Working on secure device lock authentication with automatic app locking.

package-lock.json

@@ -14,6 +14,7 @@
         "react": "19.2.0",
         "react-native": "0.83.1",
         "react-native-biometrics": "^3.0.1",
+        "react-native-keychain": "^10.0.0",
         "react-native-safe-area-context": "^5.5.2"
       },
       "devDependencies": {
@@ -10111,6 +10112,19 @@
         "react-native": ">=0.60.0"
       }
     },
+    "node_modules/react-native-keychain": {
+      "version": "10.0.0",
+      "resolved": "https://registry.npmjs.org/react-native-keychain/-/react-native-keychain-10.0.0.tgz",
+      "integrity": "sha512-YzPKSAnSzGEJ12IK6CctNLU79T1W15WDrElRQ+1/FsOazGX9ucFPTQwgYe8Dy8jiSEDJKM4wkVa3g4lD2Z+Pnw==",
+      "license": "MIT",
+      "workspaces": [
+        "KeychainExample",
+        "website"
+      ],
+      "engines": {
+        "node": ">=16"
+      }
+    },
     "node_modules/react-native-safe-area-context": {
       "version": "5.6.2",
       "resolved": "https://registry.npmjs.org/react-native-safe-area-context/-/react-native-safe-area-context-5.6.2.tgz",

package.json

@@ -16,6 +16,7 @@
     "react": "19.2.0",
     "react-native": "0.83.1",
     "react-native-biometrics": "^3.0.1",
+    "react-native-keychain": "^10.0.0",
     "react-native-safe-area-context": "^5.5.2"
   },
   "devDependencies": {

src/screen/Managelock.tsx

@@ -0,0 +1,34 @@
+import React, { useEffect, useState } from 'react';
+import { AppState, View, Text } from 'react-native';
+
+const App = () => {
+    const [locked, setLocked] = useState(true);
+    const [pinExists, setPinExists] = useState(false);
+
+    useEffect(() => {
+        isPinSet().then(setPinExists);
+        isAppLocked().then(setLocked);
+
+        const sub = AppState.addEventListener('change', state => {
+            if (state !== 'active') lockApp();
+        });
+
+        return () => sub.remove();
+    }, []);
+
+    if (!pinExists) {
+        return <SetPinScreen onDone={() => setPinExists(true)} />;
+    }
+
+    if (locked) {
+        return <LockScreen onUnlock={() => setLocked(false)} />;
+    }
+
+    return (
+        <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
+            <Text>🔓 App Unlocked (Home Screen)</Text>
+        </View>
+    );
+};
+
+export default App;