diff --git a/src/app/theme-slaughter/page.tsx b/src/app/theme-slaughter/page.tsx
index 646a0b3..bbf91be 100644
--- a/src/app/theme-slaughter/page.tsx
+++ b/src/app/theme-slaughter/page.tsx
@@ -1,6 +1,5 @@
 import Timers from "@/components/timers";
 import Streams from "@/components/streams";
-import JamHeader from "@/components/jam-header";
 import ThemeSlaughter from "@/components/themes/theme-slaughter";
 
 export default async function Home() {
@@ -15,4 +14,4 @@ export default async function Home() {
       </div>
     </div>
   );
-}
\ No newline at end of file
+}
diff --git a/src/app/theme-suggestions/page.tsx b/src/app/theme-suggestions/page.tsx
index 59df2fc..b6ddc17 100644
--- a/src/app/theme-suggestions/page.tsx
+++ b/src/app/theme-suggestions/page.tsx
@@ -1,6 +1,5 @@
 import Timers from "@/components/timers";
 import Streams from "@/components/streams";
-import JamHeader from "@/components/jam-header";
 import ThemeSuggestions from "@/components/themes/theme-suggest";
 
 export default async function Home() {
@@ -15,4 +14,4 @@ export default async function Home() {
       </div>
     </div>
   );
-}
\ No newline at end of file
+}
diff --git a/src/app/theme-voting/page.tsx b/src/app/theme-voting/page.tsx
index 2c9da8b..8243a9f 100644
--- a/src/app/theme-voting/page.tsx
+++ b/src/app/theme-voting/page.tsx
@@ -1,6 +1,5 @@
 import Timers from "@/components/timers";
 import Streams from "@/components/streams";
-import JamHeader from "@/components/jam-header";
 import ThemeVoting from "@/components/themes/theme-vote";
 
 export default async function Home() {
@@ -15,4 +14,4 @@ export default async function Home() {
       </div>
     </div>
   );
-}
\ No newline at end of file
+}
diff --git a/src/components/jam-header/index.tsx b/src/components/jam-header/index.tsx
index dddfb60..478ebe2 100644
--- a/src/components/jam-header/index.tsx
+++ b/src/components/jam-header/index.tsx
@@ -5,7 +5,8 @@ import { useEffect, useState } from "react";
 import { getCurrentJam, ActiveJamResponse } from "../../helpers/jam";
 
 export default function JamHeader() {
-  const [activeJamResponse, setActiveJamResponse] = useState<ActiveJamResponse | null>(null);
+  const [activeJamResponse, setActiveJamResponse] =
+    useState<ActiveJamResponse | null>(null);
   const [topTheme, setTopTheme] = useState<string | null>(null);
 
   // Fetch active jam details
@@ -40,15 +41,18 @@ export default function JamHeader() {
     fetchData();
   }, []);
 
-
-    // Helper function to get ordinal suffix
+  // Helper function to get ordinal suffix
   const getOrdinalSuffix = (day: number): string => {
     if (day > 3 && day < 21) return "th";
     switch (day % 10) {
-      case 1: return "st";
-      case 2: return "nd";
-      case 3: return "rd";
-      default: return "th";
+      case 1:
+        return "st";
+      case 2:
+        return "nd";
+      case 3:
+        return "rd";
+      default:
+        return "th";
     }
   };
 
