Add base network definitions

src/App/components/PageHeader/NetworkSelector/NetworkSelector.tsx

@@ -21,6 +21,7 @@ import { RiExternalLinkLine } from 'react-icons/ri';
 import cantoLogo from '../../../../assets/images/networks/canto.png';
 import scrollLogo from '../../../../assets/images/networks/scroll.png';
 import blastLogo from '../../../../assets/images/networks/blast_logo.png';
+import baseLogo from '../../../../assets/images/networks/base_logo.svg';
 import ETH from '../../../../assets/images/logos/eth-diamond-purple.png';
 import { lookupChain } from '@crocswap-libs/sdk/dist/context';
 import { BrandContext } from '../../../../contexts/BrandContext';
@@ -152,6 +153,33 @@ export default function NetworkSelector(props: propsIF) {
         </NetworkItem>
     );
 
+    const baseNetwork: JSX.Element = (
+        <NetworkItem
+            id='base_network_selector'
+            onClick={() => handleClick(chainMap.get('0x2105'))}
+            key='base'
+            custom={0}
+            variants={ItemEnterAnimation}
+            tabIndex={0}
+        >
+            <ChainNameStatus tabIndex={0} active={chainId === '0x2105'}>
+                <img
+                    src={baseLogo}
+                    alt='base network'
+                    width='22px'
+                    height='22px'
+                    style={{ borderRadius: '50%', marginLeft: '-2px' }}
+                />
+                <Text
+                    color={chainId === '0x2105' ? 'accent1' : 'white'}
+                    style={{ marginLeft: '5px' }}
+                >
+                    {'Base'}
+                </Text>
+            </ChainNameStatus>
+        </NetworkItem>
+    );
+
     // JSX element to select canto network (external link)
     const cantoNetwork: JSX.Element = (
         <NetworkItem
@@ -274,6 +302,35 @@ export default function NetworkSelector(props: propsIF) {
         </NetworkItem>
     );
 
+    const baseSepolia: JSX.Element = (
+        <NetworkItem
+            id='base_sepolia_selector'
+            onClick={() => handleClick(chainMap.get('0x14a34'))}
+            key='base'
+            custom={0}
+            variants={ItemEnterAnimation}
+            tabIndex={0}
+        >
+            <ChainNameStatus tabIndex={0} active={chainId === '0x14a34'}>
+                <img
+                    src={baseLogo}
+                    alt='base network'
+                    width='22px'
+                    height='22px'
+                    style={{ borderRadius: '50%', marginLeft: '-2px' }}
+                />
+                <Text
+                    color={chainId === '0x14a34' ? 'accent1' : 'white'}
+                    style={{ marginLeft: '5px' }}
+                >
+                    {'Sepolia'}
+                </Text>
+                <Text color={'accent1'} fontSize={'mini'} marginLeft='32px'>
+                    Testnet
+                </Text>
+            </ChainNameStatus>
+        </NetworkItem>
+    );
     return (
         <div style={{ position: 'relative' }}>
             <DropdownMenuContainer
@@ -295,7 +352,11 @@ export default function NetworkSelector(props: propsIF) {
                                     .displayName.toLowerCase()
                                     .includes('blast')
                               ? blastLogo
-                              : ETH
+                              : lookupChain(chainId)
+                                      .displayName.toLowerCase()
+                                      .includes('base')
+                                ? baseLogo
+                                : ETH
                     }
                 >
                     <MenuContent
@@ -305,12 +366,14 @@ export default function NetworkSelector(props: propsIF) {
                         {chainMap.has('0x1') && ethereumNetwork}
                         {chainMap.has('0x13e31') && blastNetwork}
                         {chainMap.has('0x82750') && scrollNetwork}
+                        {chainMap.has('0x2105') && baseNetwork}
                         {includeCanto &&
                             platformName === 'ambient' &&
                             cantoNetwork}
                         {chainMap.has('0xaa36a7') && sepoliaNetwork}
                         {chainMap.has('0xa0c71fd') && blastSepoliaNetwork}
                         {chainMap.has('0x8274f') && scrollSepoliaNetwork}
+                        {chainMap.has('0x14a34') && baseSepolia}
                     </MenuContent>
                 </DropdownMenu2>
             </DropdownMenuContainer>

src/App/hooks/useTokenSearch.ts

@@ -146,7 +146,14 @@ export const useTokenSearch = (
                                   tokenListURIs.blastCoingecko,
                               ),
                           )
-                        : tokens.getTokensFromList(tokenListURIs.ambient);
+                        : chainId === '0x2105'
+                          ? patchLists(
+                                tokens.getTokensFromList(tokenListURIs.ambient),
+                                tokens.getTokensFromList(
+                                    tokenListURIs.baseCoingecko,
+                                ),
+                            )
+                          : tokens.getTokensFromList(tokenListURIs.ambient);
 
             // ERC-20 tokens from connected wallet subject to universe verification
             const verifiedWalletTokens: TokenIF[] = walletTokens.filter(

src/ambient-utils/constants/networks/baseMainnet.ts

@@ -0,0 +1,40 @@
+import { lookupChain } from '@crocswap-libs/sdk/dist/context';
+import { scrollETH, scrollUSDC } from '../defaultTokens';
+import { NetworkIF } from '../../types/NetworkIF';
+import { TopPool } from './TopPool';
+import { Provider } from 'ethers';
+import { GCGO_SCROLL_URL } from '../gcgo';
+import { bigIntToFloat } from '@crocswap-libs/sdk';
+
+export const BASE_RPC_URL =
+    import.meta.env.VITE_BASE_RPC_URL !== undefined
+        ? import.meta.env.VITE_BASE_RPC_URL
+        : 'https://mainnet.base.org';
+
+const chain = {
+    chainId: 8453,
+    name: 'Base',
+    currency: 'ETH',
+    rpcUrl: 'https://mainnet.base.org',
+    explorerUrl: 'https://basescan.org',
+};
+
+export const baseMainnet: NetworkIF = {
+    chainId: '0x2105',
+    graphCacheUrl: GCGO_SCROLL_URL,
+    evmRpcUrl: BASE_RPC_URL,
+    chain: chain,
+    shouldPollBlock: true,
+    marketData: '0x2105',
+    defaultPair: [scrollETH, scrollUSDC],
+    topPools: [
+        new TopPool(scrollETH, scrollUSDC, lookupChain('0x2105').poolIndex),
+    ],
+    getGasPriceInGwei: async (provider?: Provider) => {
+        if (!provider) return 0;
+        return (
+            bigIntToFloat((await provider.getFeeData()).gasPrice || BigInt(0)) *
+            1e-9
+        );
+    },
+};

src/ambient-utils/constants/networks/baseSepolia.ts

@@ -0,0 +1,53 @@
+import { lookupChain } from '@crocswap-libs/sdk/dist/context';
+import {
+    scrollSepoliaETH,
+    scrollSepoliaUSDC,
+    scrollSepoliaWBTC,
+} from '../defaultTokens';
+import { NetworkIF } from '../../types/NetworkIF';
+import { TopPool } from './TopPool';
+import { Provider } from 'ethers';
+import { GCGO_TESTNET_URL } from '../gcgo';
+import { bigIntToFloat } from '@crocswap-libs/sdk';
+
+const chain = {
+    chainId: 84532,
+    name: 'Base Sepolia',
+    currency: 'ETH',
+    rpcUrl: 'https://sepolia.base.org/',
+    explorerUrl: 'https://sepolia.basescan.org',
+};
+
+export const baseSepolia: NetworkIF = {
+    chainId: '0x14a34',
+    graphCacheUrl: GCGO_TESTNET_URL,
+    evmRpcUrl: 'https://sepolia.base.org/',
+    chain: chain,
+    shouldPollBlock: true,
+    marketData: '0x1',
+    defaultPair: [scrollSepoliaETH, scrollSepoliaUSDC],
+    topPools: [
+        new TopPool(
+            scrollSepoliaETH,
+            scrollSepoliaUSDC,
+            lookupChain('0x14a34').poolIndex,
+        ),
+        new TopPool(
+            scrollSepoliaETH,
+            scrollSepoliaWBTC,
+            lookupChain('0x14a34').poolIndex,
+        ),
+        new TopPool(
+            scrollSepoliaUSDC,
+            scrollSepoliaWBTC,
+            lookupChain('0x14a34').poolIndex,
+        ),
+    ],
+    getGasPriceInGwei: async (provider?: Provider) => {
+        if (!provider) return 0;
+        return (
+            bigIntToFloat((await provider.getFeeData()).gasPrice || BigInt(0)) *
+            1e-9
+        );
+    },
+};

src/ambient-utils/constants/networks/blastNetwork.ts → src/ambient-utils/constants/networks/blastMainnet.ts

@@ -19,7 +19,7 @@ const chain = {
     explorerUrl: 'https://blastscan.io',
 };
 
-export const blast: NetworkIF = {
+export const blastMainnet: NetworkIF = {
     chainId: '0x13e31',
     graphCacheUrl: GCGO_BLAST_URL,
     evmRpcUrl: BLAST_RPC_URL,

src/ambient-utils/constants/networks/index.ts

@@ -3,14 +3,17 @@ import { ethereumSepolia } from './ethereumSepolia';
 import { ethereumMainnet } from './ethereumMainnet';
 import { scrollMainnet } from './scrollMainnet';
 import { scrollSepolia } from './scrollSepolia';
+// import { baseMainnet } from './baseMainnet';
+import { baseSepolia } from './baseSepolia';
 import { blastSepolia } from './blastSepolia';
-import { blast } from './blastNetwork';
+import { blastMainnet } from './blastMainnet';
 import {
     ambientProductionBrandAssets,
     ambientTestnetBrandAssets,
     defaultBrandAssets,
     blastBrandAssets,
     scrollBrandAssets,
+    baseBrandAssets,
     futaBrandAssets,
 } from '../../../assets/branding';
 
@@ -22,8 +25,10 @@ const networks: NetworkIF[] = [
     ethereumMainnet,
     scrollMainnet,
     scrollSepolia,
+    blastMainnet,
     blastSepolia,
-    blast,
+    // baseMainnet,
+    baseSepolia,
 ];
 
 function getNetworks(chns: (string | chainIds)[]): {
@@ -47,6 +52,8 @@ export const supportedNetworks: { [x: string]: NetworkIF } =
         ? getNetworks(Object.keys(blastBrandAssets.networks))
         : brand === 'scroll'
         ? getNetworks(Object.keys(scrollBrandAssets.networks))
+        : brand === 'base'
+        ? getNetworks(Object.keys(baseBrandAssets.networks))
         : brand === 'futa'
         ? getNetworks(Object.keys(futaBrandAssets.networks))
         : brand === 'ambientProduction'
@@ -66,5 +73,7 @@ export { ethereumSepolia };
 export { ethereumMainnet };
 export { scrollMainnet };
 export { scrollSepolia };
+export { blastMainnet };
 export { blastSepolia };
-export { blast };
+// export { baseMainnet };
+export { baseSepolia };

src/ambient-utils/constants/networks/scrollSepolia.ts

@@ -35,12 +35,12 @@ export const scrollSepolia: NetworkIF = {
         new TopPool(
             scrollSepoliaETH,
             scrollSepoliaWBTC,
-            lookupChain('0xaa36a7').poolIndex,
+            lookupChain('0x8274f').poolIndex,
         ),
         new TopPool(
             scrollSepoliaUSDC,
             scrollSepoliaWBTC,
-            lookupChain('0xaa36a7').poolIndex,
+            lookupChain('0x8274f').poolIndex,
         ),
     ],
     getGasPriceInGwei: async (provider?: Provider) => {

src/ambient-utils/constants/tokenListURIs.ts

@@ -5,6 +5,7 @@ export const tokenListURIs = {
     blastCoingecko: 'https://tokens.coingecko.com/blast/all.json',
     // broken: '/broken-list.json',
     scrollCoingecko: 'https://tokens.coingecko.com/scroll/all.json',
+    baseCoingecko: 'https://tokens.coingecko.com/base/all.json',
     scrollTech:
         'https://raw.githubusercontent.com/scroll-tech/token-list/main/scroll.tokenlist.json',
     testnet: '/testnet-token-list.json',

src/ambient-utils/dataLayer/functions/getPoolStats.ts

@@ -182,17 +182,17 @@ export async function expandPoolStats(
     const basePrice = baseUsdPrice
         ? baseUsdPrice
         : isETHorStakedEthToken(base)
-        ? (await getEthPrice()) || 0.0
-        : quoteUsdPrice
-        ? quoteUsdPrice / (await getSpotPrice())
-        : 0.0;
+          ? (await getEthPrice()) || 0.0
+          : quoteUsdPrice
+            ? quoteUsdPrice / (await getSpotPrice())
+            : 0.0;
     const quotePrice = quoteUsdPrice
         ? quoteUsdPrice
         : isETHorStakedEthToken(quote)
-        ? (await getEthPrice()) || 0.0
-        : baseUsdPrice
-        ? baseUsdPrice * (await getSpotPrice())
-        : 0.0;
+          ? (await getEthPrice()) || 0.0
+          : baseUsdPrice
+            ? baseUsdPrice * (await getSpotPrice())
+            : 0.0;
 
     return decoratePoolStats(
         payload,

src/ambient-utils/types/chainIds.ts

@@ -1,8 +1,9 @@
 export type chainIds =
-    | '0x1'
-    | '0x5'
-    | '0x82750'
-    | '0xaa36a7'
-    | '0xa0c71fd'
-    | '0x8274f'
-    | '0x13e31';
+    | '0x1' // ethereum
+    | '0x82750' // scroll
+    | '0xaa36a7' // ethereum sepolia
+    | '0xa0c71fd' // blast sepolia
+    | '0x8274f' // scroll sepolia
+    | '0x13e31' // blast
+    | '0x2105' // base
+    | '0x14a34'; // base sepolia

src/ambient-utils/types/token/TokenIF.ts

@@ -1,7 +1,7 @@
 import { tokenListURIs } from '../../constants';
 
 // string-union type of all acceptable values for `fromList` property
-type uris = typeof tokenListURIs[keyof typeof tokenListURIs];
+type uris = (typeof tokenListURIs)[keyof typeof tokenListURIs];
 export type otherTokenSources = 'on_chain_by_URL_param';
 type tokenProvenances = uris | otherTokenSources;
 

src/assets/branding/ambientProductionBrandAssets.ts

@@ -2,6 +2,7 @@ import { brandIF } from './types';
 import large from '../images/logos/large.svg';
 import scrollLogo from '../../assets/images/logos/scroll_brand_logo.svg';
 import blastLogo from '../../assets/images/logos/blast_logo.svg';
+// import baseLogo from '../../assets/images/logos/base_logo.svg';
 
 export const ambientProductionBrandAssets: brandIF = {
     networks: {
@@ -28,6 +29,15 @@ export const ambientProductionBrandAssets: brandIF = {
                 { content: blastLogo, processAs: 'image' },
             ],
         },
+        // base mainnet
+        // '0x2105': {
+        //     color: 'purple_dark',
+        //     hero: [
+        //         { content: 'ambient', processAs: 'text' },
+        //         { content: '×', processAs: 'separator' },
+        //         { content: baseLogo, processAs: 'image' },
+        //     ],
+        // },
     },
     platformName: 'ambient',
     fontSet: 'ambient',

src/assets/branding/ambientTestnetBrandAssets.ts

@@ -2,6 +2,7 @@ import { brandIF } from './types';
 import large from '../images/logos/large.svg';
 import scrollLogo from '../../assets/images/logos/scroll_brand_logo.svg';
 import blastLogo from '../../assets/images/logos/blast_logo.svg';
+import baseLogo from '../../assets/images/logos/base_logo.svg';
 
 export const ambientTestnetBrandAssets: brandIF = {
     networks: {
@@ -28,6 +29,15 @@ export const ambientTestnetBrandAssets: brandIF = {
                 { content: blastLogo, processAs: 'image' },
             ],
         },
+        // base sepolia
+        '0x14a34': {
+            color: 'purple_dark',
+            hero: [
+                { content: 'ambient', processAs: 'text' },
+                { content: '×', processAs: 'separator' },
+                { content: baseLogo, processAs: 'image' },
+            ],
+        },
     },
     platformName: 'ambient',
     fontSet: 'ambient',