[issue-444, issue-430, issue-910] Use Keychain for biometric auth, ne…

…w login screen, update reset account
Koniverse · Sep 6, 2023 · 6bf5bb8 · 6bf5bb8
1 parent f30fa91
commit 6bf5bb8
Show file tree

Hide file tree

Showing 45 changed files with 1,116 additions and 659 deletions.
diff --git a/android/app/src/main/AndroidManifest.xml b/android/app/src/main/AndroidManifest.xml
@@ -6,6 +6,7 @@
     <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
     <uses-permission android:name="android.permission.DOWNLOAD_WITHOUT_NOTIFICATION" />
     <uses-permission android:name="android.permission.VIBRATE"/>
+    <uses-permission android:name="android.permission.USE_BIOMETRIC" />
     <uses-permission android:name="android.permission.USE_FINGERPRINT"/>
     <application
       android:name=".MainApplication"

diff --git a/ios/Podfile.lock b/ios/Podfile.lock
@@ -373,6 +373,8 @@ PODS:
     - React-Core
   - react-native-segmented-control (2.2.2):
     - React-Core
+  - react-native-sensitive-info (6.0.0-alpha.9):
+    - React-Core
   - react-native-slider (4.4.2):
     - React-Core
   - react-native-splash-screen (3.3.0):
@@ -499,7 +501,7 @@ PODS:
     - React-Core
   - RNInAppBrowser (3.7.0):
     - React-Core
-  - RNKeychain (8.1.1):
+  - RNKeychain (8.1.2):
     - React-Core
   - RNPermissions (3.8.4):
     - React-Core
@@ -547,8 +549,6 @@ PODS:
     - libwebp (~> 1.0)
     - SDWebImage/Core (~> 5.10)
   - SocketRocket (0.6.1)
-  - TouchID (4.4.1):
-    - React
   - Yoga (1.14.0)
   - YogaKit (1.18.1):
     - Yoga (~> 1.14)
@@ -613,6 +613,7 @@ DEPENDENCIES:
   - react-native-restart (from `../node_modules/react-native-restart`)
   - react-native-safe-area-context (from `../node_modules/react-native-safe-area-context`)
   - "react-native-segmented-control (from `../node_modules/@react-native-community/segmented-control`)"
+  - react-native-sensitive-info (from `../node_modules/react-native-sensitive-info`)
   - "react-native-slider (from `../node_modules/@react-native-community/slider`)"
   - react-native-splash-screen (from `../node_modules/react-native-splash-screen`)
   - react-native-static-server (from `../node_modules/react-native-static-server`)
@@ -651,7 +652,6 @@ DEPENDENCIES:
   - RNScreens (from `../node_modules/react-native-screens`)
   - RNSVG (from `../node_modules/react-native-svg`)
   - RNVectorIcons (from `../node_modules/react-native-vector-icons`)
-  - TouchID (from `../node_modules/react-native-touch-id`)
   - Yoga (from `../node_modules/react-native/ReactCommon/yoga`)
 
 SPEC REPOS:
@@ -742,6 +742,8 @@ EXTERNAL SOURCES:
     :path: "../node_modules/react-native-safe-area-context"
   react-native-segmented-control:
     :path: "../node_modules/@react-native-community/segmented-control"
+  react-native-sensitive-info:
+    :path: "../node_modules/react-native-sensitive-info"
   react-native-slider:
     :path: "../node_modules/@react-native-community/slider"
   react-native-splash-screen:
@@ -818,8 +820,6 @@ EXTERNAL SOURCES:
     :path: "../node_modules/react-native-svg"
   RNVectorIcons:
     :path: "../node_modules/react-native-vector-icons"
-  TouchID:
-    :path: "../node_modules/react-native-touch-id"
   Yoga:
     :path: "../node_modules/react-native/ReactCommon/yoga"
 
@@ -872,6 +872,7 @@ SPEC CHECKSUMS:
   react-native-restart: 45c8dca02491980f2958595333cbccd6877cb57e
   react-native-safe-area-context: 9697629f7b2cda43cf52169bb7e0767d330648c2
   react-native-segmented-control: 65df6cd0619b780b3843d574a72d4c7cec396097
