Initial app

.gitignore

+node_modules/
+.expo/
+dist/
+npm-debug.*
+*.jks
+*.p8
+*.p12
+*.key
+*.mobileprovision
+*.orig.*
+web-build/
+
+# macOS
+.DS_Store
+
+# Temporary files created by Metro to check the health of the file watcher
+.metro-health-check*

App.js

+import { NavigationContainer } from "@react-navigation/native"
+import { createStackNavigator } from "@react-navigation/stack"
+import { StatusBar } from 'expo-status-bar';
+import { StyleSheet, Text, View } from 'react-native';
+
+
+import Tabs from "./navigation/Tabs";
+import UsImage from "./screens/CaptureImage";
+import Prescription from "./screens/CapturePrescription";
+import Sidebar from "./screens/Sidebar";
+import Nutrition from "./screens/Nutrition"
+import ChatWelcomeScreen from "./screens/Chat";
+import Notification from "./screens/Notification";
+
+const Stack = createStackNavigator()
+
+export default function App() {
+  return (
+    
+      <NavigationContainer>
+      <Stack.Navigator       
+        screenOptions={{ headerShown: false }}
+       >
+       <Stack.Screen name="Tabs" component={Tabs} />
+    
+       <Stack.Screen name="Nutrition" component={Nutrition} />
+       <Stack.Screen name="UsImage" component={UsImage} />
+       <Stack.Screen name="Prescription" component={Prescription} />
+       <Stack.Screen name="Sidebar" component={Sidebar} />
+       <Stack.Screen name="Chat" component={ChatWelcomeScreen} />
+       <Stack.Screen name="Notification" component={Notification} />
+
+      </Stack.Navigator>
+
+      </NavigationContainer>
+    
+    
+  
+
+
+
+  );
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    backgroundColor: '#fff',
+    alignItems: 'center',
+    justifyContent: 'center',
+  },
+});

app.json

+{
+  "expo": {
+    "name": "babybump",
+    "slug": "babybump",
+    "version": "1.0.0",
+    "orientation": "portrait",
+    "icon": "./assets/icon.png",
+    "userInterfaceStyle": "light",
+    "splash": {
+      "image": "./assets/splash.png",
+      "resizeMode": "contain",
+      "backgroundColor": "#ffffff"
+    },
+    "assetBundlePatterns": [
+      "**/*"
+    ],
+    "ios": {
+      "supportsTablet": true
+    },
+    "android": {
+      "adaptiveIcon": {
+        "foregroundImage": "./assets/adaptive-icon.png",
+        "backgroundColor": "#ffffff"
+      }
+    },
+    "web": {
+      "favicon": "./assets/favicon.png"
+    }
+  }
+}

babel.config.js

+module.exports = function(api) {
+  api.cache(true);
+  return {
+    presets: ['babel-preset-expo'],
+  };
+};

config.js

+import firebase from 'firebase/compat/app'
+import 'firebase/compat/auth'
+import 'firebase/compat/firestore'
+import 'firebase/compat/storage'
+
+const firebaseConfig = {
+  apiKey: "AIzaSyCGbJX8wj_uzrIK1Qq78YoOF0rGP3qso_o",
+  authDomain: "baby-bump-6e4e1.firebaseapp.com",
+  projectId: "baby-bump-6e4e1",
+  storageBucket: "baby-bump-6e4e1.appspot.com",
+  messagingSenderId: "659969248323",
+  appId: "1:659969248323:web:0dab122db2ea4ba07ed8f6",
+  measurementId: "G-QTFCZ25XTB"
+};
+
+  if(!firebase.apps.length){
+    firebase.initializeApp(firebaseConfig);
+  }
+
+  export {firebase};
\ No newline at end of file

navigation/Tabs.js

