dashboard-header.tsx (6571B)
1 import { Suspense } from "react" 2 import Link from "next/link" 3 import { Shield, Menu } from "lucide-react" 4 import { Button } from "@/components/ui/button" 5 import { Sheet, SheetContent, SheetTitle, SheetTrigger } from "@/components/ui/sheet" 6 import { Separator } from "@/components/ui/separator" 7 import AddBan from "../modals/add-ban" 8 import KickUserModal from "../modals/kick-user" 9 import { mockPolicyLists } from "../../app/dashboard/mockData" 10 import { VisuallyHidden } from "@radix-ui/react-visually-hidden"; 11 import BotSelector from "./bot-selector" 12 import Logout from "./logout" 13 import Notifications from "./notifications" 14 import { ListResponse } from "@/lib/api" 15 16 interface DashboardHeaderProps { 17 activeTab: "overview" | "reports" | "bans" | "analytics" | "settings" 18 teamIdParam?: string 19 listData: ListResponse | undefined 20 } 21 22 export function DashboardHeader({ activeTab, teamIdParam, listData }: DashboardHeaderProps) { 23 const policyLists = mockPolicyLists.filter((list) => list.teamId === teamIdParam) 24 25 return ( 26 <header className="sticky top-0 z-10 border-b border-gray-800 bg-black/80 backdrop-blur-sm"> 27 <div className="container flex h-16 items-center justify-between px-4 md:px-6"> 28 <div className="flex items-center gap-4"> 29 <Link href="/" className="flex items-center gap-2"> 30 <Shield className="h-6 w-6 text-purple-400" /> 31 <span className="text-xl font-bold tracking-tighter">Draupnir4All</span> 32 </Link> 33 34 {/* Global Team Selector */} 35 <Suspense> 36 <BotSelector listData={listData} selectedTeam={teamIdParam} /> 37 </Suspense> 38 </div> 39 40 <div className="flex items-center gap-4"> 41 <Notifications teamIdParam={teamIdParam} /> 42 43 {/* Quick Action Buttons */} 44 <AddBan header policyLists={policyLists} /> 45 46 <KickUserModal /> 47 48 <Logout /> 49 <Sheet> 50 <SheetTrigger asChild> 51 <Button variant="ghost" size="icon" className="md:hidden"> 52 <Menu className="h-5 w-5" /> 53 </Button> 54 </SheetTrigger> 55 <SheetContent side="right" className="bg-gray-950 border-gray-800 p-0"> 56 <VisuallyHidden asChild> 57 <SheetTitle>Navigaion</SheetTitle> 58 </VisuallyHidden> 59 <div className="flex flex-col h-full"> 60 <div className="border-b border-gray-800 p-4"> 61 <div className="flex items-center gap-2"> 62 <Shield className="h-5 w-5 text-purple-400" /> 63 <span className="font-medium">Draupnir4All</span> 64 </div> 65 </div> 66 <div className="p-4"> 67 <BotSelector listData={listData} selectedTeam={teamIdParam} /> 68 </div> 69 <nav className="flex flex-col p-4 gap-2"> 70 <Link href="/dashboard/overview"> 71 <Button 72 variant={activeTab === "overview" ? "secondary" : "ghost"} 73 className="justify-start w-full" 74 > 75 Overview 76 </Button> 77 </Link> 78 {/* Disabled because of missing draupnir support currently 79 <Link href="/dashboard/reports"> 80 <Button 81 variant={activeTab === "reports" ? "secondary" : "ghost"} 82 className="justify-start w-full" 83 > 84 Reports 85 </Button> 86 </Link>*/} 87 <Link href="/dashboard/bans"> 88 <Button 89 variant={activeTab === "bans" ? "secondary" : "ghost"} 90 className="justify-start w-full" 91 > 92 Bans 93 </Button> 94 </Link> 95 <Link href="/dashboard/analytics"> 96 <Button 97 variant={activeTab === "analytics" ? "secondary" : "ghost"} 98 className="justify-start w-full" 99 > 100 Analytics 101 </Button> 102 </Link> 103 <Link href="/dashboard/settings"> 104 <Button 105 variant={activeTab === "settings" ? "secondary" : "ghost"} 106 className="justify-start w-full" 107 > 108 Settings 109 </Button> 110 </Link> 111 112 <Separator className="my-2" /> 113 114 {/* Mobile Quick Actions */} 115 <AddBan header policyLists={policyLists} /> 116 117 <KickUserModal /> 118 </nav> 119 <div className="mt-auto border-t border-gray-800 p-4"> 120 <Logout /> 121 </div> 122 </div> 123 </SheetContent> 124 </Sheet> 125 </div> 126 </div> 127 </header> 128 ) 129 }