+  react-native-sensitive-info: d44e909d065f9c0e15734245e5dd6a24b82e3dcd
   react-native-slider: 33b8d190b59d4f67a541061bb91775d53d617d9d
   react-native-splash-screen: 4312f786b13a81b5169ef346d76d33bc0c6dc457
   react-native-static-server: 201b2a945a35096be3ae7f43e367c65bcbd61343
@@ -903,7 +904,7 @@ SPEC CHECKSUMS:
   RNFS: 4ac0f0ea233904cb798630b3c077808c06931688
   RNGestureHandler: dec4645026e7401a0899f2846d864403478ff6a5
   RNInAppBrowser: e36d6935517101ccba0e875bac8ad7b0cb655364
-  RNKeychain: ff836453cba46938e0e9e4c22e43d43fa2c90333
+  RNKeychain: a65256b6ca6ba6976132cc4124b238a5b13b3d9c
   RNPermissions: 8231416ed851ad4f9ddc220494467c8f1f79c5df
   RNQrGenerator: 90461ba3ca88c1d38ef73da50fade35d9648215d
   RNReanimated: f186e85d9f28c9383d05ca39e11dd194f59093ec
@@ -913,7 +914,6 @@ SPEC CHECKSUMS:
   SDWebImage: a7f831e1a65eb5e285e3fb046a23fcfbf08e696d
   SDWebImageWebPCoder: 908b83b6adda48effe7667cd2b7f78c897e5111d
   SocketRocket: f32cd54efbe0f095c4d7594881e52619cfe80b17
-  TouchID: ba4c656d849cceabc2e4eef722dea5e55959ecf4
   Yoga: 39310a10944fc864a7550700de349183450f8aaa
   YogaKit: f782866e155069a2cca2517aafea43200b01fd5a
   ZXingObjC: fdbb269f25dd2032da343e06f10224d62f537bdb

diff --git a/package.json b/package.json
@@ -88,7 +88,7 @@
     "react-native-gesture-handler": "^2.9.0",
     "react-native-image-picker": "^5.0.1",
     "react-native-inappbrowser-reborn": "^3.7.0",
-    "react-native-keychain": "^8.1.1",
+    "react-native-keychain": "^8.1.2",
     "react-native-linear-gradient": "^2.6.2",
     "react-native-localization": "^2.3.1",
     "react-native-mmkv": "^2.10.1",
@@ -105,6 +105,7 @@
     "react-native-restart": "^0.0.24",
     "react-native-safe-area-context": "^4.5.0",
     "react-native-screens": "^3.19.0",
+    "react-native-sensitive-info": "^6.0.0-alpha.9",
     "react-native-skeleton-placeholder": "^5.2.4",
     "react-native-splash-screen": "^3.3.0",
     "react-native-static-server": "^0.5.0",
@@ -113,7 +114,6 @@
     "react-native-svg-transformer": "^1.0.0",
     "react-native-tab-view": "^3.5.2",
     "react-native-toast-notifications": "^3.3.1",
-    "react-native-touch-id": "^4.4.1",
     "react-native-vector-icons": "^9.2.0",
     "react-native-version-number": "^0.3.6",
     "react-native-video": "^5.2.1",

diff --git a/src/AppNavigator.tsx b/src/AppNavigator.tsx
@@ -23,7 +23,6 @@ import { DAppAccessScreen } from 'screens/Settings/Security/DAppAccess';
 import { DAppAccessDetailScreen } from 'screens/Settings/Security/DAppAccess/DAppAccessDetailScreen';
 import { Languages } from 'screens/Settings/Languages';
 import { Security } from 'screens/Settings/Security';
-import { PinCodeScreen } from 'screens/Settings/Security/PinCodeScreen';
 import { AccountExport } from 'screens/Account/AccountExport';
 import { CustomTokenSetting } from 'screens/Tokens';
 import { NetworkConfig } from 'screens/Settings/NetworkConfig';
