Files
hypixel-stats/src/app/(stats)/player/[ign]/_stats/megawalls/megawalls.tsx
2025-09-08 14:41:36 +02:00

73 lines
3.6 KiB
TypeScript

import { AccordionContent, AccordionItem, AccordionTrigger } from "@/components/ui/accordion"
import { Card, CardContent } from "@/components/ui/card"
import { Separator } from "@/components/ui/separator"
import { formatNumber } from "@/lib/formatters"
import { devide } from "@/lib/hypixel/general"
import { getDifficultyColor, getMostPlayed } from "@/lib/hypixel/megawalls/general"
import { NonNullStats } from "@/lib/schema/player"
import { cn } from "@/lib/utils"
import CollapsedStats from "../../_components/CollapsedStats"
import MegaWallsGeneralStats from "./stats"
import { MegaWallsClassesTable, MegaWallsModesTable } from "./table"
export default function MegaWallsStats({ stats }: { stats: NonNullStats["MegaWalls"] }) {
if (!stats) return null
const kd = formatNumber(devide(stats.kills, stats.deaths))
const fkd = formatNumber(devide(stats.final_kills, stats.final_deaths))
const wl = formatNumber(devide(stats.wins, stats.losses))
const mostPlayed = getMostPlayed(stats)
const difficultyColor = getDifficultyColor(mostPlayed !== null ? mostPlayed.difficulty : 1)
return (
<AccordionItem value="megawalls">
<Card className="py-0">
<CardContent>
<AccordionTrigger className="items-center py-2 hover:no-underline hover:cursor-pointer">
<h1 className="text-xl font-bold">Mega Walls</h1>
<div className="flex gap-4">
<CollapsedStats
stats={[
{
title: <p>Main</p>,
stat: (
<p className={cn("font-bold", mostPlayed && `text-mc-${difficultyColor}`)}>
{mostPlayed !== null ? mostPlayed.name : "Unknown"}
</p>
)
},
{
title: <p>KD</p>,
stat: <p className="text-muted-foreground">{kd}</p>
},
{
title: <p>FKD</p>,
stat: <p className="text-muted-foreground">{fkd}</p>
},
{
title: <p>Wins</p>,
stat: <p className="text-muted-foreground">{formatNumber(stats.wins)}</p>
},
{
title: <p>WL</p>,
stat: <p className="text-muted-foreground">{wl}</p>
}
]}
/>
</div>
</AccordionTrigger>
<AccordionContent>
<Separator className="my-4" />
<MegaWallsGeneralStats stats={stats} />
<Separator className="my-4" />
<MegaWallsClassesTable stats={stats} />
<Separator className="my-4" />
<MegaWallsModesTable stats={stats} />
<Separator className="my-4" />
</AccordionContent>
</CardContent>
</Card>
</AccordionItem>
)
}