[FIX] erc20 contacts

bitpay · Nov 3, 2023 · 1df5abb · 1df5abb
1 parent c3af06c
commit 1df5abb
Show file tree

Hide file tree

Showing 10 changed files with 206 additions and 41 deletions.
diff --git a/src/navigation/tabs/contacts/screens/ContactsAdd.tsx b/src/navigation/tabs/contacts/screens/ContactsAdd.tsx
@@ -77,6 +77,7 @@ const InputContainer = styled.View<{hideInput?: boolean}>`
 
 const ActionContainer = styled.View`
   margin-top: 30px;
+  margin-bottom: 60px;
 `;
 
 const Container = styled.ScrollView`
@@ -200,9 +201,9 @@ const ContactsAdd = ({
 
   const [addressValue, setAddressValue] = useState('');
   const [coinValue, setCoinValue] = useState('');
-  const [tokenAddressValue, setTokenAddressValue] = useState(
-    undefined as string | undefined,
-  );
+  const [tokenAddressValue, setTokenAddressValue] = useState<
+    string | undefined
+  >();
   const [networkValue, setNetworkValue] = useState('');
   const [chainValue, setChainValue] = useState('');
 
@@ -224,7 +225,7 @@ const ContactsAdd = ({
   const ALL_CUSTOM_TOKENS = useMemo(() => {
     return Object.entries(tokenOptionsByAddress)
       .filter(([k]) => !BitpaySupportedTokens[k])
-      .map(([k, {symbol, name, logoURI}]) => {
+      .map(([k, {symbol, name, logoURI, address}]) => {
         const chain = getChainUsingSuffix(k);
         return {
           id: Math.random().toString(),
@@ -235,6 +236,7 @@ const ContactsAdd = ({
           isToken: true,
           chain,
           badgeUri: getBadgeImg(symbol.toLowerCase(), chain),
+          tokenAddress: address,
         } as SupportedCurrencyOption;
       });
   }, [tokenOptionsByAddress]);
@@ -289,12 +291,14 @@ const ContactsAdd = ({
     coin: string,
     network: string,
     chain: string,
+    tokenAddress: string | undefined,
   ) => {
     setValidAddress(true);
     setAddressValue(address);
     setCoinValue(coin);
     setNetworkValue(network);
     setChainValue(chain);
+    setTokenAddressValue(tokenAddress);
 
     _setSelectedCurrency(coin);
 
@@ -316,6 +320,7 @@ const ContactsAdd = ({
     coin?: string,
     network?: string,
     chain?: string,
+    tokenAddress?: string,
   ) => {
     if (address) {
       const coinAndNetwork = GetCoinAndNetwork(address, undefined, chain);
@@ -331,6 +336,7 @@ const ContactsAdd = ({
             coin || coinAndNetwork.coin,
             network || coinAndNetwork.network,
             chain || coinAndNetwork.coin,
+            tokenAddress,
           );
         } else {
           // try testnet
@@ -345,6 +351,7 @@ const ContactsAdd = ({
               coin || coinAndNetwork.coin,
               network || 'testnet',
               chain || coinAndNetwork.coin,
+              tokenAddress,
             );
           }
         }
@@ -452,11 +459,13 @@ const ContactsAdd = ({
     _setSelectedCurrency(currencyAbbreviation);
     if (isTokenAddress) {
       setChainValue(currencyAbbreviation);
+      const firstTokenOption = allTokenOptions.find(
+        t => t.chain === currencyAbbreviation,
+      );
       tokenSelected(
-        allTokenOptions.find(t => t.chain === currencyAbbreviation)
-          ?.currencyAbbreviation!,
+        firstTokenOption?.currencyAbbreviation!,
         currencyAbbreviation,
-        undefined,
+        firstTokenOption?.tokenAddress,
       );
     } else {
       setCoinValue(currencyAbbreviation);
@@ -534,6 +543,7 @@ const ContactsAdd = ({
         contact.coin,
         contact.network,
         contact.chain,
+        contact.tokenAddress,
       );
       setValue('address', contact.address!, {shouldDirty: true});
       setValue('name', contact.name || '');
@@ -693,7 +703,7 @@ const ContactsAdd = ({
         </CurrencySelectorContainer>
       ) : null}
 
-      {isTokenAddress ? (
+      {!contact && isTokenAddress ? (
         <CurrencySelectorContainer hideSelector={!evmValidAddress}>
           <Label>{t('TOKEN')}</Label>
           <CurrencyContainer
@@ -729,26 +739,28 @@ const ContactsAdd = ({
         </CurrencySelectorContainer>
       ) : null}
 
-      <CurrencySelectorContainer
-        hideSelector={!isDev || !(xrpValidAddress || evmValidAddress)}>
-        <Label>{t('NETWORK')}</Label>
-        <CurrencyContainer
-          activeOpacity={ActiveOpacity}
-          onPress={() => {
-            setNetworkModalVisible(true);
-          }}>
-          <Row
-            style={{
-              alignItems: 'center',
-              justifyContent: 'space-between',
+      {!contact ? (
+        <CurrencySelectorContainer
+          hideSelector={!isDev || !(xrpValidAddress || evmValidAddress)}>
+          <Label>{t('NETWORK')}</Label>
+          <CurrencyContainer
+            activeOpacity={ActiveOpacity}
+            onPress={() => {
+              setNetworkModalVisible(true);
             }}>
-            <Row style={{alignItems: 'center'}}>
-              <NetworkName>{networkValue}</NetworkName>
+            <Row
+              style={{
+                alignItems: 'center',
+                justifyContent: 'space-between',
+              }}>
+              <Row style={{alignItems: 'center'}}>
+                <NetworkName>{networkValue}</NetworkName>
+              </Row>
+              <WalletIcons.DownToggle />
             </Row>
-            <WalletIcons.DownToggle />
-          </Row>
-        </CurrencyContainer>
-      </CurrencySelectorContainer>
+          </CurrencyContainer>
+        </CurrencySelectorContainer>
+      ) : null}
 
       <ActionContainer>
         <Button onPress={onSubmit}>

diff --git a/src/navigation/tabs/contacts/screens/ContactsDetails.tsx b/src/navigation/tabs/contacts/screens/ContactsDetails.tsx
@@ -141,6 +141,7 @@ const ContactsDetails = ({
   const [contact, setContact] = useState(_contact);
 
   const [copied, setCopied] = useState(false);
+  const [copiedContractAddress, setCopiedContractAddress] = useState(false);
   const [showIconOptions, setShowIconOptions] = useState(false);
 
   const keys = useAppSelector(({WALLET}) => WALLET.keys);
@@ -244,6 +245,23 @@ const ContactsDetails = ({
     setCopied(true);
   };
 
+  useEffect(() => {
+    if (!copiedContractAddress) {
+      return;
+    }
+    const timer = setTimeout(() => {
+      setCopiedContractAddress(false);
+    }, 2000);
+
+    return () => clearTimeout(timer);
+  }, [copiedContractAddress]);
+
+  const copyContractAddressToClipboard = () => {
+    haptic('impactLight');
+    Clipboard.setString(contact.tokenAddress!);
+    setCopiedContractAddress(true);
+  };
+
   const deleteContactView = async () => {
     await sleep(500);
     dispatch(
@@ -252,6 +270,7 @@ const ContactsDetails = ({
         contact.coin,
         contact.network,
         contact.chain,
+        contact.tokenAddress,
       ),
     );
     navigation.goBack();
@@ -324,6 +343,28 @@ const ContactsDetails = ({
               </AddressContainer>
             </DetailInfo>
           </Detail>
+
+          {contact.tokenAddress ? (
+            <>
+              <Hr />
+              <Detail>
+                <Title>{t('Contract')}</Title>
+                <DetailInfo align="right">
+                  <AddressContainer
+                    onPress={copyContractAddressToClipboard}
+                    activeOpacity={0.7}>
+                    <CopyImgContainer>
+                      {copiedContractAddress ? <CopiedSvg width={17} /> : null}
+                    </CopyImgContainer>
+                    <AddressText numberOfLines={1} ellipsizeMode={'tail'}>
+                      {contact.tokenAddress}
+                    </AddressText>
+                  </AddressContainer>
+                </DetailInfo>
+              </Detail>
+            </>
+          ) : null}
+
           {contact.network !== 'livenet' ? (
             <>
               <Hr />

diff --git a/src/navigation/wallet/components/MultipleOutputsTx.tsx b/src/navigation/wallet/components/MultipleOutputsTx.tsx
@@ -157,6 +157,7 @@ const MultipleOutputsTx = ({
       tx.coin,
       network,
       tx.chain,
+      tokenAddress,
     );
 
     const coin = getCurrencyAbbreviation(tx.coin, tx.chain);

diff --git a/src/store/app/app.effects.ts b/src/store/app/app.effects.ts
@@ -78,8 +78,14 @@ import {
   updatePortfolioBalance,
   setCustomTokensMigrationComplete,
 } from '../wallet/wallet.actions';
-import {setContactMigrationComplete} from '../contact/contact.actions';
-import {startContactMigration} from '../contact/contact.effects';
+import {
+  setContactMigrationComplete,
+  setContactTokenAddressMigrationComplete,
+} from '../contact/contact.actions';
+import {
+  startContactMigration,
+  startContactTokenAddressMigration,
+} from '../contact/contact.effects';
 import {getStateFromPath, NavigationProp} from '@react-navigation/native';
 import {
   getAvailableGiftCards,
@@ -156,13 +162,21 @@ export const startAppInit = (): Effect => async (dispatch, getState) => {
 
     dispatch(startWalletStoreInit());
 
-    const {contactMigrationComplete} = CONTACT;
+    const {contactMigrationComplete, contactTokenAddressMigrationComplete} =
+      CONTACT;
 
     if (!contactMigrationComplete) {
       await dispatch(startContactMigration());
       dispatch(setContactMigrationComplete());
       dispatch(LogActions.info('success [setContactMigrationComplete]'));
     }
+    if (!contactTokenAddressMigrationComplete) {
+      await dispatch(startContactTokenAddressMigration());
+      dispatch(setContactTokenAddressMigrationComplete());
+      dispatch(
+        LogActions.info('success [setContactTokenAddressMigrationComplete]'),
+      );
+    }
     if (!customTokensMigrationComplete) {
       await dispatch(startCustomTokensMigration());
       dispatch(setCustomTokensMigrationComplete());

diff --git a/src/store/contact/contact.actions.ts b/src/store/contact/contact.actions.ts
@@ -22,15 +22,22 @@ export const setContactMigrationComplete = (): ContactActionType => ({
   type: ContactActionTypes.SET_CONTACT_MIGRATION_COMPLETE,
 });
 
+export const setContactTokenAddressMigrationComplete =
+  (): ContactActionType => ({
+    type: ContactActionTypes.SET_CONTACT_TOKEN_ADDRESS_MIGRATION_COMPLETE,
+  });
+
 export const deleteContact = (
   address: string,
   coin: string,
   network: string,
   chain: string,
+  tokenAddress: string | undefined,
 ): ContactActionType => ({
   type: ContactActionTypes.DELETE_CONTACT,
   address,
   coin,
   network,
   chain,
+  tokenAddress,
 });
diff --git a/src/store/contact/contact.effects.ts b/src/store/contact/contact.effects.ts
@@ -2,6 +2,8 @@ import {Effect} from '..';
 import {
   BitpaySupportedUtxoCoins,
   OtherBitpaySupportedCoins,
+  BitpaySupportedTokens,
+  SUPPORTED_EVM_COINS,
 } from '../../constants/currencies';
 import {LogActions} from '../log';
 import {migrateContacts} from './contact.actions';
@@ -33,3 +35,66 @@ export const startContactMigration =
       return resolve();
     });
   };
+
+export const startContactTokenAddressMigration =
+  (): Effect<Promise<void>> =>
+  async (dispatch, getState): Promise<void> => {
+    return new Promise(async resolve => {
+      try {
+        dispatch(
+          LogActions.info('[startContactTokenAddressMigration] - starting...'),
+        );
+        const contacts = getState().CONTACT.list;
+        dispatch(
+          LogActions.persistLog(
+            LogActions.info(`Migrating: ${JSON.stringify(contacts)}`),
+          ),
+        );
+        const {
+          WALLET: {tokenDataByAddress, customTokenDataByAddress},
+        } = getState();
+        const tokens = {
+          ...tokenDataByAddress,
+          ...customTokenDataByAddress,
+          ...BitpaySupportedTokens,
+        };
+
+        // add new tokenAddress value to old contacts
+        const migratedContacts = contacts.map(contact => {
+          let foundToken;
+          if (SUPPORTED_EVM_COINS.includes(contact.chain)) {
+            foundToken = Object.values(tokens).find(
+              token =>
+                token.coin === contact.coin && token.chain === contact.chain,
+            );
+          }
+          return {
+            ...contact,
+            tokenAddress: foundToken?.address,
+          };
+        });
+        await dispatch(migrateContacts(migratedContacts));
+        dispatch(
+          LogActions.persistLog(
+            LogActions.info(
+              `success [startContactTokenAddressMigration]: ${JSON.stringify(
+                migratedContacts,
+              )}`,
+            ),
+          ),
+        );
+        return resolve();
+      } catch (err: unknown) {
+        const errStr = err instanceof Error ? err.message : JSON.stringify(err);
+        dispatch(
+          LogActions.persistLog(
+            LogActions.error(
+              '[startContactTokenAddressMigration] failed - ',
+              errStr,
+            ),
+          ),
+        );
+        return resolve();
+      }
+    });
+  };