Feat: Improve Import & Export Passwords.

package.json

@@ -21,47 +21,50 @@
   "dependencies": {
     "@passcodes/passalgo": "github:PasscodesApp/PassAlgo#main",
     "@react-native-community/slider": "5.2.0",
-    "@react-native-vector-icons/fontawesome6": "^13.1.2",
+    "@react-native-documents/picker": "^12.0.2",
+    "@react-native-vector-icons/fontawesome6": "^13.1.5",
     "@shopify/flash-list": "2.0.2",
     "babel-plugin-inline-import": "^3.0.0",
-    "drizzle-orm": "^0.45.2",
-    "expo": "~57.0.26",
+    "drizzle-orm": "^0.45.4",
+    "expo": "~57.0.30",
     "expo-build-properties": "~57.0.22",
     "expo-clipboard": "~57.0.2",
     "expo-constants": "~57.0.3",
-    "expo-dev-client": "~57.0.19",
+    "expo-dev-client": "~57.0.20",
     "expo-file-system": "~57.0.0",
     "expo-linear-gradient": "~57.0.2",
-    "expo-linking": "~57.0.11",
+    "expo-linking": "~57.0.13",
     "expo-local-authentication": "~57.0.3",
     "expo-navigation-bar": "~57.0.3",
-    "expo-router": "~57.0.24",
-    "expo-screen-capture": "~57.0.3",
-    "expo-screen-orientation": "~57.0.2",
-    "expo-sharing": "~57.0.22",
-    "expo-splash-screen": "~57.0.9",
-    "expo-sqlite": "~57.0.3",
+    "expo-router": "~57.0.28",
+    "expo-screen-capture": "~57.0.4",
+    "expo-screen-orientation": "~57.0.3",
+    "expo-sharing": "~57.0.23",
+    "expo-splash-screen": "~57.0.10",
+    "expo-sqlite": "~57.0.4",
     "expo-status-bar": "~57.0.1",
     "expo-system-ui": "~57.0.4",
+    "papaparse": "^5.7.0",
     "react": "19.2.3",
     "react-dom": "19.2.3",
     "react-native": "0.86.3",
     "react-native-paper": "^5.15.3",
-    "react-native-quick-crypto": "^1.1.7",
+    "react-native-quick-crypto": "^1.1.8",
     "react-native-reanimated": "4.5.1",
     "react-native-safe-area-context": "~5.7.0",
     "react-native-screens": "~4.26.0",
     "react-native-web": "~0.21.0",
     "react-native-worklets": "0.10.1"
   },
   "devDependencies": {
+    "@types/papaparse": "^5.5.2",
     "@types/react": "~19.2.10",
     "babel-preset-expo": "~57.0.0",
-    "drizzle-kit": "^0.31.10",
+    "drizzle-kit": "^0.31.11",
     "eslint": "^9.39.5",
     "eslint-config-expo": "~57.0.2",
-    "expo-atlas": "^0.4.0",
-    "expo-doctor": "^1.20.1",
+    "expo-atlas": "^0.5.0",
+    "expo-doctor": "^1.20.4",
     "tsx": "^4.23.1",
     "typescript": "~6.0.3"
   },

src/app/(tabs)/(settings)/_layout.tsx

@@ -4,6 +4,21 @@ export default function SettingsLayout() {
   return (
     <Stack screenOptions={{ headerShown: false }}>
       <Stack.Screen name="settings"></Stack.Screen>
+
+      <Stack.Screen
+        name="import-passwords"
+        options={{ title: "Import passwords", headerShown: true }}
+      />
+
+      <Stack.Screen
+        name="import-review"
+        options={{ title: "Review duplicates", headerShown: true }}
+      />
+
+      <Stack.Screen
+        name="export-passwords"
+        options={{ title: "Export passwords", headerShown: true }}
+      />
     </Stack>
   );
 }

src/app/(tabs)/(settings)/export-passwords.tsx

@@ -0,0 +1,10 @@
+import { ExportScreenContent } from "@/features/import-export";
+import { SafeAreaView } from "react-native-safe-area-context";
+
+export default function ExportPasswordsScreen() {
+  return (
+    <SafeAreaView style={{ flex: 1 }} edges={["left", "right", "bottom"]}>
+      <ExportScreenContent />
+    </SafeAreaView>
+  );
+}

src/app/(tabs)/(settings)/import-passwords.tsx

@@ -0,0 +1,10 @@
+import { ImportScreenContent } from "@/features/import-export";
+import { SafeAreaView } from "react-native-safe-area-context";
+
+export default function ImportPasswordsScreen() {
+  return (
+    <SafeAreaView style={{ flex: 1 }} edges={["left", "right", "bottom"]}>
+      <ImportScreenContent />
+    </SafeAreaView>
+  );
+}

src/app/(tabs)/(settings)/import-review.tsx

