diff --git a/src/app/(app)/leaderboard/page.tsx b/src/app/(app)/leaderboard/page.tsx
index 4790c432..4346b1a5 100644
--- a/src/app/(app)/leaderboard/page.tsx
+++ b/src/app/(app)/leaderboard/page.tsx
@@ -45,15 +45,100 @@ export default async function LeaderboardPage() {
const result = await getLeaderboard('global', null, 100);
return (
-
+
+
+
Leaderboard
+
+
+
+ {isOk(result) && result.data.entries.length === 0 ? (
+ - No entries yet.
+ ) : isOk(result) ? (
+ <>
+ {(() => {
+ // Current logged-in user handle from visible list
+ const currentGithubHandle = result.data.entries.find(
+ (e: any) => e.rank,
+ )?.githubHandle;
+
+ const isUserVisible = result.data.entries.some(
+ (entry: any) => entry.githubHandle === currentGithubHandle,
+ );
+
+ return (
+ <>
+ {result.data.entries.map((entry: any) => {
+ const isMe = entry.githubHandle === currentGithubHandle;
+
+ return (
+ -
+ #{entry.rank}
+
+ {entry.avatarUrl && (
+ // eslint-disable-next-line @next/next/no-img-element
+
+ )}
+
+
+ @{entry.githubHandle}
+
+ {entry.displayName && (
+
+ {entry.displayName}
+
+ )}
+
+ {isMe && (YOU)}
+
+
+ L{entry.level}
+
+
+ {entry.xp.toLocaleString()} XP
+
+
+ );
+ })}
+
+ {!isUserVisible && (
+ <>
+ -
+
+ YOUR RANK
+
+
+
+ -
+ Your rank is outside visible leaderboard.
+
+
+ )}
+
+ );
+ })()}
+
+ ) : (
+ - Couldn't load: {result.error.message}
+ )}
+
+
+
);
}
diff --git a/src/app/(app)/logout-button.tsx b/src/app/(app)/logout-button.tsx
index a197cfe0..6833baf7 100644
--- a/src/app/(app)/logout-button.tsx
+++ b/src/app/(app)/logout-button.tsx
@@ -4,7 +4,7 @@ import { LogOut } from 'lucide-react';
import { createBrowserClient } from '@supabase/ssr';
import { useRouter } from 'next/navigation';
-export function LogoutButton() {
+export function LogoutButton({ variant = 'sidebar' }: { variant?: 'sidebar' | 'navbar' }) {
const router = useRouter();
async function handleLogout() {
@@ -16,13 +16,18 @@ export function LogoutButton() {
router.push('/');
}
+ if (variant === 'navbar') {
+ return (
+
+ );
+ }
+
return (
-