캔버스에 컴포넌트가 배치 안되는 문제 해결

frontend/contexts/ReportDesignerContext.tsx

@@ -1016,6 +1016,12 @@ export function ReportDesignerProvider({ reportId, children }: { reportId: strin
           const layoutData = layoutResponse.data;
           setLayout(layoutData);
 
+          // layoutData가 이미 pages를 가지고 있는지 확인
+          if (layoutData.pages && Array.isArray(layoutData.pages) && layoutData.pages.length > 0) {
+            // 이미 새 구조 (pages 배열)
+            setLayoutConfig({ pages: layoutData.pages });
+            setCurrentPageId(layoutData.pages[0].page_id);
+          } else {
             // 자동 마이그레이션: 기존 단일 페이지 구조 → 다중 페이지 구조
             const oldComponents = layoutData.components || [];
 
@@ -1041,8 +1047,6 @@ export function ReportDesignerProvider({ reportId, children }: { reportId: strin
 
               setLayoutConfig({ pages: [migratedPage] });
               setCurrentPageId(migratedPageId);
-
-            console.log("✅ 기존 레이아웃을 페이지 구조로 자동 마이그레이션", migratedPage);
             } else {
               // 빈 레이아웃 - 기본 페이지 생성
               const defaultPageId = uuidv4();
@@ -1061,6 +1065,7 @@ export function ReportDesignerProvider({ reportId, children }: { reportId: strin
               setCurrentPageId(defaultPageId);
             }
           }
+        }
       } catch {
         // 레이아웃이 없으면 기본 페이지 생성
         const defaultPageId = uuidv4();
@@ -1077,7 +1082,6 @@ export function ReportDesignerProvider({ reportId, children }: { reportId: strin
         };
         setLayoutConfig({ pages: [defaultPage] });
         setCurrentPageId(defaultPageId);
-        console.log("레이아웃 없음, 기본 페이지 생성");
       }
     } catch (error) {
       const errorMessage = error instanceof Error ? error.message : "리포트를 불러오는데 실패했습니다.";
@@ -1146,19 +1150,12 @@ export function ReportDesignerProvider({ reportId, children }: { reportId: strin
     [queryResults],
   );
 
-  // 컴포넌트 추가
   // 컴포넌트 추가 (현재 페이지에)
   const addComponent = useCallback(
     (component: ComponentConfig) => {
-      if (!currentPageId) return;
+      setComponents((prev) => [...prev, component]);
-
-      setLayoutConfig((prev) => ({
-        pages: prev.pages.map((page) =>
-          page.page_id === currentPageId ? { ...page, components: [...page.components, component] } : page,
-        ),
-      }));
     },
-    [currentPageId],
+    [setComponents],
   );
 
   // 컴포넌트 업데이트 (현재 페이지에서)

frontend/types/report.ts

@@ -49,6 +49,7 @@ export interface ReportLayout {
   margin_left: number;
   margin_right: number;
   components: ComponentConfig[];
+  pages?: ReportPage[]; // 새 페이지 구조 (옵셔널, 하위 호환성)
   created_at: string;
   created_by: string | null;
   updated_at: string | null;