Update BASE and LINEA support (#1818)

* add linea/base changes * update files * update changes * update comments
push-protocol · Aug 26, 2024 · adf4f9c · adf4f9c
1 parent c225904
commit adf4f9c
Show file tree

Hide file tree

Showing 17 changed files with 900 additions and 694 deletions.
diff --git a/package.json b/package.json
@@ -53,10 +53,10 @@
     "@testing-library/user-event": "^7.1.2",
     "@uniswap/widgets": "^2.47.3",
     "@unstoppabledomains/resolution": "8.5.0",
-    "@web3-name-sdk/core": "^0.1.18",
+    "@web3-name-sdk/core": "^0.2.0",
     "@web3-onboard/coinbase": "^2.4.1",
     "@web3-onboard/core": "2.22.2",
-    "@web3-onboard/injected-wallets": "2.11.1",
+    "@web3-onboard/injected-wallets": "2.11.2",
     "@web3-onboard/react": "^2.9.2",
     "@web3-onboard/walletconnect": "2.6.1",
     "@yisheng90/react-loading": "1.2.3",

diff --git a/public/svg/Linea.svg b/public/svg/Linea.svg
diff --git a/src/blocks/illustrations/components/Base.tsx b/src/blocks/illustrations/components/Base.tsx
@@ -0,0 +1,41 @@
+import { FC } from 'react';
+import { IllustrationWrapper } from '../IllustrationWrapper';
+import { IllustrationProps } from '../Illustrations.types';
+
+const Base: FC<IllustrationProps> = (allProps) => {
+  const { svgProps: props, ...restProps } = allProps;
+  return (
+    <IllustrationWrapper
+      componentName="Base"
+      illustration={
+        <svg
+          xmlns="http://www.w3.org/2000/svg"
+          width={restProps?.width ?? '24'}
+          height={restProps?.height ?? '24'}
+          viewBox="0 0 32 32"
+          fill="none"
+          {...props}
+        >
+          <g clip-path="url(#clip0_6893_17837)">
+            <path
+              d="M15.9718 32C24.8243 32 32 24.8371 32 16C32 7.16288 24.8243 0 15.9718 0C7.57376 0 0.6848 6.44864 0 14.6547H21.1853V17.3453H0C0.6848 25.5514 7.57376 32 15.9718 32Z"
+              fill="#0052FF"
+            />
+          </g>
+          <defs>
+            <clipPath id="clip0_6893_17837">
+              <rect
+                width="32"
+                height="32"
+                fill="white"
+              />
+            </clipPath>
+          </defs>
+        </svg>
+      }
+      {...restProps}
+    />
+  );
+};
+
+export default Base;
diff --git a/src/blocks/illustrations/components/Linea.tsx b/src/blocks/illustrations/components/Linea.tsx
@@ -0,0 +1,40 @@
+import { FC } from 'react';
+import { IllustrationWrapper } from '../IllustrationWrapper';
+import { IllustrationProps } from '../Illustrations.types';
+
+const Linea: FC<IllustrationProps> = (allProps) => {
+  const { svgProps: props, ...restProps } = allProps;
+  return (
+    <IllustrationWrapper
+      componentName="Linea"
+      illustration={
+        <svg
+          width={restProps?.width ?? '24'}
+          height={restProps?.height ?? '24'}
+          viewBox="0 0 32 32"
+          fill="none"
+          xmlns="http://www.w3.org/2000/svg"
+          {...props}
+        >
+          <circle
+            cx="16"
+            cy="16"
+            r="16"
+            fill="black"
+          />
+          <path
+            d="M21.2577 12.8345C22.8689 12.8345 24.1749 11.5284 24.1749 9.91725C24.1749 8.3061 22.8689 7 21.2577 7C19.6465 7 18.3405 8.3061 18.3405 9.91725C18.3405 11.5284 19.6465 12.8345 21.2577 12.8345Z"
+            fill="white"
+          />
+          <path
+            d="M10.3821 22.0437L21.3482 22.0451C21.3674 22.0451 21.3858 22.0527 21.3994 22.0663C21.413 22.0799 21.4206 22.0983 21.4206 22.1175L21.422 24.9276C21.422 24.9468 21.4143 24.9652 21.4008 24.9787C21.3872 24.9923 21.3688 25 21.3496 25H7.07237C7.05317 25 7.0348 24.9923 7.02123 24.9787C7.00766 24.9652 7 24.9468 7 24.9276L7.00278 9.87093C7.00278 9.85172 7.01044 9.83328 7.02401 9.81971C7.03758 9.80614 7.05595 9.79855 7.07516 9.79855L10.2346 9.79995C10.2538 9.79995 10.2722 9.80753 10.2857 9.8211C10.2993 9.83467 10.307 9.85311 10.307 9.87232L10.3097 21.9714C10.3097 21.9906 10.3174 22.009 10.331 22.0225C10.3445 22.0361 10.3629 22.0437 10.3821 22.0437Z"
+            fill="white"
+          />
+        </svg>
+      }
+      {...restProps}
+    />
+  );
+};
+
+export default Linea;
diff --git a/src/blocks/illustrations/index.ts b/src/blocks/illustrations/index.ts
@@ -3,6 +3,7 @@ export * from './Illustrations.types';
 
 export { default as Arbitrum } from './components/Arbitrum';
 
+export { default as Base } from './components/Base';
 export { default as BNB } from './components/BNB';
 
 export { default as ChatIllustration } from './components/Chat';
@@ -17,6 +18,8 @@ export { default as EarnOnPush } from './components/EarnOnPush';
 
 export { default as Ethereum } from './components/Ethereum';
 
+export { default as Linea } from './components/Linea';
+
 export { default as PushAlpha } from './components/PushAlpha';
 
 export { default as PushBot } from './components/PushBot';

diff --git a/src/common/Common.constants.ts b/src/common/Common.constants.ts
@@ -4,9 +4,11 @@ export const GuestWalletAddress = '0x0000000000000000000000000000000000000001';
 import { IllustrationProps } from 'blocks';
 import Arbitrum from 'blocks/illustrations/components/Arbitrum';
 import BNB from 'blocks/illustrations/components/BNB';
+import Base from 'blocks/illustrations/components/Base';
 import Cyber from 'blocks/illustrations/components/Cyber';
 import Ethereum from 'blocks/illustrations/components/Ethereum';
 import Fuse from 'blocks/illustrations/components/Fuse';
+import Linea from 'blocks/illustrations/components/Linea';
 import Optimisim from 'blocks/illustrations/components/Optimisim';
 import Polygon from 'blocks/illustrations/components/Polygon';
 import PolygonZK from 'blocks/illustrations/components/PolygonZK';
@@ -32,6 +34,10 @@ export const LOGO_ALIAS_CHAIN: {
   7560: Cyber,
   122: Fuse,
   123: Fuse,
+  8453: Base,
+  84532: Base,
+  59141: Linea,
+  59144: Linea,
 };
 
 export const SepoliaFaucetLink =

diff --git a/src/components/Faucets.tsx b/src/components/Faucets.tsx
@@ -88,14 +88,20 @@ const Faucets = () => {
       function: () => {},
       link: 'https://cyber-testnet.testnets.rollbridge.app/',
     },
-    // comment base
-    // {
-    //   id: '84532',
-    //   value: 'Base Sepolia',
-    //   title: 'Base Sepolia Faucet',
-    //   function: () => {},
-    //   link: 'https://www.alchemy.com/faucets/base-sepolia',
-    // },
+    {
+      id: '59141',
+      value: 'Linea',
+      title: 'Linea Sepolia Faucet',
+      function: () => {},
+      link: 'https://www.infura.io/faucet/linea',
+    },
+    {
+      id: '84532',
+      value: 'Base Sepolia',
+      title: 'Base Sepolia Faucet',
+      function: () => {},
+      link: 'https://www.alchemy.com/faucets/base-sepolia',
+    },
   ];
 
   // render

