[NO CHANGELOG] [Add Tokens Widget] Fetch chains from squid sdk (#2384)

immutable · Nov 12, 2024 · 266257d · 266257d
1 parent 230f601
commit 266257d
Show file tree

Hide file tree

Showing 4 changed files with 12 additions and 38 deletions.
diff --git a/packages/checkout/widgets-lib/src/widgets/add-tokens/AddTokensWidget.tsx b/packages/checkout/widgets-lib/src/widgets/add-tokens/AddTokensWidget.tsx
@@ -126,17 +126,15 @@ export default function AddTokensWidget({
   }, [toTokenAddress, toAmount]);
 
   useEffect(() => {
-    (async () => {
-      const chainsResponse = await fetchChains();
+    if (!squid) return;
 
-      addTokensDispatch({
-        payload: {
-          type: AddTokensActions.SET_CHAINS,
-          chains: chainsResponse,
-        },
-      });
-    })();
-  }, []);
+    addTokensDispatch({
+      payload: {
+        type: AddTokensActions.SET_CHAINS,
+        chains: fetchChains(squid),
+      },
+    });
+  }, [squid]);
 
   useEffect(() => {
     if (!squid || !chains || !fromProvider || fetchingBalances.current) return;

diff --git a/packages/checkout/widgets-lib/src/widgets/add-tokens/functions/fetchChains.ts b/packages/checkout/widgets-lib/src/widgets/add-tokens/functions/fetchChains.ts
@@ -1,5 +1,5 @@
+import { Squid } from '@0xsquid/sdk';
 import { Chain } from '../types';
-import { SQUID_API_BASE_URL } from '../utils/config';
 
 type SquidChain = {
   chainId: string;
@@ -9,31 +9,17 @@ type SquidChain = {
   nativeCurrency: SquidNativeCurrency;
 };
 
-type SquidChains = {
-  chains: SquidChain[];
-};
-
 export type SquidNativeCurrency = {
   name: string;
   symbol: string;
   decimals: number;
   icon: string;
 };
 
-export const fetchChains = async (): Promise<Chain[]> => {
-  const url = `${SQUID_API_BASE_URL}/chains`;
-
-  const response = await fetch(url, {
-    method: 'GET',
-    headers: {
-      // eslint-disable-next-line @typescript-eslint/naming-convention
-      'Content-Type': 'application/json',
-    },
-  });
-
-  const data: SquidChains = await response.json();
+export const fetchChains = (squid: Squid): Chain[] => {
+  const { chains } = squid;
 
-  return data.chains.map((chain: SquidChain) => ({
+  return chains.map((chain: SquidChain) => ({
     id: chain.chainId.toString(),
     name: chain.networkName,
     iconUrl: chain.chainIconURI,

diff --git a/packages/checkout/widgets-lib/src/widgets/add-tokens/utils/config.ts b/packages/checkout/widgets-lib/src/widgets/add-tokens/utils/config.ts
@@ -1,7 +1,5 @@
 export const SQUID_SDK_BASE_URL = 'https://apiplus.squidrouter.com';
 
-export const SQUID_API_BASE_URL = 'https://api.squidrouter.com/v1';
-
 export const SQUID_NATIVE_TOKEN = '0xEeeeeEeeeEeEeeEeEeEeeEEEeeeeEeeeeeeeEEeE';
 
 export const FIXED_HANDOVER_DURATION = 2000;

diff --git a/packages/checkout/widgets-lib/src/widgets/add-tokens/views/Review.tsx b/packages/checkout/widgets-lib/src/widgets/add-tokens/views/Review.tsx
@@ -455,10 +455,6 @@ export function Review({
                   <Sticker.FramedImage
                     use={<img src={fromChain?.iconUrl} alt={fromChain?.name} />}
                     emphasized
-                    sx={{
-                      bottom: 'base.spacing.x2',
-                      right: 'base.spacing.x2',
-                    }}
                   />
                 </Sticker>
                 <Stack sx={{ flex: 1 }} gap="0px">
@@ -596,10 +592,6 @@ export function Review({
                   <Sticker.FramedImage
                     use={<img src={toChain?.iconUrl} alt={toChain?.name} />}
                     emphasized
-                    sx={{
-                      bottom: 'base.spacing.x2',
-                      right: 'base.spacing.x2',
-                    }}
                   />
                 </Sticker>
                 <Stack sx={{ flex: 1 }} gap="0px">