From 913f28e2f27830192a1c80270612d8314eed3353 Mon Sep 17 00:00:00 2001
From: Pinapelz <yukais@pinapelz.com>
Date: Tue, 6 May 2025 00:05:25 -0700
Subject: phase_tracker_only: implement the twitch table

---
 src/pages/twitch/index.tsx | 65 ++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 65 insertions(+)
 create mode 100644 src/pages/twitch/index.tsx

(limited to 'src/pages')

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;
-- 
cgit v1.2.3