fixed a bit of stuff the current but API is broken again for logging in so will be fixing that with the next push

app/(main)/clue/[clueId]/page.js

@@ -1,68 +1,74 @@
 "use client";
 
 import { useState, useEffect } from "react";
+import { useSession } from "next-auth/react";
 import { useRouter } from "next/navigation";
+import { useHuntStatusCheck } from "@/hooks/useHuntStatusCheck";
 import Link from "next/link";
+import { use } from "react"; // Add this import for React.use()
 
 export default function CluePage({ params }) {
-  const { clueId } = params;
+  const { data: session, status } = useSession();
+  // Unwrap the params Promise using React.use()
+  const unwrappedParams = use(params);
+  const { clueId } = unwrappedParams;
+
   const [clue, setClue] = useState(null);
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState(null);
   const router = useRouter();
 
+  // Add this line to use the hunt status hook
+  const huntActive = useHuntStatusCheck();
+
   useEffect(() => {
-    async function checkHuntStatus() {
-      try {
-        const response = await fetch("/api/hunt-status", {
-          credentials: "include",
-        });
-
-        if (response.ok) {
-          const data = await response.json();
-          // If hunt is not active, redirect to the home page
-          if (!data.active) {
-            router.push("/");
-            return false;
-          }
-          return true;
-        } else {
-          console.error("Failed to check hunt status");
-          return false;
-        }
-      } catch (err) {
-        console.error("Error checking hunt status:", err);
-        return false;
-      }
-    }
-
     async function fetchClueDetails() {
       try {
-        // First verify the hunt is active
-        const huntIsActive = await checkHuntStatus();
-        if (!huntIsActive) return;
+        // Try to check hunt status first with robust error handling
+        try {
+          const statusResponse = await fetch("/api/hunt-status", {
+            credentials: "include",
+            headers: { Accept: "application/json" },
+          });
 
-        // Fetch the specific clue from the API with improved error handling
-        const response = await fetch(`/api/clues/${clueId}`, {
-          credentials: "include",
-        });
+          // Read as text first
+          const statusText = await statusResponse.text();
 
-        // Better error handling for non-JSON responses
-        if (!response.ok) {
-          const contentType = response.headers.get("content-type");
-          if (contentType && contentType.includes("application/json")) {
-            const errorData = await response.json();
-            throw new Error(errorData.error || "Failed to fetch clue details");
-          } else {
-            throw new Error(
-              `Failed to fetch clue details: ${response.status} ${response.statusText}`
-            );
+          try {
+            const statusData = JSON.parse(statusText);
+            if (!statusData.active && statusData.authenticated) {
+              router.push("/");
+              return;
+            }
+          } catch (parseError) {
+            console.error("Failed to parse hunt status response:", parseError);
+            // Continue anyway to try fetching clue details
           }
+        } catch (statusErr) {
+          console.error("Error checking hunt status:", statusErr);
+          // Continue anyway to try fetching clue details
         }
 
-        const data = await response.json();
+        // Now fetch clue details with robust error handling
+        const response = await fetch(`/api/clues/${clueId}`, {
+          credentials: "include",
+          headers: { Accept: "application/json" },
+        });
 
-        // If we got back an error field, show it as an error
+        // Read as text first
+        const responseText = await response.text();
+
+        // Try to parse as JSON
+        let data;
+        try {
+          data = JSON.parse(responseText);
+        } catch (parseError) {
+          console.error("Failed to parse clue details response:", parseError);
+          console.log("Response received:", responseText.slice(0, 200));
+          throw new Error("Invalid response from server. Please try again.");
+        }
+
+        // Check for error in the response
         if (data.error) {
           throw new Error(data.error);
         }