merge

_raw/locales/en/messages.json

@@ -2322,6 +2322,41 @@
           }
         },
         "agree": "I agree to the<1/> <2>Terms of Use</2> and <4>Privacy Policy</4>"
+      },
+      "successful": {
+        "create": "Created Successfully",
+        "import": "Imported Successfully",
+        "start": "Get Started",
+        "addMoreAddr": "Add more addresses from this Seed Phrase",
+        "addMoreFrom": "Add more addresses from {{name}}"
+      },
+      "readyToUse": {
+        "title": "Rabby Wallet is Ready to Use",
+        "desc": "Pin Rabby Wallet to your toolbar for easy access.",
+        "pin": "Pin Rabby Wallet",
+        "extensionTip": "Click <1/> and then <3/>"
+      },
+      "importSeedPhrase": {
+        "title": "Import Seed Phrase"
+      },
+      "importOneKey": {
+        "title": "OneKey",
+        "tip1": "1. Install <1>OneKey Bridge<1/>",
+        "tip2": "2. Plug in your OneKey device",
+        "tip3": "3. Unlock your device",
+        "connect": "Connect OneKey"
+      },
+      "importTrezor": {
+        "title": "Terzor",
+        "tip1": "1. Plug in your Trezor device",
+        "tip2": "2. Unlock your device",
+        "connect": "Connect Terzor"
+      },
+      "ImportGridPlus": {
+        "title": "GridPlus",
+        "tip1": "1. Open your GridPlus device",
+        "tip2": "2. Connect through Lattice Connector",
+        "connect": "Connect GridPlus"
       }
     }
   },

src/background/controller/wallet.ts

@@ -2929,6 +2929,20 @@ export class WalletController extends BaseController {
     return;
   };
 
+  validatePrivateKey = async (data: string) => {
+    const privateKey = ethUtil.stripHexPrefix(data);
+    const buffer = Buffer.from(privateKey, 'hex');
+
+    const error = new Error(t('background.error.invalidPrivateKey'));
+    try {
+      if (!ethUtil.isValidPrivate(buffer)) {
+        throw error;
+      }
+    } catch {
+      throw error;
+    }
+  };
+
   importPrivateKey = async (data) => {
     const privateKey = ethUtil.stripHexPrefix(data);
     const buffer = Buffer.from(privateKey, 'hex');
@@ -2969,7 +2983,7 @@ export class WalletController extends BaseController {
     );
     return this._setCurrentAccountFromKeyring(keyring);
   };
-
+  generateMnemonic = () => keyringService.generateMnemonic();
   getPreMnemonics = () => keyringService.getPreMnemonics();
   generatePreMnemonic = () => keyringService.generatePreMnemonic();
   removePreMnemonics = () => keyringService.removePreMnemonics();
@@ -3194,6 +3208,10 @@ export class WalletController extends BaseController {
     return await keyring.getInfoByAddress(address);
   };
 
