Merge pull request #45 from SimpleHold/fix-custom-tokens

Fix custom tokens

package.json

@@ -1,6 +1,6 @@
 {
   "name": "extension",
-  "version": "1.20.0",
+  "version": "1.20.1",
   "description": "extension",
   "private": false,
   "repository": "https://github.com/SimpleHold/extension.git",

src/components/CollapsibleHeader/CollapsibleHeader.tsx

@@ -112,7 +112,7 @@ const CollapsibleHeader: React.FC<Props> = React.memo((props) => {
                 style={{
                   width: clockIconSize,
                   height: clockIconSize,
-                  marginLeft: clockIconMarginLeft
+                  marginLeft: clockIconMarginLeft,
                 }}
               >
                 <SVG

src/components/WalletCard/WalletCard.tsx

@@ -14,7 +14,7 @@ import { updateBalance, THardware, getLatestBalance } from '@utils/wallet'
 import { logEvent } from '@utils/amplitude'
 
 // Config
-import { getToken } from '@config/tokens'
+import { getSharedToken, getToken } from '@config/tokens'
 import { getCurrency } from '@config/currencies'
 import { BALANCE_CHANGED, ADDRESS_WATCH } from '@config/events'
 
@@ -59,7 +59,6 @@ const WalletCard: React.FC<Props> = React.memo((props) => {
     symbol,
     chain,
     name,
-    contractAddress,
     decimals,
     isHidden,
     sumBalance,
@@ -72,6 +71,9 @@ const WalletCard: React.FC<Props> = React.memo((props) => {
     isNotActivated,
   } = props
 
+  const sharedToken = getSharedToken(symbol, chain)
+  const contractAddress = props.contractAddress || sharedToken?.address || undefined
+
   const currency = chain ? getToken(symbol, chain) : getCurrency(symbol)
   const tokenSymbol = chain ? symbol : undefined
 

src/config/tokens.ts

@@ -33,6 +33,7 @@ import audioLogo from '@assets/tokens/audio.svg'
 // Utils
 import { IWallet } from '@utils/wallet'
 import { toLower } from '@utils/format'
+import { getItem } from '@utils/storage'
 
 // Config
 import { getCurrencyByChain } from '@config/currencies'
@@ -558,3 +559,22 @@ export const getUnusedAddressesForToken = (
 
   return addresses
 }
+
+export const getSharedToken = (symbol: string, chain?: string): IToken | undefined => {
+  try {
+    const getTokens = getItem('tokens')
+
+    if (getTokens) {
+      const parse: IToken[] = JSON.parse(getTokens)
+
+      return parse.find(
+        (token: IToken) =>
+          toLower(token.symbol) === toLower(symbol) && toLower(token.chain) === toLower(chain)
+      )
+    }
+
+    return undefined
+  } catch {
+    return undefined
+  }
+}

src/manifest.json

@@ -1,7 +1,7 @@
 {
   "manifest_version": 2,
   "name": "SimpleHold",
-  "version": "1.20.0",
+  "version": "1.20.1",
   "icons": {
     "16": "assets/logo/favicon-16.png",
     "32": "assets/logo/favicon-32.png",

src/pages/Send/Send.tsx

@@ -31,7 +31,7 @@ import {
   getFee,
   getStandingFee,
   isEthereumLike,
-  checkWithZeroFee
+  checkWithZeroFee,
 } from '@utils/currencies'
 import { logEvent } from '@utils/amplitude'
 import { setItem } from '@utils/storage'
@@ -49,7 +49,7 @@ import {
   // ADDRESS_SEND,
   TRANSACTION_AUTO_FILL,
   TRANSACTION_START,
-  TRANSACTION_CANCEL
+  TRANSACTION_CANCEL,
 } from '@config/events'
 
 // Types
@@ -83,12 +83,12 @@ const initialState: IState = {
   customFee: {
     slow: 0,
     average: 0,
-    fast: 0
+    fast: 0,
   },
   isIncludeFee: false,
   isStandingFee: false,
   feeValues: [],
-  timer: null
+  timer: null,
 }
 
 const SendPage: React.FC = () => {
@@ -103,8 +103,8 @@ const SendPage: React.FC = () => {
       address,
       walletName,
       hardware,
-      currency
-    }
+      currency,
+    },
   } = useLocation<ILocationState>()
   const history = useHistory()
 
@@ -113,7 +113,7 @@ const SendPage: React.FC = () => {
     selectedAddress: address,
     walletName,
     hardware,
-    backTitle: walletName
+    backTitle: walletName,
   })
 
   const debounced = useDebounce(state.amount, 1000)
@@ -239,7 +239,9 @@ const SendPage: React.FC = () => {
       updateState({ utxosList: [] })
     }
 
-    const getTokenDecimals = tokenChain ? getToken(symbol, tokenChain)?.decimals : decimals
+    const getTokenDecimals = tokenChain
+      ? getToken(symbol, tokenChain)?.decimals || decimals
+      : decimals
 
     let amount = Number(state.amount)
 
@@ -252,13 +254,13 @@ const SendPage: React.FC = () => {
       tokenChain,
       btcLikeParams: {
         outputs: state.outputs,
-        customFee: state.customFee
+        customFee: state.customFee,
       },
       ethLikeParams: {
         contractAddress,
         decimals: getTokenDecimals,
-        fees: state.customFee
-      }
+        fees: state.customFee,
+      },
     })
 
     updateState({ isFeeLoading: false })
@@ -381,8 +383,8 @@ const SendPage: React.FC = () => {
       name: TRANSACTION_AUTO_FILL,
       properties: {
         kind: 'myWallet',
-        symbol
-      }
+        symbol,
+      },
     })
   }
 
@@ -408,7 +410,6 @@ const SendPage: React.FC = () => {
   }
 
   const onConfirm = (): void => {
-
     let amount = Number(state.amount)
 
     // _vtho
@@ -417,7 +418,11 @@ const SendPage: React.FC = () => {
       const balance = getAvailableBalance()
       const isInsufficientBalance = balance - safeGap <= 0.001
       if (isInsufficientBalance) {
-        updateState({ amountErrorLabel: `Min amount for this transfer is ${(balance + safeGap).toString().slice(0,6)}`})
+        updateState({
+          amountErrorLabel: `Min amount for this transfer is ${(balance + safeGap)
+            .toString()
+            .slice(0, 6)}`,
+        })
         return
       }
       if (amount + safeGap >= balance) {
@@ -498,8 +503,8 @@ const SendPage: React.FC = () => {
       logEvent({
         name: TRANSACTION_AUTO_FILL,
         properties: {
-          kind: 'allFunds'
-        }
+          kind: 'allFunds',
+        },
       })
     }
   }
@@ -536,13 +541,15 @@ const SendPage: React.FC = () => {
 
     const fee = state.isIncludeFee ? 0 : state.fee
 
-    if (state.amount.length && Number(state.amount) + (symbol === state.feeSymbol ? Number(fee) : 0) > availableBalance) {
+    if (
+      state.amount.length &&
+      Number(state.amount) + (symbol === state.feeSymbol ? Number(fee) : 0) > availableBalance
+    ) {
       return setInsufficientError()
     }
     const getAmount = (): number => {
       let parseAmount = Number(state.amount)
-      if (state.isIncludeFee && (symbol === state.feeSymbol)) {
-
+      if (state.isIncludeFee && symbol === state.feeSymbol) {
         parseAmount = parseAmount - state.fee
       }
 
@@ -572,7 +579,10 @@ const SendPage: React.FC = () => {
   }
 
   const isButtonDisabled = (): boolean => {
-    const getAmount = state.isIncludeFee && (symbol === state.feeSymbol) ? Number(state.amount) - state.fee : Number(state.amount)
+    const getAmount =
+      state.isIncludeFee && symbol === state.feeSymbol
+        ? Number(state.amount) - state.fee
+        : Number(state.amount)
     if (
       validateAddress(symbol, state.address, tokenChain) &&
       state.amount.length &&

src/pages/SendConfirmation/SendConfirmation.tsx

@@ -108,12 +108,12 @@ const SendConfirmation: React.FC = () => {
 
           const ethTxData = isEthereumLike(symbol, tokenChain)
             ? await getWeb3TxParams(
-              addressFrom,
-              addressTo,
-              `${parseAmount}`,
-              chain || tokenChain,
-              contractAddress
-            )
+                addressFrom,
+                addressTo,
+                `${parseAmount}`,
+                chain || tokenChain,
+                contractAddress
+              )
             : {}
 
           const xrpTxData = symbol === 'xrp' ? await getXrpTxParams(addressFrom) : {}
@@ -157,6 +157,7 @@ const SendConfirmation: React.FC = () => {
               isButtonLoading: false,
             })
           }
+
           const transaction = await createTransaction({
             ...transactionData,
             ...ethTxData,
@@ -277,7 +278,7 @@ const SendConfirmation: React.FC = () => {
   }
 
   const getAmount = (): number => {
-    if (isIncludeFee && !tokenChain && (symbol === networkFeeSymbol)) {
+    if (isIncludeFee && !tokenChain && symbol === networkFeeSymbol) {
       return minus(amount, networkFee)
     }
     return amount

src/pages/Wallet/Wallet.tsx

@@ -16,7 +16,6 @@ import PrivateKeyDrawer from '@drawers/PrivateKey'
 import RenameWalletDrawer from '@drawers/RenameWallet'
 import SuccessDrawer from '@drawers/Success'
 
-
 // Utils
 import {
   getBalance,
@@ -51,7 +50,7 @@ import { getTxHistory as getTonCoinTxHistory } from '@utils/currencies/toncoin'
 
 // Config
 import { getCurrency } from '@config/currencies'
-import { getToken } from '@config/tokens'
+import { getSharedToken, getToken } from '@config/tokens'
 import { ADDRESS_ACTION } from '@config/events'
 
 // Hooks
@@ -195,6 +194,12 @@ const WalletPage: React.FC = () => {
   }
 
   const getCurrencyChain = (): string | null => {
+    const sharedToken = getSharedToken(symbol, chain)
+
+    if (sharedToken) {
+      return sharedToken.chain
+    }
+
     if (isCustomToken && chain) {
       return chain
     }
@@ -252,13 +257,16 @@ const WalletPage: React.FC = () => {
       },
     })
 
+    const sharedToken = getSharedToken(symbol, chain)
+
     history.push(url, {
       ...locationState,
       walletName: state.walletName,
       tokenChain: chain,
-      chain: currency?.chain,
+      chain: sharedToken ? chain : currency?.chain,
       currency,
       address: state.address,
+      decimals: sharedToken ? sharedToken.decimals : decimals,
     })
   }
 
@@ -337,7 +345,7 @@ const WalletPage: React.FC = () => {
                 return updateState({
                   isDrawerButtonLoading: false,
                   isNotActivated: false,
-                  activeDrawer: "success",
+                  activeDrawer: 'success',
                   password: '',
                   address: getAddress,
                 })
@@ -419,7 +427,7 @@ const WalletPage: React.FC = () => {
   const onDownloadBackup = (): void => {
     return history.replace('/download-backup', {
       password: state.password,
-      from: 'newWallet'
+      from: 'newWallet',
     })
   }