Improve admin save UX and portfolio navigation

components/root/root-dashboard-shell.tsx

@@ -15,12 +15,16 @@ import Link from "next/link";
 
 import { DashboardLayout } from "@/components/dashboard/dashboard-layout";
 import { MotionFade } from "@/components/motion-fade";
+import { FormSaveButton } from "@/components/root/form-save-button";
+import { SidebarMaintenanceControl } from "@/components/root/sidebar-maintenance-control";
 import { ThemeToggle } from "@/components/theme-toggle";
 import { Button } from "@/components/ui/button";
-import { getSiteSettingsMediaBindings } from "@/lib/app-config";
+import { getMaintenanceMode, getSiteSettingsMediaBindings } from "@/lib/app-config";
 import { getLocalizedPath } from "@/lib/locale";
 import { getRootNavigation } from "@/lib/root-navigation";
 
+import { updateMaintenanceModeAction } from "@/app/root/maintenance/actions";
+
 type RootDashboardCopy = {
   title: string;
   subtitle: string;
@@ -41,6 +45,9 @@ type RootDashboardShellProps = {
   logoutAction: () => Promise<void>;
   headerTitle: string;
   headerDescription: string;
+  saveFormId?: string;
+  saveFormSelector?: string;
+  saveButtonLabel?: string;
   headerActions?: ReactNode;
   sidebarTopContent?: ReactNode;
   toolbar?: ReactNode;
@@ -54,12 +61,18 @@ export async function RootDashboardShell({
   logoutAction,
   headerTitle,
   headerDescription,
+  saveFormId,
+  saveFormSelector,
+  saveButtonLabel,
   headerActions,
   sidebarTopContent,
   toolbar,
   children,
 }: RootDashboardShellProps) {
-  const mediaBindings = await getSiteSettingsMediaBindings();
+  const [mediaBindings, maintenanceEnabled] = await Promise.all([
+    getSiteSettingsMediaBindings(),
+    getMaintenanceMode(),
+  ]);
   const sidebarItems = getRootNavigation(copy, active, portfolioChild).filter(
     (item) => item.href !== "/root/maintenance" && item.href !== "/root/ui-kit",
   );
@@ -81,6 +94,11 @@ export async function RootDashboardShell({
                 : FolderKanban;
   const sharedActions = (
     <>
+      <FormSaveButton
+        formIds={saveFormId ? ["sidebar-maintenance-form", saveFormId] : ["sidebar-maintenance-form"]}
+        formSelectors={saveFormSelector ? [saveFormSelector] : undefined}
+        label={saveButtonLabel ?? "Speichern"}
+      />
       <ThemeToggle ariaLabel="Theme wechseln" />
     </>
   );
@@ -105,16 +123,13 @@ export async function RootDashboardShell({
       }
       sidebarFooter={
         <>
-          <Button
-            asChild
-            variant={active === "maintenance" ? "default" : "outline"}
-            className="w-full justify-between"
-          >
-            <Link href="/root/maintenance">
-              {copy.maintenance}
-              <ShieldAlert className="h-4 w-4" />
-            </Link>
-          </Button>
+          <SidebarMaintenanceControl
+            action={updateMaintenanceModeAction}
+            initialEnabled={maintenanceEnabled}
+            label={copy.maintenance}
+            onLabel="Besucher gesperrt"
+            offLabel="Website offen"
+          />
           <Button
             asChild
             variant={active === "ui-kit" ? "default" : "outline"}