fix(send): show correct address in confirmation screen (#5019)

### Description

Fixes an edge case where the send confirmation address displays the
incorrect address if a user attempts to send to an address tied to a
phone number connected with multiple addresses and a different address
was chosen in a previous secure send flow. It always displays the
address chosen for secure send. This updates it so that for any phone
number recipient with multiple addresses, the address currently being
sent to is shown.

### Test plan

Unit tests, manually tested the following scenarios:

1. Send to phone number with multiple addresses (A, B), first time pick
address A on secure send, ensure send confirmation screen displays A
2. Send to address B, ensure send confirmation displays phone number
contact with address B
3. Send to phone number with single address, ensure confirmation screen
displays only contact info and no address
4. Send to address not tied to phone number, ensure confirmation screen
displays only address

### Related issues

N/A

### Backwards compatibility

Yes

src/send/SendConfirmation.test.tsx

@@ -16,14 +16,19 @@ import { RecursivePartial, createMockStore, getMockStackScreenProps } from 'test
 import {
   emptyFees,
   mockAccount,
+  mockAccount2,
+  mockAccount3,
+  mockAddressRecipient,
   mockCeloAddress,
   mockCeloTokenBalance,
   mockCeloTokenId,
   mockCusdAddress,
   mockCusdTokenBalance,
   mockCusdTokenId,
+  mockE164Number,
   mockPoofAddress,
   mockPoofTokenId,
+  mockRecipient,
   mockTokenBalances,
   mockTokenTransactionData,
 } from 'test/values'
@@ -293,4 +298,53 @@ describe('SendConfirmation', () => {
       ),
     ])
   })
+
+  it('renders address for phone recipients with multiple addresses', () => {
+    const screenProps = getMockStackScreenProps(Screens.SendConfirmation, {
+      transactionData: {
+        ...mockTokenTransactionData,
+        recipient: mockRecipient, // recipient that includes a PN
+      },
+      origin: SendOrigin.AppSendFlow,
+      isFromScan: false,
+    })
+    const { getByTestId } = renderScreen(
+      {
+        identity: {
+          e164NumberToAddress: {
+            [mockE164Number]: [mockAccount3, mockAccount2],
+          },
+        },
+      },
+      screenProps
+    )
+
+    expect(getByTestId('RecipientAddress')).toBeTruthy()
+  })
+
+  it.each([
+    { testSuffix: 'non phone number recipients', recipient: mockAddressRecipient },
+    { testSuffix: 'phone number recipient with one address', recipient: mockRecipient },
+  ])('does not render address for $testSuffix', ({ recipient }) => {
+    const screenProps = getMockStackScreenProps(Screens.SendConfirmation, {
+      transactionData: {
+        ...mockTokenTransactionData,
+        recipient,
+      },
+      origin: SendOrigin.AppSendFlow,
+      isFromScan: false,
+    })
+    const { queryByTestId } = renderScreen(
+      {
+        identity: {
+          e164NumberToAddress: {
+            [mockE164Number]: [mockAccount3],
+          },
+        },
+      },
+      screenProps
+    )
+
+    expect(queryByTestId('RecipientAddress')).toBeFalsy()
+  })
 })

src/send/SendConfirmation.tsx

@@ -20,10 +20,9 @@ import TokenTotalLineItem from 'src/components/TokenTotalLineItem'
 import Touchable from 'src/components/Touchable'
 import CustomHeader from 'src/components/header/CustomHeader'
 import InfoIcon from 'src/icons/InfoIcon'
-import { getSecureSendAddress } from 'src/identity/secureSend'
 import {
   addressToDataEncryptionKeySelector,
-  secureSendPhoneNumberMappingSelector,
+  e164NumberToAddressSelector,
 } from 'src/identity/selectors'
 import { getLocalCurrencyCode } from 'src/localCurrency/selectors'
 import { noHeader } from 'src/navigator/Headers'
@@ -138,8 +137,10 @@ function SendConfirmation(props: Props) {
     return () => clearTimeout(debouncedEncryptComment)
   }, [comment])
 
-  const secureSendPhoneNumberMapping = useSelector(secureSendPhoneNumberMappingSelector)
-  const validatedRecipientAddress = getSecureSendAddress(recipient, secureSendPhoneNumberMapping)
+  const e164NumberToAddress = useSelector(e164NumberToAddressSelector)
+  const showAddress =
+    !!recipient.e164PhoneNumber && (e164NumberToAddress[recipient.e164PhoneNumber]?.length ?? 0) > 1
+
   const disableSend =
     isSending || !prepareTransactionsResult || prepareTransactionsResult.type !== 'possible'
 
@@ -273,9 +274,9 @@ function SendConfirmation(props: Props) {
               <Text testID="DisplayName" style={styles.displayName}>
                 {getDisplayName(recipient, t)}
               </Text>
-              {validatedRecipientAddress && (
-                <View style={styles.addressContainer}>
-                  <ShortenedAddress style={styles.address} address={validatedRecipientAddress} />
+              {showAddress && (
+                <View style={styles.addressContainer} testID="RecipientAddress">
+                  <ShortenedAddress style={styles.address} address={recipient.address} />
                 </View>
               )}
             </View>