Refactor root admin dashboard UI

app/root/ui-kit/page.tsx

@@ -1,15 +1,8 @@
-import { ArrowLeft, LogOut } from "lucide-react";
-import Link from "next/link";
 import { redirect } from "next/navigation";
 
-import { AppHeader } from "@/components/layout/app-header";
-import { AppShell } from "@/components/layout/app-shell";
-import { AppSidebar } from "@/components/layout/app-sidebar";
-import { ThemeToggle } from "@/components/theme-toggle";
-import { getLocalizedPath } from "@/lib/locale";
+import { MotionFade } from "@/components/motion-fade";
+import { RootDashboardShell } from "@/components/root/root-dashboard-shell";
 import { clearAdminSessionCookie, isAdminAuthenticated } from "@/lib/admin-auth";
-import { getRootNavigation } from "@/lib/root-navigation";
-import { Button } from "@/components/ui/button";
 import { UiKitShowcase } from "@/components/ui/ui-kit-showcase";
 
 export const dynamic = "force-dynamic";
@@ -40,39 +33,17 @@ export default async function RootUiKitPage() {
     redirect("/root");
   }
 
-  const sidebarItems = getRootNavigation(copy, "ui-kit");
-
   return (
-    <AppShell
-      sidebar={
-        <AppSidebar
-          title={copy.title}
-          description={copy.subtitle}
-          items={sidebarItems}
-          footer={
-            <div className="space-y-2">
-              <div className="flex items-center gap-2">
-                <ThemeToggle ariaLabel="Theme wechseln" />
-              </div>
-              <Button asChild variant="outline" className="w-full justify-start">
-                <Link href={getLocalizedPath("de")}>
-                  <ArrowLeft className="h-4 w-4" />
-                  {copy.backToSite}
-                </Link>
-              </Button>
-              <form action={logoutAction}>
-                <Button type="submit" variant="destructive" className="w-full justify-start">
-                  <LogOut className="h-4 w-4" />
-                  {copy.logout}
-                </Button>
-              </form>
-            </div>
-          }
-        />
-      }
-      header={<AppHeader title={copy.title} description={copy.subtitle} />}
+    <RootDashboardShell
+      copy={copy}
+      active="ui-kit"
+      logoutAction={logoutAction}
+      headerTitle={copy.title}
+      headerDescription={copy.subtitle}
     >
-      <UiKitShowcase localeKey="de" />
-    </AppShell>
+      <MotionFade delay={0.1}>
+        <UiKitShowcase localeKey="de" />
+      </MotionFade>
+    </RootDashboardShell>
   );
 }