diff --git a/app/auth/onlineUsers.tsx b/app/auth/onlineUsers.tsx
index 9bfe1030..8c40caae 100644
--- a/app/auth/onlineUsers.tsx
+++ b/app/auth/onlineUsers.tsx
@@ -5,15 +5,17 @@ import { useSupabaseClient, useSession } from "@supabase/auth-helpers-react";
export default function OnlineUserList() {
const supabase = useSupabaseClient();
- const session = useSession();
-
+ const session = useSession(); // Session must be loaded first
const [onlineUsers, setOnlineUsers] = useState(0);
useEffect(() => {
+ // Wait until session is ready
+ if (!session?.user?.id) return;
+
const roomOne = supabase.channel('room_01', {
config: {
presence: {
- key: session?.user.id || '',
+ key: session.user.id, // Ensure session user id is used correctly
},
},
});
@@ -21,7 +23,6 @@ export default function OnlineUserList() {
roomOne
.on('presence', { event: 'sync' }, () => {
const currentPresenceState = roomOne.presenceState();
- // Update the onlineUsers state with the number of currently online users
const onlineUsersCount = Object.keys(currentPresenceState).length;
setOnlineUsers(onlineUsersCount);
})
@@ -37,7 +38,7 @@ export default function OnlineUserList() {
return () => {
roomOne.unsubscribe();
};
- }, [supabase]);
+ }, [session?.user?.id, supabase]);
return (
diff --git a/app/tests/page.tsx b/app/tests/page.tsx
index 7d4fa329..9f3e4022 100644
--- a/app/tests/page.tsx
+++ b/app/tests/page.tsx
@@ -8,14 +8,12 @@ import ProfileCardModal from "@/components/profile/form";
import { CommunityScienceStation } from "@/components/Structures/Community/StationModal";
import { CreateCommunityStation } from "@/components/Structures/Build/MakeCommunityStation";
import StationsOnPlanet from "@/components/Structures/Community/ViewAllStations";
-import OnlineUserList from "../auth/onlineUsers";
export default function TestPage() {
return (
-
);
};
diff --git a/components/Projects/Satellite/PlanetFour.tsx b/components/Projects/Satellite/PlanetFour.tsx
index e9f595ff..7b44cd67 100644
--- a/components/Projects/Satellite/PlanetFour.tsx
+++ b/components/Projects/Satellite/PlanetFour.tsx
@@ -142,7 +142,9 @@ export function PlanetFourProject() {
const [anomaly, setAnomaly] = useState
(null);
const [imageUrl, setImageUrl] = useState(null);
const [loading, setLoading] = useState(true);
+ const [showTutorial, setShowTutorial] = useState(false);
const [hasMission20000005, setHasMission20000005] = useState(false);
+
const supabaseUrl = process.env.NEXT_PUBLIC_SUPABASE_URL;
useEffect(() => {
@@ -178,6 +180,10 @@ export function PlanetFourProject() {
setLoading(false);
}
}, [session, supabase]);
+
+ const handleShowTutorial = () => {
+ setShowTutorial(true);
+ };
useEffect(() => {
const fetchAnomaly = async () => {
@@ -221,34 +227,47 @@ export function PlanetFourProject() {
return (
-
- {imageUrl && (
-
-
- Image
- Annotate the image using marker.js
-
-
-
-
-
-
-
- )}
-
- {imageUrl && (
-
+ {!showTutorial ? (
+ <>
+
+ {imageUrl && (
+
+
+ Image
+ Annotate the image using marker.js
+
+
+
+
+
+
+
+ )}
+
+
+ {imageUrl && (
+
+ )}
+ >
+ ) : (
+
+
+
)}
);