main view and sample hamburger

emma-frontend/App.js

@@ -15,6 +15,7 @@ import PatientRegSix from "./components/patientscreens/registration/regSix";
 import PatientRegSeven from "./components/patientscreens/registration/regSeven";
 import PatientRegEight from "./components/patientscreens/registration/regEight";
 import PatientConsentForm from "./components/patientscreens/consent";
+import PatientMainChatView from "./components/patientscreens/patientMainChatView";
 
 const Stack = createStackNavigator();
 
@@ -96,6 +97,10 @@ export default function App() {
             component={PatientConsentForm}
             options={{ headerShown: false }}
           />
+          <Stack.Screen
+            name="PatientMainChatView"
+            component={PatientMainChatView}
+          />
         </Stack.Navigator>
       ) : (
         <SplashScreenComponent />

emma-frontend/components/patientscreens/patientMainChatView.js

+import React, { useState } from "react";
+import { View, TextInput, TouchableOpacity, Text } from "react-native";
+import { Ionicons } from "@expo/vector-icons";
+
+export default function PatientMainChatView({ navigation, route }) {
+  const [message, setMessage] = useState("");
+  const [chatMessages, setChatMessages] = useState([]);
+
+  const sendMessage = () => {
+    if (message.trim() === "") {
+      return; // Don't send empty messages
+    }
+
+    const newMessage = {
+      id: chatMessages.length + 1,
+      text: message,
+      sender: "Me",
+      timestamp: new Date().toISOString(),
+    };
+
+    setChatMessages([...chatMessages, newMessage]);
+    setMessage("");
+  };
+
+  return (
+    <View style={{ flex: 1 }}>
+      <View style={{ flexDirection: "row", alignItems: "center", padding: 10 }}>
+        <TouchableOpacity onPress={() => navigation.openDrawer()}>
+          <Ionicons name="menu-outline" size={24} color="black" />
+        </TouchableOpacity>
+        <Text style={{ fontSize: 20, marginLeft: 10 }}>Chat</Text>
+      </View>
+      {/* Chat messages */}
+      <View style={{ flex: 1, padding: 10 }}>
+        {chatMessages.map((msg) => (
+          <View
+            key={msg.id}
+            style={{
+              marginBottom: 10,
+              alignSelf: msg.sender === "Me" ? "flex-end" : "flex-start",
+            }}
+          >
+            <Text>{msg.text}</Text>
+          </View>
+        ))}
+      </View>
+
+      {/* Message input and send button */}
+      <View style={{ flexDirection: "row", alignItems: "center", padding: 10 }}>
+        <TextInput
+          style={{
+            flex: 1,
+            borderWidth: 1,
+            borderColor: "gray",
+            borderRadius: 10,
+            paddingHorizontal: 10,
+          }}
+          placeholder="Type your message..."
+          value={message}
+          onChangeText={(text) => setMessage(text)}
+        />
+        <TouchableOpacity onPress={sendMessage} style={{ marginLeft: 10 }}>
+          <Ionicons name="send" size={24} color="blue" />
+        </TouchableOpacity>
+      </View>
+    </View>
+  );
+}

emma-frontend/components/patientscreens/registration/regEight.js

@@ -146,7 +146,13 @@ export default function PatientRegEight({ navigation, route }) {
                 );
               },
             },
-            { text: "Close", style: "cancel" },
+            {
+              text: "Close",
+              style: "cancel",
+              onPress: () => {
+                navigation.navigate("PatientMainChatView");
+              },
+            },
           ]);
           //on close send to main UI
         } catch (errorWhenStoringInAsyncStorage) {

emma-frontend/components/shared/menuContainers.js

+import { createAppContainer } from "react-navigation";
+import { createStackNavigator } from "react-navigation-stack";
+import { createDrawerNavigator } from "react-navigation-drawer";
+
+// Create a Drawer Navigator for the first hamburger menu component
+const DrawerNavigatorPatient = createDrawerNavigator(
+  {
+    Home: HomeScreen,
+    Profile: ProfileScreen,
+  },
+  {
+    initialRouteName: "Home",
+    contentOptions: {
+      // Customization options for the drawer content
+    },
+  }
+);
+
+// Create a Drawer Navigator for the second hamburger menu component
+const DrawerNavigatorPractitioner = createDrawerNavigator(
+  {
+    Home: HomeScreen,
+    Settings: SettingsScreen,
+  },
+  {
+    initialRouteName: "Home",
+    contentOptions: {
+      // Customization options for the drawer content
+    },
+  }
+);
+
+// Create separate stacks for each hamburger menu component
+const StackNavigatorPatient = createStackNavigator({
+  Drawer1: { screen: DrawerNavigatorPatient },
+});
+
+const StackNavigatorPractitioner = createStackNavigator({
+  Drawer2: { screen: DrawerNavigatorPractitioner },
+});
+
+// Create the app containers for each hamburger menu component
+const AppContainerPatient = createAppContainer(StackNavigatorPatient);
+const AppContainerPractitioner = createAppContainer(StackNavigatorPractitioner);
+
+export { AppContainerPatient, AppContainerPractitioner };