From a3b5ffe741fb67e75b81f306d81e6c570abeec22 Mon Sep 17 00:00:00 2001
From: Kevin Monisit <monisitkevin@gmail.com>
Date: Sat, 19 Oct 2024 16:45:59 -0400
Subject: [PATCH 1/2] make leaderboard page auth protected

---
 app/(pre-dashboard)/leaderboard/page.tsx      | 141 -----------------
 .../leaderboard/layout.tsx                    |   0
 app/dashboard/leaderboard/page.tsx            | 143 ++++++++++++++++++
 3 files changed, 143 insertions(+), 141 deletions(-)
 delete mode 100644 app/(pre-dashboard)/leaderboard/page.tsx
 rename app/{(pre-dashboard) => dashboard}/leaderboard/layout.tsx (100%)
 create mode 100644 app/dashboard/leaderboard/page.tsx

diff --git a/app/(pre-dashboard)/leaderboard/page.tsx b/app/(pre-dashboard)/leaderboard/page.tsx
deleted file mode 100644
index 16d4e5f..0000000
--- a/app/(pre-dashboard)/leaderboard/page.tsx
+++ /dev/null
@@ -1,141 +0,0 @@
-'use client';
-import React, { useEffect, useState } from 'react';
-import { getLeaderboard } from '@/app/lib/data';
-import GenericSection from '../(landing)/sections/GenericSection';
-import Image from 'next/image';
-import { fuzzy } from '@/app/ui/fonts';
-
-interface LeaderboardEntry {
-  id: string;
-  first_name:string;
-  last_name:string;
-  points: number;
-}
-
-
-function quickSort(
-  arr: LeaderboardEntry[],
-  low = 0,
-  high = arr.length - 1,
-): LeaderboardEntry[] {
-  if (low < high) {
-    const pivotIndex = partition(arr, low, high);
-    quickSort(arr, low, pivotIndex - 1);
-    quickSort(arr, pivotIndex + 1, high);
-  }
-  return arr;
-}
-
-function partition(arr: LeaderboardEntry[], low: number, high: number): number {
-  const pivot = arr[high];
-  let i = low - 1;
-
-  for (let j = low; j < high; j++) {
-    if (arr[j].points >= pivot.points) {
-      i++;
-      [arr[i], arr[j]] = [arr[j], arr[i]];
-    }
-  }
-
-  [arr[i + 1], arr[high]] = [arr[high], arr[i + 1]];
-  return i + 1;
-}
-
-const Leaderboard = () => {
-  const [leaderboard, setLeaderboard] = useState<LeaderboardEntry[]>([
-    { id: 'Loading...', points: 0 , first_name: "Loading", last_name: "..."},
-    { id: 'Loading...', points: 0 , first_name: "Loading", last_name: "..."},
-    { id: 'Loading...', points: 0 , first_name: "Loading", last_name: "..."},
-    { id: 'Loading...', points: 0 , first_name: "Loading", last_name: "..."},
-  ]);
-
-
-  const fetchData = async () => {
-    try {
-      const data = await getLeaderboard();
-      const mappedData = data.map((entry: any) => ({
-        id: entry._id,
-        points: entry.total_points,
-        first_name: entry.first_name,
-        last_name: entry.last_name
-      }));
-
-      const sortedData = quickSort(mappedData, 0, mappedData.length - 1);
-
-      setLeaderboard(sortedData);
-    } catch (err) {
-      console.error('Unable to fetch leaderboard data', err);
-    }
-  };
-
-  useEffect(() => {
-    fetchData();
-
-    const interval = setInterval(() => {
-      fetchData();
-    }, 120000);
-
-    return () => clearInterval(interval);
-  }, []);
-
-  return (
-    <main className={`flex h-[100vh] w-[100vw] flex-col items-center justify-center overflow-hidden md:flex ${fuzzy.className}`}>
-      <div className="z-10 flex justify-center text-blue-100">
-      <div className="h-[60vh] w-[90vw] overflow-y-auto">
-        <table className="w-[90vw] border-separate rounded-3xl bg-gradient-to-b from-offblack-100 to-[#453148]   [border-spacing:1.00rem]">
-          <thead className="rounded-3xl ring-1 ring-pink-100 sm:ring-4">
-            <tr className="text-lg sm:text-2xl md:text-3xl lg:text-4xl ">
-              <th className="w-[20%] py-4 font-extrabold">Place</th>
-              <th className="w-[20%] font-extrabold">Player</th>
-              <th className="w-[20%] text-center font-extrabold">Points</th>
-            </tr>
-          </thead>
-          <tbody className="rounded-3xl ring-1 ring-pink-100 sm:ring-4">
-            {leaderboard.map((Leaderboard, index) => {
-              if (Leaderboard.id === 'Loading...') {
-                return (
-                  
-                  <tr
-                    key={index}
-                    className=" lx:text-5xl text-xs  sm:text-lg md:text-2xl lg:text-4xl"
-                  >
-                    <td className="text-center font-extrabold">
-                      <div className="flex min-h-[90px] items-center">
-                        <div>{Leaderboard.id}</div>
-                      </div>
-                    </td>
-                  </tr>
-                );
-              }
-              return (
-                <tr
-                  key={index}
-                  className="lx:text-5xl text-xs sm:text-lg md:text-2xl lg:text-4xl"
-                >
-                  <td className="text-center font-extrabold">{index + 1}</td>
-                  <td className="text-center font-extrabold">
-                    <div className="flex flex-row justify-center">
-                      <div className="flex w-[75%] flex-row items-center justify-between">
-                        {Leaderboard.first_name + " " + Leaderboard.last_name}
-                        <div className="relative h-[100px] w-[100px]">
-
-                        </div>
-                      </div>
-                    </div>
-                  </td>
-                  
-                  <td className="text-center font-extrabold">
-                    {Leaderboard.points}
-                  </td>
-                  
-                </tr>
-              );
-            })}
-          </tbody>
-        </table>
-        </div>
-      </div>
-    </main>
-  );
-};
-export default Leaderboard;
diff --git a/app/(pre-dashboard)/leaderboard/layout.tsx b/app/dashboard/leaderboard/layout.tsx
similarity index 100%
rename from app/(pre-dashboard)/leaderboard/layout.tsx
rename to app/dashboard/leaderboard/layout.tsx
diff --git a/app/dashboard/leaderboard/page.tsx b/app/dashboard/leaderboard/page.tsx
new file mode 100644
index 0000000..c4cfcba
--- /dev/null
+++ b/app/dashboard/leaderboard/page.tsx
@@ -0,0 +1,143 @@
+'use client';
+import React, { useEffect, useState } from 'react';
+import { getLeaderboard } from '@/app/lib/data';
+import GenericSection from '../(landing)/sections/GenericSection';
+import Image from 'next/image';
+import { fuzzy } from '@/app/ui/fonts';
+
+interface LeaderboardEntry {
+  id: string;
+  first_name: string;
+  last_name: string;
+  points: number;
+}
+
+function quickSort(
+  arr: LeaderboardEntry[],
+  low = 0,
+  high = arr.length - 1,
+): LeaderboardEntry[] {
+  if (low < high) {
+    const pivotIndex = partition(arr, low, high);
+    quickSort(arr, low, pivotIndex - 1);
+    quickSort(arr, pivotIndex + 1, high);
+  }
+  return arr;
+}
+
+function partition(arr: LeaderboardEntry[], low: number, high: number): number {
+  const pivot = arr[high];
+  let i = low - 1;
+
+  for (let j = low; j < high; j++) {
+    if (arr[j].points >= pivot.points) {
+      i++;
+      [arr[i], arr[j]] = [arr[j], arr[i]];
+    }
+  }
+
+  [arr[i + 1], arr[high]] = [arr[high], arr[i + 1]];
+  return i + 1;
+}
+
+const id_to_name = {};
+
+const Leaderboard = () => {
+  const [leaderboard, setLeaderboard] = useState<LeaderboardEntry[]>([
+    { id: 'Loading...', first_name: 'Loading...', last_name: '', points: 0 },
+    { id: 'Loading...', first_name: 'Loading...', last_name: '', points: 0 },
+    { id: 'Loading...', first_name: 'Loading...', last_name: '', points: 0 },
+    { id: 'Loading...', first_name: 'Loading...', last_name: '', points: 0 },
+    { id: 'Loading...', first_name: 'Loading...', last_name: '', points: 0 },
+  ]);
+
+  const fetchData = async () => {
+    try {
+      const data = await getLeaderboard();
+      console.log(data);
+      const mappedData = data.map((entry: any) => ({
+        id: entry._id,
+        first_name: entry.first_name,
+        last_name: entry.last_name,
+        points: entry.total_points,
+      }));
+
+      const sortedData = quickSort(mappedData, 0, mappedData.length - 1);
+      console.log(sortedData);
+      setLeaderboard(sortedData);
+    } catch (err) {
+      console.error('Unable to fetch leaderboard data', err);
+    }
+  };
+
+  useEffect(() => {
+    fetchData();
+
+    const interval = setInterval(() => {
+      fetchData();
+    }, 120000);
+
+    return () => clearInterval(interval);
+  }, []);
+
+  return (
+    <main
+      className={`flex h-[100vh] w-[100vw] flex-col items-center justify-center overflow-hidden md:flex ${fuzzy.className}`}
+    >
+      <div className="z-10 flex justify-center text-blue-100">
+        <div className="h-[60vh] w-[90vw] overflow-y-auto">
+          <table className="w-[90vw] border-separate rounded-3xl bg-gradient-to-b from-offblack-100 to-[#453148]   [border-spacing:1.00rem]">
+            <thead className="rounded-3xl ring-1 ring-pink-100 sm:ring-4">
+              <tr className="text-lg sm:text-2xl md:text-3xl lg:text-4xl ">
+                <th className="w-[20%] py-4 font-extrabold">Place</th>
+                <th className="w-[20%] font-extrabold">Player</th>
+                <th className="w-[20%] text-center font-extrabold">Points</th>
+              </tr>
+            </thead>
+            <tbody className="rounded-3xl ring-1 ring-pink-100 sm:ring-4">
+              {leaderboard.map((Leaderboard, index) => {
+                if (Leaderboard.id === 'Loading...') {
+                  return (
+                    <tr
+                      key={index}
+                      className=" lx:text-5xl text-xs  sm:text-lg md:text-2xl lg:text-4xl"
+                    >
+                      <td className="text-center font-extrabold">
+                        <div className="flex min-h-[90px] items-center">
+                          {Leaderboard.first_name} {Leaderboard.last_name}
+                        </div>
+                      </td>
+                    </tr>
+                  );
+                }
+                return (
+                  <tr
+                    key={index}
+                    className="lx:text-5xl text-xs sm:text-lg md:text-2xl lg:text-4xl"
+                  >
+                    <td className="text-center font-extrabold">{index + 1}</td>
+                    <td className="text-center font-extrabold">
+                      <div className="flex flex-row justify-center">
+                        <div className="flex w-[75%] flex-row items-center justify-between">
+                          <div>
+                            {Leaderboard.first_name} {Leaderboard.last_name}
+                          </div>
+                          <div className="relative h-[100px] w-[100px]"></div>
+                        </div>
+                      </div>
+                    </td>
+
+                    <td className="text-center font-extrabold">
+                      {Leaderboard.points}
+                    </td>
+                  </tr>
+                );
+              })}
+            </tbody>
+          </table>
+        </div>
+      </div>
+    </main>
+  );
+};
+export default Leaderboard;

From c6f91051f64c2200590355cc709f17169ce2b2bf Mon Sep 17 00:00:00 2001
From: Kevin Monisit <monisitkevin@gmail.com>
Date: Sat, 19 Oct 2024 16:48:54 -0400
Subject: [PATCH 2/2] Fixed import error

---
 app/dashboard/leaderboard/page.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/dashboard/leaderboard/page.tsx b/app/dashboard/leaderboard/page.tsx
index c4cfcba..11b3ed4 100644
--- a/app/dashboard/leaderboard/page.tsx
+++ b/app/dashboard/leaderboard/page.tsx
@@ -1,7 +1,7 @@
 'use client';
 import React, { useEffect, useState } from 'react';
 import { getLeaderboard } from '@/app/lib/data';
-import GenericSection from '../(landing)/sections/GenericSection';
+import GenericSection from '@/app/(pre-dashboard)/(landing)/sections/GenericSection';
 import Image from 'next/image';
 import { fuzzy } from '@/app/ui/fonts';