From 51928a1cdc0c8bc7d9fb793f272760e118726993 Mon Sep 17 00:00:00 2001
From: James <james@jongsma.me>
Date: Thu, 12 Mar 2026 05:06:42 -0400
Subject: [PATCH] =?UTF-8?q?fix:=20request=20detail=20=E2=80=94=20full=20wi?=
 =?UTF-8?q?dth,=20response+discussion=20side=20by=20side,=20buyer=20previe?=
 =?UTF-8?q?w-only,=20header=20breadcrumb?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 portal/templates/app/request.html | 22 ++++++++++++++--------
 1 file changed, 14 insertions(+), 8 deletions(-)

diff --git a/portal/templates/app/request.html b/portal/templates/app/request.html
index b1cb1b3..7a30b96 100644
--- a/portal/templates/app/request.html
+++ b/portal/templates/app/request.html
@@ -2,14 +2,14 @@
     <div class="flex items-center gap-3">
       <a href="/app/projects" class="text-2xl font-bold text-white tracking-tight"><span class="text-[#c9a84c]">Deal</span>space</a>
       <span class="text-white/20">/</span>
-      <a id="backToProject" href="/app/projects" class="text-sm text-[#94a3b8] hover:text-white transition" id="projectNameLink">Projects</a>
+      <a id="backToProject" href="/app/projects" class="text-sm text-[#94a3b8] hover:text-white transition">Project</a>
       <span class="text-white/20">/</span>
       <span id="reqRef" class="text-sm text-white font-medium">—</span>
     </div>
 {{end}}
 
 {{define "content"}}
-    <div class="px-8 pt-4 pb-8 max-w-3xl">
+    <div class="px-8 pt-4 pb-8">
 
       <!-- REQUEST -->
       <div class="mb-6">
@@ -49,8 +49,9 @@
         </div>
       </div>
 
-      <!-- RESPONSE -->
-      <div class="mb-6 p-5 rounded-lg" style="background:var(--ds-sf);border:1px solid var(--ds-bd)">
+      <div class="grid grid-cols-1 lg:grid-cols-5 gap-6">
+      <!-- RESPONSE (left, wider) -->
+      <div class="lg:col-span-3 p-5 rounded-lg" style="background:var(--ds-sf);border:1px solid var(--ds-bd)">
         <div class="flex items-center justify-between mb-3">
           <span class="text-xs font-semibold uppercase tracking-wider" style="color:var(--ds-tx3)">Response</span>
           <div id="answeredBanner" class="hidden px-2.5 py-0.5 rounded-full text-xs font-medium bg-green-500/15 text-green-300">&#10003; Answered</div>
@@ -69,8 +70,8 @@
         </button>
       </div>
 
-      <!-- BOTTOM: Discussion (channel-based) -->
-      <div class="bg-[#0d1f3c] border border-white/[0.08] rounded-xl overflow-hidden">
+      <!-- DISCUSSION (right) -->
+      <div class="lg:col-span-2 rounded-xl overflow-hidden" style="background:var(--ds-sf);border:1px solid var(--ds-bd)">
         <!-- Channel tabs -->
         <div class="border-b border-white/[0.08] flex items-center gap-0 overflow-x-auto" id="channelTabs">
           <div class="px-4 py-3 text-xs text-[#475569]">Loading channels...</div>
@@ -90,12 +91,17 @@
           </div>
         </div>
       </div>
+      </div><!-- end two-col grid -->
     </div>
 {{end}}
 
 {{define "scripts"}}
 <script>
     const reqID = location.pathname.split('/').pop();
+    function isBuyerRole() {
+      const r = localStorage.getItem('ds_test_role') || '';
+      return r === 'buyer' || r === 'seller' || r === 'advisor';
+    }
 
     const statusColors = { open: 'bg-yellow-500/20 text-yellow-300', answered: 'bg-green-500/20 text-green-300', closed: 'bg-gray-500/20 text-gray-300', 'under-review': 'bg-blue-500/20 text-blue-300' };
     const priorityColors = { high: 'bg-red-500/20 text-red-300', medium: 'bg-yellow-500/20 text-yellow-300', low: 'bg-blue-500/20 text-blue-300' };
@@ -271,8 +277,8 @@
             <div class="text-[#475569] text-xs">${a.created_at ? new Date(a.created_at * 1000).toLocaleString() : ''}</div>
           </div>
           <div class="flex items-center gap-2 shrink-0">
-            ${objectID && previewUrl ? `<a href="${previewUrl}" target="_blank" class="px-2 py-1 rounded text-xs font-medium bg-white/[0.06] text-[#94a3b8] hover:text-white hover:bg-white/[0.1] transition">${isVideo ? 'Play' : 'Preview'}</a>` : ''}
-            ${objectID ? `<a href="${downloadUrl}" class="text-[#c9a84c] text-sm hover:underline">Download</a>` : ''}
+            ${objectID && previewUrl ? `<a href="${previewUrl}" target="_blank" class="px-2 py-1 rounded text-xs font-medium bg-white/[0.06] text-[#94a3b8] hover:text-white hover:bg-white/[0.1] transition">${isVideo ? 'Play' : (isBuyerRole() ? 'View' : 'Preview')}</a>` : ''}
+            ${objectID && !isBuyerRole() ? `<a href="${downloadUrl}" class="text-sm hover:underline" style="color:var(--ds-ac)">Download</a>` : ''}
           </div>
         </div>`;
       }).join('');