Organize/app/(app)/layout.tsx

59 lines
2.5 KiB
TypeScript

import { redirect } from "next/navigation";
import { auth } from "@/auth";
import { prisma } from "@/lib/db";
import type { ThemeName } from "@/lib/themes";
import type { ProjectDTO } from "@/types/project";
import { SideNavProvider } from "@/components/nav/side-nav-provider";
import { SideNav } from "@/components/nav/side-nav";
import { ProjectsProvider } from "@/components/projects/projects-context";
import { ScheduledPanelProvider } from "@/components/scheduled/scheduled-panel-provider";
import { ScheduledPanel } from "@/components/scheduled/scheduled-panel";
import { BoardViewProvider } from "@/components/board/board-view-provider";
import { HoldOnCompleteProvider } from "@/components/hold-on-complete";
export default async function AppLayout({ children }: { children: React.ReactNode }) {
const session = await auth();
// Defense in depth: proxy.ts already redirects unauthenticated requests,
// but every protected data boundary should check for itself too.
if (!session?.user) redirect("/login");
// Just the list for the sidebar/`/projects` page -- each project's own
// board (categories/groups/todos) is fetched separately by its own page.
// `theme` is stored as free text; the set of valid names is enforced
// client-side (ProjectThemeSchema) so a plain assertion is safe here.
const projects: ProjectDTO[] = (
await prisma.project.findMany({
where: { ownerId: session.user.id },
orderBy: { createdAt: "asc" },
select: { id: true, title: true, theme: true },
})
).map((p) => ({
id: p.id,
title: p.title,
theme: p.theme as ThemeName | null,
}));
return (
<SideNavProvider>
<ScheduledPanelProvider>
<ProjectsProvider initialProjects={projects}>
<BoardViewProvider>
<HoldOnCompleteProvider>
{/* On small screens the three-column shell would crush the
board; give it a sensible minimum width and let the page
scroll horizontally instead, and drop the Scheduled panel
(auxiliary on a phone) until the viewport can hold it. */}
<div className="flex h-screen min-w-[860px] overflow-x-auto">
<SideNav userEmail={session.user.email ?? ""} role={session.user.role} />
<main className="flex-1 overflow-auto">{children}</main>
<ScheduledPanel />
</div>
</HoldOnCompleteProvider>
</BoardViewProvider>
</ProjectsProvider>
</ScheduledPanelProvider>
</SideNavProvider>
);
}