@@ -69,34 +73,49 @@ export default function JamHeader() {
           </p>
         </div>
         <div className="p-4 px-6 font-bold">
-        <p>
-          {activeJamResponse?.jam ? (
-            <>
-              {new Date(activeJamResponse.jam.startTime).toLocaleDateString('en-US', {
-                month: 'long',
-              })} {new Date(activeJamResponse.jam.startTime).getDate()}
-              {getOrdinalSuffix(new Date(activeJamResponse.jam.startTime).getDate())}
-              {" - "}
-              {new Date(new Date(activeJamResponse.jam.startTime).getTime() + 
-                (activeJamResponse.jam.jammingHours * 60 * 60 * 1000)).toLocaleDateString('en-US', {
-                month: 'long',
-              })} {new Date(new Date(activeJamResponse.jam.startTime).getTime() + 
-                (activeJamResponse.jam.jammingHours * 60 * 60 * 1000)).getDate()}
-              {getOrdinalSuffix(new Date(new Date(activeJamResponse.jam.startTime).getTime() + 
-                (activeJamResponse.jam.jammingHours * 60 * 60 * 1000)).getDate())}
-            </>
-          ) : (
-            "Dates TBA"
-          )}
-        </p>
-      </div>
+          <p>
+            {activeJamResponse?.jam ? (
+              <>
+                {new Date(activeJamResponse.jam.startTime).toLocaleDateString(
+                  "en-US",
+                  {
+                    month: "long",
+                  }
+                )}{" "}
+                {new Date(activeJamResponse.jam.startTime).getDate()}
+                {getOrdinalSuffix(
+                  new Date(activeJamResponse.jam.startTime).getDate()
+                )}
+                {" - "}
+                {new Date(
+                  new Date(activeJamResponse.jam.startTime).getTime() +
+                    activeJamResponse.jam.jammingHours * 60 * 60 * 1000
+                ).toLocaleDateString("en-US", {
+                  month: "long",
+                })}{" "}
+                {new Date(
+                  new Date(activeJamResponse.jam.startTime).getTime() +
+                    activeJamResponse.jam.jammingHours * 60 * 60 * 1000
+                ).getDate()}
+                {getOrdinalSuffix(
+                  new Date(
+                    new Date(activeJamResponse.jam.startTime).getTime() +
+                      activeJamResponse.jam.jammingHours * 60 * 60 * 1000
+                  ).getDate()
+                )}
+              </>
+            ) : (
+              "Dates TBA"
+            )}
+          </p>
+        </div>
       </div>
 
       {/* Phase-Specific Display */}
       {activeJamResponse?.phase === "Suggestion" && (
         <div className="bg-gray-100 dark:bg-gray-800 p-4 text-center rounded-b-2x">
           <a
-            href="/theme-suggestions"
+            // href="/theme-suggestions"
             className="text-blue-300 dark:text-blue-500 hover:underline font-semibold"
           >
             Go to Theme Suggestion
@@ -107,7 +126,7 @@ export default function JamHeader() {
       {activeJamResponse?.phase === "Survival" && (
         <div className="bg-gray-100 dark:bg-gray-800 p-4 text-center rounded-b-2x">
           <a
-            href="/theme-slaughter"
+            // href="/theme-slaughter"
             className="text-blue-300 dark:text-blue-500 hover:underline font-semibold"
           >
             Go to Theme Survival
@@ -118,7 +137,7 @@ export default function JamHeader() {
       {activeJamResponse?.phase === "Voting" && (
         <div className="bg-gray-100 dark:bg-gray-800 p-4 text-center rounded-b-2x">
           <a
-            href="/theme-voting"
+            // href="/theme-voting"
             className="text-blue-300 dark:text-blue-500 hover:underline font-semibold"
           >
             Go to Theme Voting
@@ -139,7 +158,9 @@ export default function JamHeader() {
       {activeJamResponse?.phase === "Rating" && (
         <div className="bg-gray-100 dark:bg-gray-800 p-4 text-center rounded-b-2x">
           {topTheme ? (
-            <p className="text-xl font-bold text-blue-500">THEME: {topTheme} RESULTS</p>
+            <p className="text-xl font-bold text-blue-500">
+              THEME: {topTheme} RESULTS
+            </p>
           ) : (
             <p>No top-scoring theme available.</p>
           )}
@@ -147,4 +168,4 @@ export default function JamHeader() {
       )}
     </div>
   );
-}
\ No newline at end of file
+}
diff --git a/src/components/navbar/PCNavbar.tsx b/src/components/navbar/PCNavbar.tsx
index aef6e59..1e14e58 100644
--- a/src/components/navbar/PCNavbar.tsx
+++ b/src/components/navbar/PCNavbar.tsx
@@ -24,7 +24,7 @@ import NextImage from "next/image";
 import { useEffect, useState } from "react";
 import { usePathname } from "next/navigation";
 import { getCookie, hasCookie } from "@/helpers/cookie";
-import { getCurrentJam, joinJam, ActiveJamResponse } from "@/helpers/jam";
+import { getCurrentJam, joinJam } from "@/helpers/jam";
 import { JamType } from "@/types/JamType";
 import { UserType } from "@/types/UserType";
 import NavbarUser from "./PCNavbarUser";
diff --git a/src/components/themes/theme-slaughter.tsx b/src/components/themes/theme-slaughter.tsx
index bc488aa..2e5f061 100644
--- a/src/components/themes/theme-slaughter.tsx
+++ b/src/components/themes/theme-slaughter.tsx
@@ -1,17 +1,22 @@
 "use client";
 
-import React, { useState, useEffect } from "react";
+import React, { useState, useEffect, useCallback } from "react";
 import { getCookie } from "@/helpers/cookie";
-import { getCurrentJam, hasJoinedCurrentJam, ActiveJamResponse } from "@/helpers/jam";
-
-export default function ThemeSlaughter() {   
+import {
+  getCurrentJam,
+  hasJoinedCurrentJam,
+  ActiveJamResponse,
+} from "@/helpers/jam";
 
+export default function ThemeSlaughter() {
   const [randomTheme, setRandomTheme] = useState(null);
   const [votedThemes, setVotedThemes] = useState([]);
   const [loading, setLoading] = useState(false);
-  const [token, setToken] = useState(null); 
+  const [token, setToken] = useState(null);
   const [hasJoined, setHasJoined] = useState<boolean>(false);
-  const [activeJamResponse, setActiveJam] = useState<ActiveJamResponse | null>(null);
+  const [activeJamResponse, setActiveJam] = useState<ActiveJamResponse | null>(
+    null
+  );
   const [phaseLoading, setPhaseLoading] = useState(true);
 
   // Fetch token on the client side
@@ -20,8 +25,8 @@ export default function ThemeSlaughter() {
     setToken(fetchedToken);
   }, []);
 
-    // Fetch the current jam phase using helpers/jam
-    useEffect(() => {
+  // Fetch the current jam phase using helpers/jam
+  useEffect(() => {
     const fetchCurrentJamPhase = async () => {
       try {
         const activeJam = await getCurrentJam();
@@ -36,19 +41,21 @@ export default function ThemeSlaughter() {
     fetchCurrentJamPhase();
   }, []);
 
-
   // Fetch a random theme
-  const fetchRandomTheme = async () => {
+  const fetchRandomTheme = useCallback(async () => {
     if (!token) return; // Wait until token is available
-    if( !activeJamResponse) return;
-    if(activeJamResponse && activeJamResponse.jam && activeJamResponse.phase != "Survival")
-        {
-            return (
-                <div>
-                <h1>It's not Theme Survival phase.</h1>
-                </div>
-            );
-        }
+    if (!activeJamResponse) return;
+    if (
+      activeJamResponse &&
+      activeJamResponse.jam &&
+      activeJamResponse.phase != "Survival"
+    ) {
+      return (
+        <div>
+          <h1>It&apos;s not Theme Survival phase.</h1>
+        </div>
+      );
+    }
 
     try {
       const response = await fetch(
@@ -69,10 +76,10 @@ export default function ThemeSlaughter() {
     } catch (error) {
       console.error("Error fetching random theme:", error);
     }
-  };
+  }, [activeJamResponse, token]);
 
   // Fetch voted themes
-  const fetchVotedThemes = async () => {
+  const fetchVotedThemes = useCallback(async () => {
     if (!token) return; // Wait until token is available
 
     try {
@@ -94,7 +101,7 @@ export default function ThemeSlaughter() {
     } catch (error) {
       console.error("Error fetching voted themes:", error);
     }
-  };
+  }, [token]);
 
   // Handle voting
   const handleVote = async (voteType) => {
@@ -148,28 +155,26 @@ export default function ThemeSlaughter() {
     }
   };
 
-
   useEffect(() => {
     if (token && activeJamResponse?.phase === "Survival") {
       fetchRandomTheme();
       fetchVotedThemes();
     }
-  }, [token, activeJamResponse]);
-
+  }, [token, activeJamResponse, fetchRandomTheme, fetchVotedThemes]);
 
   useEffect(() => {
-      const init = async () => {
-        const joined = await hasJoinedCurrentJam();
-        setHasJoined(joined);
-        setLoading(false);
-      };
-  
-      init();
-    }, []);
-  
+    const init = async () => {
+      const joined = await hasJoinedCurrentJam();
+      setHasJoined(joined);
+      setLoading(false);
+    };
+
+    init();
+  }, []);
+
   if (phaseLoading || loading) {
     return <div>Loading...</div>;
-  }  
+  }
 
   if (!hasJoined) {
     return (
@@ -198,20 +203,19 @@ export default function ThemeSlaughter() {
           Not in Theme Slaughter Phase
         </h1>
         <p className="text-gray-600 dark:text-gray-400">
-          The current phase is <strong>{activeJamResponse?.phase || "Unknown"}</strong>. Please come back during the Theme Slaughter phase.
+          The current phase is{" "}
+          <strong>{activeJamResponse?.phase || "Unknown"}</strong>. Please come
+          back during the Theme Slaughter phase.
         </p>
       </div>
     );
   }
 
   const loggedIn = getCookie("token");
-  
-    if (!loggedIn) {
-      return (
-        <div>Sign in to be able to join the Theme Survival</div>
-      );
-    }
-  
+
+  if (!loggedIn) {
+    return <div>Sign in to be able to join the Theme Survival</div>;
+  }
 
   return (
     <div className="flex h-screen">
@@ -223,7 +227,7 @@ export default function ThemeSlaughter() {
               {randomTheme.suggestion}
             </h2>
             <div className="flex gap-4">
-            <button
+              <button
                 onClick={() => handleVote("YES")}
                 className="px-6 py-3 bg-green-500 text-white font-bold rounded-lg hover:bg-green-600"
                 disabled={loading}
@@ -247,7 +251,9 @@ export default function ThemeSlaughter() {
             </div>
           </>
         ) : (
-          <p className="text-gray-600 dark:text-gray-400">No themes available.</p>
+          <p className="text-gray-600 dark:text-gray-400">
+            No themes available.
+          </p>
         )}
       </div>
 
@@ -276,4 +282,4 @@ export default function ThemeSlaughter() {
       </div>
     </div>
   );
-}
\ No newline at end of file
+}
diff --git a/src/components/themes/theme-suggest.tsx b/src/components/themes/theme-suggest.tsx
index 5477550..aab469d 100644
--- a/src/components/themes/theme-suggest.tsx
+++ b/src/components/themes/theme-suggest.tsx
@@ -2,7 +2,11 @@
 
 import React, { useState, useEffect } from "react";
 import { getCookie } from "@/helpers/cookie";
-import { getCurrentJam, hasJoinedCurrentJam , ActiveJamResponse } from "@/helpers/jam";
+import {
+  getCurrentJam,
+  hasJoinedCurrentJam,
+  ActiveJamResponse,
+} from "@/helpers/jam";
 
 export default function ThemeSuggestions() {
   const [suggestion, setSuggestion] = useState("");
@@ -12,7 +16,8 @@ export default function ThemeSuggestions() {
   const [userSuggestions, setUserSuggestions] = useState([]);
   const [themeLimit, setThemeLimit] = useState(0);
   const [hasJoined, setHasJoined] = useState<boolean>(false);
-  const [activeJamResponse, setActiveJamResponse] = useState<ActiveJamResponse | null>(null);
+  const [activeJamResponse, setActiveJamResponse] =
+    useState<ActiveJamResponse | null>(null);
   const [phaseLoading, setPhaseLoading] = useState(true); // Loading state for fetching phase
 
   // Fetch the current jam phase using helpers/jam
@@ -105,9 +110,14 @@ export default function ThemeSuggestions() {
       setSuccessMessage("Suggestion added successfully!");
       setSuggestion(""); // Clear input field
       fetchSuggestions(); // Refresh suggestions list
-    } catch (error: any) {
-      console.error("Error submitting suggestion:", error.message);
-      setErrorMessage(error.message || "An unexpected error occurred.");
+    } catch (error) {
+      if (error instanceof Error) {
+        console.error("Error submitting suggestion:", error.message);
+        setErrorMessage(error.message || "An unexpected error occurred.");
+      } else {
+        console.error("Unknown error:", error);
+        setErrorMessage("An unexpected error occurred.");
+      }
     } finally {
       setLoading(false);
     }
@@ -176,9 +186,7 @@ export default function ThemeSuggestions() {
   const token = getCookie("token");
 
   if (!token) {
-    return (
-      <div>Sign in to be able to suggest themes</div>
-    );
+    return <div>Sign in to be able to suggest themes</div>;
   }
 
   // Render message if not in Suggestion phase
@@ -189,7 +197,9 @@ export default function ThemeSuggestions() {
           Not in Suggestion Phase
         </h1>
         <p className="text-gray-600 dark:text-gray-400">
-          The current phase is <strong>{activeJamResponse?.phase || "Unknown"}</strong>. Please come back during the Suggestion phase.
+          The current phase is{" "}
+          <strong>{activeJamResponse?.phase || "Unknown"}</strong>. Please come
+          back during the Suggestion phase.
         </p>
       </div>
     );
@@ -214,7 +224,7 @@ export default function ThemeSuggestions() {
               }
             }}
             rows={1}
-            maxLength={32} 
+            maxLength={32}
           ></textarea>
           {errorMessage && (
             <p className="text-red-500 text-sm">{errorMessage}</p>
@@ -234,7 +244,7 @@ export default function ThemeSuggestions() {
         </form>
       ) : (
         <p className="text-yellow-500 text-sm">
-          You've reached your theme suggestion limit for this jam!
+          You&apos;ve reached your theme suggestion limit for this jam!
         </p>
       )}
 
@@ -262,10 +272,10 @@ export default function ThemeSuggestions() {
           </ul>
         ) : (
           <p className="text-gray-600 dark:text-gray-400">
-            You haven't submitted any suggestions yet.
+            You haven&apos;t submitted any suggestions yet.
           </p>
         )}
       </div>
     </div>
   );
-}
\ No newline at end of file
+}
diff --git a/src/components/themes/theme-vote.tsx b/src/components/themes/theme-vote.tsx
index ac5c028..ea16e2b 100644
--- a/src/components/themes/theme-vote.tsx
+++ b/src/components/themes/theme-vote.tsx
@@ -2,12 +2,17 @@
 
 import React, { useState, useEffect } from "react";
 import { getCookie } from "@/helpers/cookie";
-import { getCurrentJam, hasJoinedCurrentJam , ActiveJamResponse } from "@/helpers/jam";
+import {
+  getCurrentJam,
+  hasJoinedCurrentJam,
+  ActiveJamResponse,
+} from "@/helpers/jam";
 
 export default function VotingPage() {
   const [themes, setThemes] = useState([]);
   const [loading, setLoading] = useState(false);
-  const [activeJamResponse, setActiveJamResponse] = useState<ActiveJamResponse | null>(null);
+  const [activeJamResponse, setActiveJamResponse] =
+    useState<ActiveJamResponse | null>(null);
   const [hasJoined, setHasJoined] = useState<boolean>(false);
   const [phaseLoading, setPhaseLoading] = useState(true); // Loading state for fetching phase
   const token = getCookie("token");
@@ -28,67 +33,66 @@ export default function VotingPage() {
     fetchCurrentJamPhase();
   }, []);
 
-  // Fetch top N themes with voting scores
-  const fetchThemes = async () => {
-    if (!token || !activeJamResponse) return;
-  
-    try {
-      const response = await fetch(
-        process.env.NEXT_PUBLIC_MODE === "PROD"
-          ? "https://d2jam.com/api/v1/themes/top-themes"
-          : "http://localhost:3005/api/v1/themes/top-themes",
-        {
-          headers: { Authorization: `Bearer ${token}` },
-          credentials: "include",
-        }
-      );
-      if (response.ok) {
-        const themes = await response.json();
-        console.log("Fetched themes:", themes); // Debug log
-        
-        // Fetch user's votes for these themes
-        const votesResponse = await fetch(
+  // Fetch themes only when phase is "Voting"
+  useEffect(() => {
+    // Fetch top N themes with voting scores
+    async function fetchThemes() {
+      if (!token || !activeJamResponse) return;
+
+      try {
+        const response = await fetch(
           process.env.NEXT_PUBLIC_MODE === "PROD"
-            ? "https://d2jam.com/api/v1/themes/votes"
-            : "http://localhost:3005/api/v1/themes/votes",
+            ? "https://d2jam.com/api/v1/themes/top-themes"
+            : "http://localhost:3005/api/v1/themes/top-themes",
           {
             headers: { Authorization: `Bearer ${token}` },
             credentials: "include",
           }
         );
-  
-        if (votesResponse.ok) {
-          const votes = await votesResponse.json();
-          console.log("Fetched votes:", votes); // Debug log
-          
-          // Merge themes with user's votes
-          const themesWithVotes = themes.map(theme => {
-            const vote = votes.find(v => v.themeSuggestionId === theme.id);
-            console.log(`Theme ${theme.id} vote:`, vote); // Debug log
-            return {
-              ...theme,
-              votingScore: vote ? vote.votingScore : null
-            };
-          });
-          
-          console.log("Themes with votes:", themesWithVotes); // Debug log
-          setThemes(themesWithVotes);
-        }
-      } else {
-        console.error("Failed to fetch themes.");
-      }
-    } catch (error) {
-      console.error("Error fetching themes:", error);
-    }
-  };
+        if (response.ok) {
+          const themes = await response.json();
+          console.log("Fetched themes:", themes); // Debug log
+
+          // Fetch user's votes for these themes
+          const votesResponse = await fetch(
+            process.env.NEXT_PUBLIC_MODE === "PROD"
+              ? "https://d2jam.com/api/v1/themes/votes"
+              : "http://localhost:3005/api/v1/themes/votes",
+            {
+              headers: { Authorization: `Bearer ${token}` },
+              credentials: "include",
+            }
+          );
+
+          if (votesResponse.ok) {
+            const votes = await votesResponse.json();
+            console.log("Fetched votes:", votes); // Debug log
+
+            // Merge themes with user's votes
+            const themesWithVotes = themes.map((theme) => {
+              const vote = votes.find((v) => v.themeSuggestionId === theme.id);
+              console.log(`Theme ${theme.id} vote:`, vote); // Debug log
+              return {
+                ...theme,
+                votingScore: vote ? vote.votingScore : null,
+              };
+            });
+
+            console.log("Themes with votes:", themesWithVotes); // Debug log
+            setThemes(themesWithVotes);
+          }
+        } else {
+          console.error("Failed to fetch themes.");
+        }
+      } catch (error) {
+        console.error("Error fetching themes:", error);
+      }
+    }
 
-  
-  // Fetch themes only when phase is "Voting"
-  useEffect(() => {
     if (activeJamResponse?.phase === "Voting") {
       fetchThemes();
     }
-  }, [activeJamResponse]);
+  }, [activeJamResponse, token]);
 
   // Handle voting
   const handleVote = async (themeId, votingScore) => {
@@ -108,14 +112,12 @@ export default function VotingPage() {
           body: JSON.stringify({ suggestionId: themeId, votingScore }),
         }
       );
-  
+
       if (response.ok) {
         // Just update the local state instead of re-fetching all themes
         setThemes((prevThemes) =>
           prevThemes.map((theme) =>
-            theme.id === themeId 
-              ? { ...theme, votingScore } 
-              : theme
+            theme.id === themeId ? { ...theme, votingScore } : theme
           )
         );
       } else {
@@ -138,7 +140,6 @@ export default function VotingPage() {
     init();
   }, []);
 
-
   if (phaseLoading || loading) {
     return <div>Loading...</div>;
   }
@@ -162,7 +163,6 @@ export default function VotingPage() {
     );
   }
 
-
   if (activeJamResponse?.phase !== "Voting") {
     return (
       <div className="p-4 bg-gray-100 dark:bg-gray-800 min-h-screen">
@@ -170,19 +170,19 @@ export default function VotingPage() {
           Not in Voting Phase
         </h1>
         <p className="text-gray-600 dark:text-gray-400">
-          The current phase is <strong>{activeJamResponse?.phase || "Unknown"}</strong>. Please come back during the Voting phase.
+          The current phase is{" "}
+          <strong>{activeJamResponse?.phase || "Unknown"}</strong>. Please come
+          back during the Voting phase.
         </p>
       </div>
     );
   }
 
   const loggedIn = getCookie("token");
-    
-    if (!loggedIn) {
-    return (
-        <div>Sign in to be able to vote</div>
-    );
-    }
+
+  if (!loggedIn) {
+    return <div>Sign in to be able to vote</div>;
+  }
 
   return (
     <div className="p-3 bg-gray-100 dark:bg-gray-800 min-h-screen">
@@ -233,10 +233,12 @@ export default function VotingPage() {
             </div>
 
             {/* Theme Suggestion */}
-            <div className="text-gray-800 dark:text-white">{theme.suggestion}</div>
+            <div className="text-gray-800 dark:text-white">
+              {theme.suggestion}
+            </div>
           </div>
         ))}
       </div>
     </div>
   );
-}
\ No newline at end of file
+}
diff --git a/src/components/timers/index.tsx b/src/components/timers/index.tsx
index 42882d9..e2533c1 100644
--- a/src/components/timers/index.tsx
+++ b/src/components/timers/index.tsx
@@ -1,15 +1,12 @@
-"use client"
+"use client";
 import { Spacer } from "@nextui-org/react";
 import React, { useState, useEffect } from "react";
 import Timer from "./Timer";
 import { getCurrentJam, ActiveJamResponse } from "@/helpers/jam";
 
-
-
 export default function Timers() {
-
-  const [activeJamResponse, setActiveJamResponse] = useState<ActiveJamResponse | null>(null);
-  const [phaseLoading, setPhaseLoading] = useState(true); // Loading state for fetching phase
+  const [activeJamResponse, setActiveJamResponse] =
+    useState<ActiveJamResponse | null>(null);
 
   // Fetch the current jam phase using helpers/jam
   useEffect(() => {
@@ -20,15 +17,13 @@ export default function Timers() {
       } catch (error) {
         console.error("Error fetching current jam:", error);
       } finally {
-        setPhaseLoading(false); // Stop loading when phase is fetched
       }
     };
 
     fetchCurrentJamPhase();
   }, []);
 
-  if(activeJamResponse && activeJamResponse.jam)
-  {
+  if (activeJamResponse && activeJamResponse.jam) {
     return (
       <div className="text-[#333] dark:text-white transition-color duration-250">
         <Timer
@@ -39,16 +34,13 @@ export default function Timers() {
         <p>Site under construction</p>
       </div>
     );
-  }
-  else
-  {
+  } else {
     return (
       <div className="text-[#333] dark:text-white transition-color duration-250">
         No upcoming jams
         <Spacer y={8} />
         <p>Site under construction</p>
       </div>
-    )
+    );
   }
-  
 }