feat: testnet mode

src/core/references/index.ts

@@ -101,18 +101,18 @@ export const NATIVE_ASSETS_PER_CHAIN: Record<ChainId, AddressOrEth> = {
   [ChainId.goerli]: ETH_ADDRESS,
   [ChainId.sepolia]: ETH_ADDRESS,
   [ChainId.arbitrum]: ETH_ARBITRUM_ADDRESS as Address,
-  [ChainId.arbitrumGoerli]: ETH_ARBITRUM_ADDRESS as Address,
+  [ChainId['arbitrum-goerli']]: ETH_ARBITRUM_ADDRESS as Address,
   [ChainId.bsc]: BSC_BNB_ADDRESS as Address,
-  [ChainId.bscTestnet]: BSC_BNB_ADDRESS as Address,
+  [ChainId['bsc-testnet']]: BSC_BNB_ADDRESS as Address,
   [ChainId.optimism]: ETH_OPTIMISM_ADDRESS as Address,
   [ChainId.hardhatOptimism]: ETH_OPTIMISM_ADDRESS as Address,
-  [ChainId.optimismGoerli]: ETH_OPTIMISM_ADDRESS as Address,
+  [ChainId['optimism-goerli']]: ETH_OPTIMISM_ADDRESS as Address,
   [ChainId.base]: ETH_BASE_ADDRESS as Address,
-  [ChainId.baseGoerli]: ETH_BASE_ADDRESS as Address,
+  [ChainId['base-goerli']]: ETH_BASE_ADDRESS as Address,
   [ChainId.zora]: ETH_ZORA_ADDRESS as Address,
-  [ChainId.zoraTestnet]: ETH_ZORA_ADDRESS as Address,
+  [ChainId['zora-testnet']]: ETH_ZORA_ADDRESS as Address,
   [ChainId.polygon]: MATIC_POLYGON_ADDRESS as Address,
-  [ChainId.polygonMumbai]: MATIC_POLYGON_ADDRESS as Address,
+  [ChainId['polygon-mumbai']]: MATIC_POLYGON_ADDRESS as Address,
 };
 export const OVM_GAS_PRICE_ORACLE =
   '0x420000000000000000000000000000000000000F';

src/core/references/shortcuts.ts

@@ -128,6 +128,10 @@ export const shortcuts = {
       display: 'L',
       key: 'l',
     },
