Merge branch 'Nutrion_Emotion_UI' into 'master'

commit

See merge request !32

screens/Plan.js

-import React, { useEffect } from 'react';
+import React, { useState ,useEffect } from 'react';
 import { View, Text,TouchableOpacity, StyleSheet, ImageBackground,ScrollView} from 'react-native';
 import { useNavigation } from '@react-navigation/native';
 import { firestore, firebase } from '../config'; // Make sure to import 'firestore' and 'firebase' correctly.
 import AsyncStorage from '@react-native-async-storage/async-storage';
 
+
 export default function Plan({ route }) {
   const { nutritionPlan } = route.params;
   const navigation = useNavigation();
@@ -22,37 +23,46 @@ export default function Plan({ route }) {
       });
   }, []);
 
+ 
   useEffect(() => {
-   
-    savePlanToDatabase();
-  }, []);
+    // When nutritionPlan is available, save it to Firestore
+    if (nutritionPlan) {
+      savePlanToDatabase(nutritionPlan);
+    
+    }
+  }, [nutritionPlan]);
 
-  // Function to save the nutritionPlan to Firestore
- const savePlanToDatabase = (nutritionPlan) => {
- 
-  const data = {
-    email:email,
-    nutritionPlan: nutritionPlan,
+  const savePlanToDatabase = (nutritionPlan) => {
+    const timestamp = firebase.firestore.FieldValue.serverTimestamp();
+    const data = {
+      date: timestamp,
+      email: email,
+      nutritionPlan: nutritionPlan,
+    };
 
-  };
 
-  // Assuming you have a 'nutritionPlans' collection in your database
-  firebase.firestore().collection("nutritionPlans").add(data);
-};
 
+    try {
+      const docRef = firebase.firestore()
+        .collection('nutritionPlans')
+        .add(data);
+        
+    } catch (error) {
+     
+    }
 
-    
+  };
+
+  
   return (
   
        <ScrollView contentContainerStyle={styles.scrollViewContent}>
        <View style={styles.container}>
-       <ImageBackground source={require("../assets/plan1.png")} resizeMode="cover" style={styles.image}>
+       <ImageBackground source={require("../assets/plan2.png")} resizeMode="cover" style={styles.image}>
        <View style={styles.overlay}>
      
-       <View>
       <Text style={styles.nutritionPlan}>{nutritionPlan}</Text>
-      </View>
-    
+     
        {/* Save Plan Button */}
        <TouchableOpacity style={styles.button} onPress={savePlanToDatabase}>
         <Text style={styles.buttonText}>Save Plan</Text>
@@ -67,18 +77,19 @@ export default function Plan({ route }) {
 
 const styles = StyleSheet.create({
   container: {
-    flex: 1,
-    justifyContent: 'center', // Center vertically
-    alignItems: 'center',     // Center horizontally
-  },
+    flex:1,
+    
   
+  },
+
   scrollViewContent: {
-    minHeight: '120%', // Set a minimum height to enable scrolling
+    minHeight: '150%', // Set a minimum height to enable scrolling
   },
 
   image: {
     flex: 1,
     justifyContent: 'center',
+   
   },
   
   overlay: {
@@ -92,13 +103,10 @@ const styles = StyleSheet.create({
     fontWeight: 'bold',
     marginTop: 16,
   },
-
   nutritionPlan: {
     fontSize: 16,
-    marginTop: 8,
-    textAlign: 'center',     // Center the text within the container
+    marginTop: 500,
   },
-
   button: {
     backgroundColor: 'transparent',
     borderWidth: 2,

screens/PreviousPlan.js

-import { ImageBackground, StyleSheet, Text, View, TouchableOpacity } from 'react-native';
-import React, { Component } from 'react'
-
+import { ImageBackground, StyleSheet, Text, View, FlatList } from 'react-native';
+import { firestore, firebase } from '../config'; // Make sure to import 'firestore' and 'firebase' correctly.
+import React, { useState ,useEffect } from 'react';
 
 export default function PreviousPlan () {
 
   
 
-  
+  const [mealPlans, setMealPlans] = useState([]);
+
+  useEffect(() => {
+    // Fetch meal plans from Firestore
+    const fetchMealPlans = async () => {
+      try {
+        const mealPlansSnapshot = await firebase.firestore().collection('nutritionPlans').get();
+        const mealPlanData = mealPlansSnapshot.docs.map(doc => doc.data());
+        setMealPlans(mealPlanData);
+      } catch (error) {
+        console.error('Error fetching meal plans:', error);
+      }
+    };
+
+    fetchMealPlans();
+  }, []);
  
     return (
       <View style={styles.container}>
         <ImageBackground source={require("../assets/plan2.png")} resizeMode="cover" style={styles.image}>
           <View style={styles.overlay}>
-      
-            
+          <View style={styles.nutritionPlan}>
+          <FlatList
+            data={mealPlans}
+            keyExtractor={(item, index) => index.toString()}
+            renderItem={({ item }) => (
+              <View style={styles.mealPlanItem}>
+                <Text style={styles.mealPlanText}>{item.nutritionPlan}</Text>
+              </View>
+            )}
+          />
+           </View>
           </View>
         </ImageBackground>
       </View>
@@ -37,6 +61,10 @@ const styles = StyleSheet.create({
     justifyContent: 'center',
   },
 
+  nutritionPlan: {
+    fontSize: 16,
+    marginTop: 350,
+  },
   
   actionButtons: {