feat: Add a prompt when importing wallets from ckb-cli

packages/neuron-ui/src/components/ImportFailureDialog/importFailureDialog.module.scss

@@ -0,0 +1,23 @@
+@import '../../styles/mixin.scss';
+
+.container {
+  width: 680px;
+
+  .content {
+    max-width: 60%;
+    text-align: center;
+    margin: 0 auto;
+    font-size: 14px;
+    line-height: 24px;
+    color: var(--main-text-color);
+
+    button {
+      border: none;
+      background: none;
+      color: var(--primary-color);
+      text-decoration: underline;
+      text-underline-offset: 4px;
+      cursor: pointer;
+    }
+  }
+}

packages/neuron-ui/src/components/ImportFailureDialog/index.tsx

@@ -0,0 +1,32 @@
+import React, { useCallback } from 'react'
+import { useTranslation } from 'react-i18next'
+import Dialog from 'widgets/Dialog'
+import { openExternal } from 'services/remote'
+import styles from './importFailureDialog.module.scss'
+
+const ImportFailureDialog = ({ show, onClose }: { show: boolean; onClose: () => void }) => {
+  const [t] = useTranslation()
+
+  const onBtnClick = useCallback(() => {
+    openExternal(
+      'https://github.com/nervosnetwork/ckb-cli/wiki/Import-ckb-cli-keystore-from%26to-Neuron-wallet#ckb-cli-and-neuron-use-the-keystore-in-different-way'
+    )
+  }, [])
+
+  return (
+    <Dialog show={show} title={t('import-keystore.import-failure')} onConfirm={onClose} showCancel={false}>
+      <div className={styles.container}>
+        <p className={styles.content}>
+          {t('import-keystore.import-failure-msg')}
+          <button type="button" onClick={onBtnClick}>
+            {t('navbar.learn-more')}
+          </button>
+        </p>
+      </div>
+    </Dialog>
+  )
+}
+
+ImportFailureDialog.displayName = 'ImportFailureDialog'
+
+export default ImportFailureDialog

packages/neuron-ui/src/components/ImportKeystore/index.tsx

@@ -19,6 +19,7 @@ import ReplaceDuplicateWalletDialog, { useReplaceDuplicateWallet } from 'compone
 import { FinishCreateLoading, CreateFirstWalletNav } from 'components/WalletWizard'
 import TextField from 'widgets/TextField'
 import { importedWalletDialogShown } from 'services/localCache'
+import ImportFailureDialog from '../ImportFailureDialog'
 import styles from './importKeystore.module.scss'
 
 const { MAX_WALLET_NAME_LENGTH, MAX_PASSWORD_LENGTH } = CONSTANTS
