From 432f4389260fef0470ba04096c43a338c271c3d9 Mon Sep 17 00:00:00 2001
From: eileen-an1 <anyilin2002@gmail.com>
Date: Thu, 17 Nov 2022 20:20:52 -0500
Subject: [PATCH 1/3] added start to navigation

---
 client/src/SignIn/SignIn.js | 2 +-
 client/src/Start/Start.js   | 6 ++++--
 2 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/client/src/SignIn/SignIn.js b/client/src/SignIn/SignIn.js
index 62f248b..e4cc1e6 100644
--- a/client/src/SignIn/SignIn.js
+++ b/client/src/SignIn/SignIn.js
@@ -90,7 +90,7 @@ function SignIn({ setSignIn, navigation }) {
                 />
                 <SafeAreaView style={styles.button}>
                     <TouchableOpacity 
-                    onPress={() => navigation.navigate("Profile")} style={styles.ButtonContainer}>
+                    onPress={() => navigation.navigate("Start")} style={styles.ButtonContainer}>
                         <Text style={styles.ButtonText}>Sign In</Text>
                     </TouchableOpacity>
                     <Button 
diff --git a/client/src/Start/Start.js b/client/src/Start/Start.js
index 77df16f..44533e9 100644
--- a/client/src/Start/Start.js
+++ b/client/src/Start/Start.js
@@ -6,6 +6,7 @@ import {
   SafeAreaView,
   Dimensions,
   Pressable,
+  TouchableOpacity
 } from "react-native";
 import { LinearGradient } from "expo-linear-gradient";
 //IMPORTS FONTS, THE COMMAND "npx expo install expo-font @expo-google-fonts/jost" SHOULD BE RUN LOCALLy BEFORE
@@ -16,7 +17,7 @@ import {
   Jost_700Bold,
 } from "@expo-google-fonts/jost";
 
-function Start() {
+function Start({navigation}) {
   //ENSURES THAT FONTS ARE LOADED BEFORE COMPONENTS ARE RENDERED
   let [fontsLoaded] = useFonts({
     Jost_400Regular,
@@ -49,7 +50,8 @@ function Start() {
             <Text style={styles.CardBodyText}>Some text here/SLIDER</Text>
           </SafeAreaView>
         </SafeAreaView>
-        <Pressable style={styles.SubmitButton}>
+        <Pressable style={styles.SubmitButton}
+          onPress={() => navigation.navigate("Profile")}>
           <Text style={styles.SubmitText}>SUBMIT</Text>
         </Pressable>
         <SafeAreaView style={styles.DefaultBox}>

From 5725c4527de102cf824b974b11e682fd5e39992b Mon Sep 17 00:00:00 2001
From: eileen-an1 <anyilin2002@gmail.com>
Date: Thu, 17 Nov 2022 21:19:16 -0500
Subject: [PATCH 2/3] turned chat into a flatlist

---
 client/src/Chat/Chat.js | 81 ++++++++++++++++++++++++++---------------
 1 file changed, 51 insertions(+), 30 deletions(-)

diff --git a/client/src/Chat/Chat.js b/client/src/Chat/Chat.js
index 614844d..0346240 100644
--- a/client/src/Chat/Chat.js
+++ b/client/src/Chat/Chat.js
@@ -1,34 +1,55 @@
 import React from 'react'
-import { StyleSheet, Text, View, Image, SafeAreaView, Dimensions} from 'react-native';
+import { StyleSheet, Text, View, Image, SafeAreaView, Dimensions, FlatList, TouchableOpacity } from 'react-native';
 const win = Dimensions.get('window')
 
-function Message() {
-    return(
-        <View style={styles.Message}>
-            <Image source={require("../../assets/avatar.png")} style={styles.Picture}/>
-            <View style={styles.Preview}>
-                <Text style={styles.MessageName}>Albert Gator</Text>
-                <Text style={styles.MessageText}>This is a message preview</Text>
-            </View>
+const FakeData = [
+    {
+      id: '1',
+      messageName: 'Albert Gator',
+      messageText: 'This is a message preview blablablablab'
+    },
+    {
+      id: '2',
+      messageName: 'Alberta Gator',
+      messageText: 'This is a message preview'
+    },
+    {
+      id: '3',
+      messageName: 'IDK',
+      messageText: 'This is a message preview'
+    },
+  ];
+  
+  const Item = ({ messageName, messageText }) => (
+    <View style={styles.Message}>
+        <Image source={require("../../assets/avatar.png")} style={styles.Picture}/>
+        <View style={styles.Preview}>
+            <Text style={styles.MessageName}>{messageName}</Text>
+            <Text style={styles.MessageText}>{messageText}</Text>
         </View>
-    )
-}
-
-function Chat() {
-    return(
-        <SafeAreaView style={styles.Chat}>
-            <View style={styles.HeaderRow}>
+    </View>
+  );
+  
+  const Chat = () => {
+    const renderItem = ({ item }) => (
+      <Item messageName={item.messageName} 
+            messageText={item.messageText}/>
+    );
+  
+    return (
+      <SafeAreaView style={styles.Chat}>
+        <View style={styles.HeaderRow}>
                 {/*add hamburger menu and back arrow here*/}
                 <Text style={styles.Header}>Messages</Text>
-            </View>
-            <Message/>
-            <Message/>
-            <Message/>
-            <Message/>
-            <Message/>
-        </SafeAreaView>
-    )
-}
+        </View>
+        <FlatList
+          data={FakeData}
+          renderItem={renderItem}
+          keyExtractor={item => item.id}
+        />
+      </SafeAreaView>
+    );
+  }  
 
 const styles = StyleSheet.create({
     HeaderRow: {
@@ -51,12 +72,12 @@ const styles = StyleSheet.create({
         backgroundColor: 'white',
         borderRadius: 30,
         height: 90,
-        width: '80%',
+        width: '100%',
         marginTop: 13,
         alignItems: 'center',
-        shadowColor: 'black',
-        shadowOffset: {width: 5, height: -5},
-        shadowOpacity: 0.5,
+        //shadowColor: 'black',
+        //shadowOffset: {width: 5, height: -5},
+        //shadowOpacity: 0.5,
         elevation: 3
     },
     Picture: {
@@ -73,7 +94,7 @@ const styles = StyleSheet.create({
     },
     MessageName: {
         fontWeight: 'bold',
-        fontSize: 18
+        fontSize: 14
     },
     MessageText: {
         fontSize: 14,

From 33bb2a4499d62097a9984f76cfedc8b032996573 Mon Sep 17 00:00:00 2001
From: eileen-an1 <anyilin2002@gmail.com>
Date: Thu, 17 Nov 2022 22:45:41 -0500
Subject: [PATCH 3/3] updated navigation to include dms

---
 client/src/Chat/Chat.js            | 38 +++++++++++++++++++++++-------
 client/src/Chat/MessagePage.js     | 11 +++++++++
 client/src/Navigation/HomeStack.js |  2 ++
 3 files changed, 43 insertions(+), 8 deletions(-)
 create mode 100644 client/src/Chat/MessagePage.js

diff --git a/client/src/Chat/Chat.js b/client/src/Chat/Chat.js
index 0346240..a26054e 100644
--- a/client/src/Chat/Chat.js
+++ b/client/src/Chat/Chat.js
@@ -20,24 +20,33 @@ const FakeData = [
     },
   ];
   
-  const Item = ({ messageName, messageText }) => (
-    <View style={styles.Message}>
+  const Item = ({ messageName, messageText, navigation }) => (
+    <TouchableOpacity 
+    style={styles.Message}
+    onPress={() => navigation.navigate("Message Page")}>
         <Image source={require("../../assets/avatar.png")} style={styles.Picture}/>
         <View style={styles.Preview}>
             <Text style={styles.MessageName}>{messageName}</Text>
             <Text style={styles.MessageText}>{messageText}</Text>
         </View>
-    </View>
+    </TouchableOpacity>
   );
   
-  const Chat = () => {
+  const Chat = ({navigation}) => {
     const renderItem = ({ item }) => (
       <Item messageName={item.messageName} 
-            messageText={item.messageText}/>
+            messageText={item.messageText}
+            navigation={navigation}/>
     );
   
     return (
       <SafeAreaView style={styles.Chat}>
+        <TouchableOpacity
+            onPress={() => navigation.navigate("Profile")}
+            style={styles.ButtonContainer}
+          >
+            <Text style={styles.ButtonText}>Back</Text>
+          </TouchableOpacity>
         <View style={styles.HeaderRow}>
                 {/*add hamburger menu and back arrow here*/}
                 <Text style={styles.Header}>Messages</Text>
@@ -58,8 +67,8 @@ const styles = StyleSheet.create({
     Header: {
         fontSize: 30,
         fontWeight: 'bold',
-        marginTop: 60,
-        marginBottom: 40
+        marginTop: 20,
+        marginBottom: 20
     },
     Chat: {
         flexDirection: 'column',
@@ -98,7 +107,20 @@ const styles = StyleSheet.create({
     },
     MessageText: {
         fontSize: 14,
-    }
+    },
+    ButtonContainer: {
+        borderRadius: 20,
+        padding: 15,
+        alignSelf: "left",
+        marginLeft: '5%',
+        backgroundColor: "#FFB72D",
+    },
+    ButtonText: {
+        fontSize: 18,
+        color: "black",
+        fontWeight: "bold",
+        alignSelf: "center",
+    },
 })
 
 export { Chat }
\ No newline at end of file
diff --git a/client/src/Chat/MessagePage.js b/client/src/Chat/MessagePage.js
new file mode 100644
index 0000000..d04548f
--- /dev/null
+++ b/client/src/Chat/MessagePage.js
@@ -0,0 +1,11 @@
+import React from 'react'
+import { StyleSheet, Text, View, Image, SafeAreaView, Dimensions } from 'react-native';
+const win = Dimensions.get('window')
+
+function Messages(){
+    <SafeAreaView>
+        <Text>temporary text</Text>
+    </SafeAreaView>
+}
+
+export {Messages};
\ No newline at end of file
diff --git a/client/src/Navigation/HomeStack.js b/client/src/Navigation/HomeStack.js
index afe36d4..d37c1ce 100644
--- a/client/src/Navigation/HomeStack.js
+++ b/client/src/Navigation/HomeStack.js
@@ -7,6 +7,7 @@ import { SignUp } from "../SignIn/SignUp";
 import { Profile } from "../Profile/Profile";
 import { Toggle } from "../Toggle/Toggle";
 import { Chat } from "../Chat/Chat";
+import { Messages } from "../Chat/MessagePage";
 
 const Stack = createNativeStackNavigator();
 /*
@@ -28,6 +29,7 @@ export default function Navigator() {
       <Stack.Screen name="Toggle" component={Toggle} />
       <Stack.Screen name="Profile" component={Profile} />
       <Stack.Screen name="Chat" component={Chat} />
+      <Stack.Screen name="Message Page" component={Messages} />
     </Stack.Navigator>
   );
 }