fix: wallet issues (#10369)

* fix: connect status * fix: mf-4885 distinguish assets among multiple accounts * fix: mf-4917 boba token * fix: mf-4862 transaction handling
DimensionDev · Aug 12, 2023 · 2559bcd · 2559bcd
1 parent d198a9c
commit 2559bcd
Show file tree

Hide file tree

Showing 10 changed files with 70 additions and 55 deletions.
diff --git a/packages/mask/src/extension/popups/modals/GasSettingModal/GasSettingDialog.tsx b/packages/mask/src/extension/popups/modals/GasSettingModal/GasSettingDialog.tsx
@@ -384,7 +384,7 @@ export const GasSettingDialog = memo<GasSettingDialogProps>(function GasSettingM
                         </Box>
                         <Box>
                             <Typography className={classes.title}>
-                                {t('popups_wallet_gas_fee_settings_gas_limit')}
+                                {replaceType ? t('nonce') : t('popups_wallet_gas_fee_settings_gas_limit')}
                             </Typography>
                             <TextField
                                 value={toFixed(replaceType ? nonce : config.gas, 0)}

diff --git a/packages/mask/src/extension/popups/pages/Wallet/components/ActivityList/ActivityItem.tsx b/packages/mask/src/extension/popups/pages/Wallet/components/ActivityList/ActivityItem.tsx
@@ -302,27 +302,28 @@ export const RecentActivityItem = memo<RecentActivityItemProps>(function RecentA
                             ) : null}
                             {recipient}
                         </Typography>
-                        {/* TODO actions for pending transitions */}
-                        <Box className={classes.operations}>
-                            <button
-                                type="button"
-                                className={cx(classes.button, classes.speedupButton)}
-                                onClick={(e) => {
-                                    e.stopPropagation()
-                                    onSpeedup?.(transaction)
-                                }}>
-                                {t('speed_up')}
-                            </button>
-                            <button
-                                type="button"
-                                className={cx(classes.button, classes.cancelButton)}
-                                onClick={(e) => {
-                                    e.stopPropagation()
-                                    onCancel?.(transaction)
-                                }}>
-                                {t('cancel')}
-                            </button>
-                        </Box>
+                        {transaction.status === 1 ? (
+                            <Box className={classes.operations}>
+                                <button
+                                    type="button"
+                                    className={cx(classes.button, classes.speedupButton)}
+                                    onClick={(e) => {
+                                        e.stopPropagation()
+                                        onSpeedup?.(transaction)
+                                    }}>
+                                    {t('speed_up')}
+                                </button>
+                                <button
+                                    type="button"
+                                    className={cx(classes.button, classes.cancelButton)}
+                                    onClick={(e) => {
+                                        e.stopPropagation()
+                                        onCancel?.(transaction)
+                                    }}>
+                                    {t('cancel')}
+                                </button>
+                            </Box>
+                        ) : null}
                     </Box>
                 }>
                 {/* TODO specify cateType */}

