// File: frontend/app/layout.jsx
import Link from "next/link";
import { redirect } from "next/navigation";
import { cookies, headers } from "next/headers";
// à¸–à¹‰à¸²à¸¡à¸µ lib rbac à¹€à¸”à¸´à¸¡à¸­à¸¢à¸¹à¹ˆà¹ƒà¸«à¹‰à¹ƒà¸Šà¹‰à¸•à¹ˆà¸­à¹„à¸”à¹‰
import { can } from "@/lib/rbac";

// à¹à¸à¹‰ title à¹ƒà¸«à¹‰à¸–à¸¹à¸à¸ªà¸°à¸à¸”
export const metadata = { title: "DMS | Protected" };

const API_BASE = (process.env.NEXT_PUBLIC_API_BASE || "").replace(/\/$/, "");

async function fetchSessionFromAPI() {
  // à¸”à¸¶à¸‡à¸„à¸¸à¸à¸à¸µà¹‰à¸ˆà¸£à¸´à¸‡à¸ˆà¸²à¸à¸à¸±à¹ˆà¸‡à¹€à¸‹à¸´à¸£à¹Œà¸Ÿà¹€à¸§à¸­à¸£à¹Œ à¹à¸¥à¹‰à¸§à¸ªà¹ˆà¸‡à¸•à¹ˆà¸­à¹ƒà¸«à¹‰ backend
  const cookieHeader = cookies().toString(); // serialize à¸—à¸±à¹‰à¸‡à¸Šà¸¸à¸”
  const hostHdr = headers().get("host");
  const protoHdr = headers().get("x-forwarded-proto") || "https";

  const res = await fetch(`${API_BASE}/api/auth/me`, {
    method: "GET",
    headers: {
      Cookie: cookieHeader,
      // à¹€à¸œà¸·à¹ˆà¸­ backend à¸•à¸£à¸§à¸ˆ origin/proto/host
      "X-Forwarded-Host": hostHdr || "",
      "X-Forwarded-Proto": protoHdr,
      Accept: "application/json",
    },
    // server component à¹„à¸¡à¹ˆà¸•à¹‰à¸­à¸‡à¹ƒà¸Šà¹‰ credentials
    cache: "no-store",
  });

  if (!res.ok) return null;
  try {
    const data = await res.json();
    return data?.ok ? data : null;
  } catch {
    return null;
  }
}

export default async function ProtectedLayout({ children }) {
  const session = await fetchSessionFromAPI();
  if (!session) {
    // à¸žà¸¢à¸²à¸¢à¸²à¸¡à¸ªà¹ˆà¸‡ next path à¸à¸¥à¸±à¸šà¹„à¸›à¸—à¸µà¹ˆ /login
    redirect("/login?next=/dashboard");
  }
  const { user } = session;

  return (
    <section className="grid grid-cols-12 gap-6 p-4 mx-auto max-w-7xl">
      <aside className="col-span-12 lg:col-span-3 xl:col-span-3">
        <div className="p-4 border rounded-3xl bg-white/70">
          <div className="mb-3 text-sm">RBAC: <b>{user.role}</b></div>

          <nav className="space-y-2">
            <Link className="block px-4 py-2 rounded-xl bg-white/60 hover:bg-white" href="/dashboard">à¹à¸”à¸Šà¸šà¸­à¸£à¹Œà¸”</Link>
            <Link className="block px-4 py-2 rounded-xl bg-white/60 hover:bg-white" href="/drawings">Drawings</Link>
            <Link className="block px-4 py-2 rounded-xl bg-white/60 hover:bg-white" href="/rfas">RFAs</Link>
            <Link className="block px-4 py-2 rounded-xl bg-white/60 hover:bg-white" href="/transmittals">Transmittals</Link>
            <Link className="block px-4 py-2 rounded-xl bg-white/60 hover:bg-white" href="/correspondences">Correspondences</Link>
            <Link className="block px-4 py-2 rounded-xl bg-white/60 hover:bg-white" href="/contracts-volumes">Contracts & Volumes</Link>
            <Link className="block px-4 py-2 rounded-xl bg-white/60 hover:bg-white" href="/reports">Reports</Link>

            {can(user, "workflow:view") && (
              <Link className="block px-4 py-2 rounded-xl bg-white/60 hover:bg-white" href="/workflow">Workflow (n8n)</Link>
            )}
            {can(user, "health:view") && (
              <Link className="block px-4 py-2 rounded-xl bg-white/60 hover:bg-white" href="/health">Health</Link>
            )}
            {can(user, "users:manage") && (
              <Link className="block px-4 py-2 rounded-xl bg-white/60 hover:bg-white" href="/users">à¸œà¸¹à¹‰à¹ƒà¸Šà¹‰/à¸šà¸—à¸šà¸²à¸—</Link>
            )}
          </nav>
        </div>
      </aside>

      <main className="col-span-12 space-y-6 lg:col-span-9 xl:col-span-9">
        {/* System / Quick Actions */}
        <div className="flex items-center gap-2">
          <div className="flex-1 text-lg font-semibold">Document Management System â€” LCBP3 Phase 3</div>

          {can(user, "admin:view") && (
            <a className="px-3 py-2 text-white rounded-xl" style={{ background: "#0D5C75" }} href="/admin">Admin</a>
          )}
          {can(user, "users:manage") && (
            <a className="px-3 py-2 text-white rounded-xl" style={{ background: "#0D5C75" }} href="/users">à¸œà¸¹à¹‰à¹ƒà¸Šà¹‰/à¸šà¸—à¸šà¸²à¸—</a>
          )}
          {can(user, "health:view") && (
            <a className="px-3 py-2 text-white rounded-xl" style={{ background: "#0D5C75" }} href="/health">Health</a>
          )}
          {can(user, "workflow:view") && (
            <a className="px-3 py-2 text-white rounded-xl" style={{ background: "#0D5C75" }} href="/workflow">Workflow</a>
          )}
          {can(user, "rfa:create") && (
            <a className="px-3 py-2 text-white rounded-xl" style={{ background: "#0D5C75" }} href="/rfas/new">+ RFA</a>
          )}
          {can(user, "drawing:upload") && (
            <a className="px-3 py-2 text-white rounded-xl" style={{ background: "#0D5C75" }} href="/drawings/upload">+ Upload Drawing</a>
          )}
          {can(user, "transmittal:create") && (
            <a className="px-3 py-2 text-white rounded-xl" style={{ background: "#0D5C75" }} href="/transmittals/new">+ Transmittal</a>
          )}
          {can(user, "correspondence:create") && (
            <a className="px-3 py-2 text-white rounded-xl" style={{ background: "#0D5C75" }} href="/correspondences/new">+ à¸«à¸™à¸±à¸‡à¸ªà¸·à¸­à¸ªà¸·à¹ˆà¸­à¸ªà¸²à¸£</a>
          )}
        </div>

        {children}
      </main>
    </section>
  );
}