Skip to content

Commit 1fcecd0

Browse files
swkatmaskswkatmask
authored
chore: add useSmartPayChainId hook (#12137)
1 parent aec5a2a commit 1fcecd0

File tree

7 files changed

+55
-51
lines changed

7 files changed

+55
-51
lines changed

‎packages/plugins/SmartPay/src/SiteAdaptor/index.tsx‎

Lines changed: 6 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,21 @@
1-
import { first } from 'lodash-es'
2-
import { useAsync } from 'react-use'
1+
import { Trans } from '@lingui/react/macro'
32
import { Icons } from '@masknet/icons'
43
import type { Plugin } from '@masknet/plugin-infra'
5-
import { EVMWeb3ContextProvider, useWallets } from '@masknet/web3-hooks-base'
6-
import { SmartPayBundler } from '@masknet/web3-providers'
4+
import { EVMWeb3ContextProvider, useSmartPayChainId, useWallets } from '@masknet/web3-hooks-base'
5+
import { first } from 'lodash-es'
76
import { base } from '../base.js'
87
import { PLUGIN_ID } from '../constants.js'
9-
import { SmartPayEntry } from './components/SmartPayEntry.js'
10-
import { SmartPayDialog } from './components/SmartPayDialog.js'
118
import { InjectReceiveDialog } from './components/ReceiveDialog.js'
129
import { InjectSmartPayDescriptionDialog } from './components/SmartPayDescriptionDialog.js'
13-
import { Trans } from '@lingui/react/macro'
10+
import { SmartPayDialog } from './components/SmartPayDialog.js'
11+
import { SmartPayEntry } from './components/SmartPayEntry.js'
1412

1513
const site: Plugin.SiteAdaptor.Definition = {
1614
...base,
1715
GlobalInjection: function SmartPayGlobalInjection() {
1816
const wallets = useWallets()
1917
const contractAccounts = wallets.filter((x) => x.owner)
20-
const { value: chainId } = useAsync(async () => SmartPayBundler.getSupportedChainId(), [])
18+
const chainId = useSmartPayChainId()
2119

2220
return (
2321
<EVMWeb3ContextProvider chainId={chainId} account={first(contractAccounts)?.address}>

‎packages/plugins/Tips/src/components/TipDialog.tsx‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,6 @@
1+
import { msg, select } from '@lingui/core/macro'
2+
import { useLingui } from '@lingui/react'
3+
import { Trans } from '@lingui/react/macro'
14
import { share } from '@masknet/plugin-infra/content-script/context'
25
import { ChainBoundary, InjectedDialog, PluginWalletStatusBar, TransactionConfirmModal } from '@masknet/shared'
36
import { NetworkPluginID, getSiteType, pluginIDsSettings } from '@masknet/shared-base'
@@ -9,25 +12,22 @@ import {
912
useNetworkContext,
1013
useNonFungibleAsset,
1114
useReverseAddress,
15+
useSmartPayChainId,
1216
useWallet,
1317
} from '@masknet/web3-hooks-base'
14-
import { SmartPayBundler } from '@masknet/web3-providers'
1518
import { TokenType } from '@masknet/web3-shared-base'
1619
import { Telemetry } from '@masknet/web3-telemetry'
1720
import { EventID, EventType } from '@masknet/web3-telemetry/types'
1821
import { TabContext, TabPanel } from '@mui/lab'
1922
import { DialogContent, Tab } from '@mui/material'
2023
import { useCallback, useMemo } from 'react'
21-
import { useAsync, useUpdateEffect } from 'react-use'
24+
import { useUpdateEffect } from 'react-use'
2225
import { TargetRuntimeContext } from '../contexts/TargetRuntimeContext.js'
2326
import { useTip } from '../contexts/index.js'
2427
import { NFTSection } from './NFTSection/index.js'
2528
import { NetworkSection } from './NetworkSection/index.js'
2629
import { RecipientSection } from './RecipientSection/index.js'
2730
import { TokenSection } from './TokenSection/index.js'
28-
import { msg, select } from '@lingui/core/macro'
29-
import { Trans } from '@lingui/react/macro'
30-
import { useLingui } from '@lingui/react'
3131

3232
const useStyles = makeStyles()((theme) => ({
3333
dialog: {
@@ -159,7 +159,7 @@ export function TipDialog({ open = false, onClose }: TipDialogProps) {
159159

160160
const pluginId = site ? pluginIDs[site] : NetworkPluginID.PLUGIN_EVM
161161

162-
const { value: smartPayChainId } = useAsync(async () => SmartPayBundler.getSupportedChainId(), [])
162+
const smartPayChainId = useSmartPayChainId()
163163

164164
const { setTargetChainId } = TargetRuntimeContext.useContainer()
165165

‎packages/plugins/Tips/src/components/TokenSection/GasSettingsBar.tsx‎

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,14 @@
11
import { useCallback } from 'react'
2-
import { useAsync } from 'react-use'
32
import { SelectGasSettingsToolbar } from '@masknet/shared'
43
import { NetworkPluginID } from '@masknet/shared-base'
5-
import { useChainContext, useGasPrice, useNativeTokenPrice, useNetwork, useWallet } from '@masknet/web3-hooks-base'
6-
import { SmartPayBundler } from '@masknet/web3-providers'
4+
import {
5+
useChainContext,
6+
useGasPrice,
7+
useNativeTokenPrice,
8+
useNetwork,
9+
useSmartPayChainId,
10+
useWallet,
11+
} from '@masknet/web3-hooks-base'
712
import { type GasConfig, isNativeTokenAddress, GasEditor } from '@masknet/web3-shared-evm'
813
import { useGasLimit } from './useGasLimit.js'
914
import { useTip } from '../../contexts/index.js'
@@ -14,7 +19,7 @@ const ERC20_GAS_LIMIT = 50000
1419
export function GasSettingsBar() {
1520
const wallet = useWallet()
1621
const { token, setGasOption, gasOption } = useTip()
17-
const { value: smartPayChainId } = useAsync(async () => SmartPayBundler.getSupportedChainId(), [])
22+
const smartPayChainId = useSmartPayChainId()
1823

1924
const isNativeToken = isNativeTokenAddress(token?.address)
2025
const { chainId } = useChainContext<NetworkPluginID.PLUGIN_EVM>()

‎packages/shared/src/UI/components/NetworkTab/index.tsx‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,20 @@
1-
import { memo, useMemo } from 'react'
2-
import { useAsync, useUpdateEffect } from 'react-use'
1+
import type { NetworkPluginID } from '@masknet/shared-base'
2+
import { MaskTabList, useTabs, type MaskTabListProps } from '@masknet/theme'
3+
import type { Web3Helper } from '@masknet/web3-helpers'
34
import {
4-
useNetworkDescriptors,
55
useChainContext,
66
useNetworkContext,
7+
useNetworkDescriptors,
8+
useSmartPayChainId,
79
useWallet,
810
useWeb3Utils,
911
} from '@masknet/web3-hooks-base'
10-
import type { Web3Helper } from '@masknet/web3-helpers'
11-
import { MaskTabList, useTabs, type MaskTabListProps } from '@masknet/theme'
12-
import type { NetworkPluginID } from '@masknet/shared-base'
12+
import { ChainId } from '@masknet/web3-shared-evm'
1313
import { TabContext } from '@mui/lab'
1414
import { Stack, Tab, Typography } from '@mui/material'
15+
import { memo, useMemo } from 'react'
16+
import { useUpdateEffect } from 'react-use'
1517
import { WalletIcon } from '../WalletIcon/index.js'
16-
import { SmartPayBundler } from '@masknet/web3-providers'
17-
import { ChainId } from '@masknet/web3-shared-evm'
1818

1919
interface NetworkTabProps extends Omit<MaskTabListProps, 'onChange'> {
2020
chains: Web3Helper.ChainIdAll[]
@@ -37,7 +37,7 @@ export const NetworkTab = memo(function NetworkTab({
3737
const networks = useNetworkDescriptors(networkPluginID)
3838
const wallet = useWallet()
3939
const Utils = useWeb3Utils()
40-
const { value: smartPaySupportChainId } = useAsync(async () => SmartPayBundler.getSupportedChainId(), [])
40+
const smartPaySupportChainId = useSmartPayChainId()
4141

4242
const supportedChains = useMemo(() => {
4343
if (!wallet?.owner || requireChains) return chains

‎packages/shared/src/UI/components/WalletConnectedBoundary/index.tsx‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,10 +6,9 @@ import {
66
useNativeTokenBalance,
77
useRiskWarningApproved,
88
useWallet,
9+
useSmartPayChainId,
910
} from '@masknet/web3-hooks-base'
1011
import type { Web3Helper } from '@masknet/web3-helpers'
11-
import { useAsync } from 'react-use'
12-
import { SmartPayBundler } from '@masknet/web3-providers'
1312
import { NetworkPluginID } from '@masknet/shared-base'
1413
import { SelectProviderModal, WalletRiskWarningModal } from '../../modals/modals.js'
1514
import { Trans } from '@lingui/react/macro'
@@ -37,7 +36,7 @@ export function WalletConnectedBoundary(props: WalletConnectedBoundaryProps) {
3736
const { pluginID } = useNetworkContext()
3837
const { account, chainId: chainIdValid } = useChainContext({ chainId: expectedChainId })
3938
const wallet = useWallet()
40-
const { value: smartPayChainId } = useAsync(async () => SmartPayBundler.getSupportedChainId(), [])
39+
const smartPayChainId = useSmartPayChainId()
4140

4241
const nativeTokenBalance = useNativeTokenBalance(undefined, {
4342
chainId: chainIdValid,

‎packages/shared/src/UI/components/WalletStatusBar/PluginVerifiedWalletStatusBar.tsx‎

Lines changed: 14 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,32 +1,32 @@
1-
import { memo, type PropsWithChildren, useCallback, useMemo, useState } from 'react'
2-
import { useAsync, useUpdateEffect } from 'react-use'
3-
import { first, omit } from 'lodash-es'
1+
import { Trans } from '@lingui/react/macro'
42
import { Icons } from '@masknet/icons'
3+
import { type BindingProof, type NetworkPluginID, Sniffings } from '@masknet/shared-base'
54
import { makeStyles, MaskColorVar } from '@masknet/theme'
6-
import { SmartPayBundler } from '@masknet/web3-providers'
7-
import { isSameAddress, resolveNextID_NetworkPluginID, TransactionStatusType } from '@masknet/web3-shared-base'
85
import type { Web3Helper } from '@masknet/web3-helpers'
9-
import { alpha, Box, Button, Divider, MenuItem, Typography } from '@mui/material'
10-
import { type BindingProof, type NetworkPluginID, Sniffings } from '@masknet/shared-base'
116
import {
7+
useAccount,
128
useChainContext,
9+
useChainId,
10+
useDefaultChainId,
1311
useNetworkContext,
1412
useNetworkDescriptor,
1513
useProviderDescriptor,
16-
useDefaultChainId,
1714
useRecentTransactions,
15+
useSmartPayChainId,
1816
useWallets,
19-
useAccount,
20-
useChainId,
2117
useWeb3Utils,
2218
} from '@masknet/web3-hooks-base'
19+
import { isSameAddress, resolveNextID_NetworkPluginID, TransactionStatusType } from '@masknet/web3-shared-base'
20+
import { alpha, Box, Button, Divider, MenuItem, Typography } from '@mui/material'
21+
import { first, omit } from 'lodash-es'
22+
import { memo, type PropsWithChildren, useCallback, useMemo, useState } from 'react'
23+
import { useUpdateEffect } from 'react-use'
24+
import { SelectProviderModal, useMenuConfig, WalletStatusModal } from '../../../index.js'
2325
import { Action } from './Action.js'
24-
import type { WalletDescriptionProps } from './WalletDescription.js'
2526
import { useWalletName } from './hooks/useWalletName.js'
27+
import type { WalletDescriptionProps } from './WalletDescription.js'
2628
import { WalletDescription } from './WalletDescription.js'
2729
import { WalletMenuItem } from './WalletMenuItem.js'
28-
import { SelectProviderModal, WalletStatusModal, useMenuConfig } from '../../../index.js'
29-
import { Trans } from '@lingui/react/macro'
3030

3131
const useStyles = makeStyles()((theme) => ({
3232
root: {
@@ -80,7 +80,7 @@ export const PluginVerifiedWalletStatusBar = memo<PluginVerifiedWalletStatusBarP
8080
const allWallets = useWallets()
8181
const { pluginID: currentPluginID } = useNetworkContext()
8282
const isSmartPay = !!allWallets.find((x) => isSameAddress(x.address, account) && x.owner)
83-
const { value: smartPaySupportChainId } = useAsync(async () => SmartPayBundler.getSupportedChainId(), [])
83+
const smartPaySupportChainId = useSmartPayChainId()
8484

8585
// exclude current account
8686
const wallets = verifiedWallets.filter((x) => !isSameAddress(x.identity, account))

‎packages/shared/src/hooks/useAvailableBalance.ts‎

Lines changed: 9 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import { useMemo } from 'react'
2-
import { useAsync } from 'react-use'
32
import { BigNumber } from 'bignumber.js'
43
import { NetworkPluginID } from '@masknet/shared-base'
54
import {
@@ -38,13 +37,16 @@ export function useAvailableBalance<T extends NetworkPluginID = NetworkPluginID>
3837
})
3938

4039
// #region paymaster ratio
41-
const { value: currencyRatio, loading } = useAsync(async () => {
42-
const chainId = await SmartPayBundler.getSupportedChainId()
43-
const depositPaymaster = new DepositPaymaster(chainId)
44-
const ratio = await depositPaymaster.getRatio()
40+
const { data: currencyRatio, isLoading: loading } = useQuery({
41+
queryKey: ['currency-ratio', chainId],
42+
queryFn: async () => {
43+
const chainId = await SmartPayBundler.getSupportedChainId()
44+
const depositPaymaster = new DepositPaymaster(chainId)
45+
const ratio = await depositPaymaster.getRatio()
4546

46-
return ratio
47-
}, [])
47+
return ratio
48+
},
49+
})
4850
// #endregion
4951

5052
const gasFee = useMemo(() => {

0 commit comments

Comments
 (0)