Added smash heros hero stat table

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

@@ -5,7 +5,7 @@ import { getSmashHerosDifficultyColor, getSmashHerosMostPlayedHero } from "@/lib
 import { NonNullStats } from "@/lib/schema/player"
 import GeneralStats from "../GeneralStats"
 import SmashHerosGeneralStats from "./stats"
-import { SmashHerosModeTable } from "./table"
+import { SmashHerosHeroTable, SmashHerosModeTable } from "./table"
 
 export default function SmashHerosStats({ stats }: { stats: NonNullStats["SmashHeros"] }) {
     if (!stats) return null
@@ -52,6 +52,8 @@ export default function SmashHerosStats({ stats }: { stats: NonNullStats["SmashH
             <Separator className="my-4" />
             <SmashHerosModeTable stats={stats} />
             <Separator className="my-4" />
+            <SmashHerosHeroTable stats={stats} />
+            <Separator className="my-4" />
         </GeneralStats>
     )
 }

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

@@ -1,9 +1,83 @@
 import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@/components/ui/table"
 import { formatNumber } from "@/lib/formatters"
-import { getSmashHerosModeName, getSmashHerosModeStats, getSmashHerosMostPlayedMode } from "@/lib/hypixel/smashhero/general"
+import {
+    getSmashHerosAllHerosStats,
+    getSmashHerosDifficultyColor,
+    getSmashHerosHero,
+    getSmashHerosHeroLvlPres,
+    getSmashHerosHeroPrestigeColor,
+    getSmashHerosModeName,
+    getSmashHerosModeStats,
+    getSmashHerosMostPlayedHero,
+    getSmashHerosMostPlayedMode
+} from "@/lib/hypixel/smashhero/general"
 import { NonNullStats } from "@/lib/schema/player"
 import { cn } from "@/lib/utils"
 
+export function SmashHerosHeroTable({ stats }: { stats: NonNullable<NonNullStats["SmashHeros"]> }) {
+    return (
+        <Table>
+            <SmashHerosHeroTableHeader />
+            <SmashHerosHeroTableStats stats={stats} />
+        </Table>
+    )
+}
+
+function SmashHerosHeroTableStats({ stats }: { stats: NonNullable<NonNullStats["SmashHeros"]> }) {
+    const heroStats = getSmashHerosAllHerosStats(stats)
+    return (
+        <TableBody>
+            {heroStats.map((v, i) => {
+                const { id, nums } = v
+                const hero = getSmashHerosHero(id)
+                const difficultyColor = getSmashHerosDifficultyColor(hero.difficulty)
+                const mostPlayed = getSmashHerosMostPlayedHero(stats)?.id === id
+                const { lvl, pg: pres } = getSmashHerosHeroLvlPres(id, stats)
+                const presColor = getSmashHerosHeroPrestigeColor(pres)
+                return (
+                    <TableRow key={i} className={cn(mostPlayed && "text-mc-light-purple")}>
+                        <TableCell>
+                            <span className={`text-mc-${difficultyColor}`}>{hero.name}</span>
+                            <span className="text-mc-gray">{" Lv"}</span>
+                            <span className="text-mc-aqua">{lvl}</span>
+                            {pres > 0 && (
+                                <span className={`text-mc-${presColor}`}>
+                                    {` 【${pres}】`}
+                                </span>
+                            )}
+                        </TableCell>
+                        {nums.map((n, j) => {
+                            return <TableCell key={j}>{formatNumber(n)}</TableCell>
+                        })}
+                    </TableRow>
+                )
+            })}
+        </TableBody>
+    )
+}
+
+function SmashHerosHeroTableHeader() {
+    const headerElements = [
+        "Hero",
+        "Kills",
+        "Deaths",
+        "KD",
+        "Wins",
+        "Losses",
+        "WL"
+    ]
+
+    return (
+        <TableHeader>
+            <TableRow>
+                {headerElements.map((v, i) => {
+                    return <TableHead key={i} className="font-bold">{v}</TableHead>
+                })}
+            </TableRow>
+        </TableHeader>
+    )
+}
+
 export function SmashHerosModeTable({ stats }: { stats: NonNullable<NonNullStats["SmashHeros"]> }) {
     return (
         <Table>