import React, { PureComponent } from 'react' import PropTypes from 'prop-types' import TransactionListItem from '../transaction-list-item' export default class TransactionList extends PureComponent { static contextTypes = { t: PropTypes.func, } static defaultProps = { pendingTransactions: [], completedTransactions: [], transactionToRetry: {}, } static propTypes = { pendingTransactions: PropTypes.array, completedTransactions: PropTypes.array, transactionToRetry: PropTypes.object, } shouldShowRetry = transaction => { const { transactionToRetry } = this.props const { id, submittedTime } = transaction return id === transactionToRetry.id && Date.now() - submittedTime > 30000 } renderTransactions () { const { t } = this.context const { pendingTransactions = [], completedTransactions = [] } = this.props return (
{ pendingTransactions.length > 0 && (
{ `${t('queue')} (${pendingTransactions.length})` }
{ pendingTransactions.map(transaction => ( )) }
) }
{ t('history') }
{ completedTransactions.length > 0 ? completedTransactions.map(transaction => ( )) : this.renderEmpty() }
) } renderEmpty () { return (
{ this.context.t('noTransactions') }
) } render () { return (
{ this.renderTransactions() }
) } }