diff --git a/src/components/VerifyAlias.tsx b/src/components/VerifyAlias.tsx
@@ -70,11 +70,14 @@ const VerifyAlias = ({ aliasEthAccount, setAliasVerified }) => {
       label: 'Cyber ETH',
       url: 'https://cyber-testnet.testnets.rollbridge.app/',
     },
-    // comment base
-    // 84532: {
-    //   label: 'Base Sepolia',
-    //   url: 'https://www.alchemy.com/faucets/base-sepolia',
-    // },
+    84532: {
+      label: 'Base Sepolia',
+      url: 'https://www.alchemy.com/faucets/base-sepolia',
+    },
+    59141: {
+      label: 'Linea Sepolia',
+      url: 'https://www.infura.io/faucet/linea',
+    },
   };
 
   const checkAlias = async () => {
@@ -171,10 +174,10 @@ const VerifyAlias = ({ aliasEthAccount, setAliasVerified }) => {
         >
           You will need{' '}
           <A
-            href={Faucets[chainId].url}
+            href={Faucets[chainId]?.url}
             target="_blank"
           >
-            {Faucets[chainId].label}
+            {Faucets[chainId]?.label}
           </A>{' '}
           to proceed.
         </SpanV2>

diff --git a/src/config/config-alpha.js b/src/config/config-alpha.js
@@ -30,6 +30,8 @@ export const config = {
     42161, // arbitrum mainnet
     1101, // polygon zkevm mainnet
     // 122 // fuse mainnet
+    8453, //base mainnet
+    59144, // Linea mainnet
   ],
 
   /**
@@ -165,4 +167,18 @@ export const CHAIN_DETAILS = {
     rpcUrl: 'https://rpc.fuse.io',
     commAddress: '0xb3971BCef2D791bc4027BbfedFb47319A4AAaaAa',
   },
+  8453: {
+    label: 'Base Mainnet',
+    name: 'BASE_MAINNET',
+    chainid: 8453,
+    rpcUrl: 'https://mainnet.base.org/',
+    commAddress: '0xb3971BCef2D791bc4027BbfedFb47319A4AAaaAa',
+  },
+  59144: {
+    label: 'Linea Mainnet',
+    name: 'LINEA_MAINNET',
+    chainid: 59144,
+    rpcUrl: 'https://rpc.linea.build',
+    commAddress: '0x0d8e75CB5d8873c43c5d9Add71Fd71a09F7Ef890',
+  },
 };
diff --git a/src/config/config-dev.js b/src/config/config-dev.js
@@ -32,8 +32,8 @@ export const config = {
     421614, // arbitrum testnet
     123, // fuse testnet
     111557560, // Cyber testnet
-    // comment base
-    // 84532, //base sepolia
+    84532, //base sepolia
+    59141, // Linea testnet
   ],
 
   /**
@@ -184,12 +184,18 @@ export const CHAIN_DETAILS = {
     rpcUrl: 'https://cyber-testnet.alt.technology/',
     commAddress: '0x9cb3bd7550B5c92baA056Fc0F08132f49508145F',
   },
-  // comment base
-  // 84532: {
-  //   label: 'Base Sepolia',
-  //   name: 'BASE_TESTNET',
-  //   chainid: 84532,
-  //   rpcUrl: 'https://sepolia.base.org/',
-  //   commAddress: '0x9cb3bd7550B5c92baA056Fc0F08132f49508145F',
-  // },
+  84532: {
+    label: 'Base Sepolia',
+    name: 'BASE_TESTNET',
+    chainid: 84532,
+    rpcUrl: 'https://sepolia.base.org/',
+    commAddress: '0x9cb3bd7550B5c92baA056Fc0F08132f49508145F',
+  },
+  59141: {
+    label: 'Linea Testnet',
+    name: 'LINEA_TESTNET',
+    chainid: 59141,
+    rpcUrl: 'https://rpc.sepolia.linea.build',
+    commAddress: '0x9cb3bd7550b5c92baa056fc0f08132f49508145f',
+  },
 };
diff --git a/src/config/config-prod.js b/src/config/config-prod.js
@@ -31,8 +31,8 @@ export const config = {
     1101, // polygon zkevm mainnet
     122, // fuse mainnet
     7560, // Cyber mainnet
-    // comment base
-    // 8453, //base ma innet
+    8453, //base mainnet
+    59144, // Linea mainnet
   ],
 
   /**
@@ -177,12 +177,18 @@ export const CHAIN_DETAILS = {
     rpcUrl: 'https://cyber.alt.technology/',
     commAddress: '0xb3971BCef2D791bc4027BbfedFb47319A4AAaaAa',
   },
-  // comment base
-  // 8453: {
-  //   label: 'Base Mainnet',
-  //   name: 'BASE_MAINNET',
-  //   chainid: 8453,
-  //   rpcUrl: 'https://mainnet.base.org/',
-  //   commAddress: '0xb3971BCef2D791bc4027BbfedFb47319A4AAaaAa',
-  // },
+  8453: {
+    label: 'Base Mainnet',
+    name: 'BASE_MAINNET',
+    chainid: 8453,
+    rpcUrl: 'https://mainnet.base.org/',
+    commAddress: '0xb3971BCef2D791bc4027BbfedFb47319A4AAaaAa',
+  },
+  59144: {
+    label: 'Linea Mainnet',
+    name: 'LINEA_MAINNET',
+    chainid: 59144,
+    rpcUrl: 'https://rpc.linea.build',
+    commAddress: '0x0d8e75CB5d8873c43c5d9Add71Fd71a09F7Ef890',
+  },
 };
diff --git a/src/config/config-staging.js b/src/config/config-staging.js
@@ -33,8 +33,8 @@ export const config = {
     421614, // arbitrum testnet
     123, // fuse testnet
     111557560, // Cyber testnet
-    // comment base
-    // 84532, //base sepolia
+    84532, //base sepolia
+    59141, // Linea testnet
   ],
 
   /**
@@ -181,12 +181,18 @@ export const CHAIN_DETAILS = {
     rpcUrl: 'https://cyber-testnet.alt.technology/',
     commAddress: '0x6e489B7af21cEb969f49A90E481274966ce9D74d',
   },
-  // comment base
-  // 84532: {
-  //   label: 'Base Sepolia',
-  //   name: 'BASE_TESTNET',
-  //   chainid: 84532,
-  //   rpcUrl: 'https://sepolia.base.org/',
-  //   commAddress: '0x6e489B7af21cEb969f49A90E481274966ce9D74d',
-  // },
+  84532: {
+    label: 'Base Sepolia',
+    name: 'BASE_TESTNET',
+    chainid: 84532,
+    rpcUrl: 'https://sepolia.base.org/',
+    commAddress: '0x6e489B7af21cEb969f49A90E481274966ce9D74d',
+  },
+  59141: {
+    label: 'Linea Testnet',
+    name: 'LINEA_TESTNET',
+    chainid: 59141,
+    rpcUrl: 'https://rpc.sepolia.linea.build',
+    commAddress: '0xb3971BCef2D791bc4027BbfedFb47319A4AAaaAa',
+  },
 };
diff --git a/src/connectors/chains.ts b/src/connectors/chains.ts
@@ -130,13 +130,18 @@ export const MAINNET_CHAINS: ChainConfig = {
     nativeCurrency: ETH,
     blockExplorerUrls: ['https://cyberscan.co/'],
   },
-  // comment base
-  // 8453: {
-  //   name: 'Base Mainnet',
-  //   urls: ['https://mainnet.base.org/'],
-  //   nativeCurrency: ETH,
-  //   blockExplorerUrls: ['https://basescan.org/'],
-  // },
+  8453: {
+    name: 'Base Mainnet',
+    urls: ['https://mainnet.base.org/'],
+    nativeCurrency: ETH,
+    blockExplorerUrls: ['https://basescan.org/'],
+  },
+  59144: {
+    name: 'Linea Mainnet',
+    urls: ['https://rpc.linea.build'],
+    nativeCurrency: ETH,
+    blockExplorerUrls: ['https://explorer.linea.build'],
+  },
 };
 
 export const TESTNET_CHAINS: ChainConfig = {
@@ -199,13 +204,18 @@ export const TESTNET_CHAINS: ChainConfig = {
     nativeCurrency: ETH,
     blockExplorerUrls: ['https://testnet.cyberscan.co/'],
   },
-  // comment base
-  // 84532: {
-  //   name: 'Base Sepolia',
-  //   urls: ['https://sepolia.base.org/'],
-  //   nativeCurrency: ETH,
-  //   blockExplorerUrls: ['https://sepolia-explorer.base.org/'],
-  // },
+  84532: {
+    name: 'Base Sepolia',
+    urls: ['https://sepolia.base.org/'],
+    nativeCurrency: ETH,
+    blockExplorerUrls: ['https://sepolia-explorer.base.org/'],
+  },
+  59141: {
+    name: 'Linea Sepolia',
+    urls: ['https://rpc.sepolia.linea.build'],
+    nativeCurrency: ETH,
+    blockExplorerUrls: ['https://sepolia.lineascan.build'],
+  },
 };
 
 export const CHAINS: ChainConfig = {