init app

app/orders/[id]/page.tsx

@@ -0,0 +1,53 @@
+import { notFound } from "next/navigation";
+import { requireCurrentUser } from "@/lib/auth";
+import { getOrderById, updateOrder } from "@/app/actions/orders";
+import { Navbar } from "@/components/Navbar";
+import { OrderForm } from "@/components/OrderForm";
+import { LockBanner } from "@/components/LockBanner";
+
+export default async function OrderDetailPage({
+  params,
+}: {
+  params: Promise<{ id: string }>;
+}) {
+  await requireCurrentUser();
+  const { id } = await params;
+  const order = await getOrderById(id);
+
+  if (!order) {
+    notFound();
+  }
+
+  const isClosed = order.status === "closed";
+
+  // Bind orderId to the update action
+  const updateOrderWithId = updateOrder.bind(null, order.id);
+
+  return (
+    <div className="min-h-screen bg-bg">
+      <Navbar />
+
+      <main className="max-w-[1080px] mx-auto px-6 py-8">
+        {isClosed && (
+          <div className="mb-6">
+            <LockBanner />
+          </div>
+        )}
+
+        <div className="mb-8">
+          <h1 className="font-display text-3xl font-bold text-fg">{order.title}</h1>
+          <p className="text-muted text-sm mt-1">
+            {isClosed ? "This order is read-only" : "Edit order details below"}
+          </p>
+        </div>
+
+        <OrderForm
+          mode="edit"
+          initialData={order}
+          serverAction={updateOrderWithId}
+          disabled={isClosed}
+        />
+      </main>
+    </div>
+  );
+}