+    TESTNET_MODE: {
+      display: 'T',
+      key: 't',
+    },
     OPEN_MORE_MENU: {
       display: '.',
       key: '.',

src/core/resources/assets/userAssets.ts

@@ -11,7 +11,8 @@ import {
   queryClient,
 } from '~/core/react-query';
 import { SupportedCurrencyKey } from '~/core/references';
-import { useConnectedToHardhatStore } from '~/core/state/currentSettings/connectedToHardhat';
+import { connectedToHardhatStore } from '~/core/state/currentSettings/connectedToHardhat';
+import { useTestnetModeStore } from '~/core/state/currentSettings/testnetMode';
 import {
   ParsedAssetsDictByChain,
   ParsedUserAsset,
@@ -24,7 +25,10 @@ import {
   filterAsset,
   parseUserAsset,
 } from '~/core/utils/assets';
-import { getSupportedChainIds } from '~/core/utils/chains';
+import {
+  getSupportedChainIds,
+  getSupportedTestnetChainIds,
+} from '~/core/utils/chains';
 import { greaterThan } from '~/core/utils/numbers';
 import { RainbowError, logger } from '~/logger';
 import {
@@ -46,30 +50,42 @@ export const USER_ASSETS_STALE_INTERVAL = 30000;
 export type UserAssetsArgs = {
   address?: Address;
   currency: SupportedCurrencyKey;
+  testnetMode?: boolean;
 };
 
 type SetUserAssetsArgs = {
   address?: Address;
   currency: SupportedCurrencyKey;
   userAssets?: UserAssetsResult;
+  testnetMode?: boolean;
 };
 
 type SetUserDefaultsArgs = {
   address?: Address;
   currency: SupportedCurrencyKey;
   staleTime: number;
+  testnetMode?: boolean;
 };
 
 type FetchUserAssetsArgs = {
   address?: Address;
   currency: SupportedCurrencyKey;
+  testnetMode?: boolean;
 };
 
 // ///////////////////////////////////////////////
 // Query Key
 
-export const userAssetsQueryKey = ({ address, currency }: UserAssetsArgs) =>
-  createQueryKey('userAssets', { address, currency }, { persisterVersion: 2 });
+export const userAssetsQueryKey = ({
+  address,
+  currency,
+  testnetMode,
+}: UserAssetsArgs) =>
+  createQueryKey(
+    'userAssets',
+    { address, currency, testnetMode },
+    { persisterVersion: 3 },
+  );
 
 type UserAssetsQueryKey = ReturnType<typeof userAssetsQueryKey>;
 
@@ -79,9 +95,10 @@ type UserAssetsQueryKey = ReturnType<typeof userAssetsQueryKey>;
 export const userAssetsFetchQuery = ({
   address,
   currency,
+  testnetMode,
 }: FetchUserAssetsArgs) => {
   queryClient.fetchQuery(
-    userAssetsQueryKey({ address, currency }),
+    userAssetsQueryKey({ address, currency, testnetMode }),
     userAssetsQueryFunction,
   );
 };
@@ -90,32 +107,40 @@ export const userAssetsSetQueryDefaults = ({
   address,
   currency,
   staleTime,
+  testnetMode,
 }: SetUserDefaultsArgs) => {
-  queryClient.setQueryDefaults(userAssetsQueryKey({ address, currency }), {
-    staleTime,
-  });
+  queryClient.setQueryDefaults(
+    userAssetsQueryKey({ address, currency, testnetMode }),
+    {
+      staleTime,
+    },
+  );
 };
 
 export const userAssetsSetQueryData = ({
   address,
   currency,
   userAssets,
+  testnetMode,
 }: SetUserAssetsArgs) => {
   queryClient.setQueryData(
-    userAssetsQueryKey({ address, currency }),
+    userAssetsQueryKey({ address, currency, testnetMode }),
     userAssets,
   );
 };
 
 async function userAssetsQueryFunction({
-  queryKey: [{ address, currency }],
+  queryKey: [{ address, currency, testnetMode }],
 }: QueryFunctionArgs<typeof userAssetsQueryKey>) {
   const cache = queryClient.getQueryCache();
   const cachedUserAssets = (cache.find(
-    userAssetsQueryKey({ address, currency }),
+    userAssetsQueryKey({ address, currency, testnetMode }),
   )?.state?.data || {}) as ParsedAssetsDictByChain;
   try {
-    const url = `/${getSupportedChainIds().join(',')}/${address}/assets`;
+    const supportedChainIds = testnetMode
+      ? getSupportedTestnetChainIds()
+      : getSupportedChainIds();
+    const url = `/${supportedChainIds.join(',')}/${address}/assets`;
     const res = await addysHttp.get<AddressAssetsReceivedMessage>(url, {
       params: {
         currency: currency.toLowerCase(),
@@ -131,6 +156,7 @@ async function userAssetsQueryFunction({
         address,
         chainIds: chainIdsWithErrorsInResponse,
         currency,
+        testnetMode,
       });
       if (assets.length && chainIdsInResponse.length) {
         const parsedAssetsDict = await parseUserAssets({
@@ -164,15 +190,17 @@ async function userAssetsQueryFunctionRetryByChain({
   address,
   chainIds,
   currency,
+  testnetMode,
 }: {
   address: Address;
   chainIds: ChainId[];
   currency: SupportedCurrencyKey;
+  testnetMode?: boolean;
 }) {
   try {
     const cache = queryClient.getQueryCache();
     const cachedUserAssets =
-      (cache.find(userAssetsQueryKey({ address, currency }))?.state
+      (cache.find(userAssetsQueryKey({ address, currency, testnetMode }))?.state
         ?.data as ParsedAssetsDictByChain) || {};
     const retries = [];
     for (const chainIdWithError of chainIds) {
@@ -195,7 +223,7 @@ async function userAssetsQueryFunctionRetryByChain({
       }
     }
     queryClient.setQueryData(
-      userAssetsQueryKey({ address, currency }),
+      userAssetsQueryKey({ address, currency, testnetMode }),
       cachedUserAssets,
     );
   } catch (e) {
@@ -237,7 +265,7 @@ export async function parseUserAssets({
     }
   }
   const { connectedToHardhat, connectedToHardhatOp } =
-    useConnectedToHardhatStore.getState();
+    connectedToHardhatStore.getState();
   if (connectedToHardhat || connectedToHardhatOp) {
     // separating out these ternaries for readability
     const selectedHardhatChainId = connectedToHardhat
@@ -303,8 +331,9 @@ export function useUserAssets<TSelectResult = UserAssetsResult>(
     UserAssetsQueryKey
   > = {},
 ) {
+  const { testnetMode } = useTestnetModeStore();
   return useQuery(
-    userAssetsQueryKey({ address, currency }),
+    userAssetsQueryKey({ address, currency, testnetMode }),
     userAssetsQueryFunction,
     {
       ...config,

src/core/resources/transactions/consolidatedTransactions.ts

@@ -10,12 +10,14 @@ import {
   queryClient,
 } from '~/core/react-query';
 import { SupportedCurrencyKey } from '~/core/references';
+import { useTestnetModeStore } from '~/core/state/currentSettings/testnetMode';
 import { ChainName } from '~/core/types/chains';
 import { TransactionsReceivedMessage } from '~/core/types/refraction';
 import { RainbowTransaction } from '~/core/types/transactions';
 import {
   chainIdFromChainName,
   getSupportedChainIds,
+  getSupportedTestnetChainIds,
 } from '~/core/utils/chains';
 import { parseTransaction } from '~/core/utils/transactions';
 import { RainbowError, logger } from '~/logger';
@@ -29,6 +31,7 @@ const CONSOLIDATED_TRANSACTIONS_TIMEOUT = 20000;
 export type ConsolidatedTransactionsArgs = {
   address?: string;
   currency: SupportedCurrencyKey;
+  testnetMode?: boolean;
 };
 
 // ///////////////////////////////////////////////
@@ -37,10 +40,11 @@ export type ConsolidatedTransactionsArgs = {
 export const consolidatedTransactionsQueryKey = ({
   address,
   currency,
+  testnetMode,
 }: ConsolidatedTransactionsArgs) =>
   createQueryKey(
     'consolidatedTransactions',
-    { address, currency },
+    { address, currency, testnetMode },
     { persisterVersion: 1 },
   );
 
@@ -54,7 +58,7 @@ type ConsolidatedTransactionsQueryKey = ReturnType<
 export async function fetchConsolidatedTransactions<
   TSelectData = ConsolidatedTransactionsResult,
 >(
-  { address, currency }: ConsolidatedTransactionsArgs,
+  { address, currency, testnetMode }: ConsolidatedTransactionsArgs,
   config: QueryConfig<
     ConsolidatedTransactionsResult,
     Error,
@@ -66,6 +70,7 @@ export async function fetchConsolidatedTransactions<
     consolidatedTransactionsQueryKey({
       address,
       currency,
+      testnetMode,
     }),
     consolidatedTransactionsQueryFunction,
     config,
@@ -82,14 +87,17 @@ type _QueryResult = {
 };
 
 export async function consolidatedTransactionsQueryFunction({
-  queryKey: [{ address, currency }],
+  queryKey: [{ address, currency, testnetMode }],
   pageParam,
 }: QueryFunctionArgs<
   typeof consolidatedTransactionsQueryKey
 >): Promise<_QueryResult> {
   try {
+    const supportedChainIds = testnetMode
+      ? getSupportedTestnetChainIds()
+      : getSupportedChainIds();
     const response = await addysHttp.get<TransactionsReceivedMessage>(
-      `/${getSupportedChainIds().join(',')}/${address}/transactions`,
+      `/${supportedChainIds.join(',')}/${address}/transactions`,
       {
         params: {
           currency: currency.toLowerCase(),
@@ -154,10 +162,12 @@ export function useConsolidatedTransactions<
     TSelectData
   > = {},
 ) {
+  const { testnetMode } = useTestnetModeStore();
   return useInfiniteQuery(
     consolidatedTransactionsQueryKey({
       address,
       currency,
+      testnetMode,
     }),
     consolidatedTransactionsQueryFunction,
     {

src/core/state/currentSettings/testnetMode.ts

@@ -0,0 +1,28 @@
+import create from 'zustand';
+
+import { createStore } from '~/core/state/internal/createStore';
+
+export interface TestnetModeState {
+  testnetMode: boolean;
+  testnetModeShortcutEnabled: boolean;
+  setTestnetMode: (testnetMode: boolean) => void;
+  setTestnetModeShortcutEnabled: (testnetModeShortcutEnabled: boolean) => void;
+}
+
+export const testnetModeStore = createStore<TestnetModeState>(
+  (set) => ({
+    testnetMode: false,
+    testnetModeShortcutEnabled: false,
+    setTestnetMode: (testnetMode) => set({ testnetMode }),
+    setTestnetModeShortcutEnabled: (testnetModeShortcutEnabled) =>
+      set({ testnetModeShortcutEnabled }),
+  }),
+  {
+    persist: {
+      name: 'testnetMode',
+      version: 0,
+    },
+  },
+);
+
+export const useTestnetModeStore = create(testnetModeStore);

src/core/state/userChains/index.ts

@@ -15,14 +15,21 @@ export interface UserChainsState {
     chainId: ChainId;
     enabled: boolean;
   }) => void;
+  updateUserChains: ({
+    chainIds,
+    enabled,
+  }: {
+    chainIds: ChainId[];
+    enabled: boolean;
+  }) => void;
   updateUserChainsOrder: ({
     userChainsOrder,
   }: {
     userChainsOrder: ChainId[];
   }) => void;
 }
 
-const chains = SUPPORTED_CHAINS.filter((chain) => !chain.testnet).reduce(
+const chains = SUPPORTED_CHAINS.reduce(
   (acc, chain) => ({
     ...acc,
     [chain.id]: true,
@@ -36,6 +43,22 @@ export const userChainsStore = createStore<UserChainsState>(
   (set, get) => ({
     userChains: chains,
     userChainsOrder,
+    updateUserChains: ({ chainIds, enabled }) => {
+      const { userChains } = get();
+      const chainsUpdated = chainIds.reduce(
+        (acc, chainId) => {
+          acc[chainId] = enabled;
+          return acc;
+        },
+        {} as Record<ChainId, boolean>,
+      ) satisfies Record<ChainId, boolean>;
+      set({
+        userChains: {
+          ...userChains,
+          ...chainsUpdated,
+        },
+      });
+    },
     updateUserChain: ({ chainId, enabled }) => {
       const { userChains } = get();
       set({