ink chain support (#1785)

Co-authored-by: Daniel Sinclair <[email protected]>

package.json

@@ -159,7 +159,7 @@
     "react-switch": "7.0.0",
     "socket.io-client": "4.5.3",
     "validator": "13.9.0",
-    "viem": "2.21.0",
+    "viem": "2.21.55",
     "wagmi": "2.8.1",
     "word-wrap": "1.2.4",
     "zustand": "4.1.5"
@@ -349,4 +349,4 @@
       "@trezor/connect-web>@trezor/connect>@trezor/utxo-lib>blake-hash": false
     }
   }
-}
+}

src/core/firebase/remoteConfig.ts

@@ -42,6 +42,7 @@ export interface RainbowConfig extends Record<string, any> {
     [ChainName.blast]: number;
     [ChainName.degen]: number;
     [ChainName.apechain]: number;
+    [ChainName.ink]: number;
   };
 }
 
@@ -69,6 +70,7 @@ const DEFAULT_CONFIG = {
     blast: 200,
     degen: 200,
     apechain: 200,
+    ink: 200,
   },
 };
 

src/core/references/assets.ts

@@ -116,6 +116,8 @@ export const customChainIdsToAssetNames: Record<ChainId, string> = {
   [hederaTestnet.id]: 'hederatestnet',
   [immutableZkEvm.id]: 'immutablezkevm',
   [immutableZkEvmTestnet.id]: 'immutablezkevmtestnet',
+  57073: 'ink',
+  763373: 'inksepolia',
   2410: 'karak',
   8054: 'karaksepolia',
   [kava.id]: 'kavaevm',

src/core/references/chains.ts

@@ -1,5 +1,5 @@
 import { Address } from 'viem';
-import { Chain } from 'viem/chains';
+import { type Chain, avalancheFuji, curtis, inkSepolia } from 'viem/chains';
 
 import backendNetworks from 'static/data/networks.json';
 
@@ -19,11 +19,13 @@ const BACKEND_CHAINS = transformBackendNetworksToChains(
   backendNetworks.networks,
 );
 
+const LOCAL_CHAINS: Chain[] = [avalancheFuji, curtis, inkSepolia];
+
 const DEFAULT_PRIVATE_MEMPOOL_TIMEOUT = 2 * 60 * 1_000; // 2 minutes
 
 export const SUPPORTED_CHAINS: Chain[] = IS_TESTING
-  ? [...BACKEND_CHAINS, chainHardhat, chainHardhatOptimism]
-  : BACKEND_CHAINS;
+  ? [...BACKEND_CHAINS, ...LOCAL_CHAINS, chainHardhat, chainHardhatOptimism]
+  : BACKEND_CHAINS.concat(LOCAL_CHAINS);
 
 export const SUPPORTED_CHAIN_IDS = SUPPORTED_CHAINS.map((chain) => chain.id);
 
@@ -51,7 +53,11 @@ export const chainsLabel: Record<number, string> =
       acc[parseInt(backendNetwork.id, 10)] = backendNetwork.label;
       return acc;
     },
-    {} as Record<number, string>,
+    {
+      [ChainId.avalancheFuji]: 'Avalanche Fuji',
+      [ChainId.apechainCurtis]: 'Apechain Curtis',
+      [ChainId.inkSepolia]: 'Ink Sepolia',
+    } as Record<number, string>,
   );
 
 export const chainsPrivateMempoolTimeout: Record<number, number> =
@@ -70,7 +76,11 @@ export const chainsName: Record<number, string> =
       acc[parseInt(backendNetwork.id, 10)] = backendNetwork.name;
       return acc;
     },
