From 2fb08425237372cd9bd757b6facc3e9c495ccb07 Mon Sep 17 00:00:00 2001
From: htlee <htlee@gcsc.co.kr>
Date: Mon, 30 Mar 2026 12:56:22 +0900
Subject: [PATCH] =?UTF-8?q?fix:=20=EC=97=B0=EA=B4=80=EC=84=B1=20=ED=8C=A8?=
 =?UTF-8?q?=EB=84=90=20historyData=20=EC=A1=B0=EA=B1=B4=20=EC=A0=9C?=
 =?UTF-8?q?=EA=B1=B0=20+=20=EC=9E=AC=EC=83=9D=20=EC=BB=A8=ED=8A=B8?=
 =?UTF-8?q?=EB=A1=A4=EB=9F=AC=20=EC=9C=84=20=EB=B0=B0=EC=B9=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- !historyData 조건 제거 — 어구 클릭 시 히스토리 자동 로딩되므로 항상 표시
- 히스토리 모드: bottom 80px (재생 컨트롤러 위), 비히스토리: bottom 20px
- z-index 21 (재생 컨트롤러 20 위)
- 오퍼레이셔널 폴리곤/이름 기반 하이라이트도 히스토리 조건 조정

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 .../src/components/korea/FleetClusterLayer.tsx   | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

diff --git a/frontend/src/components/korea/FleetClusterLayer.tsx b/frontend/src/components/korea/FleetClusterLayer.tsx
index 86fc406..7f967e5 100644
--- a/frontend/src/components/korea/FleetClusterLayer.tsx
+++ b/frontend/src/components/korea/FleetClusterLayer.tsx
@@ -1043,7 +1043,7 @@ export function FleetClusterLayer({ ships, analysisMap: analysisMapProp, onShipS
       </Source>
 
       {/* 선택된 어구 그룹 — 이름 기반 하이라이트 폴리곤 */}
-      {selectedGearGroup && !historyData && enabledModels.has('identity') && (() => {
+      {selectedGearGroup && enabledModels.has('identity') && !historyData && (() => {
         const allGroups = groupPolygons
           ? [...groupPolygons.gearInZoneGroups, ...groupPolygons.gearOutZoneGroups]
           : [];
@@ -1066,7 +1066,7 @@ export function FleetClusterLayer({ ships, analysisMap: analysisMapProp, onShipS
       })()}
 
       {/* 선택된 어구 그룹 — 모델별 오퍼레이셔널 폴리곤 오버레이 */}
-      {selectedGearGroup && !historyData && operationalPolygons.map(op => (
+      {selectedGearGroup && operationalPolygons.map(op => (
         <Source key={`op-${op.modelName}`} id={`gear-op-${op.modelName}`} type="geojson" data={op.geojson}>
           <Layer id={`gear-op-fill-${op.modelName}`} type="fill" paint={{
             'fill-color': op.color, 'fill-opacity': 0.12,
@@ -1335,20 +1335,20 @@ export function FleetClusterLayer({ ships, analysisMap: analysisMapProp, onShipS
       )}
 
       {/* ── 어구 연관성 패널 (선택된 그룹, 하단 고정) ── */}
-      {selectedGearGroup && !historyData && (() => {
+      {selectedGearGroup && (() => {
         const allGroups = groupPolygons
           ? [...groupPolygons.gearInZoneGroups, ...groupPolygons.gearOutZoneGroups]
           : [];
         const group = allGroups.find(g => g.groupKey === selectedGearGroup);
-        if (!group) return null;
+        const memberCount = group?.memberCount ?? 0;
         const defaultItems = correlationData.filter(c => c.isDefault);
         return (
           <div style={{
-            position: 'absolute', bottom: 20, left: '50%', transform: 'translateX(-50%)',
+            position: 'absolute', bottom: historyData ? 80 : 20, left: '50%', transform: 'translateX(-50%)',
             background: 'rgba(12,24,37,0.95)', border: '1px solid rgba(249,115,22,0.3)',
             borderRadius: 8, padding: '8px 12px',
             display: 'flex', gap: 12, alignItems: 'flex-start',
-            zIndex: 20, fontFamily: FONT_MONO, fontSize: 10, color: '#e2e8f0',
+            zIndex: 21, fontFamily: FONT_MONO, fontSize: 10, color: '#e2e8f0',
             boxShadow: '0 4px 16px rgba(0,0,0,0.5)', pointerEvents: 'auto',
             maxWidth: 600, minWidth: 320,
           }}>
@@ -1356,7 +1356,7 @@ export function FleetClusterLayer({ ships, analysisMap: analysisMapProp, onShipS
             <div style={{ minWidth: 150, flexShrink: 0 }}>
               <div style={{ display: 'flex', alignItems: 'center', gap: 6, marginBottom: 6 }}>
                 <span style={{ fontWeight: 700, color: '#f97316', fontSize: 11 }}>{selectedGearGroup}</span>
-                <span style={{ color: '#64748b', fontSize: 9 }}>어구 {group.memberCount}개</span>
+                <span style={{ color: '#64748b', fontSize: 9 }}>어구 {memberCount}개</span>
                 <button type="button" onClick={() => setSelectedGearGroup(null)} style={{
                   background: 'none', border: '1px solid rgba(239,68,68,0.3)', borderRadius: 4,
                   color: '#ef4444', cursor: 'pointer', padding: '1px 5px', fontSize: 10,
@@ -1376,7 +1376,7 @@ export function FleetClusterLayer({ ships, analysisMap: analysisMapProp, onShipS
                 />
                 <span style={{ width: 8, height: 8, borderRadius: '50%', background: '#f97316', flexShrink: 0 }} />
                 <span style={{ color: '#e2e8f0' }}>이름 기반</span>
-                <span style={{ color: '#64748b', marginLeft: 'auto' }}>{group.memberCount}</span>
+                <span style={{ color: '#64748b', marginLeft: 'auto' }}>{memberCount}</span>
               </label>
               {correlationLoading && <div style={{ fontSize: 8, color: '#64748b' }}>로딩...</div>}
               {availableModels.map(m => {