From 136218893bbe957992c364b22b2274fecc20c6b5 Mon Sep 17 00:00:00 2001
From: VSaric <92527393+VSaric@users.noreply.github.com>
Date: Mon, 13 Jun 2022 18:18:33 +0200
Subject: [PATCH] Fix contact address pet name  (#14613)

* The contact pet name isn't replaced by the recipients address

* Create getEnsResolutionByAddress selector and use it in the codebase

* Modified the getRecipient selector such that it returns an ens resolution as the nickname if a nickname isn't present but a ens resolution is.

* Update ui/ducks/send/send.js

Co-authored-by: Brad Decker <bhdecker84@gmail.com>

* Checked if ens resolution is present in the getRecipient selector

Co-authored-by: Brad Decker <bhdecker84@gmail.com>
---
 .../transaction-list-item-details.container.js      |  5 ++---
 ui/ducks/send/send.js                               | 13 +++++++++++++
 ui/ducks/send/send.test.js                          |  9 ++++++---
 .../confirm-transaction-base.container.js           |  4 ++--
 ui/selectors/selectors.js                           |  4 ++++
 5 files changed, 27 insertions(+), 8 deletions(-)

diff --git a/ui/components/app/transaction-list-item-details/transaction-list-item-details.container.js b/ui/components/app/transaction-list-item-details/transaction-list-item-details.container.js
index 280cec020..dc3775fb2 100644
--- a/ui/components/app/transaction-list-item-details/transaction-list-item-details.container.js
+++ b/ui/components/app/transaction-list-item-details/transaction-list-item-details.container.js
@@ -3,18 +3,17 @@ import { tryReverseResolveAddress } from '../../../store/actions';
 import {
   getAddressBook,
   getRpcPrefsForCurrentProvider,
+  getEnsResolutionByAddress,
 } from '../../../selectors';
 import { toChecksumHexAddress } from '../../../../shared/modules/hexstring-utils';
 import TransactionListItemDetails from './transaction-list-item-details.component';
 
 const mapStateToProps = (state, ownProps) => {
-  const { metamask } = state;
-  const { ensResolutionsByAddress } = metamask;
   const { recipientAddress, senderAddress } = ownProps;
   let recipientEns;
   if (recipientAddress) {
     const address = toChecksumHexAddress(recipientAddress);
-    recipientEns = ensResolutionsByAddress[address] || '';
+    recipientEns = getEnsResolutionByAddress(state, address);
   }
   const addressBook = getAddressBook(state);
 
diff --git a/ui/ducks/send/send.js b/ui/ducks/send/send.js
index 3e81bc09d..2b3d59f12 100644
--- a/ui/ducks/send/send.js
+++ b/ui/ducks/send/send.js
@@ -44,6 +44,7 @@ import {
   getTokenList,
   getAddressBookEntryOrAccountName,
   getIsMultiLayerFeeNetwork,
+  getEnsResolutionByAddress,
 } from '../../selectors';
 import {
   disconnectGasFeeEstimatePoller,
@@ -91,6 +92,7 @@ import { resetEnsResolution } from '../ens';
 import {
   isBurnAddress,
   isValidHexAddress,
+  toChecksumHexAddress,
 } from '../../../shared/modules/hexstring-utils';
 import { sumHexes } from '../../helpers/utils/transactions.util';
 import fetchEstimatedL1Fee from '../../helpers/utils/optimism/fetchEstimatedL1Fee';
@@ -2260,6 +2262,17 @@ export function getRecipientUserInput(state) {
 }
 
 export function getRecipient(state) {
+  const checksummedAddress = toChecksumHexAddress(
+    state[name].recipient.address,
+  );
+  if (state.metamask.ensResolutionsByAddress) {
+    return {
+      ...state[name].recipient,
+      nickname:
+        state[name].recipient.nickname ||
+        getEnsResolutionByAddress(state, checksummedAddress),
+    };
+  }
   return state[name].recipient;
 }
 
diff --git a/ui/ducks/send/send.test.js b/ui/ducks/send/send.test.js
index 75be1cd03..cebd88d72 100644
--- a/ui/ducks/send/send.test.js
+++ b/ui/ducks/send/send.test.js
@@ -2585,9 +2585,12 @@ describe('Send Slice', () => {
       });
 
       it('has a selector to get recipient state', () => {
-        expect(getRecipient({ send: initialState })).toMatchObject(
-          initialState.recipient,
-        );
+        expect(
+          getRecipient({
+            send: initialState,
+            metamask: { ensResolutionsByAddress: {} },
+          }),
+        ).toMatchObject(initialState.recipient);
       });
     });
 
diff --git a/ui/pages/confirm-transaction-base/confirm-transaction-base.container.js b/ui/pages/confirm-transaction-base/confirm-transaction-base.container.js
index 7752305a2..e36049c80 100644
--- a/ui/pages/confirm-transaction-base/confirm-transaction-base.container.js
+++ b/ui/pages/confirm-transaction-base/confirm-transaction-base.container.js
@@ -34,6 +34,7 @@ import {
   getIsMultiLayerFeeNetwork,
   getEIP1559V2Enabled,
   getIsBuyableChain,
+  getEnsResolutionByAddress,
 } from '../../selectors';
 import { getMostRecentOverviewPage } from '../../ducks/history/history';
 import {
@@ -80,7 +81,6 @@ const mapStateToProps = (state, ownProps) => {
   const isBuyableChain = getIsBuyableChain(state);
   const { confirmTransaction, metamask } = state;
   const {
-    ensResolutionsByAddress,
     conversionRate,
     identities,
     addressBook,
@@ -137,7 +137,7 @@ const mapStateToProps = (state, ownProps) => {
     addressBook &&
     addressBook[chainId] &&
     addressBook[chainId][checksummedAddress];
-  const toEns = ensResolutionsByAddress[checksummedAddress] || '';
+  const toEns = getEnsResolutionByAddress(state, checksummedAddress);
   const toNickname = addressBookObject ? addressBookObject.name : '';
   const transactionStatus = transaction ? transaction.status : '';
   const supportsEIP1559 =
diff --git a/ui/selectors/selectors.js b/ui/selectors/selectors.js
index a8b3ba99a..76ed8a004 100644
--- a/ui/selectors/selectors.js
+++ b/ui/selectors/selectors.js
@@ -375,6 +375,10 @@ export function getAddressBook(state) {
   return Object.values(state.metamask.addressBook[chainId]);
 }
 
+export function getEnsResolutionByAddress(state, address) {
+  return state.metamask.ensResolutionsByAddress[address] || '';
+}
+
 export function getAddressBookEntry(state, address) {
   const addressBook = getAddressBook(state);
   const entry = addressBook.find((contact) =>