Styling

src/app/(main)/page.tsx

@@ -2,7 +2,7 @@ import { SearchBar } from "@/components/search-bar"
 
 export default function Home() {
     return (
-        <div className="min-h-screen flex flex-col items-center">
+        <div className="flex flex-col items-center min-h-screen">
             <div className="mt-[20vh]">
                 <h1 className="text-4xl font-bold text-center">Stats Hypixel</h1>
             </div>

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

@@ -1,8 +1,9 @@
 import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@/components/ui/table"
 import { formatNumber } from "@/lib/formatters"
 import { concatStatArrays } from "@/lib/funcs"
-import { _BedwarsStats, getBedwarsModeStats } from "@/lib/hypixel/bedwars"
+import { _BedwarsStats, getBedwarsModeStats, getBestMode } from "@/lib/hypixel/bedwars"
 import { Player } from "@/lib/schema/player"
+import { cn } from "@/lib/utils"
 
 export default function BedwarsStatTable({ stats }: { stats: Player["player"]["stats"]["Bedwars"] }) {
     return (
@@ -70,10 +71,10 @@ function BedwarsTableHeader() {
 
 function SoloStats({ stats }: { stats: Player["player"]["stats"]["Bedwars"] }) {
     const modeStats = getBedwarsModeStats("solo", stats as _BedwarsStats)
-
+    const isBest = getBestMode(stats as _BedwarsStats) === "solo"
 
     return (
-        <TableRow>
+        <TableRow className={cn(isBest ? "font-bold text-mc-light-purple" : undefined)}>
             <TableCell>Solo</TableCell>
             {modeStats.map((v, i) => {
                 return <TableCell key={i}>{typeof v === "number" ? formatNumber(v) : v}</TableCell>
@@ -84,10 +85,10 @@ function SoloStats({ stats }: { stats: Player["player"]["stats"]["Bedwars"] }) {
 
 function DoublesStats({ stats }: { stats: Player["player"]["stats"]["Bedwars"] }) {
     const modeStats = getBedwarsModeStats("doubles", stats as _BedwarsStats)
-
+    const isBest = getBestMode(stats as _BedwarsStats) === "doubles"
 
     return (
-        <TableRow>
+        <TableRow className={cn(isBest ? "font-bold text-mc-light-purple" : undefined)}>
             <TableCell>Doubles</TableCell>
             {modeStats.map((v, i) => {
                 return <TableCell key={i}>{typeof v === "number" ? formatNumber(v) : v}</TableCell>
@@ -98,10 +99,10 @@ function DoublesStats({ stats }: { stats: Player["player"]["stats"]["Bedwars"] }
 
 function ThreesStats({ stats }: { stats: Player["player"]["stats"]["Bedwars"] }) {
     const modeStats = getBedwarsModeStats("3s", stats as _BedwarsStats)
-
+    const isBest = getBestMode(stats as _BedwarsStats) === "3s"
 
     return (
-        <TableRow>
+        <TableRow className={cn(isBest ? "font-bold text-mc-light-purple" : undefined)}>
             <TableCell>3v3v3v3</TableCell>
             {modeStats.map((v, i) => {
                 return <TableCell key={i}>{typeof v === "number" ? formatNumber(v) : v}</TableCell>
@@ -112,10 +113,10 @@ function ThreesStats({ stats }: { stats: Player["player"]["stats"]["Bedwars"] })
 
 function FoursStats({ stats }: { stats: Player["player"]["stats"]["Bedwars"] }) {
     const modeStats = getBedwarsModeStats("4s", stats as _BedwarsStats)
-
+    const isBest = getBestMode(stats as _BedwarsStats) === "4s"
 
     return (
-        <TableRow>
+        <TableRow className={cn(isBest ? "font-bold text-mc-light-purple" : undefined)}>
             <TableCell>4v4v4v4</TableCell>
             {modeStats.map((v, i) => {
                 return <TableCell key={i}>{typeof v === "number" ? formatNumber(v) : v}</TableCell>
@@ -145,7 +146,6 @@ function CoreModeStats({ stats }: { stats: Player["player"]["stats"]["Bedwars"]
 function FourVFourStats({ stats }: { stats: Player["player"]["stats"]["Bedwars"] }) {
     const modeStats = getBedwarsModeStats("4v4", stats as _BedwarsStats)
 
-
     return (
         <TableRow>
             <TableCell>4v4</TableCell>
@@ -159,7 +159,6 @@ function FourVFourStats({ stats }: { stats: Player["player"]["stats"]["Bedwars"]
 function RushDoublesStats({ stats }: { stats: Player["player"]["stats"]["Bedwars"] }) {
     const modeStats = getBedwarsModeStats("rush_2s", stats as _BedwarsStats)
 
-
     return (
         <TableRow>
             <TableCell>Rush Doubles</TableCell>
@@ -173,7 +172,6 @@ function RushDoublesStats({ stats }: { stats: Player["player"]["stats"]["Bedwars
 function Rush4sStats({ stats }: { stats: Player["player"]["stats"]["Bedwars"] }) {
     const modeStats = getBedwarsModeStats("rush_4s", stats as _BedwarsStats)
 
-
     return (
         <TableRow>
             <TableCell>Rush 4v4v4v4</TableCell>
@@ -187,7 +185,6 @@ function Rush4sStats({ stats }: { stats: Player["player"]["stats"]["Bedwars"] })
 function UltimateDoublesStats({ stats }: { stats: Player["player"]["stats"]["Bedwars"] }) {
     const modeStats = getBedwarsModeStats("ultimate_2s", stats as _BedwarsStats)
 
-
     return (
         <TableRow>
             <TableCell>Ultimate Doubles</TableCell>
@@ -201,7 +198,6 @@ function UltimateDoublesStats({ stats }: { stats: Player["player"]["stats"]["Bed
 function Ultimate4sStats({ stats }: { stats: Player["player"]["stats"]["Bedwars"] }) {
     const modeStats = getBedwarsModeStats("ultimate_4s", stats as _BedwarsStats)
 
-
     return (
         <TableRow>
             <TableCell>Ultimate 4v4v4v4</TableCell>
@@ -215,7 +211,6 @@ function Ultimate4sStats({ stats }: { stats: Player["player"]["stats"]["Bedwars"
 function LuckyDoublesStats({ stats }: { stats: Player["player"]["stats"]["Bedwars"] }) {
     const modeStats = getBedwarsModeStats("lucky_2s", stats as _BedwarsStats)
 
-
     return (
         <TableRow>
             <TableCell>Lucky Doubles</TableCell>
@@ -229,7 +224,6 @@ function LuckyDoublesStats({ stats }: { stats: Player["player"]["stats"]["Bedwar
 function Lucky4sStats({ stats }: { stats: Player["player"]["stats"]["Bedwars"] }) {
     const modeStats = getBedwarsModeStats("lucky_4s", stats as _BedwarsStats)
 
-
     return (
         <TableRow>
             <TableCell>Lucky 4v4v4v4</TableCell>
@@ -243,7 +237,6 @@ function Lucky4sStats({ stats }: { stats: Player["player"]["stats"]["Bedwars"] }
 function VoidlessDoublesStats({ stats }: { stats: Player["player"]["stats"]["Bedwars"] }) {
     const modeStats = getBedwarsModeStats("voidless_2s", stats as _BedwarsStats)
 
-
     return (
         <TableRow>
             <TableCell>Voidless Doubles</TableCell>
@@ -257,7 +250,6 @@ function VoidlessDoublesStats({ stats }: { stats: Player["player"]["stats"]["Bed
 function Voidless4sStats({ stats }: { stats: Player["player"]["stats"]["Bedwars"] }) {
     const modeStats = getBedwarsModeStats("voidless_4s", stats as _BedwarsStats)
 
-
     return (
         <TableRow>
             <TableCell>Voidless 4v4v4v4</TableCell>
@@ -271,7 +263,6 @@ function Voidless4sStats({ stats }: { stats: Player["player"]["stats"]["Bedwars"
 function ArmedDoublesStats({ stats }: { stats: Player["player"]["stats"]["Bedwars"] }) {
     const modeStats = getBedwarsModeStats("armed_2s", stats as _BedwarsStats)
 
-
     return (
         <TableRow>
             <TableCell>Armed Doubles</TableCell>
@@ -285,7 +276,6 @@ function ArmedDoublesStats({ stats }: { stats: Player["player"]["stats"]["Bedwar
 function Armed4sStats({ stats }: { stats: Player["player"]["stats"]["Bedwars"] }) {
     const modeStats = getBedwarsModeStats("armed_4s", stats as _BedwarsStats)
 
-
     return (
         <TableRow>
             <TableCell>Armed 4v4v4v4</TableCell>
@@ -299,7 +289,6 @@ function Armed4sStats({ stats }: { stats: Player["player"]["stats"]["Bedwars"] }
 function Swap4sStats({ stats }: { stats: Player["player"]["stats"]["Bedwars"] }) {
     const modeStats = getBedwarsModeStats("swap_4s", stats as _BedwarsStats)
 
-
     return (
         <TableRow>
             <TableCell>Swap 4v4v4v4</TableCell>
@@ -313,7 +302,6 @@ function Swap4sStats({ stats }: { stats: Player["player"]["stats"]["Bedwars"] })
 function Underworld4sStats({ stats }: { stats: Player["player"]["stats"]["Bedwars"] }) {
     const modeStats = getBedwarsModeStats("underworld_4s", stats as _BedwarsStats)
 
-
     return (
         <TableRow>
             <TableCell>Underworld 4v4v4v4</TableCell>
@@ -327,7 +315,6 @@ function Underworld4sStats({ stats }: { stats: Player["player"]["stats"]["Bedwar
 function CastleStats({ stats }: { stats: Player["player"]["stats"]["Bedwars"] }) {
     const modeStats = getBedwarsModeStats("castle", stats as _BedwarsStats)
 
-
     return (
         <TableRow>
             <TableCell>Castle</TableCell>

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

@@ -72,7 +72,7 @@ async function SuspendedPage({ ign: pign }: { ign: string }) {
             </h1>
             <div className="flex gap-6 px-6 mt-8 w-full max-w-7xl">
                 <Sidebar level={level} ign={pign} player={player} guild={guild ?? undefined} />
-                <div className="space-y-4 w-3/4">
+                <div className="pb-4 space-y-4 w-3/4">
                     <BedwarsStats stats={player.stats.Bedwars} />
                     <SkyWarsStats stats={player.stats.SkyWars} />
                 </div>

src/lib/hypixel/bedwars.ts

@@ -94,6 +94,28 @@ export type BedwarsModeStats = {
     beds_lost_bedwars: number
 }
 
+export function getBestMode(stats: _BedwarsStats): "solo" | "doubles" | "3s" | "4s" | null {
+    const { wins_bedwars: solo } = getBedwarsModeStats("solo", stats, true)
+    const { wins_bedwars: doubles } = getBedwarsModeStats("doubles", stats, true)
+    const { wins_bedwars: threes } = getBedwarsModeStats("3s", stats, true)
+    const { wins_bedwars: fours } = getBedwarsModeStats("4s", stats, true)
+
+    const max = Math.max(solo, doubles, threes, fours)
+
+    switch (max) {
+        case solo:
+            return "solo"
+        case doubles:
+            return "doubles"
+        case threes:
+            return "3s"
+        case fours:
+            return "4s"
+        default:
+            return null
+    }
+}
+
 export function getBedwarsModeStats(mode: Mode, stats: _BedwarsStats, raw: true): BedwarsModeStats
 export function getBedwarsModeStats(mode: Mode, stats: _BedwarsStats, raw?: false): (string | number)[]
 export function getBedwarsModeStats(mode: Mode, stats: _BedwarsStats, raw = false) {