Add CameraPreviewManager and CameraPreviewView for camera functionality

App.tsx

@@ -1,3 +1,4 @@
+import React, { useEffect, useState } from 'react';
 import {
   StatusBar,
   useColorScheme,
@@ -11,7 +12,6 @@ import {
   ScrollView,
 } from 'react-native';
 import { SafeAreaProvider } from 'react-native-safe-area-context';
-import { useState, useEffect } from 'react';
 
 import Login from './src/components/Login';
 import Register from './src/components/Register';
@@ -21,9 +21,10 @@ import { ScannerScreen } from './src/screens/ScannerScreen';
 
 type Screen = 'login' | 'register' | 'home' | 'scanner';
 
-const { MyNativeModule } = NativeModules;
+// ✅ Correct native module
+const { ICameraSDK } = NativeModules;
 
-function App() {
+function App(): JSX.Element {
   const isDarkMode = useColorScheme() === 'dark';
 
   const [currentScreen, setCurrentScreen] = useState<Screen>('login');
@@ -38,10 +39,10 @@ function App() {
   useEffect(() => {
     initializeApp();
 
-    console.log('MyNativeModule:', MyNativeModule);
-    MyNativeModule?.greet?.('John').then((msg: any) => {
-      console.log(msg);
-    });
+    console.log('ICameraSDK:', ICameraSDK);
+    ICameraSDK?.greet?.('John')
+      .then((msg: string) => console.log(msg))
+      .catch(console.error);
 
     const unsubscribe = networkService.addListener(networkState => {
       setIsOnline(networkState.isConnected);
@@ -53,15 +54,14 @@ function App() {
   const initializeApp = async () => {
     try {
       await authAPI.initialize();
-
-      const isLoggedIn = await authAPI.isLoggedIn();
-      if (isLoggedIn) {
+      const loggedIn = await authAPI.isLoggedIn();
+      if (loggedIn) {
         const user = await authAPI.getCurrentUser();
         setCurrentUser(user);
         setCurrentScreen('home');
       }
-    } catch (error) {
-      console.error('Initialization error:', error);
+    } catch (e) {
+      console.error(e);
     } finally {
       setIsInitialized(true);
     }
@@ -93,7 +93,6 @@ function App() {
   const handleLogout = async () => {
     try {
       await authAPI.logout();
-      setQrCode(null);
       navigateToLogin();
       Alert.alert('Success', 'Logged out successfully');
     } catch {
@@ -101,35 +100,20 @@ function App() {
     }
   };
 
-  const showAppStatus = async () => {
-    try {
-      const status = await authAPI.getAppStatus();
-      Alert.alert(
-        'App Status',
-        `Network: ${status.network.isOnline ? 'Online' : 'Offline'}
-Users: ${status.storage.totalUsers}
-Current User: ${status.authentication.currentUser || 'None'}
-Logged In: ${status.authentication.isLoggedIn ? 'Yes' : 'No'}`
-      );
-    } catch {
-      Alert.alert('Error', 'Failed to get app status');
-    }
-  };
-
   const generateQRCode = async () => {
-    if (!currentUser?.email) {
-      Alert.alert('Error', 'No user email available');
+    if (!currentUser?.email || !ICameraSDK) {
+      Alert.alert('Error', 'Native QR module not available');
       return;
     }
 
     setIsGeneratingQR(true);
     try {
       const qrData = `User: ${currentUser.fullName}\nEmail: ${currentUser.email}`;
-      const base64Image = await MyNativeModule.generateQRCode(qrData, 300, 300);
-      setQrCode(base64Image);
-    } catch (error) {
-      console.error(error);
-      Alert.alert('Error', 'Failed to generate QR code');
+      const base64 = await ICameraSDK.generateQRCode(qrData, 300, 300);
+      setQrCode(base64);
+    } catch (e) {
+      console.error(e);
+      Alert.alert('Error', 'QR generation failed');
     } finally {
       setIsGeneratingQR(false);
     }
@@ -146,7 +130,7 @@ Logged In: ${status.authentication.isLoggedIn ? 'Yes' : 'No'}`
     ]);
 
     Alert.alert(
-      'Scanned Successfully',
+      'Scanned',
       `Code: ${result.code}\nFormat: ${result.format}`,
       [{ text: 'OK', onPress: () => setCurrentScreen('home') }]
     );
@@ -181,50 +165,46 @@ Logged In: ${status.authentication.isLoggedIn ? 'Yes' : 'No'}`
 
       case 'home':
         return (
-          <ScrollView style={styles.homeContainer} contentContainerStyle={styles.scrollContent}>
+          <ScrollView
+            style={styles.homeContainer}
+            contentContainerStyle={styles.scrollContent}
+          >
             <Text style={styles.welcomeText}>
               Welcome, {currentUser?.fullName || 'User'}
             </Text>
 
-            {qrCode && (
-              <Image source={{ uri: qrCode }} style={styles.qrImage} />
-            )}
+            {qrCode && <Image source={{ uri: qrCode }} style={styles.qrImage} />}
 
-            <TouchableOpacity style={styles.scannerButton} onPress={openScanner}>
+            <TouchableOpacity style={styles.button} onPress={openScanner}>
               <Text style={styles.buttonText}>Scan QR / Barcode</Text>
             </TouchableOpacity>
 
             <TouchableOpacity
-              style={styles.qrButton}
+              style={[styles.button, styles.qrButton]}
               onPress={generateQRCode}
               disabled={isGeneratingQR}
             >
               <Text style={styles.buttonText}>
-                {isGeneratingQR ? 'Generating...' : 'Generate QR Code'}
+                {isGeneratingQR ? 'Generating...' : 'Generate QR'}
               </Text>
             </TouchableOpacity>
 
-            <TouchableOpacity style={styles.statusButton} onPress={showAppStatus}>
-              <Text style={styles.buttonText}>App Status</Text>
-            </TouchableOpacity>
-
-            <TouchableOpacity style={styles.logoutButton} onPress={handleLogout}>
+            <TouchableOpacity
+              style={[styles.button, styles.logoutButton]}
+              onPress={handleLogout}
+            >
               <Text style={styles.buttonText}>Logout</Text>
             </TouchableOpacity>
           </ScrollView>
         );
-
-      default:
-        return null;
     }
   };
 
-  /* -------------------- LOADING -------------------- */
   if (!isInitialized) {
     return (
       <SafeAreaProvider>
-        <View style={styles.loadingContainer}>
-          <Text style={styles.loadingText}>Initializing...</Text>
+        <View style={styles.loading}>
+          <Text>Initializing...</Text>
         </View>
       </SafeAreaProvider>
     );
@@ -238,18 +218,25 @@ Logged In: ${status.authentication.isLoggedIn ? 'Yes' : 'No'}`
   );
 }
 
+export default App;
+
+/* -------------------- STYLES -------------------- */
+
 const styles = StyleSheet.create({
-  loadingContainer: { flex: 1, justifyContent: 'center', alignItems: 'center' },
-  loadingText: { fontSize: 18, fontWeight: '600' },
+  loading: { flex: 1, justifyContent: 'center', alignItems: 'center' },
   homeContainer: { flex: 1 },
   scrollContent: { alignItems: 'center', padding: 20 },
   welcomeText: { fontSize: 24, fontWeight: '700', marginBottom: 20 },
   qrImage: { width: 300, height: 300, marginBottom: 20 },
-  scannerButton: { backgroundColor: '#9333ea', padding: 14, borderRadius: 20, marginBottom: 10 },
-  qrButton: { backgroundColor: '#10b981', padding: 14, borderRadius: 20, marginBottom: 10 },
-  statusButton: { backgroundColor: '#3bb6d8', padding: 14, borderRadius: 20, marginBottom: 10 },
-  logoutButton: { backgroundColor: '#ff6b6b', padding: 14, borderRadius: 20 },
+  button: {
+    backgroundColor: '#6366f1',
+    padding: 14,
+    borderRadius: 18,
+    marginBottom: 12,
+    minWidth: 220,
+    alignItems: 'center',
+  },
+  qrButton: { backgroundColor: '#10b981' },
+  logoutButton: { backgroundColor: '#ef4444' },
   buttonText: { color: '#fff', fontWeight: '600' },
 });
-
-export default App;