From 030d8c38e046039048196c2c0173737dc42ec2b8 Mon Sep 17 00:00:00 2001 From: wenty22 Date: Wed, 13 Nov 2024 09:40:14 +0800 Subject: [PATCH] refactor: Refactor sdk --- .../src/aggregator/index.ts | 16 ++- .../stargate/hooks/useStargateWaitTime.ts | 2 +- .../SelectModal/DestinationNetworkModal.tsx | 5 +- .../SelectModal/SourceNetworkModal.tsx | 5 +- .../SelectModal/hooks/useChainList.ts | 59 +++++++++ .../SelectModal/hooks/useTokenList.ts | 5 +- .../modules/aggregator/hooks/useSelection.ts | 114 ++++++++---------- .../modules/aggregator/shared/sortTokens.ts | 8 -- 8 files changed, 131 insertions(+), 83 deletions(-) create mode 100644 packages/canonical-bridge-widget/src/modules/aggregator/components/SelectModal/hooks/useChainList.ts diff --git a/packages/canonical-bridge-sdk/src/aggregator/index.ts b/packages/canonical-bridge-sdk/src/aggregator/index.ts index 14dc52dd..e268d9d3 100644 --- a/packages/canonical-bridge-sdk/src/aggregator/index.ts +++ b/packages/canonical-bridge-sdk/src/aggregator/index.ts @@ -99,11 +99,13 @@ export class CanonicalBridgeSDK { const adapter = this.options.adapters.find( (e) => e.bridgeType === bridgeType ); - if (adapter) return adapter; - - throw Error( - `${bridgeType} adapter is not found, you should initialize an adapter before using` - ); + if (adapter) { + return adapter; + } else { + console.warn( + `${bridgeType} adapter is not found, you should initialize an adapter before using` + ); + } }, }); }); @@ -559,4 +561,8 @@ export class CanonicalBridgeSDK { return Array.from(tokenMap.values()); } + + public getChainDetail() {} + + public getTokenDetail() {} } diff --git a/packages/canonical-bridge-widget/src/modules/aggregator/adapters/stargate/hooks/useStargateWaitTime.ts b/packages/canonical-bridge-widget/src/modules/aggregator/adapters/stargate/hooks/useStargateWaitTime.ts index e9fb6027..baae8a76 100644 --- a/packages/canonical-bridge-widget/src/modules/aggregator/adapters/stargate/hooks/useStargateWaitTime.ts +++ b/packages/canonical-bridge-widget/src/modules/aggregator/adapters/stargate/hooks/useStargateWaitTime.ts @@ -22,7 +22,7 @@ export const useStargateWaitTime = () => { toEndpointId: String(toEndpointId), }); }, - enabled: !!fromEndpointId && !!toEndpointId && isMainnet, + enabled: !!fromEndpointId && !!toEndpointId && isMainnet && !!bridgeSDK.stargate, staleTime: 1000 * 30, }); }; diff --git a/packages/canonical-bridge-widget/src/modules/aggregator/components/SelectModal/DestinationNetworkModal.tsx b/packages/canonical-bridge-widget/src/modules/aggregator/components/SelectModal/DestinationNetworkModal.tsx index 3f1a3d73..e7794bb5 100644 --- a/packages/canonical-bridge-widget/src/modules/aggregator/components/SelectModal/DestinationNetworkModal.tsx +++ b/packages/canonical-bridge-widget/src/modules/aggregator/components/SelectModal/DestinationNetworkModal.tsx @@ -10,6 +10,7 @@ import { reportEvent } from '@/core/utils/gtm'; import { useSearch } from '@/modules/aggregator/components/SelectModal/hooks/useSearch'; import { BaseModal } from '@/modules/aggregator/components/SelectModal/components/BaseModal'; import { ListItem } from '@/modules/aggregator/components/SelectModal/components/ListItem'; +import { useChainList } from '@/modules/aggregator/components/SelectModal/hooks/useChainList'; interface DestinationNetworkModalProps { isOpen: boolean; @@ -33,9 +34,9 @@ export function DestinationNetworkModal(props: DestinationNetworkModalProps) { const { isNoResult, result, onSearch } = useSearch({ filter: (item, keyword) => item.name.toLowerCase().includes(keyword), - sorter: (a) => (toChain?.id === a.id ? -1 : 0), data: toChains, }); + const { data } = useChainList('to', result); return ( - + {(item) => ( item.name.toLowerCase().includes(keyword), - sorter: (a) => (fromChain?.id === a.id ? -1 : 0), data: fromChains, }); + const { data } = useChainList('from', result); return ( - + {(item) => ( state.transfer.fromChain); + const toChain = useAppSelector((state) => state.transfer.toChain); + + const sortedChains = useMemo(() => { + const chainOrder = transferConfig.order?.chains ?? []; + + const sortedChains = chains + .sort((a, b) => { + if (direction === 'to') { + const isA = a.isCompatible; + const isB = b.isCompatible; + + if (isA && !isB) { + return -1; + } + if (!isA && isB) { + return 1; + } + } + + const indexA = chainOrder.indexOf(a.id); + const indexB = chainOrder.indexOf(b.id); + + if (indexA > -1 && indexB === -1) { + return -1; + } + if (indexA === -1 && indexB > -1) { + return 1; + } + if (indexA > -1 && indexB > -1) { + return indexA - indexB; + } + + return a.name < b.name ? -1 : 1; + }) + .sort((a) => { + if (direction === 'from' && a.id === fromChain?.id) { + return -1; + } + if (direction === 'to' && a.id === toChain?.id) { + return -1; + } + return 0; + }); + + return sortedChains; + }, [transferConfig.order?.chains, chains, direction, fromChain?.id, toChain?.id]); + + return { data: sortedChains }; +} diff --git a/packages/canonical-bridge-widget/src/modules/aggregator/components/SelectModal/hooks/useTokenList.ts b/packages/canonical-bridge-widget/src/modules/aggregator/components/SelectModal/hooks/useTokenList.ts index 1409185f..4498dcdc 100644 --- a/packages/canonical-bridge-widget/src/modules/aggregator/components/SelectModal/hooks/useTokenList.ts +++ b/packages/canonical-bridge-widget/src/modules/aggregator/components/SelectModal/hooks/useTokenList.ts @@ -1,5 +1,5 @@ import { useMemo } from 'react'; -import { IBridgeToken } from '@bnb-chain/canonical-bridge-sdk'; +import { IBridgeToken, isSameAddress } from '@bnb-chain/canonical-bridge-sdk'; import { IBridgeTokenWithBalance } from '@/modules/aggregator/types'; import { useTokenPrice } from '@/modules/aggregator/hooks/useTokenPrice'; @@ -37,7 +37,8 @@ export function useTokenList(tokens: IBridgeToken[] = []) { const sortedTokens = sortTokens({ tokens: tmpTokens, orders: transferConfig.order?.tokens, - selectedTokenAddress: selectedToken?.address, + }).sort((a) => { + return isSameAddress(a.address, selectedToken?.address) && a.isCompatible ? -1 : 0; }); return sortedTokens; diff --git a/packages/canonical-bridge-widget/src/modules/aggregator/hooks/useSelection.ts b/packages/canonical-bridge-widget/src/modules/aggregator/hooks/useSelection.ts index 46278454..5eb8b549 100644 --- a/packages/canonical-bridge-widget/src/modules/aggregator/hooks/useSelection.ts +++ b/packages/canonical-bridge-widget/src/modules/aggregator/hooks/useSelection.ts @@ -1,7 +1,7 @@ import { useChains } from 'wagmi'; import { useCallback } from 'react'; import { useConnection } from '@solana/wallet-adapter-react'; -import { IBridgeChain, IBridgeToken } from '@bnb-chain/canonical-bridge-sdk'; +import { ChainType, IBridgeChain, IBridgeToken } from '@bnb-chain/canonical-bridge-sdk'; import { useAggregator } from '@/modules/aggregator/components/AggregatorProvider'; import { IBridgeTokenWithBalance } from '@/modules/aggregator/types'; @@ -35,13 +35,12 @@ export function useSelection() { toChainId?: number; token?: IBridgeToken; }) => { - const newToToken = getToToken({ - fromChainId: fromChainId!, - toChainId: toChainId!, - token: token!, - }); - - dispatch(setToToken(newToToken)); + // const newToToken = getToToken({ + // fromChainId: fromChainId!, + // toChainId: toChainId!, + // token: token!, + // }); + // dispatch(setToToken(newToToken)); }; const updateSelectedInfo = ({ @@ -53,58 +52,58 @@ export function useSelection() { tmpToChain?: IBridgeChain; tmpToken?: IBridgeToken; }) => { - const newToken = bridgeSDK - .getTokens({ - fromChainId: tmpFromChain?.id, - toChainId: tmpToChain?.id, - }) - .find((t) => t.displaySymbol?.toUpperCase() === tmpToken?.displaySymbol?.toUpperCase()); - - const newFromChain = getFromChains({ - toChainId: tmpToChain?.id, - token: newToken, - }).find((c) => c.id === tmpFromChain?.id); - - const newToChain = getToChains({ - fromChainId: tmpFromChain?.id, - token: newToken, - }).find((c) => c.id === tmpToChain?.id); - - dispatch(setFromChain(newFromChain)); - dispatch(setToChain(newToChain)); - dispatch(setSelectedToken(newToken)); - - updateToToken({ - fromChainId: newFromChain?.id, - toChainId: newToChain?.id, - token: newToken, - }); + // const newToken = bridgeSDK + // .getTokens({ + // fromChainId: tmpFromChain?.id, + // toChainId: tmpToChain?.id, + // }) + // .find((t) => t.displaySymbol?.toUpperCase() === tmpToken?.displaySymbol?.toUpperCase()); + // const newFromChain = bridgeSDK + // .getFromChains({ + // toChainId: tmpToChain?.id, + // token: newToken, + // }) + // .find((c) => c.id === tmpFromChain?.id); + // const newToChain = bridgeSDK + // .getToChains({ + // fromChainId: tmpFromChain?.id, + // token: newToken, + // }) + // .find((c) => c.id === tmpToChain?.id); + // dispatch(setFromChain(newFromChain)); + // dispatch(setToChain(newToChain)); + // dispatch(setSelectedToken(newToken)); + // updateToToken({ + // fromChainId: newFromChain?.id, + // toChainId: newToChain?.id, + // token: newToken, + // }); }; const selectFromChain = async (tmpFromChain: IBridgeChain) => { // After selecting fromChain, if toChain becomes incompatible, reselect the first compatible network in toChain list. - const toChains = getToChains({ + const toChains = bridgeSDK.getToChains({ fromChainId: tmpFromChain.id, }); const tmpToChain = - toChains.find((c) => isChainOrTokenCompatible(c) && c.id === toChain?.id) ?? - toChains.find((c) => isChainOrTokenCompatible(c) && c.chainType !== 'link'); + toChains.find((c) => c.isCompatible && c.id === toChain?.id) ?? + toChains.find((c) => c.isCompatible && c.chainType !== 'link'); const tmpTokens = await getSortedTokens({ chainType: tmpFromChain.chainType, fromChainId: tmpFromChain.id, - tokens: getTokens({ + tokens: bridgeSDK.getTokens({ fromChainId: tmpFromChain.id, - toChainId: tmpToChain?.id, + toChainId: tmpToChain!.id, }), }); const newToken = tmpTokens.find( (t) => - isChainOrTokenCompatible(t) && + t.isCompatible && t.displaySymbol.toUpperCase() === selectedToken?.displaySymbol.toUpperCase(), - ) ?? tmpTokens.find((t) => isChainOrTokenCompatible(t)); + ) ?? tmpTokens.find((t) => t.isCompatible); updateSelectedInfo({ tmpToken: newToken, @@ -123,13 +122,6 @@ export function useSelection() { toChainId: number; tokenSymbol: string; }) { - const { adapters } = bridgeSDK.getSDKOptions(); - const bridgeTypes = adapters.map((item) => item.bridgeType); - - const token = Object.fromEntries( - bridgeTypes.map((item) => [item, { symbol: tokenSymbol }]), - ) as any as IBridgeToken; - if (chainId) { const fromChains = bridgeSDK.getFromChains(); const chain = fromChains.find((chain) => chain.id === chainId); @@ -140,15 +132,11 @@ export function useSelection() { if (fromChain?.id) return; } - const fromChains = getFromChains({ - toChainId, - token, - }); - const toChains = getToChains({ + const fromChains = bridgeSDK.getFromChains(); + const toChains = bridgeSDK.getToChains({ fromChainId, - token, }); - const tokens = getTokens({ + const tokens = bridgeSDK.getTokens({ fromChainId, toChainId, }); @@ -163,11 +151,11 @@ export function useSelection() { dispatch(setToChain(newToChain)); dispatch(setSelectedToken(newToken)); - updateToToken({ - fromChainId: newFromChain?.id, - toChainId: newToChain?.id, - token: newToken, - }); + // updateToToken({ + // fromChainId: newFromChain?.id, + // toChainId: newToChain?.id, + // token: newToken, + // }); }, selectFromChain, async selectToChain(tmpToChain: IBridgeChain) { @@ -175,7 +163,7 @@ export function useSelection() { const tmpTokens = await getSortedTokens({ fromChainId, - tokens: getTokens({ + tokens: bridgeSDK.getTokens({ fromChainId, toChainId: tmpToChain?.id, }), @@ -184,9 +172,9 @@ export function useSelection() { const newToken = tmpTokens.find( (t) => - isChainOrTokenCompatible(t) && + t.isCompatible && t.displaySymbol.toUpperCase() === selectedToken?.displaySymbol.toUpperCase(), - ) ?? tmpTokens.find((t) => isChainOrTokenCompatible(t)); + ) ?? tmpTokens.find((t) => t.isCompatible); updateSelectedInfo({ tmpToken: newToken, diff --git a/packages/canonical-bridge-widget/src/modules/aggregator/shared/sortTokens.ts b/packages/canonical-bridge-widget/src/modules/aggregator/shared/sortTokens.ts index bed5f977..18590b0f 100644 --- a/packages/canonical-bridge-widget/src/modules/aggregator/shared/sortTokens.ts +++ b/packages/canonical-bridge-widget/src/modules/aggregator/shared/sortTokens.ts @@ -1,23 +1,15 @@ -import { isSameAddress } from '@bnb-chain/canonical-bridge-sdk'; - import { IBridgeTokenWithBalance } from '@/modules/aggregator/types'; export function sortTokens({ tokens = [], orders = [], - selectedTokenAddress, }: { tokens?: IBridgeTokenWithBalance[]; orders?: string[]; - selectedTokenAddress?: string; }) { const tokenOrders = orders.map((item) => item.toUpperCase()); const sortedTokens = [...tokens].sort((a, b) => { - if (isSameAddress(a.address, selectedTokenAddress) && a.isCompatible) { - return -1; - } - const aSymbol = a.displaySymbol.toUpperCase(); const bSymbol = b.displaySymbol.toUpperCase();