julienfroidefond/got-gaming
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add bio field to user model and update related components: Enhance leaderboard and profile features by including a bio field in user data. Update API routes, UI components, and validation logic to support bio input and display, improving user profiles and leaderboard entries.

Browse Source
This commit is contained in:
Julien Froidefond
2025-12-09 22:00:19 +01:00
parent 16b0437ecb
commit 3a0dd57bb6
13 changed files with 147 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
components/Leaderboard.tsx
View File

@@ -8,6 +8,7 @@ interface LeaderboardEntry {
score: number;
level: number;
avatar?: string | null;
bio?: string | null;
}
// Format number with consistent locale to avoid hydration mismatch
@@ -48,7 +49,7 @@ export default function Leaderboard() {
LEADERBOARD
</h2>
<div className="bg-black/80 border-2 border-pixel-gold/30 rounded-lg overflow-hidden backdrop-blur-sm">
<div className="bg-black/80 border-2 border-pixel-gold/30 rounded-lg backdrop-blur-sm">
{/* Header */}
<div className="bg-gray-900/80 border-b-2 border-pixel-gold/30 grid grid-cols-12 gap-4 p-4 font-bold text-sm text-gray-300">
<div className="col-span-1 text-center">Rank</div>
@@ -58,11 +59,11 @@ export default function Leaderboard() {
</div>
{/* Entries */}
<div className="divide-y divide-pixel-gold/10">
<div className="divide-y divide-pixel-gold/10 overflow-visible">
{leaderboard.map((entry) => (
<div
key={entry.rank}
className={`grid grid-cols-12 gap-4 p-4 hover:bg-gray-900/50 transition ${
className={`grid grid-cols-12 gap-4 p-4 hover:bg-gray-900/50 transition relative ${
entry.rank <= 3 ? "bg-gray-950/50" : "bg-black/40"
}`}
>
@@ -81,10 +82,20 @@ export default function Leaderboard() {
{entry.rank}
</span>
</div>
<div className="col-span-5 flex items-center">
<span className="font-bold text-pixel-gold">
<div className="col-span-5 flex items-center relative group">
<span className="font-bold text-pixel-gold cursor-pointer relative z-10">
{entry.username}
</span>
{entry.bio && (
<div className="absolute left-0 top-full mt-1 z-[100] w-72 p-4 bg-black border-2 border-pixel-gold/70 rounded-lg shadow-2xl opacity-0 invisible group-hover:opacity-100 group-hover:visible transition-all duration-200 pointer-events-none">
<div className="text-xs text-pixel-gold uppercase tracking-widest mb-2 border-b border-pixel-gold/30 pb-1 font-bold">
Bio
</div>
<p className="text-sm text-gray-200 leading-relaxed whitespace-pre-wrap break-words">
{entry.bio}
</p>
</div>
)}
</div>
<div className="col-span-3 text-right flex items-center justify-end">
<span className="font-mono text-gray-300">