projects/hypixel-stats
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Updated layout

Browse Source
This commit is contained in:
Taken
2025-08-22 11:43:19 +02:00
parent a7c8b1cef4
commit 85be250836
11 changed files with 201 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
package.json
View File

@@ -17,6 +17,7 @@
"class-variance-authority": "^0.7.1",
"clsx": "^2.1.1",
"lucide-react": "^0.528.0",
"motion": "^12.23.12",
"next": "15.4.4",
"next-themes": "^0.4.6",
"react": "19.1.0",

60
pnpm-lock.yaml generated
View File

@@ -29,6 +29,9 @@ importers:
lucide-react:
specifier: ^0.528.0
version: 0.528.0(react@19.1.0)
motion:
specifier: ^12.23.12
version: 12.23.12(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
next:
specifier: 15.4.4
version: 15.4.4(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
@@ -1275,6 +1278,20 @@ packages:
resolution: {integrity: sha512-dKx12eRCVIzqCxFGplyFKJMPvLEWgmNtUrpTiJIR5u97zEhRG8ySrtboPHZXx7daLxQVrl643cTzbab2tkQjxg==}
engines: {node: '>= 0.4'}
framer-motion@12.23.12:
resolution: {integrity: sha512-6e78rdVtnBvlEVgu6eFEAgG9v3wLnYEboM8I5O5EXvfKC8gxGQB8wXJdhkMy10iVcn05jl6CNw7/HTsTCfwcWg==}
peerDependencies:
'@emotion/is-prop-valid': '*'
react: ^18.0.0 || ^19.0.0
react-dom: ^18.0.0 || ^19.0.0
peerDependenciesMeta:
'@emotion/is-prop-valid':
optional: true
react:
optional: true
react-dom:
optional: true
function-bind@1.1.2:
resolution: {integrity: sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==}
@@ -1649,6 +1666,26 @@ packages:
engines: {node: '>=10'}
hasBin: true
motion-dom@12.23.12:
resolution: {integrity: sha512-RcR4fvMCTESQBD/uKQe49D5RUeDOokkGRmz4ceaJKDBgHYtZtntC/s2vLvY38gqGaytinij/yi3hMcWVcEF5Kw==}
motion-utils@12.23.6:
resolution: {integrity: sha512-eAWoPgr4eFEOFfg2WjIsMoqJTW6Z8MTUCgn/GZ3VRpClWBdnbjryiA3ZSNLyxCTmCQx4RmYX6jX1iWHbenUPNQ==}
motion@12.23.12:
resolution: {integrity: sha512-8jCD8uW5GD1csOoqh1WhH1A6j5APHVE15nuBkFeRiMzYBdRwyAHmSP/oXSuW0WJPZRXTFdBoG4hY9TFWNhhwng==}
peerDependencies:
'@emotion/is-prop-valid': '*'
react: ^18.0.0 || ^19.0.0
react-dom: ^18.0.0 || ^19.0.0
peerDependenciesMeta:
'@emotion/is-prop-valid':
optional: true
react:
optional: true
react-dom:
optional: true
ms@2.1.3:
resolution: {integrity: sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==}
@@ -3321,6 +3358,15 @@ snapshots:
dependencies:
is-callable: 1.2.7
framer-motion@12.23.12(react-dom@19.1.0(react@19.1.0))(react@19.1.0):
dependencies:
motion-dom: 12.23.12
motion-utils: 12.23.6
tslib: 2.8.1
optionalDependencies:
react: 19.1.0
react-dom: 19.1.0(react@19.1.0)
function-bind@1.1.2: {}
function.prototype.name@1.1.8:
@@ -3679,6 +3725,20 @@ snapshots:
mkdirp@3.0.1: {}
motion-dom@12.23.12:
dependencies:
motion-utils: 12.23.6
motion-utils@12.23.6: {}
motion@12.23.12(react-dom@19.1.0(react@19.1.0))(react@19.1.0):
dependencies:
framer-motion: 12.23.12(react-dom@19.1.0(react@19.1.0))(react@19.1.0)
tslib: 2.8.1
optionalDependencies:
react: 19.1.0
react-dom: 19.1.0(react@19.1.0)
ms@2.1.3: {}
nanoid@3.3.11: {}

24
src/app/(main)/layout.tsx
View File

@@ -1,3 +1,4 @@
import { ThemeSwitcher } from "@/components/theme-switcher"
import { Button } from "@/components/ui/button"
import { Settings } from "lucide-react"
import Link from "next/link"
@@ -6,15 +7,20 @@ import { ReactNode } from "react"
export default function RootLayout({ children }: Readonly<{ children: ReactNode }>) {
return (
<>
<nav className="flex items-center justify-between px-6 py-4 border-b">
<Link href="/">
<span className="font-semibold text-lg">Hypixel Stats</span>
</Link>
<Button variant="ghost" size="icon" aria-label="Settings">
<Settings className="h-5 w-5" />
</Button>
</nav>
<div>
<header className="fixed w-screen bg-background/50 backdrop-blur-sm">
<nav className="flex justify-between items-center px-6 border-b h-header">
<Link href="/">
<span className="text-lg font-semibold">Hypixel Stats</span>
</Link>
<div className="flex items-center">
<ThemeSwitcher />
<Button variant="ghost" size="icon" aria-label="Settings">
<Settings className="w-5 h-5" />
</Button>
</div>
</nav>
</header>
<div className="pt-header">
{children}
</div>
</>

12
src/app/(stats)/layout.tsx
View File

@@ -1,4 +1,5 @@
import { SearchBar } from "@/components/search-bar"
import { ThemeSwitcher } from "@/components/theme-switcher"
import { Button } from "@/components/ui/button"
import { Settings } from "lucide-react"
import Link from "next/link"
@@ -13,12 +14,15 @@ export default function StatsLayout({ children }: Readonly<{ children: ReactNode
<span className="text-lg font-semibold">Hypixel Stats</span>
</Link>
<SearchBar navbar />
<Button variant="ghost" size="icon" aria-label="Settings">
<Settings className="w-5 h-5" />
</Button>
<div className="flex items-center">
<ThemeSwitcher />
<Button variant="ghost" size="icon" aria-label="Settings">
<Settings className="w-5 h-5" />
</Button>
</div>
</nav>
</header>
<div className="pt-header">
<div className="pt-header min-h-content">
{children}
</div>
</>

13
src/app/(stats)/player/[ign]/_stats/bedwars/bedwars.tsx
View File

@@ -6,7 +6,7 @@ import { Separator } from "@/components/ui/separator"
import { getBWLevelForExp, getTotalExpForLevel } from "@/lib/hypixel/bedwarsLevel"
import { getProgress } from "@/lib/hypixel/general"
import { Player } from "@/lib/schema/player"
import { ChevronDown, ChevronUp, Menu } from "lucide-react"
import { ChevronDown, ChevronUp } from "lucide-react"
import { useEffect, useRef, useState } from "react"
import CollapsedStats from "../../_components/CollapsedStats"
import { BedwarsLevel, BedwarsProgress } from "./bedwars-components"
@@ -56,7 +56,7 @@ export default function BedwarsStats({ stats }: { stats: Player["player"]["stats
<CardContent>
<Collapsible ref={ref}>
<div className="flex justify-between">
<h1 className="text-xl font-bold">Bedwars</h1>
<h1 className="text-xl font-bold">BedWars</h1>
<div className="flex gap-4">
<CollapsedStats
stats={[
@@ -87,12 +87,9 @@ export default function BedwarsStats({ stats }: { stats: Player["player"]["stats
]}
/>
</div>
<div className="flex gap-2 items-center">
<CollapsibleTrigger className="transition-all">
{opened === false ? <ChevronDown /> : <ChevronUp />}
</CollapsibleTrigger>
<Menu />
</div>
<CollapsibleTrigger className="transition-all">
{opened === false ? <ChevronDown /> : <ChevronUp />}
</CollapsibleTrigger>
</div>
<CollapsibleContent>
<Separator className="my-4" />

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

@@ -54,7 +54,7 @@ async function SuspendedPage({ ign: pign }: { ign: string }) {
const level = getExactLevel(player.networkExp)
return (
<div className="flex flex-col items-center min-h-screen">
<div className="flex flex-col items-center">
<h1 className="text-3xl font-bold mt-25">
<DisplayName
ign={player.displayname}
@@ -71,7 +71,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="w-3/4">
<div className="space-y-4 w-3/4">
<BedwarsStats stats={player.stats.Bedwars} />
</div>
</div>

9
src/app/layout.tsx
View File

@@ -1,13 +1,16 @@
import { ReactNode } from "react"
import "./globals.css"
import ThemeProvider from "@/components/ThemeProvider"
import { Toaster } from "@/components/ui/sonner"
export default function RootLayout({ children }: Readonly<{ children: ReactNode }>) {
return (
<html lang="en" suppressHydrationWarning>
<body className="antialiased dark">
{children}
<Toaster />
<body className="antialiased">
<ThemeProvider>
{children}
<Toaster />
</ThemeProvider>
</body>
</html>
)

14
src/components/ThemeProvider.tsx Normal file
View File

@@ -0,0 +1,14 @@
import { ThemeProvider as OriginalThemeProvider } from "next-themes"
import { ReactNode } from "react"
export default function ThemeProvider({ children }: Readonly<{ children: ReactNode }>) {
return (
<OriginalThemeProvider
attribute="class"
defaultTheme="system"
enableSystem
>
{children}
</OriginalThemeProvider>
)
}

88
src/components/theme-switcher.tsx Normal file
View File

@@ -0,0 +1,88 @@
"use client"
import { cn } from "@/lib/utils"
import { Monitor, Moon, Sun } from "lucide-react"
import { motion } from "motion/react"
import { useTheme } from "next-themes"
import { useCallback, useEffect, useState } from "react"
const themes = [
{
key: "light",
icon: Sun,
label: "Light theme"
},
{
key: "dark",
icon: Moon,
label: "Dark theme"
},
{
key: "system",
icon: Monitor,
label: "System theme"
}
]
export type ThemeSwitcherProps = {
className?: string
vertical?: boolean
}
export function ThemeSwitcher({ className, vertical = false }: ThemeSwitcherProps) {
const { theme, setTheme } = useTheme()
const [mounted, setMounted] = useState(false)
const handleThemeClick = useCallback(
(themeKey: "light" | "dark" | "system") => {
setTheme(themeKey)
},
[setTheme]
)
useEffect(() => {
setMounted(true)
}, [])
if (!mounted) {
return null
}
return (
<div
className={cn(
"relative isolate flex p-1 rounded-full bg-background ring-1 ring-border",
vertical ? "flex-col h-auto w-8" : "h-8",
className
)}
>
{themes.map(({ key, icon: Icon, label }) => {
const isActive = theme === key
return (
<button
aria-label={label}
className="relative w-6 h-6 rounded-full"
key={key}
onClick={() => handleThemeClick(key as "light" | "dark" | "system")}
type="button"
>
{isActive && (
<motion.div
className="absolute inset-0 rounded-full bg-secondary"
layoutId={vertical ? "activeThemeVertical" : "activeTheme"}
transition={{ type: "spring", duration: 0.5 }}
/>
)}
<Icon
className={cn(
"relative z-10 m-auto h-4 w-4",
isActive ? "text-foreground" : "text-muted-foreground"
)}
/>
</button>
)
})}
</div>
)
}

1
src/lib/hypixel/validatePlayer.ts
View File

@@ -27,4 +27,3 @@ export async function validatePlayer(ign: string) {
message: "Player found"
}
}

4
src/lib/schema/stats.ts
View File

@@ -21,8 +21,8 @@ export const bedwarsStatsSchema = z.looseObject({
slumber: z.looseObject({
tickets: z.number().default(0),
bag_type: z.string(),
total_tickets_earned: z.number(),
doublers: z.number(),
total_tickets_earned: z.number().default(0),
doublers: z.number().default(0),
room: z.record(z.string(), z.boolean())
}).optional(),
eight_one_winstreak: z.number().optional(),