Changes

StressPrediction/config.js

 import firebase from 'firebase/compat/app';
-import { getDatabase } from 'firebase/database';
+import { getDatabase, ref, onValue } from 'firebase/database';
 
 const firebaseConfig = {
   apiKey: "AIzaSyCr8EgrdjVYrI936R0MY2xTdNvLW9d_IVc",
@@ -10,7 +10,7 @@ const firebaseConfig = {
   messagingSenderId: "953444486465",
   appId: "1:953444486465:web:68681174589c1d1c54e5c0",
   measurementId: "G-SDEQKTS8D4"
-  }
+}
 
 if (firebase.apps.length === 0){
     firebase.initializeApp(firebaseConfig);

StressPrediction/src/FetchData.js

+import React, { useState, useEffect } from 'react';
+import { Text, View, StyleSheet } from 'react-native'; 
+import { db } from '../config'; 
+import { ref, get } from 'firebase/database';
+
+const NotificationsComponent = () => {
+  const [notification, setNotification] = useState(null);
+
+  useEffect(() => {
+    const retrieveNotification = async () => {
+      try {
+        const notificationRef = ref(db, 'notification');
+        const snapshot = await get(notificationRef);
+        
+        if (snapshot.exists()) {
+          const notificationData = snapshot.val();
+          setNotification(notificationData);
+        } else {
+          console.log("No notification found.");
+        }
+      } catch (error) {
+        console.error('Error retrieving notification:', error);
+      }
+    };
+
+    retrieveNotification();
+  }, []);
+
+  return (
+    <View>
+      <Text style={styles.notificationText}></Text>
+      {notification && (
+        <View>
+          {notification.message && (
+            <Text style={styles.notificationMessage}>
+              {notification.message === "Stress Level Detected" 
+                ? "Your Health Level Detected: You are in Stress Level ... 🙁"
+                : "Congratulations! You Are Healthy 🙁"
+              }
+            </Text>
+          )}
+          {notification.isTrue !== undefined && (
+            <Text>Is True: {notification.isTrue ? 'Yes' : 'No'}</Text>
+          )}
+        </View>
+      )}
+    </View>
+  );
+};
+
+const styles = StyleSheet.create({
+  notificationMessage: {
+    color: 'white', 
+    fontSize: 20,
+    fontWeight: 'bold', 
+  },
+});
+
+export default NotificationsComponent;

StressPrediction/src/newJournalEntry.js

 import React, { useState } from 'react';
-import { View, Text, StyleSheet, TextInput, Button, Image, Modal, TouchableOpacity, ScrollView } from 'react-native';
-import { db } from '../config';
+import { View, Text, StyleSheet, TextInput, Button, Image, Modal, TouchableOpacity, ScrollView, ImageBackground } from 'react-native';
+import { db, onValue, off } from '../config';
 import { ref, set } from 'firebase/database';
+import NotificationsComponent  from '../src/FetchData';
 
 const AddData = () => {
     const [Job_Satisfaction, setJobSatisfaction] = useState('');
@@ -17,49 +18,53 @@ const AddData = () => {
         const jobSatisfactionValue = Job_Satisfaction === 'Yes' ? 0 : 1;
         let sleepHoursValue = parseInt(selectedHours);
     
-        // Applying the logic to set sleep hours value
         if (!isNaN(sleepHoursValue)) {
             sleepHoursValue = sleepHoursValue > 8 ? 0 : 1;
         } else {
             console.error("Invalid input for Sleep Hours. Please enter a valid number.");
-            return; // Exit the function if sleep hours is invalid
+            return; 
         }
     
         const postData = {
             Job_Satisfaction: jobSatisfactionValue,
             Sleep_Hours: sleepHoursValue,
             Text: Additional_Text,
-            isNew: true // Set isNew to true initially
+            isNew: true 
         };
     
         set(ref(db, 'live_data'), postData)
             .then(() => {
                 console.log("Data updated successfully");
-                // After some time or event, update isNew to false
                 setTimeout(() => {
                     set(ref(db, 'live_data/isNew'), false);
-                }, 5000); // Example: Set isNew to false after 5 seconds
+                }, 5000); 
             })
             .catch(error => {
                 console.error("Error updating data:", error);
             });
     
-        setModalVisible(false); // Close the modal after updating data
+        setModalVisible(false); 
     };
     
     return (
         <View style={styles.container}>
-            <Text style={styles.header}>STRESS TRACKER</Text>
-            <TouchableOpacity onPress={() => setModalVisible(true)}>
             <Image
-                    source={require('../images/Home.jpg')}
-                    style={styles.image}
-                />
+                source={require('../images/Background.png')}
+                style={styles.backgroundImage}
+            ></Image>
+            <View style={styles.notificationsContainer}>
+                <NotificationsComponent />
+            </View>
+            <TouchableOpacity onPress={() => setModalVisible(true)}>
             </TouchableOpacity>
-            <Button
-                title="Open Popup"
+
+            <TouchableOpacity
+                style={styles.openPopupButton}
                 onPress={() => setModalVisible(true)}
-            />
+            >
+                <Text style={styles.openPopupButtonText}>+</Text>
+            </TouchableOpacity>
+
             <Modal
                 animationType="slide"
                 transparent={true}
@@ -148,7 +153,26 @@ export default AddData;
 const styles = StyleSheet.create({
     container: {
         flex: 1,
-        backgroundColor: '#fff',
+        backgroundColor: 'white',
+    },
+    backgroundImage:{
+
+    },
+    openPopupButton: {
+        position:'absolute',
+        top: 300,
+        left:130,
+        backgroundColor: '#ff2c2c',
+        padding: 5,
+        borderRadius: 50,
+        margin: 10,
+        height:80,
+        width:80,
+    }, 
+    openPopupButtonText: {
+        color: '#ffffff',
+        fontSize: 45,
+        textAlign: 'center',
     },
     header: {
         fontSize: 40,
@@ -343,4 +367,11 @@ const styles = StyleSheet.create({
         fontWeight: 'bold',
         display: 'none',
     },
+    notificationsContainer: {
+        position: 'absolute',
+        top: 120,
+        left: 80,
+        right: 0,
+        zIndex: 1, 
+      },
 });