Update root sidebar header and actions

components/dashboard/sidebar.tsx

@@ -1,9 +1,8 @@
 import type { ReactNode } from "react";
 import Link from "next/link";
+import Image from "next/image";
 import type { LucideIcon } from "lucide-react";
-import { ShieldCheck } from "lucide-react";
 
-import { Badge } from "@/components/ui/badge";
 import { Separator } from "@/components/ui/separator";
 import { cn } from "@/lib/utils";
 
@@ -17,10 +16,11 @@ type DashboardSidebarItem = {
 
 type DashboardSidebarProps = {
   items: DashboardSidebarItem[];
+  top?: ReactNode;
   footer?: ReactNode;
 };
 
-export function DashboardSidebar({ items, footer }: DashboardSidebarProps) {
+export function DashboardSidebar({ items, top, footer }: DashboardSidebarProps) {
   function renderItem(item: DashboardSidebarItem, nested = false) {
     const Icon = item.icon;
 
@@ -47,8 +47,8 @@ export function DashboardSidebar({ items, footer }: DashboardSidebarProps) {
   return (
     <div className="flex h-full flex-col bg-sidebar/40">
       <div className="flex items-center gap-3 px-4 py-5">
-        <div className="rounded-xl bg-primary/10 p-2 text-primary">
-          <ShieldCheck className="h-5 w-5" />
+        <div className="overflow-hidden rounded-xl border border-border/70 bg-background shadow-sm">
+          <Image src="/favicon.ico" alt="Mohs Admin" width={36} height={36} className="h-9 w-9" />
         </div>
         <div className="min-w-0">
           <p className="truncate text-sm font-semibold text-foreground">Mohs Admin</p>
@@ -56,17 +56,7 @@ export function DashboardSidebar({ items, footer }: DashboardSidebarProps) {
         </div>
       </div>
 
-      <div className="px-4">
-        <div className="rounded-xl border border-border/70 bg-background/80 p-4">
-          <div className="flex items-center justify-between gap-3">
-            <div>
-              <p className="text-sm font-medium text-foreground">Private panel</p>
-              <p className="mt-1 text-xs text-muted-foreground">Single owner access</p>
-            </div>
-            <Badge variant="outline">Private</Badge>
-          </div>
-        </div>
-      </div>
+      {top ? <div className="px-4">{top}</div> : null}
 
       <Separator className="my-4" />