fix: some bugs

RabbyHub · Nov 22, 2024 · d9e3254 · d9e3254
1 parent 97d59b3
commit d9e3254
Show file tree

Hide file tree

Showing 9 changed files with 195 additions and 129 deletions.
diff --git a/src/background/index.ts b/src/background/index.ts
@@ -392,10 +392,11 @@ function startEnableUser() {
 
 // On first install, open a new tab with Rabby
 async function onInstall() {
-  // todo
-  const storeAlreadyExisted = Object.keys(
-    await browser.storage.local.get('keyringState')
-  ).length;
+  const storeAlreadyExisted = Boolean(
+    Object.keys(await browser.storage.local.get(null)).filter((key) => {
+      return !['extensionId', 'openapi'].includes(key);
+    }).length
+  );
   // If the store doesn't exist, then this is the first time running this script,
   // and is therefore an install
   if (!storeAlreadyExisted) {

diff --git a/src/background/service/keyring/index.ts b/src/background/service/keyring/index.ts
@@ -45,6 +45,7 @@ import {
   passwordDecrypt,
   passwordClearKey,
 } from 'background/utils/password';
+import { nanoid } from 'nanoid';
 
 export const KEYRING_SDK_TYPES = {
   SimpleKeyring,
@@ -112,8 +113,11 @@ export class KeyringService extends EventEmitter {
   }
 
   async boot(password: string) {
+    if (this.isBooted()) {
+      throw new Error('is booted');
+    }
     this.password = password;
-    const encryptBooted = await passwordEncrypt({ data: 'true', password });
+    const encryptBooted = await passwordEncrypt({ data: nanoid(), password });
     this.store.updateState({ booted: encryptBooted });
     this.memStore.updateState({ isUnlocked: true });
   }

diff --git a/src/ui/app.tsx b/src/ui/app.tsx
@@ -3,7 +3,7 @@ import ReactDOM from 'react-dom';
 import { Provider } from 'react-redux';
 import Views from './views';
 import { Message } from '@/utils/message';
-import { getUITypeName } from 'ui/utils';
+import { getUiType, getUITypeName, openInTab } from 'ui/utils';
 import eventBus from '@/eventBus';
 import * as Sentry from '@sentry/react';
 import i18n, { addResourceBundle, changeLanguage } from 'src/i18n';
@@ -131,6 +131,15 @@ const main = () => {
   store.dispatch.app.initBizStore();
   store.dispatch.chains.init();
 
+  if (getUiType().isPop) {
+    wallet.isBooted().then((isBooted) => {
+      // todo check tabs
+      if (!isBooted) {
+        openInTab('./index.html#/new-user/guide');
+      }
+    });
+  }
+
   wallet.getLocale().then((locale) => {
     addResourceBundle(locale).then(() => {
       changeLanguage(locale);

diff --git a/src/ui/views/NewUserImport/GnosisChainList.tsx b/src/ui/views/NewUserImport/GnosisChainList.tsx
@@ -0,0 +1,66 @@
+import { Chain } from '@/types/chain';
+import React from 'react';
+import { useTranslation } from 'react-i18next';
+import styled from 'styled-components';
+
+const Container = styled.div`
+  .desc {
+    text-align: left;
+    font-weight: 400;
+    font-size: 13px;
+    line-height: 15px;
+    color: var(--r-neutral-body, #3e495e);
+    margin-bottom: 12px;
+  }
+  .chain-list {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 20px 12px;
+
+    &-item {
+      display: flex;
+      align-items: center;
+      gap: 6px;
+
+      font-weight: 500;
+      font-size: 13px;
+      line-height: 15px;
+      color: var(--r-neutral-title-1, #192945);
+
+      .chain-logo {
+        width: 20px;
+        height: 20px;
+        border-radius: 50%;
+      }
+    }
+  }
+`;
+
+export const GnosisChainList = ({
+  chainList,
+  className,
+}: {
+  chainList?: Chain[];
+  className?: string;
+}) => {
+  const { t } = useTranslation();
+  return chainList?.length ? (
+    <Container className={className}>
+      <div className="desc">
+        {t('page.importSafe.gnosisChainDesc', {
+          count: chainList?.length,
+        })}
+      </div>
+      <div className="chain-list">
+        {chainList?.map((chain) => {
+          return (
+            <div className="chain-list-item" key={chain.id}>
+              <img src={chain.logo} alt="" className="chain-logo" />
+              {chain.name}
+            </div>
+          );
+        })}
+      </div>
+    </Container>
+  ) : null;
+};
diff --git a/src/ui/views/NewUserImport/ImportGnosisAddress.tsx b/src/ui/views/NewUserImport/ImportGnosisAddress.tsx
@@ -10,6 +10,7 @@ import { useTranslation } from 'react-i18next';
 import { useHistory } from 'react-router-dom';
 import styled from 'styled-components';
 import { useNewUserGuideStore } from './hooks/useNewUserGuideStore';
+import { GnosisChainList } from './GnosisChainList';
 
 const Container = styled.div`
   .ant-input {
@@ -55,40 +56,6 @@ const Container = styled.div`
     align-items: center;
     gap: 4px;
   }
-
-  .chain-list-container {
-    margin-top: 20px;
-    .desc {
-      text-align: left;
-      font-weight: 400;
-      font-size: 13px;
-      line-height: 15px;
-      color: var(--r-neutral-body, #3e495e);
-      margin-bottom: 12px;
-    }
-    .chain-list {
-      display: flex;
-      flex-wrap: wrap;
-      gap: 20px 12px;
-
-      &-item {
-        display: flex;
-        align-items: center;
-        gap: 6px;
-
-        font-weight: 500;
-        font-size: 13px;
-        line-height: 15px;
-        color: var(--r-neutral-title-1, #192945);
-
-        .chain-logo {
-          width: 20px;
-          height: 20px;
-          border-radius: 50%;
-        }
-      }
-    }
-  }
 `;
 
 export const NewUserImportGnosisAddress = () => {
@@ -214,29 +181,10 @@ export const NewUserImportGnosisAddress = () => {
                 {errorMessage ? (
                   <div className="error">{errorMessage}</div>
                 ) : (
-                  !!chainList?.length && (
-                    <div className="chain-list-container">
-                      <div className="desc">
-                        {t('page.importSafe.gnosisChainDesc', {
-                          count: chainList?.length,
-                        })}
-                      </div>
-                      <div className="chain-list">
-                        {chainList?.map((chain) => {
-                          return (
-                            <div className="chain-list-item" key={chain.id}>
-                              <img
-                                src={chain.logo}
-                                alt=""
-                                className="chain-logo"
-                              />
-                              {chain.name}
-                            </div>
-                          );
-                        })}
-                      </div>
-                    </div>
-                  )
+                  <GnosisChainList
+                    chainList={chainList}
+                    className="mt-[20px]"
+                  />
                 )}
               </>
             )}

diff --git a/src/ui/views/NewUserImport/ImportKeystone.tsx b/src/ui/views/NewUserImport/ImportKeystone.tsx
@@ -19,6 +19,7 @@ import { useHistory, useLocation } from 'react-router-dom';
 import QRCodeReader from 'ui/component/QRCodeReader';
 import QRCodeCheckerDetail from 'ui/views/QRCodeCheckerDetail';
 import { useNewUserGuideStore } from './hooks/useNewUserGuideStore';
+import { useRequest } from 'ahooks';
 
 const KEYSTONE_TYPE = HARDWARE_KEYRING_TYPES.Keystone.type;
 
@@ -95,21 +96,21 @@ export const NewUserImportKeystone = () => {
   };
 
   const goToSelectAddress = async (keyringId?: number | null) => {
-    let search = `?hd=${KEYSTONE_TYPE}&brand=${WALLET_BRAND_TYPES.KEYSTONE}`;
-    if (keyringId) {
-      search += `&keyringId=${keyringId}`;
+    if (!keyringId) {
+      return;
     }
-    // todo
+    await wallet.requestKeyring(
+      KEYSTONE_TYPE,
+      'setHDPathType',
+      keyringId,
+      HDPathType.BIP44
+    );
 
-    // history.push({
-    //   pathname: '/import/select-address',
-    //   state: {
-    //     keyring: KEYSTONE_TYPE,
-    //     keyringId,
-    //     brand: WALLET_BRAND_TYPES.KEYSTONE,
-    //   },
-    //   search,
-    // });
+    await wallet.unlockHardwareAccount(KEYSTONE_TYPE, [0], keyringId);
+    history.push({
+      pathname: '/new-user/success',
+      search: `?hd=${KEYSTONE_TYPE}&brand=${WALLET_BRAND_TYPES.KEYSTONE}&keyringId=${keyringId}`,
+    });
   };
 
   const handleClickBack = () => {
@@ -147,7 +148,6 @@ export const NewUserImportKeystone = () => {
 
       await wallet.boot(store.password);
       await TransportWebUSB.requestPermission();
-      console.log('permission');
 
       await wallet.requestKeyring(KEYSTONE_TYPE, 'forgetDevice', null);
 
@@ -162,28 +162,29 @@ export const NewUserImportKeystone = () => {
         HDPathType.BIP44
       );
 
-      const accounts = await wallet.unlockHardwareAccount(
+      await wallet.requestKeyring(
         KEYSTONE_TYPE,
-        [0],
-        stashKeyringId
+        'setHDPathType',
+        stashKeyringId,
+        HDPathType.BIP44
       );
 
-      history.replace({
-        pathname: '/import/success',
-        state: {
-          accounts,
-          title: t('page.newAddress.importedSuccessfully'),
-          editing: true,
-          importedAccount: true,
-          importedLength: accounts.length,
-        },
+      await wallet.unlockHardwareAccount(KEYSTONE_TYPE, [0], stashKeyringId);
+
+      history.push({
+        pathname: '/new-user/success',
+        search: `?hd=${KEYSTONE_TYPE}&brand=${WALLET_BRAND_TYPES.KEYSTONE}&keyringId=${stashKeyringId}`,
       });
     } catch (error) {
       console.error(error);
       keystoneErrorCatcher(error);
     }
   };
 
+  const { runAsync: runHandleConnect, loading } = useRequest(onConnectViaUSB, {
+    manual: true,
+  });
+
   const handleScan = () => {
     setErrorMessage('');
     setScan(true);
@@ -195,9 +196,6 @@ export const NewUserImportKeystone = () => {
     <Card
       onBack={() => {
         history.goBack();
-        setStore({
-          privateKey: undefined,
-        });
       }}
       step={2}
       className="flex flex-col"
@@ -300,7 +298,8 @@ export const NewUserImportKeystone = () => {
                 className="w-[240px] mx-auto"
               />
               <Button
-                onClick={onConnectViaUSB}
+                onClick={runHandleConnect}
+                loading={loading}
                 block
                 type="primary"
                 className={clsx(