From 72eb8144e092974dfdcc3c89775daf8496608169 Mon Sep 17 00:00:00 2001
From: AutonetSellCar Deploy <autonet@grantech.kr>
Date: Thu, 2 Apr 2026 15:17:45 +0900
Subject: [PATCH] feat: Quick import on Carmodoo search result click

Click a car in Carmodoo search results to instantly import it and
open the detail modal with images. If already imported, opens the
existing car's detail modal instead.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 frontend/src/app/admin/cars/page.tsx | 87 +++++++++++++++++++++++++++-
 1 file changed, 85 insertions(+), 2 deletions(-)

diff --git a/frontend/src/app/admin/cars/page.tsx b/frontend/src/app/admin/cars/page.tsx
index 23f2a9c..a70693d 100644
--- a/frontend/src/app/admin/cars/page.tsx
+++ b/frontend/src/app/admin/cars/page.tsx
@@ -706,6 +706,89 @@ export default function CarsAdminPage() {
     });
   };
 
+  const [quickImporting, setQuickImporting] = useState<string | null>(null);
+
+  const handleQuickImport = async (car: CarmodooCarItem) => {
+    setQuickImporting(car.id);
+    try {
+      const carToImport = {
+        car_no: car.id,
+        car_name: car.car_name || '',
+        maker_name: car.maker_name,
+        model_name: car.model_name,
+        year: car.year,
+        mileage: car.mileage,
+        price: car.price,
+        fuel: car.fuel,
+        transmission: car.transmission,
+        color: car.color,
+        displacement: car.displacement,
+        main_image: car.main_image,
+        check_num: car.check_num,
+        car_key: car.car_key,
+        dealer_description: editedDescriptions[car.id],
+      };
+
+      const { data } = await api.post('/carmodoo/import', { cars: [carToImport] });
+
+      if (data.summary.imported_count > 0 && data.imported?.[0]?.car_id) {
+        const importedCarId = data.imported[0].car_id;
+        // Fetch the imported car and show detail modal
+        const carResponse = await api.get(`/cars/${importedCarId}?admin=true`);
+        const localCar: LocalCar = carResponse.data;
+        setSelectedCar(localCar);
+        setCurrentImageIndex(0);
+        setShowDetailModal(true);
+        // Load dealer comments
+        setDealerComment(null);
+        setLoadingComment(true);
+        try {
+          const commentData = await carmodooApi.getCarTranslations(importedCarId);
+          setDealerComment({
+            ko: commentData.dealer_description,
+            en: commentData.translations.en,
+            mn: commentData.translations.mn,
+            ru: commentData.translations.ru,
+          });
+        } catch { setDealerComment(null); }
+        finally { setLoadingComment(false); }
+        // Refresh local cars list
+        loadLocalCars();
+      } else if (data.summary.skipped_count > 0) {
+        // Already imported - find and show existing car
+        const skipped = data.skipped?.[0];
+        if (skipped?.car_id) {
+          const carResponse = await api.get(`/cars/${skipped.car_id}?admin=true`);
+          const localCar: LocalCar = carResponse.data;
+          setSelectedCar(localCar);
+          setCurrentImageIndex(0);
+          setShowDetailModal(true);
+          setDealerComment(null);
+          setLoadingComment(true);
+          try {
+            const commentData = await carmodooApi.getCarTranslations(skipped.car_id);
+            setDealerComment({
+              ko: commentData.dealer_description,
+              en: commentData.translations.en,
+              mn: commentData.translations.mn,
+              ru: commentData.translations.ru,
+            });
+          } catch { setDealerComment(null); }
+          finally { setLoadingComment(false); }
+        } else {
+          alert(`Already imported: ${skipped?.reason || 'duplicate'}`);
+        }
+      } else {
+        alert('Import failed. Check car details.');
+      }
+    } catch (err) {
+      console.error('Quick import failed:', err);
+      alert('Import failed. Please try again.');
+    } finally {
+      setQuickImporting(null);
+    }
+  };
+
   const handleSelectAll = () => {
     if (selectedCars.size === cars.length) {
       setSelectedCars(new Set());
@@ -2708,8 +2791,8 @@ export default function CarsAdminPage() {
                         key={car.id}
                         className={`border-b border-gray-100 hover:bg-gray-50 cursor-pointer ${
                           selectedCars.has(car.id) ? 'bg-primary-50' : ''
-                        }`}
-                        onClick={() => handleSelectCar(car.id)}
+                        } ${quickImporting === car.id ? 'opacity-50' : ''}`}
+                        onClick={() => handleQuickImport(car)}
                       >
                         <td className="py-3 px-4">
                           <input