+import { createBottomTabNavigator } from "@react-navigation/bottom-tabs"
+import { StyleSheet, View, Text, Image } from "react-native"
+
+import Home from "../screens/Home"
+import Nutrition from "../screens/Nutrition"
+import UsImage from "../screens/CaptureImage"
+import Prescription from "../screens/CapturePrescription"
+import Sidebar from "../screens/Sidebar"
+import Notification from "../screens/Notification"
+const Tab = createBottomTabNavigator();
+
+const tabs = [
+  {
+    name: "Home",
+    component: Home,
+    source: require("../assets/home-icon.png"),
+    label: "HOME",
+  },
+  {
+    name: "Notification",
+    component: Notification,
+    source: require("../assets/event-icon.png"),
+    label: "Notification",
+  },
+  {
+    name: "More",
+    component: Sidebar,
+    source: require("../assets/tips-icon.png"),
+    label: "More",
+  },
+
+  
+];
+
+const Tabs = () => {
+  return (
+    <Tab.Navigator
+      tabBarOptions={{
+        showLabel: false,
+        style: {
+          position: "absolute",
+          bottom: 30,
+          left: 20,
+          right: 20,
+          elevation: 0,
+          backgroundColor: "white",
+          borderRadius: 15,
+          height: 90,
+          ...style.shadow,
+        },
+      }}
+    >
+      {tabs.map(({ name, component: Component, source, label }) => (
+        <Tab.Screen
+          key={name}
+          name={name}
+          component={Component}
+          options={{
+            tabBarIcon: ({ focused }) => (
+              <View
+                style={{
+                  alignItems: "center",
+                  justifyContent: "center",
+                  top: 2,
+                }}
+              >
+                <Image
+                source={source}
+                  resizeMode="contain"
+                  style={{
+                    width: 25,
+                    height: 25,
+                    tintColor: focused ? "pink" : "black",
+                  }}
+                />
+                <Text
+                  style={{
+                    color: focused ? "pink" : "black",
+                    fontSize: 12,
+                  }}
+                >
+                  {label}
+                </Text>
+              </View>
+            ),
+          }}
+        />
+      ))}
+    </Tab.Navigator>
+  );
+};
+
+const style = StyleSheet.create({
+  shadow: {
+    shadowColor: "#7F5DF0",
+    shadowOffset: {
+      width: 0,
+      height: 10,
+    },
+    shadowOpacity: 0.25,
+    shadowRadius: 3.5,
+    elevation: 5, //works on ios
+  },
+});
+
+export default Tabs;

package.json

+{
+  "name": "babybump",
+  "version": "1.0.0",
+  "main": "node_modules/expo/AppEntry.js",
+  "scripts": {
+    "start": "expo start",
+    "android": "expo start --android",
+    "ios": "expo start --ios",
+    "web": "expo start --web"
+  },
+  "dependencies": {
+    "@expo/vector-icons": "^13.0.0",
+    "@react-navigation/bottom-tabs": "^6.5.8",
+    "@react-navigation/native": "^6.1.7",
+    "@react-navigation/stack": "^6.3.17",
+    "expo": "~48.0.18",
+    "expo-image-picker": "^14.1.1",
+    "expo-status-bar": "~1.4.4",
+    "firebase": "^9.23.0",
+    "react": "18.2.0",
+    "react-native": "0.71.8",
+    "react-native-gesture-handler": "~2.9.0",
+    "react-native-safe-area-context": "4.5.0",
+    "react-native-screens": "~3.20.0"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.20.0"
+  },
+  "private": true
+}

screens/Home.js

+import {ImageBackground, StyleSheet, Text, View} from 'react-native';
+import React, { Component } from 'react'
+
+const image = {};
+
+export class Home extends Component {
+  render() {
+    return (
+      <View style={styles.container}>
+      <ImageBackground source={require("../assets/homebaby.png")} resizeMode="cover" style={styles.image}>
+      </ImageBackground>
+    </View>
+    )
+  }
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+  },
+  image: {
+    flex: 1,
+    justifyContent: 'center',
+  },
+  text: {
+    color: 'white',
+    fontSize: 42,
+    lineHeight: 84,
+    fontWeight: 'bold',
+    textAlign: 'center',
+    backgroundColor: '#000000c0',
+  },
+});
+
+export default Home
\ No newline at end of file

screens/Notification.js

