fix: importing mnemonics immediately after resetting wallet

Author: bensideone

package.json

@@ -1,6 +1,6 @@
 {
   "name": "side-wallet",
-  "version": "0.0.3",
+  "version": "0.0.4",
   "private": true,
   "scripts": {
     "clean": "mkdir -p dist && rm -rf dist/* && cp -r build/_raw/* dist",

src/ui/pages/Account/CreateHDWalletScreen/index.tsx

@@ -2,7 +2,8 @@ import { useCallback, useMemo, useState } from 'react';
 import { useLocation } from 'react-router-dom';
 
 import { AddressType, RestoreWalletType } from '@/shared/types';
-import { Column, Header, Layout, StepBar } from '@/ui/components';
+import { Column, Header, StepBar } from '@/ui/components';
+import { useExtensionIsInTab } from '@/ui/features/browser/tabs';
 
 import { useNavigate } from '../../MainRoute';
 import Step1_Create from './Step1_Create';
@@ -13,6 +14,7 @@ import { ContextData, TabType, UpdateContextDataParams, WordsType } from './type
 
 export default function CreateHDWalletScreen() {
   const navigate = useNavigate();
+  const isInTab = useExtensionIsInTab();
 
   const { state } = useLocation();
   const { isImport, fromUnlock } = state as {
@@ -90,13 +92,20 @@ export default function CreateHDWalletScreen() {
   }, [items, contextData.tabType]);
 
   return (
-    <Layout
+    <div
       style={{
+        backgroundColor: '#09090A',
+        display: 'flex',
+        flexDirection: 'column',
+        width: '100%',
         maxWidth: window.location.pathname === '/sidePanel.html' ? '100vw' : '375px',
+        minHeight: '600px',
         height: window.location.pathname === '/sidePanel.html' ? '100vh' : '600px',
-        overflowY: 'hidden'
-      }}
-    >
+        overflowY: 'auto',
+        overflowX: 'hidden',
+        border: !isInTab ? '1px solid rgba(255, 255, 255, 0.1)' : 'none',
+        justifyContent: 'center'
+      }}>
       <Header
         onBack={() => {
           if (fromUnlock) {
@@ -112,8 +121,7 @@ export default function CreateHDWalletScreen() {
           padding: '0 16px 0',
           marginTop: '10px',
           marginBottom: '10px'
-        }}
-      >
+        }}>
         <StepBar
           activeKey={contextData.tabType}
           items={items.map((v) => ({
@@ -123,6 +131,6 @@ export default function CreateHDWalletScreen() {
         />
       </Column>
       {currentChildren}
-    </Layout>
+    </div>
   );
 }

src/ui/pages/Account/CreatePasswordScreen.tsx

@@ -2,8 +2,9 @@ import { Checkbox } from 'antd';
 import { useEffect, useMemo, useState } from 'react';
 import { useLocation, useNavigate as useNavigateRouter } from 'react-router-dom';
 
-import { Button, Column, Header, Input, Layout, Row, Text } from '@/ui/components';
+import { Button, Column, Header, Input, Row, Text } from '@/ui/components';
 import { useTools } from '@/ui/components/ActionComponent';
+import { useExtensionIsInTab } from '@/ui/features/browser/tabs';
 import { useWallet, useWalletRequest } from '@/ui/utils';
 import { getPasswordStrengthWord } from '@/ui/utils/password-utils';
 
@@ -14,6 +15,7 @@ type Status = '' | 'error' | 'warning' | undefined;
 export default function CreatePasswordScreen() {
   const navigate = useNavigate();
   const navigateRouter = useNavigateRouter();
+  const isInTab = useExtensionIsInTab();
   const wallet = useWallet();
   const loc = useLocation();
   const params = new URLSearchParams(loc.search);
@@ -118,9 +120,19 @@ export default function CreatePasswordScreen() {
   };
 
   return (
-    <Layout
+    <div
       style={{
-        maxWidth: window.location.pathname === '/sidePanel.html' ? '100vw' : '375px'
+        backgroundColor: '#09090A',
+        display: 'flex',
+        flexDirection: 'column',
+        width: '100%',
+        maxWidth: window.location.pathname === '/sidePanel.html' ? '100vw' : '375px',
+        minHeight: '600px',
+        height: window.location.pathname === '/sidePanel.html' ? '100vh' : '600px',
+        overflowY: 'auto',
+        overflowX: 'hidden',
+        border: !isInTab ? '1px solid rgba(255, 255, 255, 0.1)' : 'none',
+        justifyContent: 'center'
       }}>
       <Header onBack={() => navigateRouter(-1)} title="Create Password"></Header>
       <Column
@@ -252,6 +264,6 @@ export default function CreatePasswordScreen() {
         </Column>
         <Button disabled={disabled} text="Next" preset="primary" onClick={btnClick} />
       </Column>
-    </Layout>
+    </div>
   );
 }