From 296ef482bb85db49c32e9f94bcebee7f9c84194c Mon Sep 17 00:00:00 2001
From: Chandler Copeland <ccopeland@motivhealth.com>
Date: Fri, 20 Mar 2026 00:04:55 -0600
Subject: [PATCH] feat(05-03): extend document detail page with PreparePanel

- Fetch allClients in parallel with doc via Promise.all
- Import PreparePanel and render in 1/3 right column of 2/3 + 1/3 grid
- currentClientId defaults to doc.assignedClientId ?? doc.clientId
- asc import added from drizzle-orm for ordered client list
- npm run build is clean with no TypeScript errors
---
 .../(protected)/documents/[docId]/page.tsx    | 33 +++++++++++++++----
 1 file changed, 26 insertions(+), 7 deletions(-)

diff --git a/teressa-copeland-homes/src/app/portal/(protected)/documents/[docId]/page.tsx b/teressa-copeland-homes/src/app/portal/(protected)/documents/[docId]/page.tsx
index e32ab10..cbf9df3 100644
--- a/teressa-copeland-homes/src/app/portal/(protected)/documents/[docId]/page.tsx
+++ b/teressa-copeland-homes/src/app/portal/(protected)/documents/[docId]/page.tsx
@@ -2,9 +2,10 @@ import { auth } from '@/lib/auth';
 import { redirect } from 'next/navigation';
 import { db } from '@/lib/db';
 import { documents, clients } from '@/lib/db/schema';
-import { eq } from 'drizzle-orm';
+import { eq, asc } from 'drizzle-orm';
 import Link from 'next/link';
 import { PdfViewerWrapper } from './_components/PdfViewerWrapper';
+import { PreparePanel } from './_components/PreparePanel';
 
 export default async function DocumentPage({
   params,
@@ -16,10 +17,13 @@ export default async function DocumentPage({
 
   const { docId } = await params;
 
-  const doc = await db.query.documents.findFirst({
-    where: eq(documents.id, docId),
-    with: { client: true },
-  });
+  const [doc, allClients] = await Promise.all([
+    db.query.documents.findFirst({
+      where: eq(documents.id, docId),
+      with: { client: true },
+    }),
+    db.select().from(clients).orderBy(asc(clients.name)),
+  ]);
 
   if (!doc) redirect('/portal/dashboard');
 
@@ -34,10 +38,25 @@ export default async function DocumentPage({
             &larr; Back to {doc.client?.name ?? 'Client'}
           </Link>
           <h1 className="text-2xl font-bold mt-1">{doc.name}</h1>
-          <p className="text-sm text-gray-500">{doc.client?.name}</p>
+          <p className="text-sm text-gray-500">
+            {doc.client?.name} &middot; <span className="capitalize">{doc.status}</span>
+          </p>
+        </div>
+      </div>
+
+      <div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
+        <div className="lg:col-span-2">
+          <PdfViewerWrapper docId={docId} />
+        </div>
+        <div className="lg:col-span-1">
+          <PreparePanel
+            docId={docId}
+            clients={allClients}
+            currentClientId={doc.assignedClientId ?? doc.clientId}
+            currentStatus={doc.status}
+          />
         </div>
       </div>
-      <PdfViewerWrapper docId={docId} />
     </div>
   );
 }