import type { PropsWithChildren } from "react";
import PageHeader from "@/src/components/general/page-header";
import PageBody from "@/src/components/general/page-body";
import SubNav from "@/src/components/general/sub-nav";
import InlineAlert from "@/src/components/general/inline-alert";
import { SetupNav } from "../(data)/setup-nav-dict";

type Props = PropsWithChildren & {
    title: string;
    description: string;
    /** `false` shows the not-root warning */
    is_root?: boolean;
};

/** Header, sub-navigation and body shared by the three setup subpages. */
export default function SetupPageFrame({ title, description, is_root, children }: Props) {
    return (
        <>
            <PageHeader
                title={title}
                description={description}
                back={{ href: "/admin", title: "Dashboard" }}
                nav={<SubNav label="Setup sections" items={SetupNav} />}
            />
            <PageBody>
                {is_root === false ? (
                    <InlineAlert
                        tone="warning"
                        msg="wg-ui isn't running as root. Installs and tunnel management may fail."
                    />
                ) : null}
                {children}
            </PageBody>
        </>
    );
}