diff --git a/packages/mask/src/extension/popups/pages/Wallet/components/ActivityList/useTransactions.ts b/packages/mask/src/extension/popups/pages/Wallet/components/ActivityList/useTransactions.ts
@@ -25,6 +25,7 @@ export function useTransactions() {
     const networks = useNetworks()
 
     const { Transaction } = useWeb3State()
+    // TODO invalidQueries after sending transitions
     const queries = useQueries({
         queries: networks.map((network) => {
             return {
@@ -42,7 +43,7 @@ export function useTransactions() {
 
     // Some are already in debank history
     const localeTxes = useMemo(() => {
-        return allLocaleTxes.filter((tx) => !transactions.find((x) => x.hash === tx.id))
+        return allLocaleTxes.filter((tx) => !transactions.find((x) => x.id === tx.id))
     }, [allLocaleTxes, transactions])
 
     return { ...result, data: transactions, localeTxes }

diff --git a/packages/mask/src/extension/popups/pages/Wallet/components/WalletHeader/UI.tsx b/packages/mask/src/extension/popups/pages/Wallet/components/WalletHeader/UI.tsx
@@ -167,8 +167,8 @@ export const WalletHeaderUI = memo<WalletHeaderUIProps>(function WalletHeaderUI(
                                 />
                             ) : null}
                         </Box>
-                        {isLoading ? (
-                            <ProgressiveText className={classes.connected} loading={isLoading}>
+                        {isLoading ? null : (
+                            <ProgressiveText className={classes.connected} loading={isLoading} skeletonWidth={50}>
                                 <span
                                     className={cx(
                                         classes.dot,
@@ -181,7 +181,7 @@ export const WalletHeaderUI = memo<WalletHeaderUIProps>(function WalletHeaderUI(
                                     })}
                                 </span>
                             </ProgressiveText>
-                        ) : null}
+                        )}
                     </Box>
                 </div>
                 <div

diff --git a/packages/mask/src/extension/popups/pages/Wallet/utils.ts b/packages/mask/src/extension/popups/pages/Wallet/utils.ts
@@ -2,10 +2,12 @@ import { Web3 } from '@masknet/web3-providers'
 import type { RecentTransaction } from '@masknet/web3-shared-base'
 import {
     ProviderType,
+    formatWeiToGwei,
     type ChainId,
     type Transaction as EvmTransaction,
-    formatWeiToGwei,
 } from '@masknet/web3-shared-evm'
+import { mapKeys } from 'lodash-es'
+import { toHex } from 'web3-utils'
 import { GasSettingModal } from '../../modals/modals.js'
 import { ReplaceType } from './type.js'
 
@@ -17,7 +19,7 @@ export async function modifyTransaction(
     if (!candidate) return
     const oldGasSettings = {
         gas: candidate.gas!,
-        gasPrice: candidate.gasPrice,
+        gasPrice: candidate.gasPrice ? formatWeiToGwei(candidate.gasPrice).toFixed() : undefined,
         maxFeePerGas: candidate.maxFeePerGas ? formatWeiToGwei(candidate.maxFeePerGas).toFixed() : undefined,
         maxPriorityFeePerGas: candidate.maxPriorityFeePerGas
             ? formatWeiToGwei(candidate.maxPriorityFeePerGas).toFixed()
@@ -33,7 +35,7 @@ export async function modifyTransaction(
     const newConfig = {
         ...candidate,
         ...oldGasSettings,
-        ...gasSettings,
+        ...mapKeys(gasSettings, (value) => (typeof value === 'undefined' ? value : toHex(value))),
     }
     if (replaceType === ReplaceType.CANCEL) {
         await Web3.cancelTransaction(transaction.id, newConfig, {

diff --git a/packages/shared/src/UI/components/AssetsManagement/AssetsProvider.tsx b/packages/shared/src/UI/components/AssetsManagement/AssetsProvider.tsx
@@ -78,19 +78,20 @@ export const AssetsProvider = memo<Props>(function AssetsProvider({ children, bl
         const listingMap: Record<string, AssetsState> = { ...assetsMap }
         let updated = false
         for (const id in assetsMap) {
-            const originalAssets = assetsMap[id].assets
+            const storeId = `${account}.${id}`
+            const originalAssets = assetsMap[storeId].assets
             const newAssets = originalAssets.filter((x) => {
                 const assetId = `${x.chainId}.${x.address}.${x.tokenId}`.toLowerCase()
                 return !blockedIds.includes(assetId)
             })
             if (newAssets.length !== originalAssets.length) {
-                listingMap[id] = { ...listingMap[id], assets: newAssets }
+                listingMap[storeId] = { ...listingMap[storeId], assets: newAssets }
                 updated = true
             }
         }
         // Update accordingly
         return updated ? listingMap : assetsMap
-    }, [assetsMap, blockedIds])
+    }, [assetsMap, account, blockedIds])
 
     const assetsMapRef = useRef<AssetsReducerState['assetsMap']>({})
     const listingAssetsMapRef = useRef<AssetsReducerState['assetsMap']>({})
@@ -120,15 +121,16 @@ export const AssetsProvider = memo<Props>(function AssetsProvider({ children, bl
             if (!collection.id) return
 
             const { id, chainId } = collection
+            const storeId = `${account}.${id}`
             const stateKey = `${id}.${chainId}`
             const realId = collectionId ?? id
-            const assetsState = assetsMapRef.current[id]
+            const assetsState = assetsMapRef.current[storeId]
 
             // Fetch less in collection list, and more every time in expanded collection.
             // Also expand size if for id chunk, since there might be more assets than chunk size
             const size = assetsState?.assets.length || collectionId ? 20 : 4
             const indicator = (!collectionId && indicatorMapRef.current.get(id)) || createIndicator()
-            dispatch({ type: 'SET_LOADING_STATUS', id: stateKey, loading: true })
+            dispatch({ type: 'SET_LOADING_STATUS', account, id: stateKey, loading: true })
             const pageable = await Hub.getNonFungibleAssetsByCollectionAndOwner(realId, account, {
                 indicator,
                 size,
@@ -144,11 +146,11 @@ export const AssetsProvider = memo<Props>(function AssetsProvider({ children, bl
             if (pageable.nextIndicator) {
                 indicatorMapRef.current.set(id, pageable.nextIndicator as PageIndicator)
             }
-            dispatch({ type: 'APPEND_ASSETS', id: stateKey, assets: pageable.data })
+            dispatch({ type: 'APPEND_ASSETS', id: stateKey, account, assets: pageable.data })
             // If collectionId is set, that means we are loading part of a merged collection.
             // And we will let the merged collection's iterator decide if it has ended
             const finished = !collectionId && !pageable.nextIndicator
-            dispatch({ type: 'SET_LOADING_STATUS', id: stateKey, finished, loading: false })
+            dispatch({ type: 'SET_LOADING_STATUS', id: stateKey, account, finished, loading: false })
             return pageable.data
         },
         [Hub, account],
@@ -179,7 +181,7 @@ export const AssetsProvider = memo<Props>(function AssetsProvider({ children, bl
                 assetsLoaderIterators.current.set(stateKey, iterator)
                 const result = await iterator.next()
                 if (result.done) {
-                    dispatch({ type: 'SET_LOADING_STATUS', id: stateKey, finished: true, loading: false })
+                    dispatch({ type: 'SET_LOADING_STATUS', id: stateKey, account, finished: true, loading: false })
                     return
                 }
                 assets = result.value
@@ -207,10 +209,10 @@ export const AssetsProvider = memo<Props>(function AssetsProvider({ children, bl
 
     const getAssets = useCallback(
         (collection: Web3Helper.NonFungibleCollectionAll) => {
-            const key = `${collection.id}.${collection.chainId}`
+            const key = `${account}.${collection.id}.${collection.chainId}`
             return listingAssetsMap[key] ?? createAssetsState()
         },
-        [listingAssetsMap],
+        [listingAssetsMap, account],
     )
     const getBLockedTokenIds = useCallback(
         (collection: Web3Helper.NonFungibleCollectionAll) => {

diff --git a/packages/shared/src/UI/components/AssetsManagement/CollectionList.tsx b/packages/shared/src/UI/components/AssetsManagement/CollectionList.tsx
@@ -165,13 +165,13 @@ export const CollectionList = memo(function CollectionList({
     const handleInitialRender = useCallback(
         (collection: Web3Helper.NonFungibleCollectionAll) => {
             const id = collection.id!
-            const assetsState = assetsMapRef.current[id]
+            const assetsState = assetsMapRef.current[`${account}.${id}`]
             // To reduce requests, check if has been initialized
             if (assetsState?.assets.length || assetsState?.loading) return
             loadVerifiedBy(id)
             loadAssets(collection)
         },
-        [loadAssets, loadVerifiedBy],
+        [loadAssets, loadVerifiedBy, account],
     )
 
     const sidebar = disableSidebar ? null : (

diff --git a/packages/shared/src/UI/components/AssetsManagement/assetsReducer.ts b/packages/shared/src/UI/components/AssetsManagement/assetsReducer.ts
@@ -14,16 +14,18 @@ export interface AssetsReducerState {
     verifiedMap: Record<string, string[]>
 }
 
-type Action =
+export type AssetsAction =
     | {
           type: 'SET_LOADING_STATUS'
           id: string
+          account: string
           loading?: boolean
           finished?: boolean
       }
     | {
           type: 'APPEND_ASSETS'
           id: string
+          account: string
           assets: Web3Helper.NonFungibleAssetScope[]
       }
     | {
@@ -42,26 +44,32 @@ export function createAssetsState() {
 
 export const initialAssetsState: AssetsReducerState = { assetsMap: {}, verifiedMap: {} }
 
-export function assetsReducer(state: AssetsReducerState, action: Action): AssetsReducerState {
+/**
+ * To distinguish assets among multiple accounts, we combine account and collection id as store-id.
+ *
+ */
+export function assetsReducer(state: AssetsReducerState, action: AssetsAction): AssetsReducerState {
     switch (action.type) {
         case 'SET_LOADING_STATUS':
             return produce(state, (draft) => {
-                const { id, loading, finished } = action
-                if (!draft.assetsMap[id]) draft.assetsMap[id] = createAssetsState()
+                const { loading, finished, id, account } = action
+                const storeId = `${account}.${id}`
+                if (!draft.assetsMap[storeId]) draft.assetsMap[storeId] = createAssetsState()
                 if (typeof loading !== 'undefined') {
-                    draft.assetsMap[id].loading = loading
+                    draft.assetsMap[storeId].loading = loading
                 }
                 if (typeof finished !== 'undefined') {
-                    draft.assetsMap[id].finished = finished
+                    draft.assetsMap[storeId].finished = finished
                 }
             })
         case 'APPEND_ASSETS':
             return produce(state, (draft) => {
-                const { id, assets } = action
-                if (!draft.assetsMap[id]) draft.assetsMap[id] = createAssetsState()
-                draft.assetsMap[id].assets = assets.length
-                    ? uniqBy([...draft.assetsMap[id].assets, ...assets], (x) => `${x.id}.${x.tokenId}`)
-                    : draft.assetsMap[id].assets ?? EMPTY_LIST
+                const { id, account, assets } = action
+                const storeId = `${account}.${id}`
+                if (!draft.assetsMap[storeId]) draft.assetsMap[storeId] = createAssetsState()
+                draft.assetsMap[storeId].assets = assets.length
+                    ? uniqBy([...draft.assetsMap[storeId].assets, ...assets], (x) => `${x.id}.${x.tokenId}`)
+                    : draft.assetsMap[storeId].assets ?? EMPTY_LIST
             })
         case 'SET_VERIFIED':
             return produce(state, (draft) => {

diff --git a/packages/web3-constants/evm/coingecko.json b/packages/web3-constants/evm/coingecko.json
@@ -22,7 +22,8 @@
         "Aurora": "aurora",
         "Aurora_Testnet": "",
         "Conflux": "",
-        "Astar": "astar"
+        "Astar": "astar",
+        "Boba": "boba"
     },
     "COIN_ID": {
         "Mainnet": "ethereum",
@@ -54,6 +55,7 @@
         "Harmony": "harmony",
         "Moonriver": "moonriver",
         "Cronos": "crypto-com-chain",
-        "BitTorrent": "bittorrent"
+        "BitTorrent": "bittorrent",
+        "Boba": "boba-network"
     }
 }
diff --git a/packages/web3-hooks/base/src/useFungibleToken.ts b/packages/web3-hooks/base/src/useFungibleToken.ts
@@ -32,7 +32,6 @@ export function useFungibleToken<S extends 'all' | void = void, T extends Networ
                         if (pluginID !== NetworkPluginID.PLUGIN_EVM || !isNativeTokenAddress(address) || !chainId)
                             return
                         const network = networks.find((x) => x.chainId === chainId)
-                        console.log('nativeCurrency', network?.nativeCurrency, chainId)
                         return network?.nativeCurrency
                     },
                     async () => {