Merge pull request #198 from bnb-chain/wenty/pancake

Wenty/pancake
bnb-chain · Dec 16, 2024 · 5789c21 · 5789c21
2 parents 94005a7 + c245228
commit 5789c21
Show file tree

Hide file tree

Showing 46 changed files with 816 additions and 436 deletions.
diff --git a/.release/.changeset/cold-baboons-serve.md b/.release/.changeset/cold-baboons-serve.md
@@ -0,0 +1,5 @@
+---
+"@bnb-chain/canonical-bridge-widget": patch
+---
+
+Add attribute `data-address` to all routes
diff --git a/.release/.changeset/happy-insects-give.md b/.release/.changeset/happy-insects-give.md
@@ -0,0 +1,5 @@
+---
+"@bnb-chain/canonical-bridge-widget": patch
+---
+
+Add more customizable configs
diff --git a/.release/.changeset/hip-news-reflect.md b/.release/.changeset/hip-news-reflect.md
@@ -0,0 +1,5 @@
+---
+"@bnb-chain/canonical-bridge-widget": patch
+---
+
+Keep the previous selected route after routes refreshing
diff --git a/.release/.changeset/honest-adults-mate.md b/.release/.changeset/honest-adults-mate.md
@@ -0,0 +1,5 @@
+---
+"@bnb-chain/canonical-bridge-widget": patch
+---
+
+Fixed an issue caused by sdk not building
diff --git a/.release/.changeset/large-jeans-jam.md b/.release/.changeset/large-jeans-jam.md
@@ -0,0 +1,5 @@
+---
+"@bnb-chain/canonical-bridge-widget": patch
+---
+
+Support custom toast for errors
diff --git a/.release/.changeset/lazy-vans-applaud.md b/.release/.changeset/lazy-vans-applaud.md
@@ -0,0 +1,5 @@
+---
+"@bnb-chain/canonical-bridge-widget": patch
+---
+
+Split `TransferWidget` into `BridgeTransfer` and `BridgeRoutes`
diff --git a/.release/.changeset/long-rivers-type.md b/.release/.changeset/long-rivers-type.md
@@ -0,0 +1,5 @@
+---
+"@bnb-chain/canonical-bridge-widget": patch
+---
+
+AlertIcon supports customize color
diff --git a/.release/.changeset/metal-scissors-repeat.md b/.release/.changeset/metal-scissors-repeat.md
@@ -0,0 +1,5 @@
+---
+"@bnb-chain/canonical-bridge-widget": patch
+---
+
+Add to token address to route
diff --git a/.release/.changeset/pre.json b/.release/.changeset/pre.json
@@ -0,0 +1,22 @@
+{
+  "mode": "pre",
+  "tag": "alpha",
+  "initialVersions": {
+    "@bnb-chain/canonical-bridge-sdk": "0.4.2",
+    "@bnb-chain/canonical-bridge-widget": "0.5.9"
+  },
+  "changesets": [
+    "cold-baboons-serve",
+    "happy-insects-give",
+    "hip-news-reflect",
+    "honest-adults-mate",
+    "large-jeans-jam",
+    "lazy-vans-applaud",
+    "long-rivers-type",
+    "metal-scissors-repeat",
+    "quiet-hotels-accept",
+    "silent-keys-fold",
+    "small-mangos-lay",
+    "tough-carrots-report"
+  ]
+}
diff --git a/.release/.changeset/quiet-hotels-accept.md b/.release/.changeset/quiet-hotels-accept.md
@@ -0,0 +1,5 @@
+---
+"@bnb-chain/canonical-bridge-widget": patch
+---
+
+Support custom toast for errors
diff --git a/.release/.changeset/silent-keys-fold.md b/.release/.changeset/silent-keys-fold.md
@@ -0,0 +1,5 @@
+---
+"@bnb-chain/canonical-bridge-widget": patch
+---
+
+Support custom toast for errors
diff --git a/.release/.changeset/small-mangos-lay.md b/.release/.changeset/small-mangos-lay.md
@@ -0,0 +1,5 @@
+---
+"@bnb-chain/canonical-bridge-widget": patch
+---
+
+Remove bridge bottom element if `routeContentBottom` not setted
diff --git a/.release/.changeset/tough-carrots-report.md b/.release/.changeset/tough-carrots-report.md
@@ -0,0 +1,5 @@
+---
+"@bnb-chain/canonical-bridge-widget": patch
+---
+
+Support specific wallets to exclude unsupported chains
diff --git a/apps/canonical-bridge-ui/core/components/Layout/index.tsx b/apps/canonical-bridge-ui/core/components/Layout/index.tsx
@@ -9,11 +9,12 @@ export function Layout({ children }: React.PropsWithChildren) {
       <Header />
       <Flex
         as="main"
-        flexDir="column"
         flex={1}
-        w={['100%', '100%', '100%', 'auto']}
         p={['24px 20px', '24px 20px', '40px']}
-        alignItems="center"
+        w={['100%']}
+        mb={['120px', '120px', '160px']}
+        alignItems={'flex-start'}
+        justifyContent={'center'}
       >
         {children}
       </Flex>

diff --git a/apps/canonical-bridge-ui/pages/mainnet/index.tsx b/apps/canonical-bridge-ui/pages/mainnet/index.tsx
@@ -1,8 +1,11 @@
 import {
   CanonicalBridgeProvider,
   ICanonicalBridgeConfig,
-  TransferWidget,
+  BridgeTransfer,
+  BridgeRoutes,
 } from '@bnb-chain/canonical-bridge-widget';
+import { useMemo } from 'react';
+import { useAccount } from 'wagmi';
 
 import { useTransferConfig } from '@/token-config/mainnet/useTransferConfig';
 import { chains } from '@/token-config/mainnet/chains';
@@ -13,6 +16,13 @@ import { useWalletModal } from '@/core/wallet/hooks/useWalletModal';
 import { WalletProvider } from '@/core/wallet/WalletProvider';
 import { Layout } from '@/core/components/Layout';
 
+const unsupportedChainsInWallets = [
+  {
+    wallets: ['BinanceW3WSDK', 'binanceWeb3Wallet'],
+    chains: [1101],
+  },
+];
+
 export const bridgeConfig: ICanonicalBridgeConfig = {
   appName: env.APP_NAME,
   assetPrefix: env.ASSET_PREFIX,
@@ -43,15 +53,29 @@ function BridgeWidget() {
   const transferConfig = useTransferConfig();
   const { onOpen } = useWalletModal();
 
+  const { connector } = useAccount();
+  const supportedChains = useMemo(() => {
+    return chains.filter((e) => {
+      if (connector) {
+        const unsupportedChains = unsupportedChainsInWallets.find((e) =>
+          e.wallets.includes(connector.id),
+        )?.chains;
+        return !unsupportedChains?.includes(e.id);
+      }
+      return true;
+    });
+  }, [connector]);
+
   return (
     <CanonicalBridgeProvider
       config={bridgeConfig}
       transferConfig={transferConfig}
-      chains={chains}
+      chains={supportedChains}
       onClickConnectWalletButton={onOpen}
     >
       <Layout>
-        <TransferWidget />
+        <BridgeTransfer />
+        <BridgeRoutes />
       </Layout>
     </CanonicalBridgeProvider>
   );

diff --git a/apps/canonical-bridge-ui/pages/testnet/index.tsx b/apps/canonical-bridge-ui/pages/testnet/index.tsx
@@ -1,7 +1,8 @@
 import {
   CanonicalBridgeProvider,
   ICanonicalBridgeConfig,
-  TransferWidget,
+  BridgeTransfer,
+  BridgeRoutes,
 } from '@bnb-chain/canonical-bridge-widget';
 
 import { useTestnetTransferConfig } from '@/token-config/testnet/useTestnetTransferConfig';
@@ -52,7 +53,8 @@ function BridgeWidget() {
       onClickConnectWalletButton={onOpen}
     >
       <Layout>
-        <TransferWidget />
+        <BridgeTransfer />
+        <BridgeRoutes />
       </Layout>
     </CanonicalBridgeProvider>
   );

diff --git a/apps/canonical-bridge-ui/public/images/tokens/CAKE.png b/apps/canonical-bridge-ui/public/images/tokens/CAKE.png
diff --git a/apps/canonical-bridge-ui/token-config/mainnet/useTransferConfig.ts b/apps/canonical-bridge-ui/token-config/mainnet/useTransferConfig.ts
@@ -129,11 +129,15 @@ export function useTransferConfig() {
               56: [
                 '0x67d66e8ec1fd25d98b3ccd3b19b7dc4b4b7fc493',
                 '0x0000000000000000000000000000000000000000',
+                '0x9c7beba8f6ef6643abd725e45a4e8387ef260649',
               ],
               137: ['cUSDCv3'],
               42161: ['cUSDCv3'],
               43114: ['BNB'],
-              7565164: ['So11111111111111111111111111111111111111112'],
+              7565164: [
+                'So11111111111111111111111111111111111111112',
+                'FmqVMWXBESyu4g6FT1uz1GABKdJ4j6wbuuLFwPJtqpmu',
+              ],
             },
           },
           bridgedTokenGroups: [

diff --git a/packages/canonical-bridge-widget/CHANGELOG.md b/packages/canonical-bridge-widget/CHANGELOG.md
@@ -1,5 +1,78 @@
 # @bnb-chain/canonical-bridge-widget
 
+## 0.5.14-alpha.3
+
+### Patch Changes
+
+- Add attribute `data-address` to all routes
+
+## 0.5.14-alpha.2
+
+### Patch Changes
+
+- Fixed an issue caused by sdk not building
+
+## 0.5.14-alpha.1
+
+### Patch Changes
+
+- Support specific wallets to exclude unsupported chains
+
+## 0.5.14-alpha.0
+
+### Patch Changes
+
+- Add to token address to route
+
+## 0.5.12-alpha.3
+
+### Patch Changes
+
+- Support custom toast for errors
+
+## 0.5.12-alpha.2
+
+### Patch Changes
+
+- Support custom toast for errors
+
+## 0.5.12-alpha.1
+
+### Patch Changes
+
+- Support custom toast for errors
+
+## 0.5.12-alpha.0
+
+### Patch Changes
+
+- Keep the previous selected route after routes refreshing
+
+## 0.5.10-alpha.4
+
+### Patch Changes
+
+- Remove bridge bottom element if `routeContentBottom` not setted
+
+## 0.5.10-alpha.3
+
+### Patch Changes
+
+- Split `TransferWidget` into `BridgeTransfer` and `BridgeRoutes`
+
+## 0.5.10-alpha.2
+
+### Patch Changes
+
+- 2849332: Add more customizable configs
+- AlertIcon supports customize color
+
+## 0.5.10-alpha.0
+
+### Patch Changes
+
+- Add more customizable configs
+
 ## 0.5.12
 
 ### Patch Changes

diff --git a/packages/canonical-bridge-widget/package.json b/packages/canonical-bridge-widget/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@bnb-chain/canonical-bridge-widget",
-  "version": "0.5.12",
+  "version": "0.5.14-alpha.3",
   "description": "canonical bridge widget",
   "author": "bnb-chain",
   "private": false,

diff --git a/packages/canonical-bridge-widget/src/CanonicalBridgeProvider.tsx b/packages/canonical-bridge-widget/src/CanonicalBridgeProvider.tsx
@@ -10,6 +10,7 @@ import { TokenPricesProvider } from '@/modules/aggregator/components/TokenPrices
 import { locales } from '@/core/locales';
 import { TronAccountProvider } from '@/modules/wallet/TronAccountProvider';
 import { WalletConnectButton } from '@/modules/transfer/components/Button/WalletConnectButton';
+import { ExportsProvider } from '@/ExportsProvider';
 
 export interface ICanonicalBridgeConfig {
   appName: string;
@@ -40,11 +41,13 @@ export interface ICanonicalBridgeConfig {
 interface CanonicalBridgeContextProps extends ICanonicalBridgeConfig {
   routeContentBottom: React.ReactNode;
   connectWalletButton: React.ReactNode;
+  refreshingIcon?: React.ReactNode;
   onClickConnectWalletButton?: (params: {
     chainType: ChainType;
     chainId: number;
     onConnected?: (params?: { walletType?: ChainType; chainId?: number }) => void;
   }) => void;
+  onError?: (params: { type: string; message?: string; error?: Error }) => void;
 }
 
 const CanonicalBridgeContext = React.createContext({} as CanonicalBridgeContextProps);
@@ -61,6 +64,8 @@ export interface CanonicalBridgeProviderProps {
   connectWalletButton?: React.ReactNode;
   children: React.ReactNode;
   onClickConnectWalletButton?: CanonicalBridgeContextProps['onClickConnectWalletButton'];
+  onError?: CanonicalBridgeContextProps['onError'];
+  refreshingIcon?: React.ReactNode;
 }
 
 export function CanonicalBridgeProvider(props: CanonicalBridgeProviderProps) {
@@ -71,7 +76,9 @@ export function CanonicalBridgeProvider(props: CanonicalBridgeProviderProps) {
     transferConfig,
     routeContentBottom,
     connectWalletButton,
+    refreshingIcon,
     onClickConnectWalletButton,
+    onError,
   } = props;
 
   const value = useMemo<CanonicalBridgeContextProps>(() => {
@@ -97,8 +104,17 @@ export function CanonicalBridgeProvider(props: CanonicalBridgeProviderProps) {
       routeContentBottom,
       connectWalletButton: connectWalletButton ?? <WalletConnectButton />,
       onClickConnectWalletButton,
+      onError,
+      refreshingIcon,
     };
-  }, [config, connectWalletButton, onClickConnectWalletButton, routeContentBottom]);
+  }, [
+    config,
+    connectWalletButton,
+    onClickConnectWalletButton,
+    onError,
+    refreshingIcon,
+    routeContentBottom,
+  ]);
 
   return (
     <CanonicalBridgeContext.Provider value={value}>
@@ -109,7 +125,7 @@ export function CanonicalBridgeProvider(props: CanonicalBridgeProviderProps) {
               <TronAccountProvider>
                 <TokenBalancesProvider />
                 <TokenPricesProvider />
-                {children}
+                <ExportsProvider>{children}</ExportsProvider>
               </TronAccountProvider>
             </ThemeProvider>
           </AggregatorProvider>

diff --git a/packages/canonical-bridge-widget/src/ExportsProvider.tsx b/packages/canonical-bridge-widget/src/ExportsProvider.tsx
@@ -0,0 +1,30 @@
+import React, { useContext, useMemo } from 'react';
+
+import { useAppSelector } from '@/modules/store/StoreProvider';
+
+interface ExportsContextProps {
+  isGlobalFeeLoading: boolean;
+  isRefreshing: boolean;
+}
+
+const ExportsContext = React.createContext({} as ExportsContextProps);
+
+export function ExportsProvider(props: React.PropsWithChildren) {
+  const { children } = props;
+
+  const isGlobalFeeLoading = useAppSelector((state) => state.transfer.isGlobalFeeLoading) ?? false;
+  const isRefreshing = useAppSelector((state) => state.transfer.isRefreshing) ?? false;
+
+  const value = useMemo(() => {
+    return {
+      isGlobalFeeLoading,
+      isRefreshing,
+    };
+  }, [isGlobalFeeLoading, isRefreshing]);
+
+  return <ExportsContext.Provider value={value}>{children}</ExportsContext.Provider>;
+}
+
+export function useBridge() {
+  return useContext(ExportsContext);
+}