"use client";
import { useCallback, useEffect, useState, type ReactNode } from "react";
import { useRouter } from "next/navigation";
import { AdminHeader } from "@/components/admin/AdminHeader";
import { AdminSidebar } from "@/components/admin/AdminSidebar";
import { ErrorState } from "@/components/ui/ErrorState";
import { Skeleton } from "@/components/ui/Skeleton";
import { adminApi } from "@/lib/api/admin";
import { ApiError } from "@/lib/api";
import { cn } from "@/lib/cn";
import type { AdminUser } from "@/types/admin";
const ADMIN_CACHE_KEY = "pv.admin.user";
function readCachedAdmin(): AdminUser | null {
if (typeof window === "undefined") {
return null;
}
try {
const raw = sessionStorage.getItem(ADMIN_CACHE_KEY);
if (!raw) {
return null;
}
const parsed = JSON.parse(raw) as AdminUser;
if (
typeof parsed?.id === "number" &&
typeof parsed?.name === "string" &&
typeof parsed?.email === "string"
) {
return parsed;
}
} catch {
// ignore cache parse errors
}
return null;
}
export function writeAdminCache(admin: AdminUser | null): void {
if (typeof window === "undefined") {
return;
}
if (!admin) {
sessionStorage.removeItem(ADMIN_CACHE_KEY);
return;
}
sessionStorage.setItem(ADMIN_CACHE_KEY, JSON.stringify(admin));
}
function AdminChromeSkeleton() {
return (
);
}
export function AdminShell({
title,
subtitle,
contentWidth = "full",
children,
}: {
title: string;
subtitle?: string;
/**
* `full` uses the content column beside the sidebar (default — matches dashboard).
* `contained` optionally keeps a page at `max-w-dashboard`.
*/
contentWidth?: "contained" | "full";
children: (admin: AdminUser) => ReactNode;
}) {
const router = useRouter();
// Start null on server and client to avoid sessionStorage hydration mismatches.
const [admin, setAdmin] = useState(null);
const [isLoading, setIsLoading] = useState(true);
const [sessionVerified, setSessionVerified] = useState(false);
const [loadError, setLoadError] = useState(false);
const [navOpen, setNavOpen] = useState(false);
const [isLoggingOut, setIsLoggingOut] = useState(false);
const verify = useCallback(async () => {
setIsLoading(true);
setLoadError(false);
try {
const me = await adminApi.me();
setAdmin(me);
writeAdminCache(me);
setSessionVerified(true);
} catch (error) {
if (error instanceof ApiError && error.kind === "unauthenticated") {
setAdmin(null);
writeAdminCache(null);
setSessionVerified(true);
} else {
setLoadError(true);
setSessionVerified(false);
}
} finally {
setIsLoading(false);
}
}, []);
useEffect(() => {
const cached = readCachedAdmin();
if (cached) {
setAdmin(cached);
}
void verify();
}, [verify]);
useEffect(() => {
const html = document.documentElement;
const { body } = document;
const previousHtmlOverflow = html.style.overflow;
const previousBodyOverflow = body.style.overflow;
html.style.overflow = "hidden";
body.style.overflow = "hidden";
return () => {
html.style.overflow = previousHtmlOverflow;
body.style.overflow = previousBodyOverflow;
};
}, []);
useEffect(() => {
if (isLoading || !sessionVerified) {
return;
}
if (!admin) {
router.replace("/admin/signin");
}
}, [admin, isLoading, sessionVerified, router]);
async function handleLogout() {
if (isLoggingOut) {
return;
}
setIsLoggingOut(true);
try {
await adminApi.logout();
} catch {
// still clear local session
} finally {
writeAdminCache(null);
setAdmin(null);
setIsLoggingOut(false);
router.replace("/admin/signin");
}
}
if (loadError) {
return (
void verify()}
/>
);
}
if (isLoading || !sessionVerified || !admin) {
return ;
}
return (
{navOpen ? (
) : null}
void handleLogout()}
isLoggingOut={isLoggingOut}
onOpenNav={() => setNavOpen(true)}
/>
{children(admin)}
);
}