@@ -68,7 +67,7 @@ import { ConnectionList } from 'screens/Settings/WalletConnect/ConnectionList';
 import { ConnectWalletConnect } from 'screens/Settings/WalletConnect/ConnectWalletConnect';
 import { ConnectionDetail } from 'screens/Settings/WalletConnect/ConnectionDetail';
 import useAppLock from 'hooks/useAppLock';
-import { LockScreen } from 'screens/LockScreen';
+import LoginScreen from 'screens/MasterPassword/Login';
 import { STATUS_BAR_LIGHT_CONTENT } from 'styles/sharedStyles';
 import { UnlockModal } from 'components/common/Modal/UnlockModal';
 import { AppModalContext } from 'providers/AppModalContext';
@@ -143,6 +142,7 @@ const AppNavigator = ({ isAppReady }: Props) => {
   const { hasConfirmations } = useSelector((state: RootState) => state.requestState);
   const { accounts, hasMasterPassword } = useSelector((state: RootState) => state.accountState);
   const { isLocked } = useAppLock();
+  const [isNavigationReady, setNavigationReady] = useState<boolean>(false);
   const appModalContext = useContext(AppModalContext);
 
   const needMigrate = useMemo(
@@ -179,7 +179,6 @@ const AppNavigator = ({ isAppReady }: Props) => {
     return () => {
       amount = false;
     };
-    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [hasConfirmations, navigationRef, currentRoute]);
 
   useEffect(() => {
@@ -195,16 +194,12 @@ const AppNavigator = ({ isAppReady }: Props) => {
   }, [currentRoute, hasMasterPassword, navigationRef, needMigrate]);
 
   useEffect(() => {
-    let amount = true;
-    if (isLocked && amount) {
+    if (isLocked && !!accounts.length && isNavigationReady) {
       appModalContext.hideConfirmModal();
-      setTimeout(() => navigationRef.current?.navigate('Login'), 500);
+      setTimeout(() => navigationRef.current?.navigate('Login'), 300);
     }
-    return () => {
-      amount = false;
-    };
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [isLocked, navigationRef]);
+  }, [isLocked, isNavigationReady, accounts]);
 
   useEffect(() => {
     if (isEmptyAccounts) {
@@ -215,8 +210,17 @@ const AppNavigator = ({ isAppReady }: Props) => {
     }
   }, [isEmptyAccounts, navigationRef]);
 
+  const onNavigationReady = () => {
+    setNavigationReady(true);
+  };
+
   return (
-    <NavigationContainer linking={linking} ref={navigationRef} theme={theme} onStateChange={onUpdateRoute}>
+    <NavigationContainer
+      linking={linking}
+      ref={navigationRef}
+      theme={theme}
+      onStateChange={onUpdateRoute}
+      onReady={onNavigationReady}>
       <StatusBar barStyle={STATUS_BAR_LIGHT_CONTENT} translucent={true} backgroundColor={'transparent'} />
       <ErrorBoundary FallbackComponent={ErrorFallback} onError={onError}>
         <Stack.Navigator
@@ -284,7 +288,6 @@ const AppNavigator = ({ isAppReady }: Props) => {
                 <Stack.Screen name="DAppAccessDetail" component={DAppAccessDetailScreen} />
                 <Stack.Screen name="Languages" component={Languages} />
                 <Stack.Screen name="Security" component={Security} />
-                <Stack.Screen name="PinCode" component={PinCodeScreen} />
                 <Stack.Screen
                   name="ChangePassword"
                   component={ChangeMasterPassword}
@@ -316,8 +319,8 @@ const AppNavigator = ({ isAppReady }: Props) => {
                   component={Confirmations}
                   options={{ gestureEnabled: false, animationDuration: 100 }}
                 />
-                <Stack.Screen name="Login" component={LockScreen} />
-                {<Stack.Screen name={'UnlockModal'} component={UnlockModal} />}
+                {!!accounts.length && <Stack.Screen name="Login" component={LoginScreen} />}
+                <Stack.Screen name={'UnlockModal'} component={UnlockModal} />
               </Stack.Group>
             </>
           )}