Merge branch 'main' of https://github.com/ufosc/OSC-Proximity-Chat-App …

…into store-types-seperately

.github/workflows/main.yml

@@ -24,29 +24,10 @@ jobs:
         working-directory: server/
 
       - name: Set up environment variables
-        env:
-          API_KEY: ${{ secrets.API_KEY }}
-          AUTH_DOMAIN: ${{ secrets.AUTH_DOMAIN }}
-          PROJECT_ID: ${{ secrets.PROJECT_ID }}
-          STORAGE_BUCKET: ${{ secrets.STORAGE_BUCKET }}
-          MESSAGING_SENDER_ID: ${{ secrets.MESSAGING_SENDER_ID }}
-          APP_ID: ${{ secrets.APP_ID }}
-          MESSAGE_OUTREACH_RADIUS: ${{ secrets.MESSAGE_OUTREACH_RADIUS }}
-          EXPRESS_PORT: ${{ secrets.EXPRESS_PORT }}
-          SOCKET_PORT: ${{ secrets.SOCKET_PORT }}
-          SOCKET_TEST_CLIENT_PORT: ${{ secrets.SOCKET_TEST_CLIENT_PORT }}
         run: |
-          echo "API_KEY=${API_KEY}" >> .env
-          echo "AUTH_DOMAIN=${AUTH_DOMAIN}" >> .env
-          echo "PROJECT_ID=${PROJECT_ID}" >> .env
-          echo "STORAGE_BUCKET=${STORAGE_BUCKET}" >> .env
-          echo "MESSAGING_SENDER_ID=${MESSAGING_SENDER_ID}" >> .env
-          echo "APP_ID=${APP_ID}" >> .env
-          echo "message_outreach_radius=${MESSAGE_OUTREACH_RADIUS}" >> .env
-          echo "express_port=${EXPRESS_PORT}" >> .env
-          echo "socket_port=${SOCKET_PORT}" >> .env
-          echo "socket_test_client_port=${SOCKET_TEST_CLIENT_PORT}" >> .env
-        working-directory: server/
+          mkdir private_key
+          echo "${{ secrets.SERVICE_ACCOUNT_SECRET }}" > private_key/private.json
+        working-directory: server/src
 
       - name: Compile TypeScript files
         run: npx tsc

client/src/app/(home)/_layout.tsx

@@ -3,20 +3,23 @@ import { Stack } from "expo-router";
 import { SettingsProvider } from "../../contexts/SettingsContext";
 import { SocketProvider } from "../../contexts/SocketContext";
 import { LocationProvider } from "../../contexts/LocationContext";
+import { UserProvider } from "../../contexts/UserContext";
 
 const AuthLayout = () => {
   return (
     <LocationProvider>
       <SocketProvider>
-        <SettingsProvider>
-          <Stack
-            screenOptions={{
-              headerShown: false,
-            }}
-          >
-            <Stack.Screen name="chatchannel" options={{}} />
-          </Stack>
-        </SettingsProvider>
+        <UserProvider>
+          <SettingsProvider>
+            <Stack
+              screenOptions={{
+                headerShown: false,
+              }}
+            >
+              <Stack.Screen name="chatchannel" options={{}} />
+            </Stack>
+          </SettingsProvider>
+        </UserProvider>
       </SocketProvider>
     </LocationProvider>
   );

client/src/components/Chat/ChatScreen.tsx

@@ -14,15 +14,15 @@ import {
 import { ChatInput } from "../Common/CustomInputs";
 import { ChatSendButton } from "../Common/CustomButtons";
 import MessageChannel from "../Common/MessageChannel";
-import { LinearGradient } from "expo-linear-gradient";
 import * as Crypto from "expo-crypto";
 import { generateName } from "../../utils/scripts";
-import { useSettings } from "../../contexts/SettingsContext";
 import { SignOutButton } from "../Common/AuthButtons"
 import { MessageType } from "../../types/Message";
 import { LocationProvider } from "../../contexts/LocationContext";
 import { useSocket } from "../../contexts/SocketContext";
+import { useSettings } from "../../contexts/SettingsContext";
 import { useLocation } from "../../contexts/LocationContext";
+import { useUser } from "../../contexts/UserContext"; // imported for when it needs to be used
 import { AuthStore } from "../../services/store";
 
 const ChatScreen = () => {
@@ -32,8 +32,10 @@ const ChatScreen = () => {
   const keyboardBehavior = Platform.OS === "ios" ? "padding" : undefined;
   const socket = useSocket();
   const location = useLocation();
-  const { user } = AuthStore.useState();
-
+  const user = useUser();  
+  const userAuth = AuthStore.useState()
+  // Note: To prevent complexity, all user information is grabbed from different contexts and services. If we wanted most information inside of UserContext, we would have to import contexts within contexts and have state change as certain things mount, which could cause errors that are difficult to pinpoint.
+
   // Message loading and sending logic
   const [messages, setMessages] = React.useState<MessageType[]>([]);
   const [messageContent, setMessageContent] = React.useState<string>("");
@@ -54,7 +56,9 @@ const ChatScreen = () => {
   const onHandleSubmit = () => {
     if (messageContent.trim() !== "") {
       const newMessage: MessageType = {
-        uid: String(user?.uid), 
+        author: {
+          uid: String(userAuth.userAuthInfo?.uid), 
+        },
         msgId: Crypto.randomUUID(), 
         msgContent: messageContent.trim(),
         timeSent: Date.now(),

client/src/components/Common/ChatMessage.tsx

@@ -1,7 +1,7 @@
 import React, { useContext } from "react";
 import { View, StyleSheet, Text, Image, Dimensions } from "react-native";
 import { useSettings } from "../../contexts/SettingsContext";
-import { MessageProps } from "../../utils/types";
+import { MessageProps } from "../../types/Props";
 
 const Message: React.FC<MessageProps> = ({ messageContent, time, author }) => {
   const settings = useSettings();

client/src/components/Common/CustomButtons.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
 import { View, StyleSheet, Text, TouchableOpacity, Image, Dimensions } from 'react-native'
-import { ChatSendButtonProps } from '../../utils/types';
+import { ChatSendButtonProps } from '../../types/Props';
 
 export const ChatSendButton: React.FC<ChatSendButtonProps> = ({ onPress }) => {
   return (