+import React from "react";
+import { View, Text, StyleSheet } from "react-native";
+
+
+const Notification = () => {
+  return (
+    <View style={styles.container}>
+      <Text style={styles.text}>Welcome </Text>
+    </View>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    justifyContent: "center",
+    alignItems: "center",
+  },
+  text: {
+    fontSize: 24,
+    fontWeight: "bold",
+    textAlign: "center",
+  },
+});
+
+export default Notification;

screens/Nutrition.js

+import React, { useState, useEffect } from "react"
+import {
+  View,
+  Text,
+  FlatList,
+  StyleSheet,
+  TextInput,
+  TouchableOpacity,
+  Keyboard,
+  Pressable,
+  Alert,
+  Image,
+  TouchableHighlight,
+} from "react-native"
+import { firebase } from "../config"
+import { FontAwesome } from "@expo/vector-icons"
+import { useNavigation } from "@react-navigation/native"
+import { SafeAreaView } from "react-native-safe-area-context"
+import * as ImagePicker from "expo-image-picker"
+
+const MAX_LENGTH = 25;
+const Nutrition = () => {
+  const [nutritions, setNutritions] = useState([])
+  const [addData, setAddData] = useState("")
+  const [addDescription, setDescription] = useState("")
+  const [image, setImage] = useState(null)
+  const [uploading, setUploading] = useState(false)
+  const nutritionReference = firebase.firestore().collection("nutritions")
+  const navigation = useNavigation()
+
+  //fetch the data from firestore
+  useEffect(() => {
+    nutritionReference
+      .orderBy("createdAt", "desc")
+      .onSnapshot((querySnapshot) => {
+        const nutritions = []
+        querySnapshot.forEach((doc) => {
+          const { heading, description } = doc.data()
+          nutritions.push({
+            id: doc.id,
+            heading,
+            description,
+          })
+        })
+        setNutritions(nutritions)
+      })
+  }, [])
+
+  //alert box
+  const deleteNutrition = (nutrition) => {
+    Alert.alert("Delete Details", "Do you want to delete this details?", [
+      {
+        text: "Cancel",
+        onPress: () => console.log("Cancel Pressed"),
+        style: "cancel",
+      },
+      {
+        text: "OK",
+        onPress: () => {
+          nutritionDelete(nutrition)
+        },
+      },
+    ])
+  }
+
+  //delete a nutrition  details from firestore database
+  const Delete = (nutrition) => {
+    nutritionReference
+      .doc(nutrition.id)
+      .delete()
+      .then(() => {
+        alert("Deleted nutrition details successfully")
+      })
+      .catch((error) => {
+        alert(error)
+      })
+  }
+
+  //add a nutrition details item
+  const addNutrition = () => {
+    //check if we have a nutrition item
+    if (addData && addData.length > 0) {
+      //get the timestamp
+      const timestamp = firebase.firestore.FieldValue.serverTimestamp()
+      const data = {
+        heading: addData,
+        description: addDescription,
+        createdAt: timestamp,
+      }
+      nutritionReference
+        .add(data)
+        .then(() => {
+          setAddData("")
+          setDescription("")
+          //release keyboard
+          Keyboard.dismiss()
+        })
+        .catch((error) => {
+          alert(error)
+        })
+    }
+  }
+
+  const pickImage = async () => {
+    let result = await ImagePicker.launchImageLibraryAsync({
+      mediaTypes: ImagePicker.MediaTypeOptions.All,
+      allowsEditing: true,
+      aspect: [4, 3],
+      quantity: 1,
+    });
+    const source = {uri: result.uri}
+    console.log(source)
+    setImage(source)
+  };
+
+  const uploadImage = async () => {
+    setUploading(true);
+    try {
+      const response = await fetch(image.uri);
+      const blob = await response.blob();
+      const filename = image.uri.substring(image.uri.lastIndexOf("/") + 1);
+      var ref = firebase.storage().ref().child(filename);
+      await ref.put(blob);
+      Alert.alert("Photo uploaded...");
+      setImage(null);
+    } catch (error) {
+      console.error(error);
+    } finally {
+      setUploading(false);
+    }
+  };
+  
+
+  return (
+    <View style={styles.subContainer}>
+    <View style={{ flex: 1 }}>
+      <SafeAreaView style={styles.nutritionContainer}>
+        <View style={styles.imageContainer}>
+          {image && 
+            <Image
+              source={{ uri: image.uri }}
+              style={{ width: 100, height: 100 }}
+            />
+          }
+          <TouchableOpacity style={styles.selectButton} onPress={pickImage}>
+          <Text style={styles.buttonText}>Pick Image</Text>
+        </TouchableOpacity>
+          <TouchableOpacity style={styles.uploadButton} onPress={uploadImage}>
+            <Text style={styles.buttonText}>Upload Image</Text>
+          </TouchableOpacity>
+        </View>
+      </SafeAreaView>
+      
+      <View style={styles.textAreaView}>
+        <Text style={{ fontWeight: "bold" }}>Weight</Text>
+        <TextInput
+          style={styles.textAreacontainer}
+          placeholder="Add your Weight"
+          maxLength={MAX_LENGTH}
+          placeholderTextColor="#aaaaaa"
+          onChangeText={(heading) => setAddData(heading)}
+          value={addData}
+          underlineColorAndroid="transparent"
+          autoCapitalize="none"
+        />
+      </View>
+      <View style={styles.textAreaView}>
+      <Text style={{ fontWeight: "bold" }}>Height</Text> 
+      <TextInput
+      multiline={true}
+      style={styles.textAreacontainer}
+      placeholder="Add your Height"
+      placeholderTextColor="#aaaaaa"
+      onChangeText={(description) => setDescription(description)}
+      value={addDescription}
+      underlineColorAndroid="transparent"
+      autoCapitalize="none"
+    />
+    </View>
+    <TouchableHighlight
+  style={styles.button}
+  underlayColor="#FF9DD2"
+  onPress={addNutrition}
+>
+        <Text style={styles.buttonText}>Get Nutrition Plan</Text>
+      
+
+      
+</TouchableHighlight>
+
+
+
+      <FlatList
+        data={nutritions}
+        numColumns={1}
+        renderItem={({ item }) => (
+          <View>
+            <Pressable
+              style={styles.container}
+              onPress={() => navigation.navigate("updatenutrition", { item })}
+            >
+              <FontAwesome
+                name="trash-o"
+                color="red"
+                onPress={() => deleteNutrition(item)}
+                style={styles.recipieIcon}
+              />
+              <View style={styles.innerContainer}>
+                <Text style={styles.itemHeading}>
+                  {item.heading[0].toUpperCase() + item.heading.slice(1)}
+                </Text>
+              </View>
+            </Pressable>
+          </View>
+        )}
+      />
+    </View>
+    </View>
+  )
+}
+
+export default Nutrition
+
+const styles = StyleSheet.create({
+  nutritionContainer: {
+    flex: 1,
+    alignItems: "center",
+    justifyContent: "center",
+    
+  },
+  subContainer:{
+    backgroundColor: "white",
+    flex: 1,
+    justifyContent: "center",
+},
+  container: {
+    padding: 15,
+    borderRadius: 15,
+    margin: 5,
+    marginHorizontal: 10,
+    flexDirection: "row",
+    alignItems: "center",
+  },
+  textAreacontainer: {
+    backgroundColor: "white",
+    padding: 10,
+    borderRadius: 5,
+    margin: 5,
+    marginHorizontal: 10,
+    flexDirection: "row",
+    alignItems: "center",
+    height: 48,
+    overflow: "hidden",
+    paddingLeft: 16,
+    flex: 1,
+    marginRight: 5,
+  },
+  textAreaView: {
+    backgroundColor: "#e5e5e5",
+    borderRadius: 15,
+    margin: 5,
+    marginHorizontal: 10,
+    flexDirection: "row",
+    alignItems: "center",
+  },
+  innerContainer: {
+    alignItems: "center",
+    flexDirection: "column",
+    marginLeft: 100,
+  },
+  itemHeading: {
+    fontWeight: "bold",
+    fontSize: 18,
+    marginRight: 30,
+  },
+  formContainer: {
+    flexDirection: "row",
+    height: 80,
+    marginTop: 100,
+  },
+  input: {
+    height: 48,
+    borderRadius: 5,
+    overflow: "hidden",
+    backgroundColor: "white",
+    paddingLeft: 16,
+    flex: 1,
+    marginRight: 5,
+  },
+  button: {
+    height: 47,
+    borderRadius: 5,
+   
+    borderWidth: 2,
+    borderColor: "#FF9DD2",
+    width: 180,
+    alignItems: "center",
+    justifyContent: "center",
+    marginLeft: 210
+  },
+ 
+  recipieIcon: {
+    marginTop: 5,
+    fontSize: 20,
+    marginLeft: 14,
+  },
+  selectButton: {
+    borderRadius: 5,
+    width: 200,
+    height: 40,
+    backgroundColor: "pink",
+    alignItems: "center",
+    justifyContent: "center",
+  },
+  uploadButton: {
+    borderRadius: 5,
+    width: 200,
+    height: 40,
+    backgroundColor: "#FF9DD2",
+    alignItems: "center",
+    justifyContent: "center",
+    marginTop: 10
+  },
+  buttonText: {
+    color: "black",
+    fontSize: 14,
+    fontWeight: "bold",
+  },
+  imageContainer: {
+    marginTop: 2,
+    marginBottom: 100,
+    alignItems: "center",
+  },
+})

