feat: verify receive address on BitBox02 hardware

_raw/locales/en/messages.json

@@ -2124,7 +2124,8 @@
     "Done": "Done",
     "Nonce": "Nonce",
     "tryAgain": "Try Again",
-    "notSupportTesntnet": "Not supported for custom network"
+    "notSupportTesntnet": "Not supported for custom network",
+    "verifyAddress": "Verify address on device"
   },
   "background": {
     "error": {

src/background/controller/wallet.ts

@@ -2934,6 +2934,11 @@ export class WalletController extends BaseController {
     return this._setCurrentAccountFromKeyring(keyringInstance, -1);
   };
 
+  verifyAddress = async (type: string, from: string) => {
+    const keyring = await keyringService.getKeyringForAccount(from, type);
+    return await keyringService.verifyAddress(keyring, from);
+  };
+
   getSignTextHistory = (address: string) => {
     return signTextHistoryService.getHistory(address);
   };

src/background/service/keyring/eth-bitbox02-keyring/bitbox02-bridge-interface.ts

@@ -25,4 +25,9 @@ export interface BitBox02BridgeInterface {
     keypath: string,
     msg: string
   ) => ReturnType<PairedBitBox['ethSignTypedMessage']>;
+  ethAddress: (
+    chainId: number,
+    keypath: string,
+    display: boolean
+  ) => ReturnType<PairedBitBox['ethAddress']>;
 }

src/background/service/keyring/eth-bitbox02-keyring/bitbox02-bridge.ts

@@ -127,4 +127,15 @@ export default class BitBox02Bridge implements BitBox02BridgeInterface {
     }
     return this.app.ethSignTypedMessage(BigInt(chainId), keypath, message);
   };
+
+  ethAddress: BitBox02BridgeInterface['ethAddress'] = async (
+    chainId,
+    keypath,
+    display = true
+  ) => {
+    if (!this.app) {
+      throw new Error('Device not initialized');
+    }
+    return this.app.ethAddress(BigInt(chainId), keypath, display);
+  };
 }

src/background/service/keyring/eth-bitbox02-keyring/bitbox02-offscreen-bridge.ts

@@ -152,4 +152,22 @@ export default class BitBox02OffscreenBridge
         });
     });
   };
+
+  ethAddress: BitBox02BridgeInterface['ethAddress'] = async (...params) => {
+    return new Promise((resolve, reject) => {
+      browser.runtime
+        .sendMessage({
+          target: OffscreenCommunicationTarget.bitbox02Offscreen,
+          action: BitBox02Action.ethAddress,
+          params,
+        })
+        .then((res) => {
+          if (res?.error) {
+            reject(res.error);
+          } else {
+            resolve(res);
+          }
+        });
+    });
+  };
 }

src/background/service/keyring/eth-bitbox02-keyring/eth-bitbox02-keyring.ts

@@ -284,6 +284,15 @@ class BitBox02Keyring extends EventEmitter {
     });
   }
 
+  async verifyAddress(withAccount) {
+    await this.init();
+    return await this.bridge.ethAddress(
+      1,
+      this._pathFromAddress(withAccount),
+      true
+    );
+  }
+
   exportAccount(): Promise<any> {
     return Promise.reject(new Error('Not supported on this device'));
   }

src/background/service/keyring/index.ts

@@ -736,6 +736,18 @@ export class KeyringService extends EventEmitter {
     return keyring.exportAccount(address, { withAppKeyOrigin: origin });
   }
 
+  /**
+   * Show address on device
+   * Display receive address on hardware device for verification
+   *
+   * @param {Object} msgParams - The account parameters.
+   * @returns {Promise<string>} The account address.
+   */
+  verifyAddress(keyring, from) {
+    const address = normalizeAddress(from);
+    return keyring.verifyAddress(address);
+  }
+
   /**
    * Persist All Keyrings
    *

src/constant/offscreen-communication.ts

@@ -36,6 +36,7 @@ export enum BitBox02Action {
   ethSignMessage = 'bitbox02-sign-message',
   ethSignTypedMessage = 'bitbox02-sign-typed-message',
   ethXpub = 'bitbox02-xpub',
+  ethAddress = 'bitbox02-eth-address',
 }
 
 export enum LatticeAction {

src/offscreen/scripts/bitbox02.ts

@@ -116,6 +116,15 @@ export function initBitBox02() {
             });
           break;
 
+        case BitBox02Action.ethAddress:
+          bridge
+            .ethAddress(...(msg.params as [any, any, any]))
+            .then(sendResponse)
+            .catch((err) => {
+              sendResponse({ error: err });
+            });
+          break;
+
         default:
           sendResponse({
             success: false,

src/ui/views/Receive/index.tsx

@@ -16,6 +16,7 @@ import { ReactComponent as IconBack } from 'ui/assets/back.svg';
 import { ReactComponent as RcIconCopy } from 'ui/assets/icon-copy-1-cc.svg';
 import IconEyeHide from 'ui/assets/icon-eye-hide.svg';
 import IconEye from 'ui/assets/icon-eye.svg';
+import IconEyeBlack from 'ui/assets/icon-eye-black.svg';
 import IconSuccess from 'ui/assets/icon-success-1.svg';
 import { ReactComponent as RcIconWarning } from 'ui/assets/icon-warning-large.svg';
 import { splitNumberByStep, useWallet } from 'ui/utils';
@@ -104,6 +105,14 @@ const Receive = () => {
     copyAddress(account.address!);
   };
 
+  const handleVerifyAddress = () => {
+    if (!account) throw new Error(t('background.error.noCurrentAccount'));
+    return wallet.verifyAddress(
+      account.type as string,
+      account.address as string
+    );
+  };
+
   const init = async () => {
     const account = await wallet.syncGetCurrentAccount();
 
@@ -233,17 +242,39 @@ const Receive = () => {
           {account?.address && <QRCode value={account.address} size={175} />}
         </div>
         <div className="qr-card-address">{account?.address}</div>
-        <button
-          type="button"
-          className="qr-card-btn"
-          onClick={handleCopyAddress}
+        <div
+          className={
+            account?.type === KEYRING_CLASS.HARDWARE.BITBOX02
+              ? 'qr-card-btn-container'
+              : ''
+          }
         >
-          <ThemeIcon
-            src={RcIconCopy}
-            className="icon-copy text-r-neutral-title-1"
-          />
-          {t('global.copyAddress')}
-        </button>
+          <button
+            type="button"
+            className="qr-card-btn"
+            onClick={handleCopyAddress}
+          >
+            <ThemeIcon
+              src={RcIconCopy}
+              className="icon-copy text-r-neutral-title-1"
+            />
+            {t('global.copyAddress')}
+          </button>
+
+          {account?.type === KEYRING_CLASS.HARDWARE.BITBOX02 && (
+            <button
+              type="button"
+              className="qr-card-btn"
+              onClick={handleVerifyAddress}
+            >
+              <ThemeIcon
+                src={IconEyeBlack}
+                className="icon-copy text-r-neutral-title-1"
+              />
+              {t('global.verifyAddress')}
+            </button>
+          )}
+        </div>
       </div>
       <div className="page-receive-footer">
         <img

src/ui/views/Receive/style.less

@@ -178,5 +178,17 @@
         margin-right: 6px;
       }
     }
+    &-btn-container {
+      display: flex;
+      gap: 10px;
+      justify-content: center;
+      margin-left: 10px;
+      margin-right: 10px;
+
+      .qr-card-btn {
+        margin: 0;
+        padding: 12px 16px;
+      }
+    }
   }
 }