From 40d4ac9ae1ed9557d066c184abd90e51a380cf06 Mon Sep 17 00:00:00 2001 From: Alexander Tseung Date: Mon, 30 Jul 2018 11:53:54 -0700 Subject: Add TransactionStatus component --- .../transaction-status.component.js | 44 ++++++++++++++++++++++ 1 file changed, 44 insertions(+) create mode 100644 ui/app/components/transaction-status/transaction-status.component.js (limited to 'ui/app/components/transaction-status/transaction-status.component.js') diff --git a/ui/app/components/transaction-status/transaction-status.component.js b/ui/app/components/transaction-status/transaction-status.component.js new file mode 100644 index 000000000..cf688558f --- /dev/null +++ b/ui/app/components/transaction-status/transaction-status.component.js @@ -0,0 +1,44 @@ +import React, { PureComponent } from 'react' +import PropTypes from 'prop-types' +import classnames from 'classnames' + +const UNAPPROVED_STATUS = 'unapproved' +const REJECTED_STATUS = 'rejected' +const APPROVED_STATUS = 'approved' +const SIGNED_STATUS = 'signed' +const SUBMITTED_STATUS = 'submitted' +const CONFIRMED_STATUS = 'confirmed' +const FAILED_STATUS = 'failed' +const DROPPED_STATUS = 'dropped' + +const statusToClassNameHash = { + [UNAPPROVED_STATUS]: 'transaction-status--unapproved', + [REJECTED_STATUS]: 'transaction-status--rejected', + [APPROVED_STATUS]: 'transaction-status--approved', + [SIGNED_STATUS]: 'transaction-status--signed', + [SUBMITTED_STATUS]: 'transaction-status--submitted', + [CONFIRMED_STATUS]: 'transaction-status--confirmed', + [FAILED_STATUS]: 'transaction-status--failed', + [DROPPED_STATUS]: 'transaction-status--dropped', +} + +const statusToTextHash = { + [APPROVED_STATUS]: 'pending', + [SUBMITTED_STATUS]: 'pending', +} + +export default class TransactionStatus extends PureComponent { + static propTypes = { + status: PropTypes.string, + } + + render () { + const { status } = this.props + + return ( +
+ { statusToTextHash[status] || status } +
+ ) + } +} -- cgit v1.2.3 From 5de48c67a080f2681a005e364eefb9ea1d6b1e12 Mon Sep 17 00:00:00 2001 From: Alexander Tseung Date: Tue, 31 Jul 2018 19:37:38 -0700 Subject: Use css grid for TransactionListItem for responsive layout --- ui/app/components/transaction-status/transaction-status.component.js | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) (limited to 'ui/app/components/transaction-status/transaction-status.component.js') diff --git a/ui/app/components/transaction-status/transaction-status.component.js b/ui/app/components/transaction-status/transaction-status.component.js index cf688558f..1b05d61b2 100644 --- a/ui/app/components/transaction-status/transaction-status.component.js +++ b/ui/app/components/transaction-status/transaction-status.component.js @@ -30,13 +30,14 @@ const statusToTextHash = { export default class TransactionStatus extends PureComponent { static propTypes = { status: PropTypes.string, + className: PropTypes.string, } render () { - const { status } = this.props + const { className, status } = this.props return ( -
+
{ statusToTextHash[status] || status }
) -- cgit v1.2.3 From 342522c6cf23670f931e69ba822eedfd2d6ee252 Mon Sep 17 00:00:00 2001 From: Alexander Tseung Date: Thu, 23 Aug 2018 16:44:38 -0700 Subject: Fix naming, add eth.getCode check for actions, fix translations for statuses --- .../transaction-status.component.js | 32 +++++++++++++--------- 1 file changed, 19 insertions(+), 13 deletions(-) (limited to 'ui/app/components/transaction-status/transaction-status.component.js') diff --git a/ui/app/components/transaction-status/transaction-status.component.js b/ui/app/components/transaction-status/transaction-status.component.js index 1b05d61b2..a4c827ae8 100644 --- a/ui/app/components/transaction-status/transaction-status.component.js +++ b/ui/app/components/transaction-status/transaction-status.component.js @@ -1,15 +1,16 @@ import React, { PureComponent } from 'react' import PropTypes from 'prop-types' import classnames from 'classnames' - -const UNAPPROVED_STATUS = 'unapproved' -const REJECTED_STATUS = 'rejected' -const APPROVED_STATUS = 'approved' -const SIGNED_STATUS = 'signed' -const SUBMITTED_STATUS = 'submitted' -const CONFIRMED_STATUS = 'confirmed' -const FAILED_STATUS = 'failed' -const DROPPED_STATUS = 'dropped' +import { + UNAPPROVED_STATUS, + REJECTED_STATUS, + APPROVED_STATUS, + SIGNED_STATUS, + SUBMITTED_STATUS, + CONFIRMED_STATUS, + FAILED_STATUS, + DROPPED_STATUS, +} from '../../constants/transactions' const statusToClassNameHash = { [UNAPPROVED_STATUS]: 'transaction-status--unapproved', @@ -28,17 +29,22 @@ const statusToTextHash = { } export default class TransactionStatus extends PureComponent { + static contextTypes = { + t: PropTypes.func, + } + static propTypes = { - status: PropTypes.string, + statusKey: PropTypes.string, className: PropTypes.string, } render () { - const { className, status } = this.props + const { className, statusKey } = this.props + const statusText = this.context.t(statusToTextHash[statusKey] || statusKey) return ( -
- { statusToTextHash[status] || status } +
+ { statusText }
) } -- cgit v1.2.3