pelagia-portal/App/app/(portal)/po/[id]/page.tsx

import { auth } from "@/auth";
import { db } from "@/lib/db";
import { notFound, redirect } from "next/navigation";
import { PoDetail } from "@/components/po/po-detail";
import { canViewAllPos } from "@/lib/permissions";
import { VendorIdForm } from "./vendor-id-form";
import type { Metadata } from "next";

interface Props {
  params: Promise<{ id: string }>;
}

export async function generateMetadata({ params }: Props): Promise<Metadata> {
  const { id } = await params;
  const po = await db.purchaseOrder.findUnique({ where: { id }, select: { poNumber: true } });
  return { title: po ? `PO ${po.poNumber}` : "Purchase Order" };
}

export default async function PoDetailPage({ params }: Props) {
  const session = await auth();
  if (!session?.user) redirect("/login");

  const { id } = await params;

  const po = await db.purchaseOrder.findUnique({
    where: { id },
    include: {
      submitter: true,
      vessel: true,
      account: true,
      vendor: true,
      lineItems: { orderBy: { sortOrder: "asc" } },
      documents: { orderBy: { uploadedAt: "desc" } },
      actions: { include: { actor: true }, orderBy: { createdAt: "asc" } },
      receipt: true,
      supersededBy: { select: { id: true, poNumber: true } },
      supersedes: { select: { id: true, poNumber: true } },
    },
  });

  if (!po) notFound();

  // Submitters can only view their own POs — unless they hold view_all_pos, or the
  // submitter-view-all feature flag grants them read access to every PO.
  if (!canViewAllPos(session.user.role) && po.submitterId !== session.user.id) {
    redirect("/dashboard");
  }

  const canProvideVendorId =
    po.status === "VENDOR_ID_PENDING" &&
    (
      (["TECHNICAL", "MANNING"].includes(session.user.role) && po.submitterId === session.user.id) ||
      ["ACCOUNTS", "MANAGER", "SUPERUSER"].includes(session.user.role)
    );

  const vendors = canProvideVendorId
    ? await db.vendor.findMany({ where: { isActive: true }, orderBy: { name: "asc" } })
    : [];

  return (
    <div className="max-w-6xl space-y-6">
      <PoDetail po={po} currentUserId={session.user.id} currentRole={session.user.role} />
      {canProvideVendorId && <VendorIdForm poId={po.id} vendors={vendors} />}
    </div>
  );
}