diff options
author | Alexander Tseung <alextsg@gmail.com> | 2018-09-01 03:34:22 +0800 |
---|---|---|
committer | Alexander Tseung <alextsg@gmail.com> | 2018-09-13 10:48:52 +0800 |
commit | 084158f1a2af9d117c054420e895f4ae76a94df0 (patch) | |
tree | 1f822718e3ee315bf1d8f8f0c3aec4ec7242dbef /ui/app/components/transaction-activity-log/transaction-activity-log.component.js | |
parent | 8143f7725a21aa48c00b59402a79a3d3918ae601 (diff) | |
download | tangerine-wallet-browser-084158f1a2af9d117c054420e895f4ae76a94df0.tar.gz tangerine-wallet-browser-084158f1a2af9d117c054420e895f4ae76a94df0.tar.zst tangerine-wallet-browser-084158f1a2af9d117c054420e895f4ae76a94df0.zip |
Add tests for TransactionActivityLog. Make changes to rendering events
Diffstat (limited to 'ui/app/components/transaction-activity-log/transaction-activity-log.component.js')
-rw-r--r-- | ui/app/components/transaction-activity-log/transaction-activity-log.component.js | 43 |
1 files changed, 15 insertions, 28 deletions
diff --git a/ui/app/components/transaction-activity-log/transaction-activity-log.component.js b/ui/app/components/transaction-activity-log/transaction-activity-log.component.js index 4cba8cf15..c0cf099d0 100644 --- a/ui/app/components/transaction-activity-log/transaction-activity-log.component.js +++ b/ui/app/components/transaction-activity-log/transaction-activity-log.component.js @@ -1,7 +1,10 @@ import React, { PureComponent } from 'react' import PropTypes from 'prop-types' +import classnames from 'classnames' import { getActivities } from './transaction-activity-log.util' import Card from '../card' +import { getEthConversionFromWeiHex } from '../../helpers/conversions.util' +import { ETH } from '../../constants/common' export default class TransactionActivityLog extends PureComponent { static contextTypes = { @@ -10,6 +13,8 @@ export default class TransactionActivityLog extends PureComponent { static propTypes = { transaction: PropTypes.object, + className: PropTypes.string, + conversionRate: PropTypes.number, } state = { @@ -35,54 +40,36 @@ export default class TransactionActivityLog extends PureComponent { } renderActivity (activity, index) { + const { conversionRate } = this.props + const { eventKey, value } = activity + const ethValue = getEthConversionFromWeiHex({ value, toCurrency: ETH, conversionRate }) + return ( <div key={index} className="transaction-activity-log__activity" > <div className="transaction-activity-log__activity-icon" /> - { this.renderActivityText(activity) } - </div> - ) - } - - renderActivityText (activity) { - const { eventKey, value, valueDescriptionKey } = activity - - return ( - <div className="transaction-activity-log__activity-text"> - { `Transaction ` } - <b>{ `${eventKey}` }</b> - { - valueDescriptionKey && value - ? ( - <span> - { ` with a ${valueDescriptionKey} of ` } - <b>{ value }</b> - . - </span> - ) : '.' - } + <div className="transaction-activity-log__activity-text"> + { this.context.t(eventKey, [ethValue]) } + </div> </div> ) } render () { const { t } = this.context + const { className } = this.props const { activities } = this.state return ( - <div className="transaction-activity-log"> + <div className={classnames('transaction-activity-log', className)}> <Card title={t('activityLog')} className="transaction-activity-log__card" > <div className="transaction-activity-log__activities-container"> - { - activities.map((activity, index) => ( - this.renderActivity(activity, index) - )) - } + { activities.map((activity, index) => this.renderActivity(activity, index)) } </div> </Card> </div> |