@@ -0,0 +1,10 @@
+import { ImportReviewScreenContent } from "@/features/import-export";
+import { SafeAreaView } from "react-native-safe-area-context";
+
+export default function ImportReviewScreen() {
+  return (
+    <SafeAreaView style={{ flex: 1 }} edges={["left", "right", "bottom"]}>
+      <ImportReviewScreenContent />
+    </SafeAreaView>
+  );
+}

src/app/(tabs)/(settings)/settings.tsx

@@ -5,17 +5,7 @@ import Config from "@/config";
 import {
   isBiometricsAuthEnabled,
   toggleBiometricsFeature,
-  unlockWithBiometricsApp,
 } from "@/libs/biometric";
-import {
-  getGooglePasswordsCSVContent,
-  type PasswordCSVFormat,
-  sharePasswordAsCSV,
-} from "@/libs/exporting";
-import {
-  convertRawCSVToPasswords,
-  getCSVPasswordString,
-} from "@/libs/importing";
 import {
   setHomeLayout,
   useHomeLayout,
@@ -27,8 +17,9 @@ import {
 } from "@/libs/screenshot_prevention";
 import { FontAwesome6 } from "@react-native-vector-icons/fontawesome6";
 import { LinearGradient } from "expo-linear-gradient";
+import { router } from "expo-router";
 import { useState } from "react";
-import { Alert, ScrollView } from "react-native";
+import { ScrollView } from "react-native";
 import {
   Card,
   Divider,
@@ -39,7 +30,6 @@ import {
 } from "react-native-paper";
 import { SafeAreaView } from "react-native-safe-area-context";
 
-import { usePasswordRepository } from "@/contexts/RepositoryContext";
 import PasscodesAutofillServiceModule from "../../../../modules/passcodes-autofill-service/src/PasscodesAutofillServiceModule";
 
 export default function SettingsScreen() {
@@ -61,21 +51,6 @@ export default function SettingsScreen() {
   const homeLayout = useHomeLayout();
 
   const theme = useTheme();
-  const passwordRepository = usePasswordRepository();
-
-  async function handleImportPasswords() {
-    let content = await getCSVPasswordString();
-    let importPasswordList: PasswordCSVFormat[] =
-      convertRawCSVToPasswords(content);
-    await passwordRepository.importAll(importPasswordList);
-  }
-
-  async function handleExportPasswords() {
-    const result: PasswordCSVFormat[] = await passwordRepository.getAll();
-
-    let content = await getGooglePasswordsCSVContent(result);
-    sharePasswordAsCSV(content);
-  }
 
   return (
     <SafeAreaView style={{ flex: 1, paddingVertical: 12 }}>
@@ -183,7 +158,7 @@ export default function SettingsScreen() {
           <List.Section style={{ margin: 15 }}>
             <List.Item
               title="Import passwords"
-              description="Import a Google Password CSV"
+              description="From a Google Password CSV or a Passcodes backup"
               left={(props) => (
                 <FontAwesome6
                   {...props}
@@ -200,14 +175,14 @@ export default function SettingsScreen() {
                   size={20}
                 />
               )}
-              onPress={handleImportPasswords}
+              onPress={() => router.navigate("/import-passwords")}
             />
 
             <Divider />
 
             <List.Item
               title="Export passwords"
-              description="Share as Google Password CSV"
+              description="As a Google Password CSV or a Passcodes backup"
               left={(props) => (
                 <FontAwesome6
                   {...props}
@@ -224,18 +199,7 @@ export default function SettingsScreen() {
                   size={20}
                 />
               )}
-              onPress={async () => {
-                const result = await unlockWithBiometricsApp();
-
-                if (result) {
-                  handleExportPasswords();
-                } else {
-                  Alert.alert(
-                    "Authentication Failed",
-                    "Exporting passwords is protected by App Lock.",
-                  );
-                }
-              }}
+              onPress={() => router.navigate("/export-passwords")}
             />
           </List.Section>
         </Card>

src/config.ts

@@ -5,12 +5,12 @@ const config = {
   // Main Config
   // ----------------------
   APP_NAME: "Passcodes",
-  VERSION: "v4.0.0 - RC.2",
+  VERSION: "v4.0.0 - RC.3",
 
   // ----------------------
   // Build Config
   // ----------------------
-  BUILD_VERSION: "v4.0.0-RC.2", // same as VERSION, just without spaces.
+  BUILD_VERSION: "v4.0.0-RC.3", // same as VERSION, just without spaces.
   BUILD_ANDROID_VERSIONCODE: 10,
   BUILD_IOS_VERSIONCODE: "1.0.0",
 

src/db/provider.tsx

@@ -181,8 +181,8 @@ function DrizzleDatabaseError({ error }: { error: unknown }) {
             textAlign: "center",
           }}
         >
-          Passcodes couldn't prepare its local database. Please close and reopen
-          the app.
+          Passcodes couldn't prepare its local database. Please close and
+          reopen the app.
         </Text>
       </View>
     </SafeAreaView>