Added warlords class stats table

src/app/(stats)/player/[ign]/_client.tsx

@@ -10,7 +10,7 @@ import { CSS } from "@dnd-kit/utilities"
 import Cookies from "js-cookie"
 import { GripVertical } from "lucide-react"
 import { usePathname } from "next/navigation"
-import { useEffect, useMemo, useState } from "react"
+import { useEffect, useRef, useState } from "react"
 
 import ArcadeStats from "./_stats/arcade/arcade"
 import BedwarsStats from "./_stats/bedwars/bedwars"
@@ -114,17 +114,14 @@ export function PlayerStats(
         })
     )
 
-    const cookieOpts = useMemo(() => {
-        const cookieOpts: Parameters<typeof Cookies.set>[2] = {
-            secure: process.env.NODE_ENV === "production",
-            sameSite: "lax",
-            expires: 365
-        }
-        return cookieOpts
-    }, [])
+    const cookieOpts = useRef<Parameters<typeof Cookies.set>[2]>({
+        secure: process.env.NODE_ENV === "production",
+        sameSite: "lax",
+        expires: 365
+    })
 
     function updateStatsOrder(arr: string[]) {
-        Cookies.set(COOKIE_VALUES.statsOrder, JSON.stringify(arr), cookieOpts)
+        Cookies.set(COOKIE_VALUES.statsOrder, JSON.stringify(arr), cookieOpts.current)
     }
 
     function handleDragEnd(event: DragEndEvent) {
@@ -147,7 +144,7 @@ export function PlayerStats(
         }
         const cookie = Cookies.get(COOKIE_VALUES.statsOrder)
         if (cookie) {
-            Cookies.set(COOKIE_VALUES.statsOrder, cookie, cookieOpts)
+            Cookies.set(COOKIE_VALUES.statsOrder, cookie, cookieOpts.current)
         }
     }, [layout, cookieOpts])
 

src/app/(stats)/player/[ign]/_stats/warlords/table.tsx

@@ -1,9 +1,82 @@
 import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@/components/ui/table"
 import { formatNumber } from "@/lib/formatters"
-import { getWarlordsModeName, getWarlordsModeStats, getWarlordsMostPlayedMode } from "@/lib/hypixel/warlords/general"
+import {
+    getWarlordsClassLevel,
+    getWarlordsClassName,
+    getWarlordsClassStats,
+    getWarlordsModeName,
+    getWarlordsModeStats,
+    getWarlordsMostPlayedClass,
+    getWarlordsMostPlayedMode
+} from "@/lib/hypixel/warlords/general"
 import { NonNullStats } from "@/lib/schema/player"
 import { cn } from "@/lib/utils"
 
+export function WarlordsClassStatsTable({ stats }: { stats: NonNullable<NonNullStats["Warlords"]> }) {
+    return (
+        <Table>
+            <WarlordsClassStatsTableHeader />
+            <TableBody>
+                <WarlordsClassStatsTableStat classId="mage" stats={stats} />
+                <WarlordsClassStatsTableStat classId="paladin" stats={stats} />
+                <WarlordsClassStatsTableStat classId="shaman" stats={stats} />
+                <WarlordsClassStatsTableStat classId="warrior" stats={stats} />
+                <WarlordsClassStatsTableStat classId="all" stats={stats} />
+            </TableBody>
+        </Table>
+    )
+}
+
+function WarlordsClassStatsTableStat(
+    { classId, stats }: { classId: Parameters<typeof getWarlordsClassStats>[0], stats: NonNullable<NonNullStats["Warlords"]> }
+) {
+    const classStats = getWarlordsClassStats(classId, stats)
+    const klassName = getWarlordsClassName(classId)
+    const mostPlayed = getWarlordsMostPlayedClass(stats)?.id === classId
+
+    return (
+        <TableRow className={cn(mostPlayed && "text-mc-light-purple")}>
+            {classId === "all" ?
+                (
+                    <TableCell>
+                        {klassName}
+                    </TableCell>
+                )
+                : (
+                    <TableCell>
+                        <span className="text-mc-gray">{`Lv ${getWarlordsClassLevel(classId, stats)} `}</span>
+                        <span className="text-mc-gold">{klassName}</span>
+                    </TableCell>
+                )}
+            {classStats.map((v, i) => {
+                return <TableCell key={i}>{formatNumber(v)}</TableCell>
+            })}
+        </TableRow>
+    )
+}
+
+function WarlordsClassStatsTableHeader() {
+    const headerElements = [
+        "Class",
+        "Damage",
+        "Damage Prevented",
+        "Healing",
+        "Wins",
+        "Losses",
+        "WL"
+    ]
+
+    return (
+        <TableHeader>
+            <TableRow>
+                {headerElements.map((v, i) => {
+                    return <TableHead key={i} className="font-bold">{v}</TableHead>
+                })}
+            </TableRow>
+        </TableHeader>
+    )
+}
+
 export function WarlordsModeStatsTable({ stats }: { stats: NonNullable<NonNullStats["Warlords"]> }) {
     return (
         <Table>

src/app/(stats)/player/[ign]/_stats/warlords/warlords.tsx

@@ -6,7 +6,7 @@ import { NonNullStats } from "@/lib/schema/player"
 import GeneralStats from "../GeneralStats"
 import { WarlordsWeaponsBar } from "./client"
 import WarlordsGeneralStats from "./stats"
-import { WarlordsModeStatsTable } from "./table"
+import { WarlordsClassStatsTable, WarlordsModeStatsTable } from "./table"
 
 export default function WarlordsStats({ stats }: { stats: NonNullStats["Warlords"] }) {
     if (!stats) return null
@@ -44,6 +44,8 @@ export default function WarlordsStats({ stats }: { stats: NonNullStats["Warlords
             <Separator className="my-4" />
             <WarlordsWeaponsBar stats={stats} />
             <Separator className="my-4" />
+            <WarlordsClassStatsTable stats={stats} />
+            <Separator className="my-4" />
             <WarlordsModeStatsTable stats={stats} />
             <Separator className="my-4" />
         </GeneralStats>