From 2e674e13d073bc5aeb96816f6cec886b55c69901 Mon Sep 17 00:00:00 2001 From: kjs Date: Thu, 6 Nov 2025 13:26:54 +0900 Subject: [PATCH] =?UTF-8?q?fix:=20resizable-dialog=20=EC=A3=BC=EC=84=9D=20?= =?UTF-8?q?=EC=B2=98=EB=A6=AC=EB=90=9C=20=EA=B0=9D=EC=B2=B4=20=EB=A6=AC?= =?UTF-8?q?=ED=84=B0=EB=9F=B4=20=ED=8C=8C=EC=8B=B1=20=EC=97=90=EB=9F=AC=20?= =?UTF-8?q?=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 여러 줄 객체 리터럴을 한 줄로 변경 - console.log 주석이 파싱 에러를 일으키는 문제 해결 - 빌드 에러 해결 --- frontend/components/ui/resizable-dialog.tsx | 69 +++------------------ 1 file changed, 10 insertions(+), 59 deletions(-) diff --git a/frontend/components/ui/resizable-dialog.tsx b/frontend/components/ui/resizable-dialog.tsx index 0bf369de..facb07ca 100644 --- a/frontend/components/ui/resizable-dialog.tsx +++ b/frontend/components/ui/resizable-dialog.tsx @@ -95,10 +95,7 @@ const ResizableDialogContent = React.forwardRef< return ((acc << 5) - acc) + char.charCodeAt(0); }, 0); stableIdRef.current = `modal-${Math.abs(hash).toString(36)}`; - // console.log("🔄 ResizableDialog - className 기반 ID 생성:", { - className, - generatedId: stableIdRef.current, - }); + // console.log("🔄 ResizableDialog - className 기반 ID 생성:", { className, generatedId: stableIdRef.current }); } else if (userStyle) { // userStyle 기반 ID 생성 const styleStr = JSON.stringify(userStyle); @@ -106,10 +103,7 @@ const ResizableDialogContent = React.forwardRef< return ((acc << 5) - acc) + char.charCodeAt(0); }, 0); stableIdRef.current = `modal-${Math.abs(hash).toString(36)}`; - // console.log("🔄 ResizableDialog - userStyle 기반 ID 생성:", { - userStyle, - generatedId: stableIdRef.current, - }); + // console.log("🔄 ResizableDialog - userStyle 기반 ID 생성:", { userStyle, generatedId: stableIdRef.current }); } else { // 기본 ID stableIdRef.current = 'modal-default'; @@ -171,13 +165,7 @@ const ResizableDialogContent = React.forwardRef< const [wasOpen, setWasOpen] = React.useState(false); React.useEffect(() => { - // console.log("🔍 모달 상태 변화 감지:", { - actualOpen, - wasOpen, - externalOpen, - contextOpen: context.open, - effectiveModalId - }); + // console.log("🔍 모달 상태 변화 감지:", { actualOpen, wasOpen, externalOpen, contextOpen: context.open, effectiveModalId }); if (actualOpen && !wasOpen) { // 모달이 방금 열림 @@ -194,11 +182,7 @@ const ResizableDialogContent = React.forwardRef< // modalId가 변경되면 초기화 리셋 (다른 모달이 열린 경우) React.useEffect(() => { if (effectiveModalId !== lastModalId) { - // console.log("🔄 모달 ID 변경 감지, 초기화 리셋:", { - 이전: lastModalId, - 현재: effectiveModalId, - isInitialized, - }); + // console.log("🔄 모달 ID 변경 감지, 초기화 리셋:", { 이전: lastModalId, 현재: effectiveModalId, isInitialized }); setIsInitialized(false); setUserResized(false); // 사용자 리사이징 플래그도 리셋 setLastModalId(effectiveModalId); @@ -207,11 +191,7 @@ const ResizableDialogContent = React.forwardRef< // 모달이 열릴 때 초기 크기 설정 (localStorage와 내용 크기 중 큰 값 사용) React.useEffect(() => { - // console.log("🔍 초기 크기 설정 useEffect 실행:", { - isInitialized, - hasContentRef: !!contentRef.current, - effectiveModalId, - }); + // console.log("🔍 초기 크기 설정 useEffect 실행:", { isInitialized, hasContentRef: !!contentRef.current, effectiveModalId }); if (!isInitialized) { // 내용의 실제 크기 측정 (약간의 지연 후, contentRef가 준비될 때까지 대기) @@ -231,22 +211,9 @@ const ResizableDialogContent = React.forwardRef< contentWidth = contentRef.current.scrollWidth || defaultWidth; contentHeight = contentRef.current.scrollHeight || defaultHeight; - // console.log("📏 모달 내용 크기 측정:", { - attempt: attempts, - scrollWidth: contentRef.current.scrollWidth, - scrollHeight: contentRef.current.scrollHeight, - clientWidth: contentRef.current.clientWidth, - clientHeight: contentRef.current.clientHeight, - contentWidth, - contentHeight, - }); + // console.log("📏 모달 내용 크기 측정:", { attempt: attempts, scrollWidth: contentRef.current.scrollWidth, scrollHeight: contentRef.current.scrollHeight, clientWidth: contentRef.current.clientWidth, clientHeight: contentRef.current.clientHeight, contentWidth, contentHeight }); } else { - // console.log("⚠️ contentRef 없음, 재시도:", { - attempt: attempts, - maxAttempts, - defaultWidth, - defaultHeight - }); + // console.log("⚠️ contentRef 없음, 재시도:", { attempt: attempts, maxAttempts, defaultWidth, defaultHeight }); // contentRef가 아직 없으면 재시도 if (attempts < maxAttempts) { @@ -275,12 +242,7 @@ const ResizableDialogContent = React.forwardRef< const storageKey = `modal_size_${effectiveModalId}_${userId}`; const saved = localStorage.getItem(storageKey); - // console.log("📦 localStorage 확인:", { - effectiveModalId, - userId, - storageKey, - saved: saved ? "있음" : "없음", - }); + // console.log("📦 localStorage 확인:", { effectiveModalId, userId, storageKey, saved: saved ? "있음" : "없음" }); if (saved) { const parsed = JSON.parse(saved); @@ -299,12 +261,7 @@ const ResizableDialogContent = React.forwardRef< finalSize = savedSize; setUserResized(true); - // console.log("✅ 최종 크기 (사용자가 설정한 크기 우선 적용):", { - savedSize, - contentBasedSize, - finalSize, - note: "사용자가 리사이징한 크기를 그대로 사용합니다", - }); + // console.log("✅ 최종 크기 (사용자가 설정한 크기 우선 적용):", { savedSize, contentBasedSize, finalSize, note: "사용자가 리사이징한 크기를 그대로 사용합니다" }); } else { // console.log("ℹ️ 자동 계산된 크기는 무시, 내용 크기 사용"); } @@ -384,13 +341,7 @@ const ResizableDialogContent = React.forwardRef< userResized: true, // 사용자가 직접 리사이징했음을 표시 }; localStorage.setItem(storageKey, JSON.stringify(currentSize)); - // console.log("💾 localStorage에 크기 저장 (사용자 리사이징):", { - effectiveModalId, - userId, - storageKey, - size: currentSize, - stateSize: { width: size.width, height: size.height }, - }); + // console.log("💾 localStorage에 크기 저장 (사용자 리사이징):", { effectiveModalId, userId, storageKey, size: currentSize, stateSize: { width: size.width, height: size.height } }); } catch (error) { // console.error("❌ 모달 크기 저장 실패:", error); }