Merge branch 'main' into chore/lw-10236-use-drep-registration-tracker

apps/browser-extension-wallet/src/hooks/useWalletManager.ts

@@ -39,7 +39,7 @@ const { AVAILABLE_CHAINS, CHAIN } = config();
 const DEFAULT_CHAIN_ID = Wallet.Cardano.ChainIds[CHAIN];
 export const LOCK_VALUE = Buffer.from(JSON.stringify({ lock: 'lock' }), 'utf8');
 
-export interface CreateWallet {
+export interface CreateWalletParams {
   name: string;
   mnemonic: string[];
   password: string;
@@ -79,7 +79,7 @@ export interface UseWalletManager {
     wallets: AnyWallet<Wallet.WalletMetadata, Wallet.AccountMetadata>[],
     activeWalletProps: WalletManagerActivateProps | null
   ) => Promise<Wallet.CardanoWallet | null>;
-  createWallet: (args: CreateWallet) => Promise<Wallet.CardanoWallet>;
+  createWallet: (args: CreateWalletParams) => Promise<Wallet.CardanoWallet>;
   activateWallet: (args: Omit<WalletManagerActivateProps, 'chainId'>) => Promise<void>;
   createHardwareWallet: (args: CreateHardwareWallet) => Promise<Wallet.CardanoWallet>;
   createHardwareWalletRevamped: CreateHardwareWalletRevamped;
@@ -459,7 +459,7 @@ export const useWalletManager = (): UseWalletManager => {
       name,
       password,
       chainId = getCurrentChainId()
-    }: CreateWallet): Promise<Wallet.CardanoWallet> => {
+    }: CreateWalletParams): Promise<Wallet.CardanoWallet> => {
       const accountIndex = 0;
       const passphrase = Buffer.from(password, 'utf8');
       const keyAgent = await Wallet.KeyManagement.InMemoryKeyAgent.fromBip39MnemonicWords(

apps/browser-extension-wallet/src/lib/translations/en.json

@@ -3,26 +3,26 @@
   "account.disable.confirm": "Disable",
   "account.disable.description": "Are you sure you want to disable this account? You can re-enable it later",
   "account.disable.title": "Hold up!",
-  "account.edit.footer.cancel": "Cancel",
-  "account.edit.footer.save": "Save",
-  "account.edit.input.label": "Account name",
   "account.edit.title": "Edit account name",
-  "account.enable.hw.buttons.cancel": "Cancel",
-  "account.enable.hw.buttons.signing": "Signing in progress",
-  "account.enable.hw.buttons.tryAgain": "Try again",
-  "account.enable.hw.buttons.waiting": "Waiting for {{device}}",
-  "account.enable.hw.description": "Connect and unlock your device. Then, follow instructions to confirm your action.",
-  "account.enable.hw.errorDescription": "Please ensure your device is properly connected and unlocked.",
-  "account.enable.hw.errorHeadline": "Sorry! Something went wrong",
-  "account.enable.hw.errorHelpLink": "Having trouble?",
-  "account.enable.hw.headline": "Confirm with Your Hardware Wallet",
-  "account.enable.inMemory.cancel": "Cancel",
-  "account.enable.inMemory.confirm": "Confirm",
-  "account.enable.inMemory.description": "Enter password to confirm this action.",
+  "account.edit.input.label": "Account name",
+  "account.edit.footer.save": "Save",
+  "account.edit.footer.cancel": "Cancel",
+  "account.enable.title": "Enable account",
   "account.enable.inMemory.headline": "Confirm action",
+  "account.enable.inMemory.description": "Enter password to confirm this action.",
   "account.enable.inMemory.passwordPlaceholder": "Password",
   "account.enable.inMemory.wrongPassword": "Wrong Password",
-  "account.enable.title": "Enable account",
+  "account.enable.inMemory.cancel": "Cancel",
+  "account.enable.inMemory.confirm": "Confirm",
+  "account.enable.hw.headline": "Confirm with Your Hardware Wallet",
+  "account.enable.hw.description": "Connect and unlock your device. Then, follow instructions to confirm your action.",
+  "account.enable.hw.errorHeadline": "Sorry! Something went wrong",
+  "account.enable.hw.errorDescription": "Please ensure your device is properly connected and unlocked.",
+  "account.enable.hw.errorHelpLink": "Having trouble?",
+  "account.enable.hw.buttons.waiting": "Waiting for {{device}}",
+  "account.enable.hw.buttons.signing": "Signing in progress",
+  "account.enable.hw.buttons.cancel": "Cancel",
+  "account.enable.hw.buttons.tryAgain": "Try again",
   "addressBook.addressDetail.btn.copy": "Copy",
   "addressBook.deleteModal.buttons.cancel": "No",
   "addressBook.deleteModal.description": "Are you sure? There is no way to undo this action",

apps/browser-extension-wallet/src/providers/AnalyticsProvider/analyticsTracker/events.ts

@@ -1,4 +1,4 @@
-import { PostHogAction, PostHogOnboardingActionsType } from './types';
+import { PostHogAction, PostHogMultiWalletActionsType, PostHogOnboardingActionsType } from './types';
 
 export const postHogOnboardingActions: PostHogOnboardingActionsType = {
   onboarding: {
@@ -45,3 +45,28 @@ export const postHogOnboardingActions: PostHogOnboardingActionsType = {
       PostHogAction.UnlockWalletForgotPasswordRecoveryPhrasePasteFromClipboardClick
   }
 };
+
+export const postHogMultiWalletActions: PostHogMultiWalletActionsType = {
+  create: {
+    SETUP_OPTION_CLICK: PostHogAction.MultiWalletCreateClick,
+    SAVE_RECOVERY_PHRASE_NEXT_CLICK: PostHogAction.MultiWalletCreateSaveRecoveryPhraseNextClick,
+    ENTER_RECOVERY_PHRASE_NEXT_CLICK: PostHogAction.MultiWalletCreateEnterRecoveryPhraseNextClick,
+    ENTER_WALLET: PostHogAction.MultiWalletCreateEnterWalletClick,
+    RECOVERY_PHRASE_INTRO_WATCH_VIDEO_CLICK: PostHogAction.MultiWalletCreateSaveRecoveryPhraseIntroPlayVideoClick,
+    RECOVERY_PHRASE_INTRO_VIDEO_GOTIT_CLICK: PostHogAction.MultiWalletCreateKeepWalletSecureGotItClick,
+    RECOVERY_PHRASE_COPY_TO_CLIPBOARD_CLICK: PostHogAction.MultiWalletCreateSaveRecoveryPhraseCopyToClipboardClick,
+    RECOVERY_PHRASE_PASTE_FROM_CLIPBOARD_CLICK:
+      PostHogAction.MultiWalletCreateEnterRecoveryPhrasePasteFromClipboardClick
+  },
+  restore: {
+    SETUP_OPTION_CLICK: PostHogAction.MultiWalletRestoreClick,
+    ENTER_RECOVERY_PHRASE_NEXT_CLICK: PostHogAction.MultiWalletRestoreEnterRecoveryPhraseNextClick,
+    ENTER_WALLET: PostHogAction.MultiWalletRestoreEnterWalletClick,
+    RECOVERY_PHRASE_PASTE_FROM_CLIPBOARD_CLICK:
+      PostHogAction.MultiWalletRestoreEnterRecoveryPhrasePasteFromClipboardClick,
+    RECOVERY_PHRASE_PASTE_READ_MORE_CLICK: PostHogAction.MultiWalletCreateSaveRecoveryPhrasePasteReadMoreClick
+  },
+  hw: {
+    SETUP_OPTION_CLICK: PostHogAction.MultiWalletHWClick
+  }
+};

apps/browser-extension-wallet/src/providers/AnalyticsProvider/analyticsTracker/types.ts

@@ -39,6 +39,7 @@ export enum TxCreationType {
 }
 
 export type OnboardingFlows = 'create' | 'restore' | 'hw' | 'forgot_password' | 'onboarding';
+export type MultiWalletFlows = 'create' | 'restore' | 'hw';
 export type PostHogActionsKeys =
   | 'SETUP_OPTION_CLICK'
   | 'ANALYTICS_AGREE_CLICK'
@@ -62,7 +63,9 @@ export type PostHogActionsKeys =
   | 'RECOVERY_PHRASE_COPY_READ_MORE_CLICK'
   | 'RECOVERY_PHRASE_PASTE_READ_MORE_CLICK';
 export type PostHogOnboardingActionsValueType = Partial<Record<PostHogActionsKeys, PostHogAction>>;
+export type PostHogMultiWalletActionsValueType = Partial<Record<PostHogActionsKeys, PostHogAction>>;
 export type PostHogOnboardingActionsType = Partial<Record<OnboardingFlows, PostHogOnboardingActionsValueType>>;
+export type PostHogMultiWalletActionsType = Record<MultiWalletFlows, PostHogMultiWalletActionsValueType>;
 export type PostHogPersonProperties = {
   $set: {
     user_tracking_type: UserTrackingType;

apps/browser-extension-wallet/src/routes/wallet-paths.ts

@@ -26,9 +26,7 @@ export const walletRoutePaths = {
     create: {
       root: '/new-wallet/create',
       setup: '/new-wallet/create/setup',
-      keepSecure: '/new-wallet/create/keep-secure',
-      recoveryPhrase: '/new-wallet/create/recovery-phrase',
-      allDone: '/new-wallet/create/all-done'
+      recoveryPhrase: '/new-wallet/create/recovery-phrase'
     },
     hardware: {
       root: '/new-wallet/hardware',
@@ -40,10 +38,7 @@ export const walletRoutePaths = {
     restore: {
       root: '/new-wallet/restore',
       setup: '/new-wallet/restore/setup',
-      keepSecure: '/new-wallet/restore/keep-secure',
-      selectRecoveryPhraseLength: '/new-wallet/restore/select-recovery-phrase-length',
-      enterRecoveryPhrase: '/new-wallet/restore/enter-recovery-phrase',
-      allDone: '/new-wallet/restore/all-done'
+      enterRecoveryPhrase: '/new-wallet/restore/enter-recovery-phrase'
     }
   },
   sharedWallet: {

apps/browser-extension-wallet/src/views/browser-view/features/multi-wallet/components/Home.tsx

@@ -1,10 +1,10 @@
-import { PostHogAction } from '@lace/common';
 import { WalletSetupOptionsStep } from '@lace/core';
 import { useAnalyticsContext } from '@providers';
 import { walletRoutePaths } from '@routes';
 import React from 'react';
 import { useHistory } from 'react-router';
 import { useTranslation } from 'react-i18next';
+import { postHogMultiWalletActions } from '@providers/AnalyticsProvider/analyticsTracker';
 
 export const Home = (): JSX.Element => {
   const { t: translate } = useTranslation();
@@ -34,16 +34,16 @@ export const Home = (): JSX.Element => {
   return (
     <WalletSetupOptionsStep
       onNewWalletRequest={() => {
-        analytics.sendEventToPostHog(PostHogAction.MultiWalletCreateClick);
-        history.push(walletRoutePaths.newWallet.create.setup);
+        void analytics.sendEventToPostHog(postHogMultiWalletActions.create.SETUP_OPTION_CLICK);
+        history.push(walletRoutePaths.newWallet.create.root);
       }}
       onHardwareWalletRequest={() => {
-        analytics.sendEventToPostHog(PostHogAction.MultiWalletHWClick);
-        history.push(walletRoutePaths.newWallet.hardware.connect);
+        void analytics.sendEventToPostHog(postHogMultiWalletActions.hw.SETUP_OPTION_CLICK);
+        history.push(walletRoutePaths.newWallet.hardware.root);
       }}
       onRestoreWalletRequest={() => {
-        analytics.sendEventToPostHog(PostHogAction.MultiWalletRestoreClick);
-        history.push(walletRoutePaths.newWallet.restore.setup);
+        void analytics.sendEventToPostHog(postHogMultiWalletActions.restore.SETUP_OPTION_CLICK);
+        history.push(walletRoutePaths.newWallet.restore.root);
       }}
       translations={walletSetupOptionsStepTranslations}
     />

apps/browser-extension-wallet/src/views/browser-view/features/multi-wallet/create-wallet/CreateWallet.test.tsx

@@ -21,7 +21,15 @@ import { fireEvent, render, screen } from '@testing-library/react';
 import { MemoryRouter } from 'react-router-dom';
 import { Providers } from './types';
 import { walletRoutePaths } from '@routes';
-import { createAssetsRoute, fillMnemonic, getNextButton, mnemonicWords, setupStep } from '../tests/utils';
+import {
+  DEFAULT_MNEMONIC_LENGTH,
+  createAssetsRoute,
+  fillMnemonic,
+  getNextButton,
+  mnemonicWords,
+  setupStep,
+  getBackButton
+} from '../tests/utils';
 import { StoreProvider } from '@src/stores';
 import { APP_MODE_BROWSER } from '@src/utils/constants';
 import { AppSettingsProvider, DatabaseProvider } from '@providers';
@@ -30,39 +38,22 @@ import { AnalyticsTracker } from '@providers/AnalyticsProvider/analyticsTracker'
 import { CreateWallet } from './CreateWallet';
 
 jest.mock('@providers/AnalyticsProvider', () => ({
-  useAnalyticsContext: jest.fn<Pick<AnalyticsTracker, 'sendMergeEvent' | 'sendEventToPostHog'>, []>().mockReturnValue({
-    sendMergeEvent: jest.fn().mockReturnValue(''),
-    sendEventToPostHog: jest.fn().mockReturnValue('')
-  })
+  useAnalyticsContext: jest
+    .fn<Pick<AnalyticsTracker, 'sendMergeEvent' | 'sendEventToPostHog' | 'sendAliasEvent'>, []>()
+    .mockReturnValue({
+      sendMergeEvent: jest.fn().mockReturnValue(''),
+      sendEventToPostHog: jest.fn().mockReturnValue(''),
+      sendAliasEvent: jest.fn().mockReturnValue('')
+    })
 }));
 
-const keepWalletSecureStep = async () => {
-  const nextButton = getNextButton();
-
-  fireEvent.click(nextButton);
-
-  await screen.findByText('Write down your secret passphrase');
-};
-
 const recoveryPhraseStep = async () => {
-  const nextButton = getNextButton();
-
-  // 08/24
-  fireEvent.click(nextButton);
-  // 16/24
+  let nextButton = getNextButton();
   fireEvent.click(nextButton);
-  // 24/24
+  await fillMnemonic(0, DEFAULT_MNEMONIC_LENGTH);
+  nextButton = getNextButton();
   fireEvent.click(nextButton);
-
-  const step1 = 8;
-  const step2 = 16;
-  const step3 = 24;
-
-  await fillMnemonic(0, step1);
-  await fillMnemonic(step1, step2);
-  await fillMnemonic(step2, step3);
-
-  await screen.findByText('Total wallet balance');
+  await screen.findByText("Let's set up your new wallet");
 };
 
 describe('Multi Wallet Setup/Create Wallet', () => {
@@ -92,7 +83,7 @@ describe('Multi Wallet Setup/Create Wallet', () => {
       <AppSettingsProvider>
         <DatabaseProvider>
           <StoreProvider appMode={APP_MODE_BROWSER}>
-            <MemoryRouter initialEntries={[walletRoutePaths.newWallet.create.setup]}>
+            <MemoryRouter initialEntries={[walletRoutePaths.newWallet.create.root]}>
               <CreateWallet providers={providers as Providers} />
               {createAssetsRoute()}
             </MemoryRouter>
@@ -101,17 +92,18 @@ describe('Multi Wallet Setup/Create Wallet', () => {
       </AppSettingsProvider>
     );
 
-    await setupStep();
-    await keepWalletSecureStep();
     await recoveryPhraseStep();
+    await setupStep();
   });
 
   test('should emit correct value for shouldShowDialog', async () => {
+    providers.generateMnemonicWords.mockReturnValue(mnemonicWords);
+
     render(
       <AppSettingsProvider>
         <DatabaseProvider>
           <StoreProvider appMode={APP_MODE_BROWSER}>
-            <MemoryRouter initialEntries={[walletRoutePaths.newWallet.create.setup]}>
+            <MemoryRouter initialEntries={[walletRoutePaths.newWallet.create.root]}>
               <CreateWallet providers={providers as Providers} />
               {createAssetsRoute()}
             </MemoryRouter>
@@ -120,14 +112,15 @@ describe('Multi Wallet Setup/Create Wallet', () => {
       </AppSettingsProvider>
     );
 
-    const nameInput = screen.getByTestId('wallet-name-input');
-
-    fireEvent.change(nameInput, { target: { value: 'My X Wallet' } });
+    expect(await firstValueFrom(providers.confirmationDialog.shouldShowDialog$)).toBe(false);
 
+    const nextButton = getNextButton();
+    fireEvent.click(nextButton);
     expect(await firstValueFrom(providers.confirmationDialog.shouldShowDialog$)).toBe(true);
 
-    fireEvent.change(nameInput, { target: { value: '' } });
-
+    const backButton = getBackButton();
+    fireEvent.click(backButton);
+    fireEvent.click(screen.queryByTestId('delete-address-modal-confirm'));
     expect(await firstValueFrom(providers.confirmationDialog.shouldShowDialog$)).toBe(false);
   });
 });

apps/browser-extension-wallet/src/views/browser-view/features/multi-wallet/create-wallet/CreateWallet.tsx

@@ -1,10 +1,9 @@
 import React from 'react';
-import { Route, Switch } from 'react-router-dom';
+import { Redirect, Route, Switch } from 'react-router-dom';
 import { Setup } from './steps/Setup';
 import { NewRecoveryPhrase } from './steps/NewRecoveryPhrase';
 import { CreateWalletProvider } from './context';
 import { walletRoutePaths } from '@routes';
-import { KeepWalletSecure } from './steps/KeepWalletSecure';
 import { Providers } from './types';
 
 const {
@@ -18,9 +17,9 @@ interface Props {
 export const CreateWallet = ({ providers }: Props): JSX.Element => (
   <CreateWalletProvider providers={providers}>
     <Switch>
-      <Route path={create.setup} component={Setup} />
-      <Route path={create.keepSecure} component={KeepWalletSecure} />
       <Route path={create.recoveryPhrase} component={NewRecoveryPhrase} />
+      <Route path={create.setup} component={Setup} />
+      <Redirect from={create.root} to={create.recoveryPhrase} />
     </Switch>
   </CreateWalletProvider>
 );