feat(nami): disable password change for hw wallet (#1481)

feat(nami): disable password change for hw wallet

Author: mirceahasegan

packages/nami/src/adapters/wallet.test.ts

@@ -236,7 +236,7 @@ describe('useChangePassword', () => {
 
     await expect(
       result.current('wrong-password', 'new-password'),
-    ).rejects.toEqual(ERROR.wrongPassword);
+    ).rejects.toEqual(new Error(ERROR.wrongPassword));
     expect(mockDeleteWallet).not.toHaveBeenCalled();
   });
 });

packages/nami/src/adapters/wallet.ts

@@ -56,15 +56,15 @@ export const useChangePassword = ({
 
   return useCallback(
     async (currentPassword: string, newPassword: string) => {
-      try {
-        if (
-          !wallet?.metadata?.name ||
-          !('encryptedSecrets' in wallet) ||
-          !('accounts' in wallet)
-        ) {
-          return;
-        }
+      if (
+        !wallet?.metadata?.name ||
+        !('encryptedSecrets' in wallet) ||
+        !('accounts' in wallet)
+      ) {
+        throw new Error(ERROR.passwordChangeNotPossible);
+      }
 
+      try {
         const decryptedRootPrivateKeyBytes =
           await Wallet.KeyManagement.emip3decrypt(
             Buffer.from(wallet.encryptedSecrets.rootPrivateKeyBytes, 'hex'),
@@ -106,7 +106,7 @@ export const useChangePassword = ({
         }
         await activateWallet({ chainId, walletId, accountIndex });
       } catch {
-        throw ERROR.wrongPassword;
+        throw new Error(ERROR.wrongPassword);
       }
     },
     [

packages/nami/src/config/config.ts

@@ -31,6 +31,7 @@ export const POPUP_WINDOW = {
 export const ERROR = {
   accessDenied: 'Access denied',
   wrongPassword: 'Wrong password',
+  passwordChangeNotPossible: 'Cannot change password',
   txTooBig: 'Transaction too big',
   txNotPossible: 'Transaction not possible',
   storeNotEmpty: 'Storage key is already set',

packages/nami/src/ui/app/pages/settings.tsx

@@ -2,6 +2,7 @@
 /* eslint-disable react/no-multi-comp */
 import React, { useCallback, useEffect, useRef, useState } from 'react';
 
+import { WalletType } from '@cardano-sdk/web-extension';
 import {
   ChevronLeftIcon,
   ChevronRightIcon,
@@ -44,6 +45,7 @@ import type { UseAccount } from '../../../adapters/account';
 import type { OutsideHandlesContextValue } from '../../../features/outside-handles-provider';
 import type { ChangePasswordModalComponentRef } from '../components/changePasswordModal';
 import type { Wallet } from '@lace/cardano';
+import type { CommonOutsideHandlesContextValue } from 'features/common-outside-handles-provider';
 
 type Props = Pick<
   OutsideHandlesContextValue,
@@ -60,17 +62,18 @@ type Props = Pick<
   | 'setTheme'
   | 'switchNetwork'
   | 'theme'
-> & {
-  currency: CurrencyCode;
-  setCurrency: (currency: CurrencyCode) => void;
-  changePassword: (
-    currentPassword: string,
-    newPassword: string,
-  ) => Promise<void>;
-  accountName: string;
-  accountAvatar?: string;
-  updateAccountMetadata: UseAccount['updateAccountMetadata'];
-};
+> &
+  Pick<CommonOutsideHandlesContextValue, 'walletType'> & {
+    currency: CurrencyCode;
+    setCurrency: (currency: CurrencyCode) => void;
+    changePassword: (
+      currentPassword: string,
+      newPassword: string,
+    ) => Promise<void>;
+    accountName: string;
+    accountAvatar?: string;
+    updateAccountMetadata: UseAccount['updateAccountMetadata'];
+  };
 
 const Settings = ({
   currency,
@@ -92,6 +95,7 @@ const Settings = ({
   getCustomSubmitApiForNetwork,
   defaultSubmitApi,
   isValidURL,
+  walletType,
 }: Readonly<Props>) => {
   const history = useHistory();
   const location = useLocation();
@@ -136,6 +140,7 @@ const Settings = ({
             accountAvatar={accountAvatar}
             accountName={accountName}
             updateAccountMetadata={updateAccountMetadata}
+            walletType={walletType}
           />
         </Route>
         <Route path="/settings/whitelisted" exact>
@@ -275,6 +280,7 @@ const GeneralSettings = ({
   accountAvatar,
   changePassword,
   updateAccountMetadata,
+  walletType,
 }: Readonly<
   Pick<
     Props,
@@ -286,6 +292,7 @@ const GeneralSettings = ({
     | 'setTheme'
     | 'theme'
     | 'updateAccountMetadata'
+    | 'walletType'
   >
 >) => {
   const capture = useCaptureEvent();
@@ -395,20 +402,24 @@ const GeneralSettings = ({
       </Box>
       <Box height="15" />
       <Box height="5" />
-      <Button
-        colorScheme="orange"
-        size="sm"
-        onClick={() => {
-          capture(Events.SettingsChangePasswordClick);
-          changePasswordRef.current?.openModal();
-        }}
-      >
-        Change Password
-      </Button>
-      <ChangePasswordModal
-        ref={changePasswordRef}
-        changePassword={changePassword}
-      />
+      {walletType === WalletType.InMemory && (
+        <>
+          <Button
+            colorScheme="orange"
+            size="sm"
+            onClick={() => {
+              capture(Events.SettingsChangePasswordClick);
+              changePasswordRef.current?.openModal();
+            }}
+          >
+            Change Password
+          </Button>
+          <ChangePasswordModal
+            ref={changePasswordRef}
+            changePassword={changePassword}
+          />
+        </>
+      )}
     </>
   );
 };

packages/nami/src/ui/indexMain.tsx

@@ -62,8 +62,13 @@ const App = () => {
     setDeletingWallet,
   } = useOutsideHandles();
 
-  const { inMemoryWallet, withSignTxConfirmation, cardanoCoin, openHWFlow } =
-    useCommonOutsideHandles();
+  const {
+    inMemoryWallet,
+    withSignTxConfirmation,
+    cardanoCoin,
+    openHWFlow,
+    walletType,
+  } = useCommonOutsideHandles();
 
   const { currency, setCurrency } = useFiatCurrency(
     fiatCurrency,
@@ -188,6 +193,7 @@ const App = () => {
             getCustomSubmitApiForNetwork={getCustomSubmitApiForNetwork}
             defaultSubmitApi={defaultSubmitApi}
             isValidURL={isValidURL}
+            walletType={walletType}
           />
         </Route>
         <Route path="/send">