From 5585a4676dd9b096f6d0e79dd05c526977847e23 Mon Sep 17 00:00:00 2001 From: yuhoyeong Date: Mon, 22 Dec 2025 15:05:06 +0900 Subject: [PATCH] [FRONTEND] code-refactor --- .../common/Quote/QuoteSection/QuotePart.tsx | 141 +++--------------- 1 file changed, 19 insertions(+), 122 deletions(-) diff --git a/frontend/src/components/common/Quote/QuoteSection/QuotePart.tsx b/frontend/src/components/common/Quote/QuoteSection/QuotePart.tsx index afcbef4..d0913bd 100644 --- a/frontend/src/components/common/Quote/QuoteSection/QuotePart.tsx +++ b/frontend/src/components/common/Quote/QuoteSection/QuotePart.tsx @@ -5,7 +5,7 @@ import SelectedPartList from "./SelectedPartList/SelectedPartList"; import CompatibilityCheckModal from "../../CompatibilityCheckModal/CompatibilityCheckModal"; import styles from "./quotePart.module.css"; import { useQuoteCartContext } from "@/contexts/QuoteCartContext"; -// import { compatibilityCheckService } from "@/api/services/compatibilityCheckService"; +import { compatibilityCheckService } from "@/api/services/compatibilityCheckService"; import type { CompatibilityCheckItem, CompatibilityCheckDetail, @@ -33,15 +33,20 @@ export default function QuotePart() { // selectedParts를 API 형식으로 변환하는 함수 const convertToApiFormat = (): CompatibilityCheckItem[] => { return Object.entries(selectedParts) - .filter(([part]) => part !== null) + .filter(([, part]) => part) .map(([category, part]) => ({ title: part!.name, category3: category, })); }; - // 호환성 체크 핸들러 (임시: API 비활성화, UI만 표시) + // 호환성 체크 핸들러 (SSE 기반) const handleCompatibilityCheck = () => { + if (eventSourceRef.current) { + eventSourceRef.current.close(); + eventSourceRef.current = null; + } + const parts = convertToApiFormat(); if (parts.length === 0) { @@ -49,136 +54,29 @@ export default function QuotePart() { return; } - console.log("🔍 호환성 체크 요청 (임시 - API 비활성화):", parts); - - // 기존 결과 초기화 및 모달 열기 setCheckResults([]); setIsModalOpen(true); setIsChecking(true); - // 임시: 더미 데이터로 UI 테스트 (10개 항목) - const dummyResults: CompatibilityCheckDetail[] = [ - { - check_id: 1, - check_name: "CPU ↔ 메인보드 호환성", - status: "SUCCESS", - result: "POSITIVE", - details: "CPU와 메인보드가 호환됩니다.", - warnings: [], - errors: [], - }, - { - check_id: 2, - check_name: "메모리 타입 호환성", - status: "SUCCESS", - result: "POSITIVE", - details: "메모리 타입이 호환됩니다.", - warnings: [], - errors: [], - }, - { - check_id: 3, - check_name: "메모리 속도 호환성", - status: "SUCCESS", - result: "POSITIVE", - details: "메모리 속도가 호환됩니다.", - warnings: [], - errors: [], - }, - { - check_id: 4, - check_name: " 메인보드 ↔ 케이스 폼펙 호환성", - status: "SUCCESS", - result: "NEGATIVE", - details: "메인보드와 케이스 폼팩이 호환되지 않습니다.", - warnings: [], - errors: ["폼팩을 확인해주세요."], - }, - { - check_id: 5, - check_name: "GPU ↔ 케이스 호환성", - status: "SUCCESS", - result: "NEGATIVE", - details: "GPU가 케이스에 장착할 수 없습니다.", - warnings: [], - errors: ["케이스 크기를 확인해주세요."], - }, - { - check_id: 6, - check_name: "전력 안정성", - status: "SUCCESS", - result: "NEGATIVE", - details: "전력이 부족합니다.", - warnings: [], - errors: ["파워 용량을 확인해주세요."], - }, - { - check_id: 7, - check_name: "파워 커넥터 호환성 검사", - status: "SUCCESS", - result: "POSITIVE", - details: "파워 커넥터가 호환됩니다.", - warnings: [], - errors: [], - }, - { - check_id: 8, - check_name: "스토리지", - status: "SUCCESS", - result: "POSITIVE", - details: "스토리지가 호환됩니다.", - warnings: [], - errors: [], - }, - { - check_id: 9, - check_name: "CPU 쿨러 ↔ 케이스/램 (높이 및 간섭)", - status: "SUCCESS", - result: "POSITIVE", - details: "CPU 쿨러가 호환됩니다.", - warnings: [], - errors: [], - }, - { - check_id: 10, - check_name: " OS/드라이버", - status: "SUCCESS", - result: "POSITIVE", - details: "OS/드라이버가 호환됩니다.", - warnings: [], - errors: [], - }, - ]; - - // 랜덤한 순서로 결과 추가 (더 나은 UX) - const shuffledIndices = [3, 7, 1, 9, 2, 5, 8, 4, 10, 6]; // 섞인 순서 - shuffledIndices.forEach((checkId, index) => { - setTimeout(() => { - const result = dummyResults.find((r) => r.check_id === checkId); - if (result) { - setCheckResults((prev) => [...prev, result]); - } - if (index === shuffledIndices.length - 1) { - setIsChecking(false); - console.log("✅ 모든 호환성 체크 완료 (임시 - 더미 데이터)"); - } - }, (index + 1) * 500); - }); - - // 실제 API 호출 (주석 처리) - /* eventSourceRef.current = compatibilityCheckService.checkCompatibilityStream( { items: parts }, - // onResult: 각 결과를 받을 때마다 호출 (result) => { - setCheckResults((prev) => [...prev, result]); + setCheckResults((prev) => { + const next = [...prev]; + const index = next.findIndex( + (item) => item.check_id === result.check_id + ); + if (index >= 0) { + next[index] = result; + return next; + } + return [...next, result]; + }); }, - // onComplete: 모든 체크 완료 () => { setIsChecking(false); console.log("✅ 모든 호환성 체크 완료"); }, - // onError: 에러 발생 (error) => { setIsChecking(false); console.error("❌ 호환성 체크 에러:", error); @@ -186,7 +84,6 @@ export default function QuotePart() { setIsModalOpen(false); } ); - */ }; // 모달 닫을 때 SSE 연결 종료