Added new UI

App.js

@@ -21,6 +21,9 @@ import BmiCalculator from "./screens/BmiCalculator";
 import BmiRecords from "./screens/BmiRecords";
 import BloodReportCapture from "./screens/BloodReportCapture";
 import Plan from "./screens/Plan";
+import UserProfile from "./screens/UserProfile";
+import MedHome from "./screens/MedHome";
+import MyMed from "./screens/MyMed";
 
 const Stack = createStackNavigator()
 const Tab = createBottomTabNavigator();
@@ -52,6 +55,9 @@ export default function App() {
 
        <Stack.Screen name="Signup" component={Signup} />
        <Stack.Screen name="Signin" component={Signin} />
+       <Stack.Screen name="UserProfile" component={UserProfile} />
+       <Stack.Screen name="MedHome" component={MedHome} />
+       <Stack.Screen name="MyMed" component={MyMed} />
 
       </Stack.Navigator>
 

screens/CapturePrescription.js

@@ -59,54 +59,42 @@ const Prescription = () => {
   const extractTextFromImage = async () => {
     if (image) {
       setLoading(true);
-      const apiUrl = 'http://192.168.8.100:5000/extract'; // Replace with your Flask server URL
-
+      const apiUrl = 'http://192.168.1.100:5000/extract'; // Replace with your Flask server URL
+  
       const formData = new FormData();
       formData.append('image', {
         uri: image,
-        type: 'image/jpeg',
+        type: 'image/jpeg', // or 'image/png' based on the actual image type
         name: 'image.jpg',
       });
-
+  
       try {
         const response = await axios.post(apiUrl, formData, {
           headers: {
             'Content-Type': 'multipart/form-data',
           },
         });
-
+  
         // Check if the response contains the expected structure
         if (response.data && Array.isArray(response.data.extracted_medicines)) {
           const { extracted_medicines } = response.data;
           setExtractedMedicineData(extracted_medicines);
-          
-          // Fetch the existing data from Firestore
-        const userDetailsRef = firebase.firestore().collection("userDetails").doc(email);
-        const userDetailsSnapshot = await userDetailsRef.get();
-        const existingData = userDetailsSnapshot.data();
-
-        // Update existing records and add new records
-        const updatedData = existingData?.extractedMedicines || [];
-        
-        for (const newMedicine of extracted_medicines) {
-          const index = updatedData.findIndex(
-            (record) => record.medicine_name === newMedicine.medicine_name
-          );
-
-          if (index !== -1) {
-            // If a medicine with the same name exists, replace it
-            updatedData[index] = newMedicine;
-          } else {
-            // If not, add a new record
-            updatedData.push(newMedicine);
-          }
-        }
-
-        // Update the Firestore document with the updated data
-        await userDetailsRef.set({ extractedMedicines: updatedData });
-        
-        console.log("Data saved to Firestore");
-
+  
+          const db = firebase.firestore(); // Get Firestore instance
+  
+          // Loop through extracted medicines and save data to Firestore
+          extracted_medicines.forEach(async (medicine) => {
+            try {
+              await db.collection('userDetails').add({
+                email,
+                medicine_name: medicine.medicine_name,
+                dosages: medicine.dosages.join(', '), // Convert dosages array to a comma-separated string
+                side_effects: medicine.side_effects,
+              });
+            } catch (error) {
+              console.error('Error saving data to Firestore:', error);
+            }
+          });
         } else {
           console.error('Invalid response format from Flask server.');
         }
@@ -118,6 +106,7 @@ const Prescription = () => {
     }
   };
   
+  
 
   return (<ScrollView contentContainerStyle={styles.container}>
     <View style={styles.imageContainer}>

screens/MedHome.js

+import React from 'react';
+import { View, Text, Button, StyleSheet } from 'react-native';
+
+const MedHome = ({ navigation }) => {
+  return (
+    <View style={styles.container}>
+      <Text style={styles.title}>My Health App</Text>
+      <Button
+        title="Extract Medicine Names"
+        onPress={() => navigation.navigate('Prescription')}
+      />
+      <Button
+        title="My Med Records"
+        onPress={() => navigation.navigate('MyMed')}
+      />
+    </View>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+  title: {
+    fontSize: 24,
+    marginBottom: 20,
+  },
+});
+
+export default MedHome;

screens/MyMed.js

+import React, { useState, useEffect } from 'react';
+import { View, Text, FlatList, StyleSheet } from 'react-native';
+import { firebase } from '../config';
+import AsyncStorage from '@react-native-async-storage/async-storage';
+
+const MyMed = ({ route }) => {
+  const [userDetails, setUserDetails] = useState([]);
+  const [email, setEmail] = useState('');
+
+  useEffect(() => {
+    // Retrieve the email from local storage
+    AsyncStorage.getItem('userEmail')
+      .then(result => {
+        if (result) {
+          setEmail(result);
+        }
+      })
+      .catch(error => {
+        console.error('Error retrieving email from local storage:', error);
+      });
+  }, []);
+
+  useEffect(() => {
+    const db = firebase.firestore();
+    const userDetailsRef = db.collection('userDetails');
+
+    // Fetch user details based on the email
+    userDetailsRef
+      .where('email', '==', email)
+      .get()
+      .then((querySnapshot) => {
+        const data = [];
+        querySnapshot.forEach((doc) => {
+          data.push(doc.data());
+        });
+        setUserDetails(data);
+      })
+      .catch((error) => {
+        console.error('Error fetching user details:', error);
+      });
+  }, [email]);
+
+  return (
+    <View style={styles.container}>
+      <Text style={styles.title}>User Details for {email}</Text>
+      <FlatList
+        data={userDetails}
+        keyExtractor={(item) => item.id}
+        renderItem={({ item }) => (
+          <View style={styles.itemContainer}>
+            <Text>Medicine Name: {item.medicine_name}</Text>
+            <Text>Dosages: {item.dosages}</Text>
+            <Text>Side Effects: {item.side_effects}</Text>
+          </View>
+        )}
+      />
+    </View>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    padding: 16,
+  },
+  title: {
+    fontSize: 24,
+    marginBottom: 16,
+  },
+  itemContainer: {
+    marginBottom: 16,
+  },
+});
+
+export default MyMed;

screens/Sidebar.js

@@ -9,9 +9,9 @@ const Sidebar = () => {
   const handleTabPress = (tabIndex) => {
     setActiveTab(tabIndex);
     if (tabIndex === 0) {
-        navigation.navigate("Profile"); 
+        navigation.navigate("UserProfile"); 
       }if (tabIndex === 1){
-        navigation.navigate("Prescription"); 
+        navigation.navigate("MedHome"); 
       }if (tabIndex === 2){
         navigation.navigate("WelcomeScreen"); 
       }if (tabIndex === 3){

screens/UserProfile.js

+import React, { useState, useEffect } from 'react';
+import { View, Text, Button, StyleSheet, ScrollView } from 'react-native';
+import { useNavigation } from '@react-navigation/native';
+import { firebase } from "../config";
+import AsyncStorage from '@react-native-async-storage/async-storage';
+
+const UserProfile = () => {
+  const navigation = useNavigation();
+  const [userName, setUserName] = useState('');
+  const [email, setEmail] = useState('');
+  const [phone, setPhone] = useState('');
+
+  useEffect(() => {
+    // Retrieve the email from local storage
+    AsyncStorage.getItem('userEmail')
+      .then(result => {
+        if (result) {
+          setEmail(result);
+        }
+      })
+      .catch(error => {
+        console.error('Error retrieving email from local storage:', error);
+      });
+  }, []);
+
+  useEffect(() => {
+    // Replace 'user_email@example.com' with the actual email you want to search for
+    const userEmail = email;
+
+    // Fetch the user data from Firebase Firestore based on email
+    const userCollection = firebase.firestore().collection("users");
+    const query = userCollection.where("email", "==", userEmail).limit(1);
+
+    query.get()
+      .then((querySnapshot) => {
+        if (!querySnapshot.empty) {
+          const userData = querySnapshot.docs[0].data();
+          setUserName(userData.userName);
+          setEmail(userData.email);
+          setPhone(userData.phone);
+        }
+      })
+      .catch(error => {
+        console.error('Error fetching user data:', error);
+      });
+  }, []);
+
+  return (
+    <View style={styles.body}>
+      <ScrollView>
+        <Text style={styles.pageTitle}>User Profile</Text>
+        <View style={styles.container}>
+          <Text>User Name: {userName}</Text>
+        </View>
+        <View style={styles.container}>
+          <Text>Email: {email}</Text>
+        </View>
+        <View style={styles.container}>
+          <Text>Phone Number: {phone}</Text>
+        </View>
+      </ScrollView>
+    </View>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: {
+    backgroundColor: "#e5e5e5",
+    padding: 15,
+    borderRadius: 15,
+    margin: 5,
+    marginHorizontal: 10,
+    flexDirection: "row",
+    alignItems: "center",
+  },
+  input: {
+    borderWidth: 1,
+    borderColor: 'gray',
+    padding: 10,
+    marginBottom: 20,
+  },
+  body: {
+    flex: 1,
+    backgroundColor: "#ffffff",
+  },
+  pageTitle: {
+    fontSize: 35,
+    paddingTop: 50,
+    paddingLeft: 150,
+    color: "#633974",
+    fontWeight: 'bold',
+  },
+});
+
+export default UserProfile;