Merge pull request #958 from gabrielbazan7/ref/tokensData

[REF] custom token using symbol not contract address
bitpay · Nov 6, 2023 · 9ee39d9 · 9ee39d9
2 parents fab3855 + 2eb2238
commit 9ee39d9
Show file tree

Hide file tree

Showing 72 changed files with 1,313 additions and 822 deletions.
diff --git a/assets/img/currencies/png/WETH.png b/assets/img/currencies/png/WETH.png
diff --git a/assets/img/currencies/weth.svg b/assets/img/currencies/weth.svg
diff --git a/src/components/amount/Amount.tsx b/src/components/amount/Amount.tsx
@@ -109,6 +109,7 @@ export interface Limits {
 export interface AmountProps {
   cryptoCurrencyAbbreviation?: string;
   fiatCurrencyAbbreviation?: string;
+  tokenAddress?: string;
   chain?: string;
   context?: string;
   buttonState?: ButtonState;
@@ -126,6 +127,7 @@ const Amount: React.VFC<AmountProps> = ({
   cryptoCurrencyAbbreviation,
   fiatCurrencyAbbreviation,
   chain,
+  tokenAddress,
   context,
   buttonState,
   swapOpts,
@@ -212,6 +214,7 @@ const Amount: React.VFC<AmountProps> = ({
               primaryIsFiat ? val / rate : val,
               cryptoCurrencyAbbreviation.toLowerCase(),
               chain,
+              tokenAddress,
             ),
           ).amount;
 

diff --git a/src/components/list/ContactRow.tsx b/src/components/list/ContactRow.tsx
@@ -39,6 +39,7 @@ export interface ContactRowProps {
   tag?: number; // backward compatibility
   destinationTag?: number;
   email?: string;
+  tokenAddress?: string;
 }
 
 interface Props {
@@ -49,13 +50,19 @@ interface Props {
 const ContactRow = ({contact, onPress}: Props) => {
   const theme = useTheme();
   const underlayColor = theme.dark ? '#121212' : '#fbfbff';
-  const {coin: _coin, name, email, address, chain} = contact;
+  const {coin: _coin, name, email, address, chain, tokenAddress} = contact;
   const coin = getCurrencyAbbreviation(_coin, chain);
   return (
     <ContactContainer underlayColor={underlayColor} onPress={onPress}>
       <RowContainer>
         <ContactImageContainer>
-          <ContactIcon name={name} coin={coin} size={45} chain={chain} />
+          <ContactIcon
+            name={name}
+            coin={coin}
+            size={45}
+            chain={chain}
+            tokenAddress={tokenAddress}
+          />
         </ContactImageContainer>
         <ContactColumn>
           <H5>{name}</H5>

diff --git a/src/components/list/CurrencySelectionRow.tsx b/src/components/list/CurrencySelectionRow.tsx
@@ -25,6 +25,7 @@ export type CurrencySelectionItem = Pick<
   'id' | 'currencyAbbreviation' | 'currencyName' | 'img' | 'isToken'
 > & {
   chain: string;
+  tokenAddress?: string;
   imgSrc?: ImageRequireSource | undefined;
   selected?: boolean;
   disabled?: boolean;
@@ -36,7 +37,11 @@ export type CurrencySelectionRowProps = {
   description?: string;
   hideCheckbox?: boolean;
   selectionMode?: CurrencySelectionMode;
-  onToggle?: (currencyAbbreviation: string, chain: string) => void;
+  onToggle?: (
+    currencyAbbreviation: string,
+    chain: string,
+    tokenAddress?: string,
+  ) => void;
   onViewAllTokensPressed?: (
     currency: CurrencySelectionItem,
     tokens: CurrencySelectionItem[],
@@ -151,7 +156,11 @@ interface TokenSelectionRowProps {
   token: CurrencySelectionItem;
   hideCheckbox?: boolean;
   selectionMode?: CurrencySelectionMode;
-  onToggle?: (currencyAbbreviation: string, chain: string) => any;
+  onToggle?: (
+    currencyAbbreviation: string,
+    chain: string,
+    tokenAddress: string,
+  ) => any;
   hideArrow?: boolean;
   badgeUri?: string | ((props?: any) => ReactElement);
 }
@@ -173,7 +182,13 @@ export const TokenSelectionRow: React.VFC<TokenSelectionRowProps> = memo(
       <FlexRow
         accessibilityLabel="token-selection-row"
         style={{marginBottom: 24}}
-        onPress={() => onToggle?.(token.currencyAbbreviation, token.chain)}>
+        onPress={() =>
+          onToggle?.(
+            token.currencyAbbreviation,
+            token.chain,
+            token.tokenAddress!,
+          )
+        }>
         {!hideArrow ? (
           <CurrencyColumn style={{marginRight: 16}}>
             <NestedArrowIcon />
@@ -203,7 +218,11 @@ export const TokenSelectionRow: React.VFC<TokenSelectionRowProps> = memo(
               radio={selectionMode === 'single'}
               disabled={!!token.disabled}
               onPress={() =>
-                onToggle?.(token.currencyAbbreviation, token.chain)
+                onToggle?.(
+                  token.currencyAbbreviation,
+                  token.chain,
+                  token.tokenAddress!,
+                )
               }
             />
           </CurrencyColumn>
@@ -233,9 +252,13 @@ const CurrencySelectionRow: React.VFC<CurrencySelectionRowProps> = ({
   const {t} = useTranslation();
   const {currencyName} = currency;
   const onPress = useCallback(
-    (currencyAbbreviation: string, chain: string): void => {
+    (
+      currencyAbbreviation: string,
+      chain: string,
+      tokenAddress?: string,
+    ): void => {
       haptic(IS_ANDROID ? 'keyboardPress' : 'impactLight');
-      onToggle?.(currencyAbbreviation, chain);
+      onToggle?.(currencyAbbreviation, chain, tokenAddress);
     },
     [onToggle],
   );
@@ -262,7 +285,11 @@ const CurrencySelectionRow: React.VFC<CurrencySelectionRowProps> = ({
               key={token.id}
               token={token}
               onToggle={() => {
-                onPress(token.currencyAbbreviation, token.chain);
+                onPress(
+                  token.currencyAbbreviation,
+                  token.chain,
+                  token.tokenAddress,
+                );
               }}
               hideCheckbox={hideCheckbox}
               selectionMode={selectionMode}

diff --git a/src/components/list/WalletRow.tsx b/src/components/list/WalletRow.tsx
@@ -38,6 +38,7 @@ export interface WalletRowProps {
   badgeImg?: string | ((props?: any) => ReactElement);
   currencyName: string;
   currencyAbbreviation: string;
+  tokenAddress?: string;
   chain: string;
   walletName?: string;
   cryptoBalance: string;

diff --git a/src/components/modal/pin/PinModal.tsx b/src/components/modal/pin/PinModal.tsx
@@ -2,12 +2,7 @@ import {useNavigation} from '@react-navigation/native';
 import isEqual from 'lodash.isequal';
 import React, {useState, useEffect, useCallback, useRef} from 'react';
 import {useTranslation} from 'react-i18next';
-import {
-  Animated,
-  TouchableOpacity,
-  View,
-  NativeModules,
-} from 'react-native';
+import {Animated, TouchableOpacity, View, NativeModules} from 'react-native';
 import {gestureHandlerRootHOC} from 'react-native-gesture-handler';
 import {useSafeAreaInsets} from 'react-native-safe-area-context';
 import styled, {useTheme} from 'styled-components/native';