diff options
| author | Pinapelz <yukais@pinapelz.com> | 2025-05-06 00:05:25 -0700 |
|---|---|---|
| committer | Pinapelz <yukais@pinapelz.com> | 2025-05-06 00:10:40 -0700 |
| commit | 913f28e2f27830192a1c80270612d8314eed3353 (patch) | |
| tree | 01bdf287a3b7c2370b37b3b1eba0be4ba5868479 /src/pages/twitch | |
| parent | 83c3fa302adbc4c3adf63c59cfe87b51d83ecbcb (diff) | |
phase_tracker_only: implement the twitch table
Diffstat (limited to 'src/pages/twitch')
| -rw-r--r-- | src/pages/twitch/index.tsx | 65 |
1 files changed, 65 insertions, 0 deletions
diff --git a/src/pages/twitch/index.tsx b/src/pages/twitch/index.tsx new file mode 100644 index 0000000..43d88ed --- /dev/null +++ b/src/pages/twitch/index.tsx @@ -0,0 +1,65 @@ +import { useEffect, useState } from "react"; +import TwitchDataTable, { + type TwitchDataTableProp, +} from "../../components/SubscriberTable/TwitchDataTable"; +import TitleBar from "../../components/TitleBar/TitleBar"; +import Announcement from "../../components/Announcement"; +import "../../app/globals.css"; + +function TwitchPage() { + const [twitchData, setTwitchData] = useState<TwitchDataTableProp | null>(null); + const [error, setError] = useState<string | null>(null); + + const announcementText = process.env.NEXT_PUBLIC_ANNOUNCEMENT; + + useEffect(() => { + async function fetchTwitchData() { + try { + const apiUrl = process.env.NEXT_PUBLIC_API_URL_TESTING; + const endpoint = "/api/twitch"; + const headers = { + "Cache-Control": "no-cache", + }; + const cacheOption = "no-cache"; + + const response = await fetch(`${apiUrl}${endpoint}`, { + headers: headers, + cache: cacheOption, + }); + + if (!response.ok) { + throw new Error(response.statusText); + } + + const data = await response.json(); + setTwitchData(data); + } catch (err) { + setError(err instanceof Error ? err.message : "An error occurred"); + } + } + + fetchTwitchData(); + }, []); + + return ( + <> + <TitleBar title="PhaseTracker" backgroundColor="black" /> + {announcementText && ( + <Announcement + message={announcementText} + backgroundColor="#e0f7fa" + textColor="#006064" + /> + )} + {error ? ( + <div>Error: {error}</div> + ) : twitchData ? ( + <TwitchDataTable {...twitchData} /> + ) : ( + <div>Loading...</div> + )} + </> + ); +} + +export default TwitchPage; |
