fixed all issues regarding team's member list page where users couldn't leave properly or where they couldn't join properly. the team selection page will now directly communicate with the database to ensure everything stays up to date. The team member list page will also auto update every few seconds so the user will not have to manually update their page.

app/(main)/team/[teamId]/page.js

@@ -37,14 +37,38 @@ export default function TeamPage({ params }) {
         throw new Error("Invalid team ID");
       }
 
-      console.log("Fetching team data for team ID:", teamId);
-
-      const response = await fetch(`/api/teams/${teamId}`, {
+      // First check if the user is still part of this team by fetching current user data
+      const userResponse = await fetch("/api/user", {
         method: "GET",
         headers: {
           "Content-Type": "application/json",
         },
         credentials: "include",
+        cache: "no-store",
+      });
+
+      const userData = await userResponse.json();
+
+      // If the user is not in this team anymore, redirect to team selection
+      if (!userData.teamId || userData.teamId != teamId) {
+        console.log("User no longer in team, redirecting to team selection");
+        window.location.href = "/team-selection";
+        return;
+      }
+
+      console.log("Fetching team data for team ID:", teamId);
+
+      // Add timestamp to URL to ensure fresh data on every request
+      const timestamp = new Date().getTime();
+      const response = await fetch(`/api/teams/${teamId}?_t=${timestamp}`, {
+        method: "GET",
+        headers: {
+          "Content-Type": "application/json",
+          "Cache-Control": "no-cache, no-store, must-revalidate",
+          Pragma: "no-cache",
+        },
+        credentials: "include",
+        cache: "no-store",
       });
 
       if (!response.ok) {
@@ -90,6 +114,12 @@ export default function TeamPage({ params }) {
     if (status === "authenticated" && teamId) {
       console.log("Session authenticated, fetching team data");
       fetchTeamData();
+
+      // Use a shorter interval (3 seconds) for more responsive updates
+      const refreshInterval = setInterval(fetchTeamData, 3000);
+
+      // Clean up the interval when component unmounts
+      return () => clearInterval(refreshInterval);
     } else if (status === "unauthenticated") {
       console.log("User not authenticated, redirecting to login");
       router.push("/login");
@@ -174,10 +204,18 @@ export default function TeamPage({ params }) {
                 });
 
                 if (response.ok) {
-                  router.push("/team-selection");
+                  // Immediately remove team data from session state
+                  localStorage.removeItem("teamData");
+                  sessionStorage.removeItem("teamData");
+
+                  // Set a flag so we know the user has left this team
+                  localStorage.setItem("userLeftTeam", "true");
+
+                  // Force redirect to team selection
+                  window.location.href = "/team-selection";
                 } else {
-                  const error = await response.json();
-                  throw new Error(error.message || "Failed to leave team");
+                  const errorData = await response.json();
+                  throw new Error(errorData.error || "Failed to leave team");
                 }
               } catch (err) {
                 setError(err.message);
@@ -195,7 +233,6 @@ export default function TeamPage({ params }) {
             onClick={async () => {
               try {
                 setLoading(true);
-
                 if (!huntActive) {
                   // If hunt is not active, redirect to the "not started" page
                   router.push(`/hunt-not-started?teamId=${teamId}`);
@@ -318,6 +355,8 @@ export default function TeamPage({ params }) {
         .members-container {
           padding: 20px;
           flex: 1;
+          display: flex;
+          flex-direction: column;
         }
 
         .members-title {