import type { Metadata } from "next";
import { requirePermission } from "@/lib/auth/session";
import { getProjects, getProjectUsers, getProjectTeams } from "@/lib/projects/queries";
import { PageHeader } from "@/components/ui/PageHeader";
import { ProjectsManager } from "./ProjectsManager";

export const metadata: Metadata = { title: "Projekte" };

export default async function ProjectsPage() {
  const session = await requirePermission("projects.view");
  const canManage = Boolean(session.user.permissions?.includes("projects.manage"));

  const [projects, users, teams] = await Promise.all([
    getProjects(),
    getProjectUsers(),
    getProjectTeams(),
  ]);

  return (
    <div className="flex flex-col gap-5">
      <PageHeader
        eyebrow="Steuerung"
        title="Projekte"
        description="Projekte mit Status, Fortschritt, Verantwortlichen, Team und Meilensteinen."
      />
      <ProjectsManager projects={projects} users={users} teams={teams} canManage={canManage} />
    </div>
  );
}