+  validateMnemonic = (mnemonic: string) => {
+    return HdKeyring.validateMnemonic(mnemonic);
+  };
+
   generateKeyringWithMnemonic = async (
     mnemonic: string,
     passphrase: string

src/ui/component/NewUserImport/index.tsx

@@ -92,7 +92,8 @@ export const Card = ({
             'header',
             headerClassName,
             step && 'mt-18',
-            title && 'mt-16'
+            title && 'mt-16',
+            !step && !title && onBack && 'mt-18'
           )}
         >
           {!!onBack && (

src/ui/component/WordsMatrix/MnemonicsInputs.tsx

@@ -21,6 +21,8 @@ import ThemeIcon from '../ThemeMode/ThemeIcon';
 
 import { ReactComponent as RcIconMnemonicsShow } from '@/ui/assets/import/mnemonics-show.svg';
 import { ReactComponent as RcIconMnemonicsHide } from '@/ui/assets/import/mnemonics-hide.svg';
+import { ReactComponent as RcIconArrowCC } from '@/ui/assets/import/arrow-cc.svg';
+import { ReactComponent as RcIconSwipeCC } from '@/ui/assets/import/swipe-cc.svg';
 
 const ITEM_H = 208 / 4;
 const ROW_COUNT = 3;
@@ -61,6 +63,22 @@ const MatrixWrapper = styled.div.withConfig<{
   display: flex;
   flex-wrap: wrap;
 
+  &.new-user-import {
+    background-color: transparent;
+    gap: 9px;
+    .matrix-word-item {
+      border-radius: 8px;
+      width: calc(calc(100% - 18px) / 3);
+      border: 0.5px solid var(--r-neutral-line, #e0e5ec) !important;
+      .mnemonics-input {
+        &:focus,
+        &.ant-input-focused {
+          box-shadow: none;
+        }
+      }
+    }
+  }
+
   .matrix-word-item {
     box-sizing: border-box;
     height: ${ITEM_H}px;
@@ -218,6 +236,7 @@ const SLIP39_MNEMONICS_COUNTS: { passphrase: boolean }[] = [
 ];
 
 function MnemonicsInputs({
+  newUserImport,
   className,
   rowCount = ROW_COUNT,
   value = '',
@@ -232,6 +251,7 @@ function MnemonicsInputs({
   setSlip39GroupNumber,
   ...props
 }: React.PropsWithChildren<{
+  newUserImport?: boolean;
   className?: string;
   rowCount?: number;
   value?: string;
@@ -502,26 +522,46 @@ function MnemonicsInputs({
               )}
             </span>
 
-            <img className="ml-[2px]" src={IconCaretDown} />
+            {newUserImport ? (
+              <RcIconArrowCC
+                className="ml-[2px] text-r-neutral-body w-16 h-16"
+                viewBox="0 0 16 16"
+              />
+            ) : (
+              <img className="ml-[2px]" src={IconCaretDown} />
+            )}
           </div>
         </Dropdown>
         <div
-          className="right flex items-center cursor-pointer"
+          className={clsx(
+            'right flex items-center cursor-pointer',
+            newUserImport && 'min-w-max p-4 hover:bg-r-neutral-card2 rounded'
+          )}
           onClick={() => {
             clearAll();
           }}
         >
-          <ThemeIcon src={RcIconClearAll} />
-          <span className="ml-[6px]">
-            {t('page.newAddress.seedPhrase.clearAll')}
-          </span>
+          {newUserImport ? (
+            <RcIconSwipeCC
+              viewBox="0 0 16 16"
+              className="w-16 h-16 text-r-neutral-foot"
+            />
+          ) : (
+            <ThemeIcon src={RcIconClearAll} svgSize={16} />
+          )}
+          {!newUserImport && (
+            <span className="ml-[6px]">
+              {t('page.newAddress.seedPhrase.clearAll')}
+            </span>
+          )}
         </div>
       </HeadToolbar>
       <MatrixWrapper
         className={clsx(
           'rounded-[6px] text-center',
-          'border border-rabby-neutral-line border-solid',
+          !newUserImport && 'border border-rabby-neutral-line border-solid',
           isSlip39 && 'hidden',
+          newUserImport && 'new-user-import',
           className
         )}
         rowCount={rowCount}
@@ -563,7 +603,8 @@ function MnemonicsInputs({
                   debounce={150}
                   key={`word-input-${ver}-${word}-${idx}`}
                   className={clsx(
-                    'mnemonics-input pl-[46px] pr-10',
+                    'mnemonics-input  pr-10',
+                    newUserImport ? 'pl-[30px]' : 'pl-[46px]',
                     isCurrentFocusing && 'ant-input-focused',
                     {
                       'opacity-50':

src/ui/models/newUserGuide.ts

@@ -10,6 +10,8 @@ interface State {
     address: string;
     chainList: Chain[];
   };
+  passphrase?: string;
+  clearKeyringId?: number;
 }
 
 export const newUserGuide = createModel<RootModel>()({
@@ -20,6 +22,7 @@ export const newUserGuide = createModel<RootModel>()({
     seedPhrase: '',
     privateKey: '',
     gnosis: undefined,
+    passphrase: '',
   },
 
   reducers: {

src/ui/views/HDManager/HDManager.tsx

@@ -29,6 +29,7 @@ import { ReactComponent as imtokenOfflineSVG } from '@/ui/assets/walletlogo/imTo
 import { BitBox02Manager } from './BitBox02Manager';
 import { useTranslation } from 'react-i18next';
 import { ImKeyManager } from './ImKeyManager';
+import { useHistory, useLocation } from 'react-router-dom';
 
 const LOGO_MAP = {
   [HARDWARE_KEYRING_TYPES.Ledger.type]: LedgerSVG,
@@ -61,6 +62,13 @@ export const HDManager: React.FC<StateProviderProps> = ({
   keyringId,
   brand,
 }) => {
+  const { search } = useLocation();
+  const isNewUserImport = React.useMemo(
+    () => new URLSearchParams(search).get('isNewUserImport'),
+    [search]
+  );
+  const history = useHistory();
+
   const wallet = useWallet();
   const [initialed, setInitialed] = React.useState(false);
   const idRef = React.useRef<number | null>(null);
@@ -122,17 +130,26 @@ export const HDManager: React.FC<StateProviderProps> = ({
           });
         });
     }
-
-    window.addEventListener('beforeunload', () => {
-      closeConnect();
-    });
+    if (!isNewUserImport) {
+      window.addEventListener('beforeunload', () => {
+        closeConnect();
+      });
+    }
 
     return () => {
-      closeConnect();
+      if (!isNewUserImport) {
+        closeConnect();
+      }
     };
   }, []);
 
   const handleCloseWin = React.useCallback(() => {
+    if (isNewUserImport) {
+      history.push(
+        `/new-user/success?hd=${keyring}&keyringId=${keyringId}&brand=${brand}`
+      );
+      return;
+    }
     window.close();
   }, []);
 

src/ui/views/HDManager/utils.tsx

@@ -222,6 +222,14 @@ export const HDManagerStateProvider: React.FC<StateProviderProps> = ({
   keyringId,
   keyring,
 }) => {
+  console.log('keyring', {
+    ...useGetCurrentAccounts({ keyringId, keyring }),
+    ...useManagerTab(),
+    ...useHiddenInfo(),
+    ...useTaskQueue({ keyring }),
+    keyringId,
+    keyring,
+  });
   return (
     <HDManagerStateContext.Provider
       value={{