From a2307ec34e6f5be91cb2a5a96621e6e640906aad Mon Sep 17 00:00:00 2001 From: Ategon Date: Wed, 22 Jan 2025 20:12:54 -0500 Subject: [PATCH] Fix linting issues --- src/app/theme-slaughter/page.tsx | 3 +- src/app/theme-suggestions/page.tsx | 3 +- src/app/theme-voting/page.tsx | 3 +- src/components/jam-header/index.tsx | 87 ++++++++------ src/components/navbar/PCNavbar.tsx | 2 +- src/components/themes/theme-slaughter.tsx | 98 +++++++-------- src/components/themes/theme-suggest.tsx | 36 ++++-- src/components/themes/theme-vote.tsx | 138 +++++++++++----------- src/components/timers/index.tsx | 20 +--- 9 files changed, 209 insertions(+), 181 deletions(-) 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() { ); -} \ 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() { ); -} \ 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() { ); -} \ 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(null); + const [activeJamResponse, setActiveJamResponse] = + useState(null); const [topTheme, setTopTheme] = useState(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() {

-

- {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" - )} -

-
+

+ {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" + )} +

+ {/* Phase-Specific Display */} {activeJamResponse?.phase === "Suggestion" && (
Go to Theme Suggestion @@ -107,7 +126,7 @@ export default function JamHeader() { {activeJamResponse?.phase === "Survival" && (
Go to Theme Survival @@ -118,7 +137,7 @@ export default function JamHeader() { {activeJamResponse?.phase === "Voting" && (
Go to Theme Voting @@ -139,7 +158,9 @@ export default function JamHeader() { {activeJamResponse?.phase === "Rating" && (
{topTheme ? ( -

THEME: {topTheme} RESULTS

+

+ THEME: {topTheme} RESULTS +

) : (

No top-scoring theme available.

)} @@ -147,4 +168,4 @@ export default function JamHeader() { )}
); -} \ 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(false); - const [activeJamResponse, setActiveJam] = useState(null); + const [activeJamResponse, setActiveJam] = useState( + 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 ( -
-

It's not Theme Survival phase.

-
- ); - } + if (!activeJamResponse) return; + if ( + activeJamResponse && + activeJamResponse.jam && + activeJamResponse.phase != "Survival" + ) { + return ( +
+

It's not Theme Survival phase.

+
+ ); + } 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
Loading...
; - } + } if (!hasJoined) { return ( @@ -198,20 +203,19 @@ export default function ThemeSlaughter() { Not in Theme Slaughter Phase

- The current phase is {activeJamResponse?.phase || "Unknown"}. Please come back during the Theme Slaughter phase. + The current phase is{" "} + {activeJamResponse?.phase || "Unknown"}. Please come + back during the Theme Slaughter phase.

); } const loggedIn = getCookie("token"); - - if (!loggedIn) { - return ( -
Sign in to be able to join the Theme Survival
- ); - } - + + if (!loggedIn) { + return
Sign in to be able to join the Theme Survival
; + } return (
@@ -223,7 +227,7 @@ export default function ThemeSlaughter() { {randomTheme.suggestion}
-
) : ( -

No themes available.

+

+ No themes available. +

)}
@@ -276,4 +282,4 @@ export default function ThemeSlaughter() {
); -} \ 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(false); - const [activeJamResponse, setActiveJamResponse] = useState(null); + const [activeJamResponse, setActiveJamResponse] = + useState(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 ( -
Sign in to be able to suggest themes
- ); + return
Sign in to be able to suggest themes
; } // Render message if not in Suggestion phase @@ -189,7 +197,9 @@ export default function ThemeSuggestions() { Not in Suggestion Phase

- The current phase is {activeJamResponse?.phase || "Unknown"}. Please come back during the Suggestion phase. + The current phase is{" "} + {activeJamResponse?.phase || "Unknown"}. Please come + back during the Suggestion phase.

); @@ -214,7 +224,7 @@ export default function ThemeSuggestions() { } }} rows={1} - maxLength={32} + maxLength={32} > {errorMessage && (

{errorMessage}

@@ -234,7 +244,7 @@ export default function ThemeSuggestions() { ) : (

- You've reached your theme suggestion limit for this jam! + You've reached your theme suggestion limit for this jam!

)} @@ -262,10 +272,10 @@ export default function ThemeSuggestions() { ) : (

- You haven't submitted any suggestions yet. + You haven't submitted any suggestions yet.

)} ); -} \ 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(null); + const [activeJamResponse, setActiveJamResponse] = + useState(null); const [hasJoined, setHasJoined] = useState(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
Loading...
; } @@ -162,7 +163,6 @@ export default function VotingPage() { ); } - if (activeJamResponse?.phase !== "Voting") { return (
@@ -170,19 +170,19 @@ export default function VotingPage() { Not in Voting Phase

- The current phase is {activeJamResponse?.phase || "Unknown"}. Please come back during the Voting phase. + The current phase is{" "} + {activeJamResponse?.phase || "Unknown"}. Please come + back during the Voting phase.

); } const loggedIn = getCookie("token"); - - if (!loggedIn) { - return ( -
Sign in to be able to vote
- ); - } + + if (!loggedIn) { + return
Sign in to be able to vote
; + } return (
@@ -233,10 +233,12 @@ export default function VotingPage() {
{/* Theme Suggestion */} -
{theme.suggestion}
+
+ {theme.suggestion} +
))} ); -} \ 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(null); - const [phaseLoading, setPhaseLoading] = useState(true); // Loading state for fetching phase + const [activeJamResponse, setActiveJamResponse] = + useState(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 (
Site under construction

); - } - else - { + } else { return (
No upcoming jams

Site under construction

- ) + ); } - }