From 641bd37f645ac80999825abb77a0b3a3560c4864 Mon Sep 17 00:00:00 2001
From: AutonetSellCar Deploy <autonet@grantech.kr>
Date: Wed, 18 Feb 2026 09:20:42 +0900
Subject: [PATCH] feat: Add "Send Recommendation" button to Vehicle Requests
 admin

Adds a green button below the vehicle list that approves all vehicles
and sends notification to the user. Status changes to Completed.
Previously there was no way to trigger the approve + notify flow from UI.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 .../src/app/admin/vehicle-requests/page.tsx   | 66 +++++++++++++++++++
 1 file changed, 66 insertions(+)

diff --git a/frontend/src/app/admin/vehicle-requests/page.tsx b/frontend/src/app/admin/vehicle-requests/page.tsx
index cc3ce50..a0eebc6 100644
--- a/frontend/src/app/admin/vehicle-requests/page.tsx
+++ b/frontend/src/app/admin/vehicle-requests/page.tsx
@@ -11,6 +11,7 @@ export default function AdminVehicleRequestsPage() {
   const [statusFilter, setStatusFilter] = useState<string>('');
   const [deletingVehicleId, setDeletingVehicleId] = useState<number | null>(null);
   const [regeneratingPdfId, setRegeneratingPdfId] = useState<number | null>(null);
+  const [sendingRecommendation, setSendingRecommendation] = useState(false);
 
   // Load requests
   useEffect(() => {
@@ -107,6 +108,35 @@ export default function AdminVehicleRequestsPage() {
     }
   };
 
+  // Send recommendation (approve vehicles + notify user)
+  const sendRecommendation = async () => {
+    if (!selectedRequest) return;
+    const vehicles = selectedRequest.approved_vehicles;
+    if (vehicles.length === 0) {
+      alert('No vehicles to send. Add vehicles first.');
+      return;
+    }
+
+    if (!confirm(`${vehicles.length}개의 차량을 고객에게 추천 발송하시겠습니까?\n(고객에게 알림이 전송됩니다)`)) {
+      return;
+    }
+
+    try {
+      setSendingRecommendation(true);
+      const vehicleIds = vehicles.map(v => v.id);
+      await vehicleRequestsApi.adminApproveVehicles(selectedRequest.request.id, vehicleIds);
+
+      alert('추천이 발송되었습니다.');
+      loadRequests();
+      loadRequestDetail(selectedRequest.request.id);
+    } catch (error) {
+      console.error('Failed to send recommendation:', error);
+      alert('추천 발송에 실패했습니다.');
+    } finally {
+      setSendingRecommendation(false);
+    }
+  };
+
   // Format date
   const formatDate = (dateString: string) => {
     return new Date(dateString).toLocaleDateString('ko-KR', {
@@ -406,6 +436,42 @@ export default function AdminVehicleRequestsPage() {
                       );
                     })}
                   </div>
+
+                  {/* Send Recommendation Button */}
+                  {selectedRequest.request.status !== 'completed' && (
+                    <div className="mt-4 pt-3 border-t border-gray-200">
+                      <button
+                        onClick={sendRecommendation}
+                        disabled={sendingRecommendation}
+                        className="w-full bg-green-600 text-white px-4 py-2.5 rounded-lg hover:bg-green-700 transition-colors disabled:opacity-50 flex items-center justify-center gap-2 font-medium"
+                      >
+                        {sendingRecommendation ? (
+                          <>
+                            <div className="w-4 h-4 border-2 border-white border-t-transparent rounded-full animate-spin"></div>
+                            <span>Sending...</span>
+                          </>
+                        ) : (
+                          <>
+                            <svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                              <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 19l9 2-9-18-9 18 9-2zm0 0v-8" />
+                            </svg>
+                            <span>Send Recommendation ({selectedRequest.approved_vehicles.length})</span>
+                          </>
+                        )}
+                      </button>
+                      <p className="text-xs text-gray-500 mt-1 text-center">
+                        Status will change to Completed and user will be notified
+                      </p>
+                    </div>
+                  )}
+
+                  {selectedRequest.request.status === 'completed' && (
+                    <div className="mt-4 pt-3 border-t border-gray-200">
+                      <div className="bg-green-50 rounded-lg px-4 py-2 text-center text-green-700 text-sm font-medium">
+                        Recommendation sent
+                      </div>
+                    </div>
+                  )}
                 )}
               </div>
             </div>