feat(ui): show rank in dashboard navigation

src/app/(frontend)/layout.tsx

@@ -19,6 +19,7 @@ import { CommandPalette } from "@/components/command-palette/CommandPalette";
 import { CommandPaletteProvider } from "@/components/command-palette/CommandPaletteContext";
 import { KeyboardShortcutsProvider } from "@/components/command-palette/KeyboardShortcutsProvider";
 import { isSuperuser } from "@/utils/access-control/hasPermission";
+import { Rank } from "@/payload-types";
 
 // Skip static prerendering of this layout (and all pages under (frontend)/).
 // The layout calls `getPayload()` at render time to resolve the current user,
@@ -58,6 +59,7 @@ export default async function RootLayout(props: { children: React.ReactNode }) {
 
   let isIntelligence = false;
   let isLogistics = false;
+  let currentRank = "";
 
   if (user) {
     [isIntelligence, isLogistics] = await Promise.all([
@@ -69,6 +71,7 @@ export default async function RootLayout(props: { children: React.ReactNode }) {
         collection: "profiles",
         where: { user: { equals: user.id } },
         select: {
+          rank: true,
           progression: {
             awards: true,
             scoreboard: true,
@@ -90,6 +93,8 @@ export default async function RootLayout(props: { children: React.ReactNode }) {
 
     const userXp = profileRes.docs[0]?.progression?.xp ?? 0;
     xpLevel = resolveLevel(userXp, experienceRes.docs);
+
+    currentRank = (profileRes.docs[0]?.rank as Rank).abbreviation;
   }
 
   return (
@@ -107,6 +112,7 @@ export default async function RootLayout(props: { children: React.ReactNode }) {
                   user={{
                     displayName: user.payloadDisplayName ?? "Guest",
                     username: user.username ?? "Not logged in",
+                    rank: currentRank,
                   }}
                   xpLevel={xpLevel}
                   adminUrl={payloadConfig.routes.admin}

src/app/(frontend)/page.tsx

@@ -205,7 +205,7 @@ export default async function HomePage() {
     <div className="p-5 flex flex-col gap-6">
       <div className="flex flex-col gap-1">
         <h1 className="text-lg font-semibold">
-          Welcome back, {profileUser?.displayName ?? user.username}
+          Welcome back, {(profile?.rank as Rank).name}. {/*{profileUser?.displayName ?? user.username}*/}
         </h1>
         <p className="text-sm text-muted-foreground">Here&apos;s your operations dashboard.</p>
       </div>

src/components/frontend/blocks/AppSidebar.tsx

@@ -31,6 +31,7 @@ import Image from "next/image";
 import Link from "next/link";
 import XPDisplay from "@/components/frontend/blocks/XPDisplay";
 import type { ResolvedLevel } from "@/utils/xp/resolveLevel";
+import { Rank } from "@/payload-types";
 
 const data = {
   navMain: [
@@ -151,6 +152,7 @@ export function AppSidebar({
   user: {
     displayName: string;
     username: string;
+    rank: string;
   };
   xpLevel: ResolvedLevel;
   adminUrl?: string;
@@ -228,7 +230,9 @@ export function AppSidebar({
       <SidebarFooter>
         <NavUser
           user={{
-            displayName: user?.displayName ?? "Not logged in",
+            displayName: user?.displayName
+              ? [user?.rank ? `(${user?.rank}.)` : null, user?.displayName].join(" ")
+              : "Not logged in",
             username: user?.username ?? "",
             avatar: "",
           }}