@@ -49,6 +50,7 @@ const ImportKeystore = () => {
   const navigate = useNavigate()
   const [fields, setFields] = useState(defaultFields)
   const [openingFile, setOpeningFile] = useState(false)
+  const [isImportFailureDialogShow, setIsImportFailureDialogShow] = useState(false)
   const { onImportingExitingWalletError, dialogProps } = useReplaceDuplicateWallet()
   const goBack = useGoBack()
 
@@ -122,6 +124,11 @@ const ImportKeystore = () => {
             return
           }
 
+          if (res.status === ErrorCode.UnsupportedCkbCliKeystore) {
+            setIsImportFailureDialogShow(true)
+            return
+          }
+
           if (res.message) {
             const msg = typeof res.message === 'string' ? res.message : res.message.content || ''
             if (msg) {
@@ -140,7 +147,18 @@ const ImportKeystore = () => {
           closeDialog()
         })
     },
-    [fields.name, fields.password, fields.path, navigate, openDialog, closeDialog, disabled, setFields, t]
+    [
+      fields.name,
+      fields.password,
+      fields.path,
+      navigate,
+      openDialog,
+      closeDialog,
+      disabled,
+      setFields,
+      t,
+      setIsImportFailureDialogShow,
+    ]
   )
 
   const handleChange = useCallback(
@@ -199,6 +217,10 @@ const ImportKeystore = () => {
     [setFields, wallets, t]
   )
 
+  const onCloseImportFailureDialog = useCallback(() => {
+    setIsImportFailureDialogShow(false)
+  }, [setIsImportFailureDialogShow])
+
   return (
     <>
       <form className={styles.container} onSubmit={handleSubmit}>
@@ -248,6 +270,8 @@ const ImportKeystore = () => {
       </form>
 
       <ReplaceDuplicateWalletDialog {...dialogProps} />
+
+      <ImportFailureDialog show={isImportFailureDialogShow} onClose={onCloseImportFailureDialog} />
     </>
   )
 }

packages/neuron-ui/src/locales/en.json

@@ -202,6 +202,8 @@
     "import-keystore": {
       "title": "Import Keystore File",
       "select-file": "Choose File",
+      "import-failure": "Import Failure",
+      "import-failure-msg": "Neuron does not support importing ckb-cli's keystore file due to different keystore file derivation rules.",
       "label": {
         "path": "Keystore File",
         "name": "Wallet Name",

packages/neuron-ui/src/locales/es.json

@@ -194,6 +194,8 @@
     "import-keystore": {
       "title": "Importar Keystore",
       "select-file": "Seleccionar Archivo",
+      "import-failure": "Error de importación",
+      "import-failure-msg": "Neuron no soporta la importación del archivo Keystore debido a diferentes reglas de derivación del archivo Keystore.",
       "label": {
         "path": "Archivo de Claves",
         "name": "Nombre de la Billetera",

packages/neuron-ui/src/locales/fr.json

@@ -201,6 +201,8 @@
     "import-keystore": {
       "title": "Importer le fichier Keystore",
       "select-file": "Choisir le fichier",
+      "import-failure": "Échec de l'importation",
+      "import-failure-msg": "Neuron ne prend pas en charge l'importation du fichier Keystore en raison de différentes règles de dérivation du fichier Keystore.",
       "label": {
         "path": "Fichier Keystore",
         "name": "Nom du Wallet",

packages/neuron-ui/src/locales/zh-tw.json

@@ -196,6 +196,8 @@
     "import-keystore": {
       "title": "導入 Keystore 文件",
       "select-file": "選擇文件",
+      "import-failure": "導入失敗",
+      "import-failure-msg": "由於不同的Keystore文件衍生規則，Neuron不支持導入ckb-cli的Keystore文件。",
       "label": {
         "path": "Keystore 檔案",
         "name": "錢包名稱",

packages/neuron-ui/src/locales/zh.json

@@ -195,6 +195,8 @@
     "import-keystore": {
       "title": "导入 Keystore 文件",
       "select-file": "选择文件",
+      "import-failure": "导入失败",
+      "import-failure-msg": "由于不同的Keystore文件派生规则，Neuron不支持导入ckb-cli的Keystore文件。",
       "label": {
         "path": "Keystore 文件",
         "name": "钱包名称",

packages/neuron-ui/src/utils/enums.ts

@@ -112,6 +112,7 @@ export enum ErrorCode {
   // active warning
   WaitForFullySynced = 600,
   DuplicateImportWallet = 118,
+  UnsupportedCkbCliKeystore = 119,
 }
 
 export enum SyncStatus {

packages/neuron-wallet/src/controllers/wallets.ts

@@ -22,6 +22,7 @@ import {
   UsedName,
   MainnetAddressRequired,
   TestnetAddressRequired,
+  UnsupportedCkbCliKeystore,
 } from '../exceptions'
 import AddressService from '../services/addresses'
 import TransactionSender from '../services/transaction-sender'
@@ -166,6 +167,19 @@ export default class WalletsController {
       throw new InvalidJSON()
     }
     const keystoreObject = Keystore.fromJson(keystore)
+
+    if (keystoreObject.isFromCkbCli()) {
+      throw new UnsupportedCkbCliKeystore()
+    }
+
+    try {
+      keystoreObject.extendedPrivateKey(password)
+    } catch (error) {
+      if (error.message === 'Incorrect password!') {
+        throw new IncorrectPassword()
+      }
+    }
+
     const masterPrivateKey = keystoreObject.extendedPrivateKey(password)
     const masterKeychain = new Keychain(
       Buffer.from(bytes.bytify(masterPrivateKey.privateKey)),

packages/neuron-wallet/src/exceptions/wallet.ts

@@ -85,6 +85,13 @@ export class DuplicateImportWallet extends Error {
   }
 }
 
+export class UnsupportedCkbCliKeystore extends Error {
+  public code = 119
+  constructor() {
+    super(t('messages.unsupported-ckb-cli-keystore'))
+  }
+}
+
 export default {
   WalletNotFound,
   CurrentWalletNotSet,
@@ -96,4 +103,5 @@ export default {
   CapacityNotEnoughForChange,
   InvalidKeystore,
   DuplicateImportWallet,
+  UnsupportedCkbCliKeystore,
 }

packages/neuron-wallet/src/locales/en.ts

@@ -122,6 +122,7 @@ export default {
       'connect-device-failed': 'The device cannot be connected, please check your connection.',
       'unsupported-manufacturer': 'Devices from {{manufacturer}} are not yet supported.',
       'wallet-not-supported-function': 'This wallet does not support {name} function.',
+      'unsupported-ckb-cli-keystore': "Neuron does not support importing ckb-cli's keystore file.",
       'invalid-transaction-file': 'Invalid transaction file.',
       'offline-sign-failed': 'Signing failed, please check if you are signing with the correct wallet.',
       'multisig-script-prefix-error': 'The multisig config is error',

packages/neuron-wallet/src/locales/es.ts

@@ -121,6 +121,8 @@ export default {
       'connect-device-failed': 'No se puede conectar el dispositivo, por favor, verifica tu conexión.',
       'unsupported-manufacturer': 'Los dispositivos de {{manufacturer}} aún no son compatibles.',
       'wallet-not-supported-function': 'Esta billetera no admite la función {name}.',
+      'unsupported-ckb-cli-keystore':
+        'Neuron no soporta la importación del archivo de almacenamiento de claves de ckb-cli.',
       'invalid-transaction-file': 'Archivo de transacción no válido.',
       'offline-sign-failed': 'Firma fallida, por favor, verifica si estás firmando con la billetera correcta.',
       'multisig-script-prefix-error': 'Error en la configuración multifirma',

packages/neuron-wallet/src/locales/fr.ts

@@ -124,6 +124,8 @@ export default {
       'connect-device-failed': "L'appareil ne peut pas être connecté, veuillez vérifier votre connexion.",
       'unsupported-manufacturer': 'Les appareils de {{manufacturer}} ne sont pas encore pris en charge.',
       'wallet-not-supported-function': 'Ce Wallet ne prend pas en charge la fonction {name}.',
+      'unsupported-ckb-cli-keystore':
+        "Neuron ne prend pas en charge l'importation du fichier de stockage de clés de ckb-cli.",
       'invalid-transaction-file': 'Fichier de transaction non valide.',
       'offline-sign-failed': 'Échec de la signature, veuillez vérifier si vous signez avec le bon Wallet.',
       'multisig-script-prefix-error': 'La configuration multisig est erronée',