allow viewer to use the address test-flag to have a view-only experience of a wallet (#250)

* allow viewer to use  test-flag to specify a view-only experience of a wallet

* respond to CR

* lint

src/constants/wallets.ts

@@ -33,6 +33,7 @@ export enum WalletConnectionType {
   CosmosSigner = 'CosmosSigner',
   InjectedEip1193 = 'injectedEip1193',
   WalletConnect2 = 'walletConnect2',
+  TestWallet = 'TestWallet',
 }
 
 export enum WalletErrorType {
@@ -68,6 +69,9 @@ export const walletConnectionTypes: Record<WalletConnectionType, WalletConnectio
   [WalletConnectionType.CosmosSigner]: {
     name: 'CosmosSigner',
   },
+  [WalletConnectionType.TestWallet]: {
+    name: 'TestWallet',
+  },
 };
 
 // Wallets
@@ -88,7 +92,7 @@ export enum WalletType {
   TokenPocket = 'TOKEN_POCKET',
   TrustWallet = 'TRUST_WALLET',
   WalletConnect2 = 'WALLETCONNECT_2',
-  // TestWallet = 'TEST_WALLET',
+  TestWallet = 'TEST_WALLET',
   OtherWallet = 'OTHER_WALLET',
 }
 
@@ -243,6 +247,12 @@ export const wallets: Record<WalletType, WalletConfig> = {
     icon: KeplrIcon,
     connectionTypes: [WalletConnectionType.CosmosSigner],
   },
+  [WalletType.TestWallet]: {
+    type: WalletType.TestWallet,
+    stringKey: STRING_KEYS.TEST_WALLET,
+    icon: GenericWalletIcon,
+    connectionTypes: [WalletConnectionType.TestWallet],
+  },
 };
 
 // Injected EIP-1193 Providers
@@ -354,3 +364,5 @@ export enum DydxChainAsset {
   USDC = 'usdc',
   CHAINTOKEN = 'chain',
 }
+
+export const TEST_WALLET_EVM_ADDRESS: EvmAddress = '0x0000000000000000000000000000000000000000';

src/hooks/useAccounts.tsx

@@ -6,14 +6,22 @@ import { NOBLE_BECH32_PREFIX, LocalWallet, type Subaccount } from '@dydxprotocol
 
 import { OnboardingGuard, OnboardingState, type EvmDerivedAddresses } from '@/constants/account';
 import { DialogTypes } from '@/constants/dialogs';
+import { STRING_KEYS } from '@/constants/localization';
 import { LocalStorageKey, LOCAL_STORAGE_VERSIONS } from '@/constants/localStorage';
-import { DydxAddress, EvmAddress, PrivateInformation } from '@/constants/wallets';
+import {
+  DydxAddress,
+  EvmAddress,
+  PrivateInformation,
+  TEST_WALLET_EVM_ADDRESS,
+  WalletType,
+} from '@/constants/wallets';
 
 import { setOnboardingState, setOnboardingGuard } from '@/state/account';
 import { forceOpenDialog } from '@/state/dialogs';
 
 import abacusStateManager from '@/lib/abacus';
 import { log } from '@/lib/telemetry';
+import { testFlags } from '@/lib/testFlags';
 
 import { useDydxClient } from './useDydxClient';
 import { useLocalStorage } from './useLocalStorage';
@@ -178,7 +186,26 @@ const useAccountsContext = () => {
 
   useEffect(() => {
     (async () => {
-      if (connectedDydxAddress && signerGraz) {
+      if (walletType === WalletType.TestWallet) {
+        // Get override values. Use the testFlags value if it exists, otherwise use the previously
+        // saved value where possible. If neither exist, use a default garbage value.
+        const addressOverride: DydxAddress = testFlags.addressOverride as DydxAddress ||
+          evmDerivedAddresses?.[TEST_WALLET_EVM_ADDRESS]?.dydxAddress as DydxAddress ||
+          'dydx1';
+
+        dispatch(setOnboardingState(OnboardingState.WalletConnected));
+
+        // Set variables.
+        saveEvmDerivedAccount({
+          evmAddress: TEST_WALLET_EVM_ADDRESS,
+          dydxAddress: addressOverride,
+        });
+        const wallet = new LocalWallet();
+        wallet.address = addressOverride;
+        setLocalDydxWallet(wallet);
+
+        dispatch(setOnboardingState(OnboardingState.AccountConnected));
+      } else if (connectedDydxAddress && signerGraz) {
         dispatch(setOnboardingState(OnboardingState.WalletConnected));
         try {
           setLocalDydxWallet(await LocalWallet.fromOfflineSigner(signerGraz));

src/hooks/useWalletConnection.ts

@@ -2,6 +2,7 @@ import { useCallback, useEffect, useState, useMemo } from 'react';
 import { useSelector } from 'react-redux';
 
 import { EvmDerivedAddresses } from '@/constants/account';
+import { STRING_KEYS } from '@/constants/localization';
 import { LocalStorageKey } from '@/constants/localStorage';
 import { ENVIRONMENT_CONFIG_MAP } from '@/constants/networks';
 
@@ -38,6 +39,7 @@ import { getWalletConnection, parseWalletError } from '@/lib/wallet';
 import { log } from '@/lib/telemetry';
 
 import { useStringGetter } from './useStringGetter';
+import { testFlags } from '@/lib/testFlags';
 
 export const useWalletConnection = () => {
   const stringGetter = useStringGetter();
@@ -138,6 +140,8 @@ export const useWalletConnection = () => {
               walletType: cosmosWalletType,
             });
           }
+        } else if (walletConnection.type === WalletConnectionType.TestWallet) {
+          saveEvmAddress(STRING_KEYS.TEST_WALLET as EvmAddress);
         } else {
           const isAccountConnected = Boolean(
             evmAddress && evmDerivedAddresses[evmAddress]?.encryptedSignature
@@ -224,6 +228,15 @@ export const useWalletConnection = () => {
     setSelectedWalletType(walletType);
   };
 
+  // On page load, if testFlag.address is set, connect to the test wallet.
+  useEffect(() => {
+    (async () => {
+      if (testFlags.addressOverride) {
+        setSelectedWalletType(WalletType.TestWallet);
+      }
+    })();
+  }, []);
+
   return {
     // Wallet connection
     walletType,

src/lib/testFlags.ts

@@ -22,6 +22,10 @@ class TestFlags {
   get showMobileSignInOption() {
     return !!this.queryParams.mobilesignin;
   }
+
+  get addressOverride():string {
+    return this.queryParams.address;
+  }
 }
 
 export const testFlags = new TestFlags();

src/lib/wallet/index.ts

@@ -62,6 +62,12 @@ export const getWalletConnection = ({
           type: WalletConnectionType.CosmosSigner,
         };
       }
+
+      case WalletConnectionType.TestWallet: {
+        return {
+          type: WalletConnectionType.TestWallet,
+        };
+      }
     }
   }
 };