From 14a905a138158f7db0d86a47e8357318a0dbd970 Mon Sep 17 00:00:00 2001
From: Paul Bailey <psbailey31@gmail.com>
Date: Sun, 16 Nov 2025 22:30:07 +0000
Subject: [PATCH] Put all action buttons (Verify, Dispute, Cleaned Up) in same
 row with shorter labels

---
 src/components/report/ReportDetailModal.tsx | 57 +++++++++------------
 1 file changed, 25 insertions(+), 32 deletions(-)

diff --git a/src/components/report/ReportDetailModal.tsx b/src/components/report/ReportDetailModal.tsx
index 448b2c2..69ef6f1 100644
--- a/src/components/report/ReportDetailModal.tsx
+++ b/src/components/report/ReportDetailModal.tsx
@@ -367,47 +367,40 @@ export function ReportDetailModal({ report, isOpen, onClose, onVerify, onDispute
                 )}
                 
                 {!showVerifyComment && !showDisputeComment && (
-                  <div className="space-y-3">
-                    {/* Mark as Cleaned Button */}
+                  <div className="flex gap-3">
+                    {onVerify && (
+                      <button
+                        onClick={() => setShowVerifyComment(true)}
+                        className="flex-1 px-4 py-2 bg-green-600 text-white rounded-lg font-medium hover:bg-green-700 transition-colors flex items-center justify-center gap-2"
+                      >
+                        <svg className="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
+                          <path fillRule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clipRule="evenodd" />
+                        </svg>
+                        Verify
+                      </button>
+                    )}
+                    {onDispute && (
+                      <button
+                        onClick={() => setShowDisputeComment(true)}
+                        className="flex-1 px-4 py-2 bg-red-600 text-white rounded-lg font-medium hover:bg-red-700 transition-colors flex items-center justify-center gap-2"
+                      >
+                        <svg className="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
+                          <path fillRule="evenodd" d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clipRule="evenodd" />
+                        </svg>
+                        Dispute
+                      </button>
+                    )}
                     {onMarkCleaned && (
                       <button
                         onClick={() => onMarkCleaned(report.id)}
-                        className="w-full px-4 py-2 bg-blue-600 text-white rounded-lg font-medium hover:bg-blue-700 transition-colors flex items-center justify-center gap-2"
+                        className="flex-1 px-4 py-2 bg-blue-600 text-white rounded-lg font-medium hover:bg-blue-700 transition-colors flex items-center justify-center gap-2"
                       >
                         <svg className="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
                           <path fillRule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clipRule="evenodd" />
                         </svg>
-                        Mark as Cleaned Up
+                        Cleaned Up
                       </button>
                     )}
-
-                    {/* Verify/Dispute Buttons */}
-                    {(onVerify || onDispute) && (
-                      <div className="flex gap-3">
-                        {onVerify && (
-                          <button
-                            onClick={() => setShowVerifyComment(true)}
-                            className="flex-1 px-4 py-2 bg-green-600 text-white rounded-lg font-medium hover:bg-green-700 transition-colors flex items-center justify-center gap-2"
-                          >
-                            <svg className="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
-                              <path fillRule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clipRule="evenodd" />
-                            </svg>
-                            Verify Report
-                          </button>
-                        )}
-                        {onDispute && (
-                          <button
-                            onClick={() => setShowDisputeComment(true)}
-                            className="flex-1 px-4 py-2 bg-red-600 text-white rounded-lg font-medium hover:bg-red-700 transition-colors flex items-center justify-center gap-2"
-                          >
-                            <svg className="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
-                              <path fillRule="evenodd" d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clipRule="evenodd" />
-                            </svg>
-                            Dispute Report
-                          </button>
-                        )}
-                      </div>
-                    )}
                   </div>
                 )}