screens/Sidebar.js

+import React, { useState } from "react";
+import { View, TouchableOpacity, Text, StyleSheet } from "react-native";
+import { useNavigation } from "@react-navigation/native";
+
+const Sidebar = () => {
+  const [activeTab, setActiveTab] = useState(0);
+  const navigation = useNavigation();
+
+  const handleTabPress = (tabIndex) => {
+    setActiveTab(tabIndex);
+    if (tabIndex === 0) {
+        navigation.navigate("Profile"); 
+      }if (tabIndex === 1){
+        navigation.navigate("Prescription"); 
+      }if (tabIndex === 2){
+        navigation.navigate("Chat"); 
+      }if (tabIndex === 3){
+        navigation.navigate("Nutrition"); 
+      }if (tabIndex === 4){
+        navigation.navigate("UsImage"); 
+    
+      }
+
+
+
+
+  };
+
+  return (
+    <View style={styles.sidebar}>
+      <TouchableOpacity
+        style={[styles.tab, activeTab === 0 && styles.activeTab]}
+        onPress={() => handleTabPress(0)}
+      >
+        <Text style={styles.tabText}>Profile</Text>
+      </TouchableOpacity>
+      <TouchableOpacity
+        style={[styles.tab, activeTab === 1 && styles.activeTab]}
+        onPress={() => handleTabPress(1)}
+      >
+        <Text style={styles.tabText}>My Medicines</Text>
+      </TouchableOpacity>
+      <TouchableOpacity
+        style={[styles.tab, activeTab === 2 && styles.activeTab]}
+        onPress={() => handleTabPress(2)}
+      >
+        <Text style={styles.tabText}>Chat</Text>
+      </TouchableOpacity>
+      <TouchableOpacity
+        style={[styles.tab, activeTab === 3 && styles.activeTab]}
+        onPress={() => handleTabPress(3)}
+      >
+        <Text style={styles.tabText}>Food Plans</Text>
+      </TouchableOpacity>
+      <TouchableOpacity
+        style={[styles.tab, activeTab === 4 && styles.activeTab]}
+        onPress={() => handleTabPress(4)}
+      >
+        <Text style={styles.tabText}>Baby Growth</Text>
+      </TouchableOpacity>
+    </View>
+  );
+};
+
+const styles = StyleSheet.create({
+  sidebar: {
+    flex: 1,
+    backgroundColor: "#F5F5F5",
+    paddingTop: 40,
+    paddingHorizontal: 20,
+  },
+  tab: {
+    paddingVertical: 10,
+    marginBottom: 10,
+    borderRadius: 5,
+  },
+  activeTab: {
+    backgroundColor: "#FF9DD2",
+  },
+  tabText: {
+   
+    fontSize: 18,
+    fontWeight: "bold",
+    textAlign: "left",
+  },
+});
+
+export default Sidebar;