diff --git a/ui/app/components/app/confirm-page-container/confirm-page-container.component.js b/ui/app/components/app/confirm-page-container/confirm-page-container.component.js index 1ff797fa1..d26daf786 100644 --- a/ui/app/components/app/confirm-page-container/confirm-page-container.component.js +++ b/ui/app/components/app/confirm-page-container/confirm-page-container.component.js @@ -24,6 +24,7 @@ export default class ConfirmPageContainer extends Component { fromName: PropTypes.string, toAddress: PropTypes.string, toName: PropTypes.string, + toNickname: PropTypes.string, // Content contentComponent: PropTypes.node, errorKey: PropTypes.string, @@ -68,6 +69,7 @@ export default class ConfirmPageContainer extends Component { fromName, fromAddress, toName, + toNickname, toAddress, disabled, errorKey, @@ -126,6 +128,7 @@ export default class ConfirmPageContainer extends Component { senderAddress={fromAddress} recipientName={toName} recipientAddress={toAddress} + recipientNickname={toNickname} assetImage={renderAssetImage ? assetImage : undefined} /> diff --git a/ui/app/components/ui/sender-to-recipient/sender-to-recipient.component.js b/ui/app/components/ui/sender-to-recipient/sender-to-recipient.component.js index a98a94101..933f1b007 100644 --- a/ui/app/components/ui/sender-to-recipient/sender-to-recipient.component.js +++ b/ui/app/components/ui/sender-to-recipient/sender-to-recipient.component.js @@ -19,6 +19,7 @@ export default class SenderToRecipient extends PureComponent { senderAddress: PropTypes.string, recipientName: PropTypes.string, recipientAddress: PropTypes.string, + recipientNickname: PropTypes.string, t: PropTypes.func, variant: PropTypes.oneOf([DEFAULT_VARIANT, CARDS_VARIANT, FLAT_VARIANT]), addressOnly: PropTypes.bool, @@ -88,7 +89,7 @@ export default class SenderToRecipient extends PureComponent { renderRecipientWithAddress () { const { t } = this.context - const { recipientName, recipientAddress, addressOnly, onRecipientClick } = this.props + const { recipientName, recipientAddress, recipientNickname, addressOnly, onRecipientClick } = this.props const checksummedRecipientAddress = checksumAddress(recipientAddress) return ( @@ -114,7 +115,7 @@ export default class SenderToRecipient extends PureComponent { { addressOnly ? `${t('to')}: ${checksummedRecipientAddress}` - : (recipientName || this.context.t('newContract')) + : (recipientNickname || recipientName || this.context.t('newContract')) } diff --git a/ui/app/pages/confirm-transaction-base/confirm-transaction-base.component.js b/ui/app/pages/confirm-transaction-base/confirm-transaction-base.component.js index 5c46c8449..623079e68 100644 --- a/ui/app/pages/confirm-transaction-base/confirm-transaction-base.component.js +++ b/ui/app/pages/confirm-transaction-base/confirm-transaction-base.component.js @@ -59,6 +59,7 @@ export default class ConfirmTransactionBase extends Component { tokenData: PropTypes.object, tokenProps: PropTypes.object, toName: PropTypes.string, + toNickname: PropTypes.string, transactionStatus: PropTypes.string, txData: PropTypes.object, unapprovedTxCount: PropTypes.number, @@ -529,6 +530,7 @@ export default class ConfirmTransactionBase extends Component { fromAddress, toName, toAddress, + toNickname, methodData, valid: propsValid = true, errorMessage, @@ -551,13 +553,13 @@ export default class ConfirmTransactionBase extends Component { const { name } = methodData const { valid, errorKey } = this.getErrorKey() const { totalTx, positionOfCurrentTx, nextTxId, prevTxId, showNavigation, firstTx, lastTx, ofText, requestsWaitingText } = this.getNavigateTxData() - return ( { const { conversionRate, identities, + addressBook, currentCurrency, selectedAddress, selectedAddressTxList, @@ -75,6 +76,8 @@ const mapStateToProps = (state, ownProps) => { : addressSlicer(checksumAddress(toAddress)) ) + const addressBookObject = addressBook[checksumAddress(toAddress)] + const toNickname = addressBookObject ? addressBookObject.name : '' const isTxReprice = Boolean(lastGasPrice) const transactionStatus = transaction ? transaction.status : '' @@ -115,6 +118,7 @@ const mapStateToProps = (state, ownProps) => { fromName, toAddress, toName, + toNickname, ethTransactionAmount, ethTransactionFee, ethTransactionTotal, diff --git a/ui/app/pages/send/send-footer/tests/send-footer-container.test.js b/ui/app/pages/send/send-footer/tests/send-footer-container.test.js index 118ebf356..11b4adb3e 100644 --- a/ui/app/pages/send/send-footer/tests/send-footer-container.test.js +++ b/ui/app/pages/send/send-footer/tests/send-footer-container.test.js @@ -38,6 +38,7 @@ proxyquire('../send-footer.container.js', { getSendEditingTransactionId: (s) => `mockEditingTransactionId:${s}`, getSendFromObject: (s) => `mockFromObject:${s}`, getSendTo: (s) => `mockTo:${s}`, + getSendToNickname: (s) => `mockToNickname:${s}`, getSendToAccounts: (s) => `mockToAccounts:${s}`, getTokenBalance: (s) => `mockTokenBalance:${s}`, getSendHexData: (s) => `mockHexData:${s}`,