fixing navbar

Adding Svg files and fixing appearance of navbar to look like the design pages

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

@@ -135,6 +135,43 @@ export default function TeamPage({ params }) {
     }
   }, [effectiveTeamId, status, fetchTeamData, router]);
 
+  const continueTreasureHunt = async (e) => {
+    e.preventDefault();
+    setLoading(true);
+    
+    try {
+      // Check if hunt is active first
+      const timestamp = Date.now();
+      const response = await fetch(`/api/hunt-status?t=${timestamp}`, {
+        method: "GET",
+        headers: {
+          "Content-Type": "application/json",
+          "Cache-Control": "no-store, no-cache, must-revalidate",
+          Pragma: "no-cache",
+        },
+        credentials: "include",
+      });
+      
+      if (response.ok) {
+        const data = await response.json();
+        
+        if (data.active) {
+          // Hunt is active, redirect to map
+          router.push("/map");
+        } else {
+          // Hunt is not active, redirect to waiting page
+          router.push("/waiting");
+        }
+      } else {
+        throw new Error("Failed to check hunt status");
+      }
+    } catch (err) {
+      console.error("Error checking hunt status:", err);
+      setError("Failed to check hunt status. Please try again.");
+      setLoading(false);
+    }
+  };
+
   if (status === "loading" || loading) {
     return (
       <div className="loading-container">
@@ -341,27 +378,46 @@ export default function TeamPage({ params }) {
         )}
       </div>
 
-      {/* Replace the outdated navbar with this consistent design */}av-bar"]}>
-      <div className="nav-bar">v-item"]}>
-        <Link href="/map" className="nav-item">>🗺️</div>
-          <div className="nav-icon">🗺️</div>>Map</div>
-          <div className="nav-label">Map</div>
-        </Link>v-item"]}>
-        <Link href="/stats" className="nav-item">}>📊</div>
-          <div className="nav-icon">📊</div>tats</div>
-          <div className="nav-label">Stats</div>
-        </Link> 
-        <Link  
-          href={teamData ? `/${teamData.id}` : "/team-selection"} tem"]} ${styles["active"]}`}
-          className="nav-item active"
-        >}>👥</div>
-          <div className="nav-icon">👥</div>Team</div>
-          <div className="nav-label">Team</div>
-        </Link>v-item"]}>
-        <Link href="/leaderboard" className="nav-item">}>🏆</div>
-          <div className="nav-icon">🏆</div>oard</div>
-          <div className="nav-label">Leaderboard</div>
-        </Link>
+      {team && team.hasStarted && (
+        <div className="button-container">
+          <button
+            className="continue-button"
+            onClick={continueTreasureHunt}
+            disabled={loading}
+          >
+            {loading ? "Loading..." : "Continue Hunt"}
+          </button>
+        </div>
+      )}
+
+      <div className="nav-bar">
+        <div className="nav-item">
+          <Link href="/map" className="nav-item">
+            <div className="nav-icon">🗺️</div>
+            <div className="nav-label">Map</div>
+          </Link>
+        </div>
+        <div className="nav-item">
+          <Link href="/stats" className="nav-item">
+            <div className="nav-icon">📊</div>
+            <div className="nav-label">Stats</div>
+          </Link>
+        </div>
+        <div className="nav-item">
+          <Link
+            href={teamData ? `/${teamData.id}` : "/team-selection"}
+            className="nav-item active"
+          >
+            <div className="nav-icon">👥</div>
+            <div className="nav-label">Team</div>
+          </Link>
+        </div>
+        <div className="nav-item">
+          <Link href="/leaderboard" className="nav-item">
+            <div className="nav-icon">🏆</div>
+            <div className="nav-label">Leaderboard</div>
+          </Link>
+        </div>
       </div>
 
       <style jsx>{`