.github/workflows/jsdoc.yaml

@@ -1,27 +0,0 @@
-name: JSDoc to GH Pages
-
-on:
-  push:
-    branches:
-      - main
-
-jobs:
-  deploy:
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout Code
-        uses: actions/checkout@v2
-
-      - name: Build
-        uses: andstor/jsdoc-action@v1
-        with:
-          source_dir: ./frontend-next
-          output_dir: ./jsdoc
-          recurse: true
-          template: minami
-
-      - name: Deploy
-        uses: peaceiris/actions-gh-pages@v3
-        with:
-          github_token: ${{ secrets.GITHUB_TOKEN }}
-          publish_dir: ./jsdoc

frontend-next/src/app/app/page.js

@@ -7,7 +7,7 @@ import Drawer from '@mui/material/Drawer';
 
 // Firebase Imports
 import { auth, database } from "../../../firebase-config";
-import { ref, get, set } from "firebase/database";
+import { ref, onValue, set } from "firebase/database";
 import { useAuthState } from "react-firebase-hooks/auth"
 
 // Component Imports
@@ -43,10 +43,10 @@ function Home() {
   // Authentication Verification / Redirection if Profile Data not Filled out
   useEffect(() => {
     if (authUser && authLoading === false) {
-        get(ref(database, `users/${authUser.uid}`)).then((userData) => {
+        onValue(ref(database, `users/${authUser.uid}`), (userData) => {
             userData = userData.val();
             if (userData) {
-                setUser({...userData});
+                setUser(userData);
             } else {
                 window.location.href = "/onboarding";
             }

frontend-next/src/app/chat/page.js

@@ -39,7 +39,7 @@ function Chat() {
   // Authentication Verification / Redirection if Profile Data not Filled out
   useEffect(() => {
     if (authUser && authLoading === false && !user) {
-        get(ref(database, `users/${authUser.uid}`)).then((userData) => {
+        onValue(ref(database, `users/${authUser.uid}`),(userData) => {
             userData = userData.val();
             if (userData) {
                 setUser(userData);
@@ -91,7 +91,7 @@ function Chat() {
         })*/
 
         // Room Object Load
-        get(ref(database, `/rooms/${path}`)).then((roomData) => {
+        onValue(ref(database, `/rooms/${path}`), (roomData) => {
             roomData = roomData.val();
             setChatRoomObj(roomData)
             if (!doneLoading) {

frontend-next/src/app/dm/page.js

@@ -5,7 +5,7 @@ import { useState, useEffect } from "react";
 
 // Firebase Imports
 import { auth, database } from "../../../firebase-config";
-import { ref, onValue, set, onDisconnect, get, onChildAdded, onChildRemoved} from "firebase/database";
+import { ref, onValue, set, onDisconnect} from "firebase/database";
 import { useAuthState } from "react-firebase-hooks/auth"
 
 // Component Imports
@@ -40,7 +40,7 @@ function Chat() {
   // Authentication Verification / Redirection if Profile Data not Filled out
   useEffect(() => {
     if (authUser && authLoading === false) {
-      get(ref(database, `users/${authUser.uid}`)).then((userData) => {
+      onValue(ref(database, `users/${authUser.uid}`), (userData) => {
           userData = userData.val();
           if (userData) {
               setUser(userData);
@@ -58,10 +58,11 @@ function Chat() {
     if (user) {
         const searchParams = new URLSearchParams(document.location.search);
         var path = searchParams.get("dm")
-        if (path.includes(user.uid))
+        if (path.includes(user.uid)) {
           setIsUserAuthed(true)
-        else
+        } else {
           location.href = "/app"
+        }
         /*// Send entered message
         var payload = {
             body: "entered",
@@ -95,7 +96,7 @@ function Chat() {
         })*/
 
         // Room Object Load
-        get(ref(database, `/dms/${path}`)).then((roomData) => {
+        onValue(ref(database, `/dms/${path}`), (roomData) => {
           roomData = roomData.val();
           setChatRoomObj(roomData)
           if (!doneLoading) {

frontend-next/src/app/onboarding/page.js

@@ -6,27 +6,9 @@ import { useRouter } from "next/navigation";
 
 // Firebase Imports
 import { ref, set } from "firebase/database";
-import { auth, database } from "../../../firebase-config";
+import { auth, database, storage } from "../../../firebase-config";
 import { onAuthStateChanged } from "firebase/auth";
-
-/**
- * Creates user data in Firebase DB
- * @param {JSON} data - User data to be stored in Firebase DB ( from form ) 
- * @return {Boolean} - True if user data is stored, False if user data is not stored
- */
-function createUser(data) {
-  onAuthStateChanged(auth, (user) => {
-    if (user.uid) {
-      data.uid = user.uid;
-      data.defined = true;
-      data.email = user.email;
-      set(ref(database, `users/${user.uid}`), data);
-      return true;
-    } else {
-      return false;
-    }
-  });
-}
+import { ref as sRef, getDownloadURL } from "firebase/storage";
 
 /**
  * Onboarding Page
@@ -37,8 +19,24 @@ function Onboarding() {
   var { register, handleSubmit } = useForm();
 
   function Onboard(data) {
-    createUser(data);
-    router.push("/app");
+    onAuthStateChanged(auth, (user) => {
+      if (user.uid) {
+        data.uid = user.uid;
+        data.defined = true;
+        data.invisibleStatus = false;
+        data.bio = " ";
+        data.interests = " , , "
+        getDownloadURL(sRef(storage, `/default.png`)).then((url) => {
+          data.pfp = url;
+          data.email = user.email;
+          set(ref(database, `users/${user.uid}`), data);
+          router.push("/app");
+        })
+
+      } else {
+        return false;
+      }
+    });
   }
   return (
     <div>

frontend-next/src/app/user/page.js

@@ -127,7 +127,7 @@ function UserProfile() {
                   <div>
                     <img
                       src={profileData.pfp}
-                      className="relative mx-auto rounded-2xl overflow-hidden w-[90%]"
+                      className="relative mx-auto rounded-2xl overflow-hidden max-h-[20%] max-w-[70%]"
                     />
                     <div className="font-bold text-[30px] flex justify-center items-center">
                       {profileData.lastOnline == true && <CircleIcon className="text-lime-600 mr-3"/>}{profileData.firstName} {profileData.lastName}

frontend-next/src/components/app/header.js

@@ -21,8 +21,12 @@ import CloseIcon from '@mui/icons-material/Close';
  * @param {JSON} user - User Object
  * @returns {void}
  */
-function closeChat(chatRoomObj, user) {
+function closeChat(chatRoomObj, user, mainTab) {
+  if (mainTab == "chat") {
   remove(ref(database, `/rooms/${chatRoomObj.path}/${chatRoomObj.name}-${chatRoomObj.timestamp}/users/online/${user.uid}`))
+  } else {
+  remove(ref(database, `/dms/${chatRoomObj.room}/users/online/${user.uid}`))
+  }
 
 }
 
@@ -49,6 +53,7 @@ function addToMyRooms(chatRoomObj, user) {
   );
   var path =
     chatRoomObj.path + "/" + chatRoomObj.name + "-" + chatRoomObj.timestamp;
+  user.lastOnline = serverTimestamp();
   set(ref(database, `/rooms/${path}/users/all/${user.uid}`), user);
 }
 
@@ -124,7 +129,6 @@ export function Header({mainTab,chatRoomObj,user,sidebarControl}) {
           <a
             onClick={() => {
               removeFromMyRooms(chatRoomObj, user);
-              
             }}
             className="p-2 cursor-pointer bg-cyan-500 text-white font-bold rounded-full mr-2 flex items-center"
           >
@@ -135,7 +139,7 @@ export function Header({mainTab,chatRoomObj,user,sidebarControl}) {
           <Link
             href="/app"
             className="p-2 cursor-pointer bg-cyan-500 text-white font-bold rounded-full mr-2 flex items-center"
-            onClick={() => {closeChat(chatRoomObj,user)}}
+            onClick={() => {closeChat(chatRoomObj,user, mainTab)}}
           >
             <CloseIcon/>
           </Link>

frontend-next/src/components/app/sidebar/dm.js

@@ -1,24 +1,22 @@
 import { Member } from "../datatypes"
 
 import { database } from "../../../../firebase-config"
-import {ref, get, onValue} from "firebase/database"
+import {ref, get} from "firebase/database"
 
 import { useState, useEffect } from "react"
 
 export function Sidebar({user, chatRoomObj}) {
   const [profileData, setProfileData] = useState(null)
   const [chatroomOnline, setChatroomOnline] = useState(null)
-  
-  var path = chatRoomObj.UIDs[0] < chatRoomObj.UIDs[1] ? chatRoomObj.UIDs[0] + "-" + chatRoomObj.UIDs[1] : chatRoomObj.UIDs[1] + "-" + chatRoomObj.UIDs[0];
-  var activeUsers = []
-  get(ref(database, `/dms/${path}/users/online`)).then((snapshot) => {
-    if (snapshot.exists()) {
-      var activeUsersJSON = snapshot.val();
-      for (var activeUser in activeUsersJSON)
-        activeUsers.push(<Member memberObj={activeUsersJSON[activeUser]} key={activeUser} />);
-    }
-  })
 
+  useEffect(() => {
+    if (chatRoomObj.users && chatRoomObj.users.online) {
+      var activeUsers = []
+      for (var activeUser in chatRoomObj.users.online)
+        activeUsers.push(<Member memberObj={chatRoomObj.users.online[activeUser]} key={activeUser} />);
+    }
+    setChatroomOnline(activeUsers)
+  }, [chatRoomObj])
     useEffect(() => {
         if (user) {
             // Profile Information
@@ -49,7 +47,7 @@ export function Sidebar({user, chatRoomObj}) {
                 </div>
                 <div className="bg-white rounded-lg m-2 shadow-2xl">
                 <div>In The Chat</div>
-                {activeUsers}
+                {chatroomOnline}
                 </div>
             </div>
           </div>

frontend-next/src/components/app/sidebar/home.js

@@ -156,7 +156,7 @@ export function Sidebar({user,location,loadingLoc}) {
       }
        
     })
-  }, [])
+  }, [user.friends])
 
   return (
     <div className="h-dvh bg-[aliceblue] pt-2 pb-2 pl-2 pr-1">