-    {} as Record<number, string>,
+    {
+      [ChainId.avalancheFuji]: 'avalanche-fuji',
+      [ChainId.apechainCurtis]: 'apechain-curtis',
+      [ChainId.inkSepolia]: 'ink-sepolia',
+    } as Record<number, string>,
   );
 
 const filterChainIdsByService = (

src/core/references/index.ts

@@ -128,9 +128,16 @@ export const DEGEN_DEGEN_ADDRESS = AddressZero;
 
 // apechain
 export const APE_APECHAIN_ADDRESS = AddressZero;
-export const WAPE_APECHAIN_ADDRESS = '0x48b62137edfa95a428d35c09e44256a739f6b557';
-export const APEETH_APECHAIN_ADDRESS = '0xcF800F4948D16F23333508191B1B1591daF70438';
-export const APEUSD_APECHAIN_ADDRESS = '0xA2235d059F80e176D931Ef76b6C51953Eb3fBEf4';
+export const WAPE_APECHAIN_ADDRESS =
+  '0x48b62137edfa95a428d35c09e44256a739f6b557';
+export const APEETH_APECHAIN_ADDRESS =
+  '0xcF800F4948D16F23333508191B1B1591daF70438';
+export const APEUSD_APECHAIN_ADDRESS =
+  '0xA2235d059F80e176D931Ef76b6C51953Eb3fBEf4';
+
+// ink
+export const ETH_INK_ADDRESS = AddressZero;
+export const WETH_INK_ADDRESS = '0x4200000000000000000000000000000000000006';
 
 export const OVM_GAS_PRICE_ORACLE =
   '0x420000000000000000000000000000000000000F';

src/core/resources/_selectors/assets.ts

@@ -69,6 +69,7 @@ export function selectUserAssetsListByChainId(assets: ParsedAssetsDictByChain) {
     assets?.[ChainId.zora],
     assets?.[ChainId.bsc],
     assets?.[ChainId.avalanche],
+    assets?.[ChainId.ink],
   ].flat();
   return assetsByNetwork
     .map((chainAssets) =>
@@ -95,6 +96,7 @@ export function selectUserAssetAddressMapByChainId(
     [ChainId.base]: mapAddresses(assets[ChainId.base]) || [],
     [ChainId.zora]: mapAddresses(assets[ChainId.zora]) || [],
     [ChainId.avalanche]: mapAddresses(assets[ChainId.avalanche]) || [],
+    [ChainId.ink]: mapAddresses(assets[ChainId.ink]) || [],
   };
 }
 

src/core/state/favorites/index.ts

@@ -1,9 +1,9 @@
 import create from 'zustand';
 
 import {
-  APE_APECHAIN_ADDRESS,
   APEETH_APECHAIN_ADDRESS,
   APEUSD_APECHAIN_ADDRESS,
+  APE_APECHAIN_ADDRESS,
   AVAX_AVALANCHE_ADDRESS,
   BNB_BSC_ADDRESS,
   DAI_ADDRESS,
@@ -18,6 +18,7 @@ import {
   ETH_ARBITRUM_ADDRESS,
   ETH_BASE_ADDRESS,
   ETH_BLAST_ADDRESS,
+  ETH_INK_ADDRESS,
   ETH_OPTIMISM_ADDRESS,
   ETH_ZORA_ADDRESS,
   OP_ADDRESS,
@@ -41,6 +42,7 @@ import {
   WBTC_POLYGON_ADDRESS,
   WETH_BASE_ADDRESS,
   WETH_BLAST_ADDRESS,
+  WETH_INK_ADDRESS,
   WETH_OPTIMISM_ADDRESS,
   WETH_POLYGON_ADDRESS,
   WETH_ZORA_ADDRESS,
@@ -117,6 +119,7 @@ const defaultFavorites = {
     APEETH_APECHAIN_ADDRESS,
     APEUSD_APECHAIN_ADDRESS,
   ],
+  [ChainId.ink]: [ETH_INK_ADDRESS, WETH_INK_ADDRESS],
 } satisfies FavoritesState['favorites'];
 
 const mergeNewOfficiallySupportedChainsState = (
@@ -161,7 +164,7 @@ export const favoritesStore = createStore<FavoritesState>(
   {
     persist: persistOptions({
       name: 'favorites',
-      version: 5,
+      version: 6,
       migrations: [
         // version 1 didn't need a migration
         (state: FavoritesState) => state,
@@ -177,6 +180,8 @@ export const favoritesStore = createStore<FavoritesState>(
         // version 5 added apechain
         (state) =>
           mergeNewOfficiallySupportedChainsState(state, [ChainId.apechain]),
+        // version 6 added ink
+        (state) => mergeNewOfficiallySupportedChainsState(state, [ChainId.ink]),
       ],
     }),
   },

src/core/state/rainbowChains/index.ts

@@ -122,7 +122,7 @@ export const rainbowChainsStore = createStore<RainbowChainsState>(
   {
     persist: persistOptions({
       name: 'rainbowChains',
-      version: 10,
+      version: 11,
       migrations: [
         // v1 didn't need a migration
         function v1(s: RainbowChainsState) {
@@ -163,6 +163,7 @@ export const rainbowChainsStore = createStore<RainbowChainsState>(
           ]);
         },
 
+        // version 6 added support for Zora
         function v6(state: unknown) {
           const rnbwChainState = state as RainbowChainsState;
           if (
@@ -178,6 +179,7 @@ export const rainbowChainsStore = createStore<RainbowChainsState>(
           return state;
         },
 
+        // version 8 added support for Degen
         function v8(state: unknown) {
           const rnbwChainState = state as RainbowChainsState;
           if (
@@ -191,13 +193,36 @@ export const rainbowChainsStore = createStore<RainbowChainsState>(
           }
           return state;
         },
+
+        // This migration intended to resolve issues where we
+        // inadvertently added RPCs supplied by the dApp provider
+        // (i.e. Wagmi add network calls) that replaced the default
+        // RPCs for our supported chains.
         function v9(state: unknown) {
           return replaceChainsWithInitial(state as RainbowChainsState);
         },
+
+        // The previous version of this migration #1738 returned
+        // `getInitialRainbowChains` which reset user custom networks,
+        // RPCs, and active status toggles for all chains.
+        // Now we merge Apechain into the default chains for users
+        // that haven't yet migrated to v10.
         function v10(state: unknown) {
-          const rnbwState = state as RainbowChainsState;
-          rnbwState.rainbowChains = getInitialRainbowChains();
-          return rnbwState;
+          const rnbwChainState = state as RainbowChainsState;
+          return mergeNewOfficiallySupportedChainsState(rnbwChainState, [
+            ChainId.apechain,
+            // not adding `apechainCurtis` because most users already migrated
+          ]);
+        },
+
+        // version 11 added support for Ink and fixed `apechainCurtis`
+        function v11(state: unknown) {
+          const rnbwChainState = state as RainbowChainsState;
+          return mergeNewOfficiallySupportedChainsState(rnbwChainState, [
+            ChainId.apechainCurtis,
+            ChainId.ink,
+            ChainId.inkSepolia,
+          ]);
         },
       ],
     }),

src/core/state/userChains/index.ts

@@ -2,6 +2,7 @@ import create from 'zustand';
 
 import { SUPPORTED_MAINNET_CHAINS } from '~/core/references/chains';
 import { ChainId } from '~/core/types/chains';
+import { persistOptions } from '~/core/utils/persistOptions';
 
 import { createStore } from '../internal/createStore';
 import { withSelectors } from '../internal/withSelectors';
@@ -38,20 +39,22 @@ export interface UserChainsState {
   removeUserChain: ({ chainId }: { chainId: ChainId }) => void;
 }
 
-const chains = SUPPORTED_MAINNET_CHAINS.reduce(
+const initialChains = SUPPORTED_MAINNET_CHAINS.reduce(
   (acc, chain) => ({
     ...acc,
     [chain.id]: true,
   }),
   {} as Record<number, boolean>,
 );
 
-const userChainsOrder = Object.keys(chains).map((id) => Number(id) as number);
+const initialUserChainsOrder = SUPPORTED_MAINNET_CHAINS.map(
+  (id) => Number(id) as number,
+);
 
 export const userChainsStore = createStore<UserChainsState>(
   (set, get) => ({
-    userChains: chains,
-    userChainsOrder,
+    userChains: initialChains,
+    userChainsOrder: initialUserChainsOrder,
     updateUserChains: ({ chainIds, enabled }) => {
       const { userChains } = get();
       const chainsUpdated = chainIds.reduce(
@@ -108,10 +111,76 @@ export const userChainsStore = createStore<UserChainsState>(
     },
   }),
   {
-    persist: {
+    persist: persistOptions({
       name: 'userChains',
-      version: 5,
-    },
+      version: 6,
+      migrations: [
+        // previous naive migrations reset user custom networks and ordering
+        function v1(state: UserChainsState) {
+          return {
+            ...state,
+            userChains: initialChains,
+            userChainsOrder: initialUserChainsOrder,
+          };
+        },
+
+        function v2(state: UserChainsState) {
+          return {
+            ...state,
+            userChains: initialChains,
+            userChainsOrder: initialUserChainsOrder,
+          };
+        },
+
+        function v3(state: UserChainsState) {
+          return {
+            ...state,
+            userChains: initialChains,
+            userChainsOrder: initialUserChainsOrder,
+          };
+        },
+
+        function v4(state: UserChainsState) {
+          return {
+            ...state,
+            userChains: initialChains,
+            userChainsOrder: initialUserChainsOrder,
+          };
+        },
+
+        // v5 adds apechain support
+        function v5(state: UserChainsState) {
+          // previous october migration #1738 inadvertenly reset state
+          // this will only apply to users who have not yet migrated to v5
+          return {
+            ...state,
+            userChains: { ...state.userChains, [ChainId.apechain]: true },
+            userChainsOrder: state.userChainsOrder.includes(ChainId.apechain)
+              ? state.userChainsOrder
+              : [...state.userChainsOrder, ChainId.apechain],
+          };
+        },
+
+        // v6 adds apechainCurtis, ink, inkSepolia support
+        function v6(state: UserChainsState) {
+          const newChains = [
+            ChainId.apechainCurtis,
+            ChainId.ink,
+            ChainId.inkSepolia,
+          ];
+          return {
+            ...state,
+            userChains: {
+              ...state.userChains,
+              ...Object.fromEntries(newChains.map((id) => [id, true])),
+            },
+            userChainsOrder: state.userChainsOrder.concat(
+              newChains.filter((id) => !state.userChainsOrder.includes(id)),
+            ),
+          };
+        },
+      ],
+    }),
   },
 );