From b1009b186e6dfae1e8f07548491c2ffa81c21ed3 Mon Sep 17 00:00:00 2001
From: Nicholas Pease <me@nicholaspease.com>
Date: Sun, 10 Mar 2024 16:43:08 +0000
Subject: [PATCH] Fix Added Members, onValue for Room List, Nearby

---
 frontend-next/src/app/app/page.js | 23 +++++++++++++++++++----
 1 file changed, 19 insertions(+), 4 deletions(-)

diff --git a/frontend-next/src/app/app/page.js b/frontend-next/src/app/app/page.js
index 474e434..3c19426 100644
--- a/frontend-next/src/app/app/page.js
+++ b/frontend-next/src/app/app/page.js
@@ -211,6 +211,7 @@ function Home() {
   const [loadingNearby, setLoadingNearby] = useState(true); // loading nearby rooms array, true = loading, false = finished loading
   const [chatroomOnline, setChatRoomOnline] = useState(null) // holds online users
   const [chatroomUsers, setChatroomUsers] = useState(null) // holds all chatroom users
+  const [chatroomUsersLoading ,setChatroomUsersLoading] = useState(true)
   const [users, setUsers] = useState(null) // all users from firebase
   const [alreadyLeft, setAlreadyLeft] = useState(false) // if already left from room
 
@@ -218,7 +219,8 @@ function Home() {
   useEffect(() => {
     fetch('/api/user').then((res) => res.json())
     .then((user) => {
-      get(ref(database, '/users/'+user.uid+'/rooms')).then((snapshot) => {
+      onValue(ref(database, '/users/'+user.uid+'/rooms'),(snapshot) => {
+        setRoomLoading(true)
         var rooms = snapshot.val()
         setMyRoomsObj(rooms)
         var roomArr = []
@@ -239,9 +241,10 @@ function Home() {
       navigator.geolocation.getCurrentPosition(({ coords }) => {
         setLocation(coords)
         setLoadingLoc(false)
-        var nearbyArr = []
         var path = String(coords.latitude.toFixed(2)).replace(".","")+"/"+String(coords.longitude.toFixed(2)).replace(".","")
-        get(ref(database, `/rooms/${path}`)).then((snapshot) => {
+        setLoadingNearby(true)
+        onValue(ref(database, `/rooms/${path}`), (snapshot) => {
+          var nearbyArr = []
           if (snapshot.exists()) {
             var data = snapshot.val()
             for (var room in data) {
@@ -265,6 +268,7 @@ function Home() {
     
   }, []);
 
+  // Dont Double Send Leaving Message
   useEffect(() => {
    if (myRoomsObj && chatRoomObj) {
     var roomName = chatRoomObj.name+"-"+chatRoomObj.timestamp
@@ -333,6 +337,9 @@ function Home() {
       set(ref(database, `/rooms/${path}/users/online/${user.uid}`), user)
       onValue(ref(database, `/rooms/${path}`), (snapshot) => {
 
+        setChatRoomOnline(null)
+        setChatroomUsers(null)
+        
         // Active users list
         if (snapshot.val().hasOwnProperty("users") && snapshot.val().users.hasOwnProperty("online")) {
           var activeUsers = []
@@ -343,12 +350,16 @@ function Home() {
         }
 
         // Users who added to "my rooms"
+        console.log(snapshot.val().hasOwnProperty("users") && snapshot.val().users.hasOwnProperty("all"))
         if (snapshot.val().hasOwnProperty("users") && snapshot.val().users.hasOwnProperty("all")) {
+          setChatroomUsersLoading(true)
           var allUsers = []
           var allUsersJSON = snapshot.val().users.all
           for (var user in allUsersJSON)
             allUsers.push(<Member memberObj={allUsersJSON[user]}/>)
           setChatroomUsers(allUsers)
+          setChatroomUsersLoading(false)
+
         }
 
       })
@@ -388,6 +399,8 @@ function Home() {
         longitude: chatRoomObj.longitude,
         latitude: chatRoomObj.latitude,
       })
+      var path = chatRoomObj.path+"/"+chatRoomObj.name+"-"+chatRoomObj.timestamp
+      set(ref(database, `/rooms/${path}/users/all/${user.uid}`), user)
     })
     setIsMyRoom(true)
   }
@@ -396,7 +409,9 @@ function Home() {
   function removeFromMyRooms() {
     fetch('/api/user').then((res) => res.json())
     .then((user) => {
+      var path = chatRoomObj.path+"/"+chatRoomObj.name+"-"+chatRoomObj.timestamp
       remove(ref(database,`/users/${user.uid}/rooms/${chatRoomObj.name}-${chatRoomObj.timestamp}`))
+      remove(ref(database, `/rooms/${path}/users/all/${user.uid}`))
     })
     setIsMyRoom(false)
   }
@@ -492,7 +507,7 @@ function Home() {
             <div>
               All Members
             </div>
-            {chatroomUsers}
+            {!chatroomUsersLoading && chatroomUsers}
           </div>
         </div>
       </div>