add admin header links

src/app/_components/header.tsx

@@ -8,12 +8,11 @@ import {
   DropdownMenuItem,
   DropdownMenuTrigger,
 } from '@/components/ui/dropdown-menu'
-import { auth } from '@/server/auth'
 import { ThemeToggle } from 'fumadocs-ui/components/layout/theme-toggle'
 import type { HomeLayoutProps } from 'fumadocs-ui/layouts/home'
 import type { LinkItemType } from 'fumadocs-ui/layouts/links'
 import { replaceOrDefault } from 'fumadocs-ui/layouts/shared'
-import { LogIn, LogOut, Settings, Tv, User } from 'lucide-react'
+import { LogIn, LogOut, Settings, Shield, Tv, User } from 'lucide-react'
 import { signIn, signOut, useSession } from 'next-auth/react'
 import Link from 'next/link'
 import { Fragment } from 'react'
@@ -37,6 +36,7 @@ export function Header({
 }) {
   const { data: session, status } = useSession()
   const isAuthenticated = status === 'authenticated'
+  const isAdmin = isAuthenticated && session?.user?.role === 'admin'
   const navItems = finalLinks.filter((item) =>
     ['nav', 'all'].includes(item.on ?? 'all')
   )
@@ -59,6 +59,36 @@ export function Header({
           .map((item, i) => (
             <NavbarLinkItem key={i} item={item} className='text-sm' />
           ))}
+        {isAdmin && (
+          <NavbarMenu>
+            <NavbarMenuTrigger className='text-sm'>
+              <div className='flex items-center gap-1'>
+                <Shield className='h-4 w-4' />
+                <span>Admin</span>
+              </div>
+            </NavbarMenuTrigger>
+            <NavbarMenuContent>
+              <NavbarMenuLink href='/admin/logs'>
+                <p className='-mb-1 font-medium text-sm'>Logs</p>
+                <p className='text-[13px] text-fd-muted-foreground'>
+                  View and manage logs
+                </p>
+              </NavbarMenuLink>
+              <NavbarMenuLink href='/admin/releases'>
+                <p className='-mb-1 font-medium text-sm'>Releases</p>
+                <p className='text-[13px] text-fd-muted-foreground'>
+                  Manage releases
+                </p>
+              </NavbarMenuLink>
+              <NavbarMenuLink href='/admin/stream/obs-control-panel'>
+                <p className='-mb-1 font-medium text-sm'>OBS Control Panel</p>
+                <p className='text-[13px] text-fd-muted-foreground'>
+                  Stream widget controls
+                </p>
+              </NavbarMenuLink>
+            </NavbarMenuContent>
+          </NavbarMenu>
+        )}
       </ul>
       <div className='flex flex-1 flex-row items-center justify-end gap-1.5'>
         {enableSearch ? (
@@ -164,6 +194,28 @@ export function Header({
               .map((item, i) => (
                 <MenuLinkItem key={i} item={item} className='sm:hidden' />
               ))}
+            {isAdmin && (
+              <div className='sm:hidden'>
+                <div className='flex items-center gap-1 px-3 py-2 font-medium'>
+                  <Shield className='h-4 w-4' />
+                  <span>Admin</span>
+                </div>
+                <div className='ml-4 flex flex-col gap-1'>
+                  <Link href='/admin/logs' className='px-3 py-1 text-sm'>
+                    Logs
+                  </Link>
+                  <Link href='/admin/releases' className='px-3 py-1 text-sm'>
+                    Releases
+                  </Link>
+                  <Link
+                    href='/admin/stream/obs-control-panel'
+                    className='px-3 py-1 text-sm'
+                  >
+                    OBS Control Panel
+                  </Link>
+                </div>
+              </div>
+            )}
             <div className='-ms-1.5 flex flex-row items-center gap-1.5 max-sm:mt-2'>
               {menuItems.filter(isSecondary).map((item, i) => (
                 <MenuLinkItem key={i} item={item} className='-me-1.5' />