From d4b728c5e82769ae737afdf5190debd4f1b34b83 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?S=C3=A9bastien=20Van=20Eyck?= Date: Thu, 9 Jan 2025 18:21:12 +0100 Subject: [PATCH 01/10] feat: add OneKey on device selection screen --- app/_locales/en/messages.json | 7 ++ app/scripts/metamask-controller.js | 1 + ui/components/ui/logo/logo-onekey.js | 53 ++++++++ .../create-account/connect-hardware/index.js | 1 + .../connect-hardware/select-hardware.js | 113 +++++++++++++++++- 5 files changed, 172 insertions(+), 3 deletions(-) create mode 100644 ui/components/ui/logo/logo-onekey.js diff --git a/app/_locales/en/messages.json b/app/_locales/en/messages.json index 96201a041778..23cde705db60 100644 --- a/app/_locales/en/messages.json +++ b/app/_locales/en/messages.json @@ -5682,6 +5682,13 @@ "message": "Download, set up, and enter your password to unlock $1.", "description": "$1 represents the `ledgerLiveApp` localization value" }, + "step1OnekeyWallet": { + "message": "Connect your OneKey" + }, + "step1OnekeyWalletMsg": { + "message": "Plug your OneKey directly into your computer and unlock it. Make sure you use the correct passphrase.", + "description": "$1 represents the `hardwareWalletSupportLinkConversion` localization key" + }, "step1TrezorWallet": { "message": "Connect your Trezor" }, diff --git a/app/scripts/metamask-controller.js b/app/scripts/metamask-controller.js index b307cda155ab..4bd9b6d22e0d 100644 --- a/app/scripts/metamask-controller.js +++ b/app/scripts/metamask-controller.js @@ -7811,6 +7811,7 @@ export default class MetamaskController extends EventEmitter { let keyringType = null; switch (options.name) { case HardwareDeviceNames.trezor: + case HardwareDeviceNames.oneKeyViaTrezor: keyringType = keyringOverrides?.trezor?.type || TrezorKeyring.type; break; case HardwareDeviceNames.ledger: diff --git a/ui/components/ui/logo/logo-onekey.js b/ui/components/ui/logo/logo-onekey.js new file mode 100644 index 000000000000..a3f7e822254e --- /dev/null +++ b/ui/components/ui/logo/logo-onekey.js @@ -0,0 +1,53 @@ +import React from 'react'; +import PropTypes from 'prop-types'; + +const LogoOnekey = ({ + width = '100%', + color = 'var(--color-text-default)', + className, + ariaLabel, +}) => { + return ( + + + + + + + + + + ); +}; + +LogoOnekey.propTypes = { + /** + * The width of the logo. Defaults to 100% + */ + width: PropTypes.string, + /** + * The color of the logo defaults to var(--color-text-default) + */ + color: PropTypes.string, + /** + * Additional className to add to the root svg + */ + className: PropTypes.string, + /** + * Aria label to add to the logo component + */ + ariaLabel: PropTypes.string, +}; + +export default LogoOnekey; diff --git a/ui/pages/create-account/connect-hardware/index.js b/ui/pages/create-account/connect-hardware/index.js index 22b335c75b17..0df2bd5d20ab 100644 --- a/ui/pages/create-account/connect-hardware/index.js +++ b/ui/pages/create-account/connect-hardware/index.js @@ -128,6 +128,7 @@ class ConnectHardwareForm extends Component { async checkIfUnlocked() { for (const device of [ HardwareDeviceNames.trezor, + HardwareDeviceNames.oneKeyViaTrezor, HardwareDeviceNames.ledger, HardwareDeviceNames.lattice, ]) { diff --git a/ui/pages/create-account/connect-hardware/select-hardware.js b/ui/pages/create-account/connect-hardware/select-hardware.js index 0b81b6aa3592..9e336efa023e 100644 --- a/ui/pages/create-account/connect-hardware/select-hardware.js +++ b/ui/pages/create-account/connect-hardware/select-hardware.js @@ -14,6 +14,7 @@ import { import LogoLedger from '../../../components/ui/logo/logo-ledger'; import LogoQRBased from '../../../components/ui/logo/logo-qr-based'; import LogoTrezor from '../../../components/ui/logo/logo-trezor'; +import LogoOnekey from '../../../components/ui/logo/logo-onekey'; import LogoLattice from '../../../components/ui/logo/logo-lattice'; import { @@ -67,8 +68,14 @@ export default class SelectHardware extends Component { connect = async () => { if (this.state.selectedDevice) { - if (this.state.selectedDevice === 'trezor' && isUSBSupported) { - this.setState({ trezorRequestDevicePending: true }); + if ( + (this.state.selectedDevice === HardwareDeviceNames.trezor || + this.state.selectedDevice === HardwareDeviceNames.oneKeyViaTrezor) && + isUSBSupported + ) { + this.setState({ + trezorRequestDevicePending: true, + }); try { await window.navigator.usb.requestDevice({ filters: [ @@ -107,6 +114,23 @@ export default class SelectHardware extends Component { ); } + renderConnectToOnekeyButton() { + return ( + + ); + } + renderConnectToLatticeButton() { return ( + + + +

{step.message}

+ {step.asset && ( + + )} + + ))} + + ); + } + renderQRHardwareWalletSteps() { const steps = []; steps.push( From fd483d58b228db18259b4268ae61aceb7a7aefcc Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?S=C3=A9bastien=20Van=20Eyck?= Date: Mon, 13 Jan 2025 15:07:52 +0100 Subject: [PATCH 02/10] feat: update connect hardware snapshot --- .../__snapshots__/index.test.tsx.snap | 45 +++++++++++++++++-- 1 file changed, 41 insertions(+), 4 deletions(-) diff --git a/ui/pages/create-account/connect-hardware/__snapshots__/index.test.tsx.snap b/ui/pages/create-account/connect-hardware/__snapshots__/index.test.tsx.snap index 692047851816..0ec258838664 100644 --- a/ui/pages/create-account/connect-hardware/__snapshots__/index.test.tsx.snap +++ b/ui/pages/create-account/connect-hardware/__snapshots__/index.test.tsx.snap @@ -88,6 +88,25 @@ exports[`ConnectHardwareForm should match snapshot 1`] = ` /> +