diff --git a/frontend/app/(main)/screens/[screenId]/page.tsx b/frontend/app/(main)/screens/[screenId]/page.tsx index ce99a685..5685d23a 100644 --- a/frontend/app/(main)/screens/[screenId]/page.tsx +++ b/frontend/app/(main)/screens/[screenId]/page.tsx @@ -356,17 +356,6 @@ function ScreenViewPage() { return isButton; }); - console.log( - "๐Ÿ” ๋ฉ”๋‰ด์—์„œ ๋ฐœ๊ฒฌ๋œ ์ „์ฒด ๋ฒ„ํŠผ:", - allButtons.map((b) => ({ - id: b.id, - label: b.label, - positionX: b.position.x, - positionY: b.position.y, - width: b.size?.width, - height: b.size?.height, - })), - ); topLevelComponents.forEach((component) => { const isButton = @@ -406,33 +395,13 @@ function ScreenViewPage() { (c) => (c as any).componentId === "table-search-widget", ); - // ๋””๋ฒ„๊ทธ: ๋ชจ๋“  ์ปดํฌ๋„ŒํŠธ ํƒ€์ž… ํ™•์ธ - console.log( - "๐Ÿ” ์ „์ฒด ์ปดํฌ๋„ŒํŠธ ํƒ€์ž…:", - regularComponents.map((c) => ({ - id: c.id, - type: c.type, - componentType: (c as any).componentType, - componentId: (c as any).componentId, - })), - ); - - // ๐Ÿ†• ์กฐ๊ฑด๋ถ€ ์ปจํ…Œ์ด๋„ˆ๋“ค์„ ์ฐพ๊ธฐ + // ์กฐ๊ฑด๋ถ€ ์ปจํ…Œ์ด๋„ˆ๋“ค์„ ์ฐพ๊ธฐ const conditionalContainers = regularComponents.filter( (c) => (c as any).componentId === "conditional-container" || (c as any).componentType === "conditional-container", ); - console.log( - "๐Ÿ” ์กฐ๊ฑด๋ถ€ ์ปจํ…Œ์ด๋„ˆ ๋ฐœ๊ฒฌ:", - conditionalContainers.map((c) => ({ - id: c.id, - y: c.position.y, - size: c.size, - })), - ); - // TableSearchWidget ๋ฐ ์กฐ๊ฑด๋ถ€ ์ปจํ…Œ์ด๋„ˆ ๋†’์ด ์ฐจ์ด๋ฅผ ๊ณ„์‚ฐํ•˜์—ฌ Y ์œ„์น˜ ์กฐ์ • const adjustedComponents = regularComponents.map((component) => { const isTableSearchWidget = (component as any).componentId === "table-search-widget"; @@ -520,12 +489,6 @@ function ScreenViewPage() { columnOrder={tableColumnOrder} tableDisplayData={tableDisplayData} onSelectedRowsChange={(_, selectedData, sortBy, sortOrder, columnOrder, tableDisplayData) => { - console.log("๐Ÿ” ํ™”๋ฉด์—์„œ ์„ ํƒ๋œ ํ–‰ ๋ฐ์ดํ„ฐ:", selectedData); - console.log("๐Ÿ“Š ์ •๋ ฌ ์ •๋ณด:", { sortBy, sortOrder, columnOrder }); - console.log("๐Ÿ“Š ํ™”๋ฉด ํ‘œ์‹œ ๋ฐ์ดํ„ฐ:", { - count: tableDisplayData?.length, - firstRow: tableDisplayData?.[0], - }); setSelectedRowsData(selectedData); setTableSortBy(sortBy); setTableSortOrder(sortOrder || "asc"); @@ -604,12 +567,6 @@ function ScreenViewPage() { columnOrder, tableDisplayData, ) => { - console.log("๐Ÿ” ํ™”๋ฉด์—์„œ ์„ ํƒ๋œ ํ–‰ ๋ฐ์ดํ„ฐ (์ž์‹):", selectedData); - console.log("๐Ÿ“Š ์ •๋ ฌ ์ •๋ณด (์ž์‹):", { sortBy, sortOrder, columnOrder }); - console.log("๐Ÿ“Š ํ™”๋ฉด ํ‘œ์‹œ ๋ฐ์ดํ„ฐ (์ž์‹):", { - count: tableDisplayData?.length, - firstRow: tableDisplayData?.[0], - }); setSelectedRowsData(selectedData); setTableSortBy(sortBy); setTableSortOrder(sortOrder || "asc"); @@ -618,7 +575,6 @@ function ScreenViewPage() { }} refreshKey={tableRefreshKey} onRefresh={() => { - console.log("๐Ÿ”„ ํ…Œ์ด๋ธ” ์ƒˆ๋กœ๊ณ ์นจ ์š”์ฒญ๋จ (์ž์‹)"); setTableRefreshKey((prev) => prev + 1); setSelectedRowsData([]); // ์„ ํƒ ํ•ด์ œ }} diff --git a/frontend/components/ui/resizable-dialog.tsx b/frontend/components/ui/resizable-dialog.tsx index 74a53411..cc28be85 100644 --- a/frontend/components/ui/resizable-dialog.tsx +++ b/frontend/components/ui/resizable-dialog.tsx @@ -122,10 +122,6 @@ const ResizableDialogContent = React.forwardRef< // 1์ˆœ์œ„: userStyle์—์„œ ํฌ๊ธฐ ์ถ”์ถœ (ํ™”๋ฉด๊ด€๋ฆฌ์—์„œ ์ง€์ •ํ•œ ํฌ๊ธฐ - ํ•ญ์ƒ ์ดˆ๊ธฐ๊ฐ’์œผ๋กœ ์‚ฌ์šฉ) if (userStyle) { - console.log("๐Ÿ” userStyle ๊ฐ์ง€:", userStyle); - console.log("๐Ÿ” userStyle.width ํƒ€์ž…:", typeof userStyle.width, "๊ฐ’:", userStyle.width); - console.log("๐Ÿ” userStyle.height ํƒ€์ž…:", typeof userStyle.height, "๊ฐ’:", userStyle.height); - const styleWidth = typeof userStyle.width === 'string' ? parseInt(userStyle.width) : userStyle.width; @@ -133,31 +129,15 @@ const ResizableDialogContent = React.forwardRef< ? parseInt(userStyle.height) : userStyle.height; - console.log("๐Ÿ“ ํŒŒ์‹ฑ๋œ ํฌ๊ธฐ:", { - styleWidth, - styleHeight, - "styleWidth truthy?": !!styleWidth, - "styleHeight truthy?": !!styleHeight, - minWidth, - maxWidth, - minHeight, - maxHeight - }); - if (styleWidth && styleHeight) { const finalSize = { width: Math.max(minWidth, Math.min(maxWidth, styleWidth)), height: Math.max(minHeight, Math.min(maxHeight, styleHeight)), }; - console.log("โœ… userStyle ํฌ๊ธฐ ์‚ฌ์šฉ:", finalSize); return finalSize; - } else { - console.log("โŒ styleWidth ๋˜๋Š” styleHeight๊ฐ€ falsy:", { styleWidth, styleHeight }); } } - console.log("โš ๏ธ userStyle ์—†์Œ, defaultWidth/defaultHeight ์‚ฌ์šฉ:", { defaultWidth, defaultHeight }); - // 2์ˆœ์œ„: ํ˜„์žฌ ๋ Œ๋”๋ง๋œ ํฌ๊ธฐ ์‚ฌ์šฉ (์ฃผ์„์ฒ˜๋ฆฌ - ๋ชจ๋‹ฌ์ด ์—ด๋ฆฐ ํ›„ ๋Š˜์–ด๋‚˜๋Š” ํ˜„์ƒ ๋ฐฉ์ง€) // if (contentRef.current) { // const rect = contentRef.current.getBoundingClientRect(); @@ -209,7 +189,6 @@ const ResizableDialogContent = React.forwardRef< // ์‚ฌ์šฉ์ž๊ฐ€ ๋ฆฌ์‚ฌ์ด์ง•ํ•œ ํฌ๊ธฐ ์šฐ์„  setSize({ width: savedSize.width, height: savedSize.height }); setUserResized(true); - console.log("โœ… ์‚ฌ์šฉ์ž ๋ฆฌ์‚ฌ์ด์ง• ํฌ๊ธฐ ์ ์šฉ:", savedSize); } else if (userStyle && userStyle.width && userStyle.height) { // ํ™”๋ฉด๊ด€๋ฆฌ์—์„œ ์„ค์ •ํ•œ ํฌ๊ธฐ const styleWidth = typeof userStyle.width === 'string' @@ -224,7 +203,6 @@ const ResizableDialogContent = React.forwardRef< width: Math.max(minWidth, Math.min(maxWidth, styleWidth)), height: Math.max(minHeight, Math.min(maxHeight, styleHeight)), }; - console.log("๐Ÿ”„ userStyle ํฌ๊ธฐ ์ ์šฉ:", newSize); setSize(newSize); } } diff --git a/frontend/lib/registry/DynamicComponentRenderer.tsx b/frontend/lib/registry/DynamicComponentRenderer.tsx index cf6037eb..245e2527 100644 --- a/frontend/lib/registry/DynamicComponentRenderer.tsx +++ b/frontend/lib/registry/DynamicComponentRenderer.tsx @@ -289,17 +289,8 @@ export const DynamicComponentRenderer: React.FC = // modal-repeater-table์€ ๋ฐฐ์—ด ๋ฐ์ดํ„ฐ๋ฅผ ๋‹ค๋ฃจ๋ฏ€๋กœ ๋นˆ ๋ฐฐ์—ด๋กœ ์ดˆ๊ธฐํ™” let currentValue; if (componentType === "modal-repeater-table") { - // ๐Ÿ†• EditModal์—์„œ ์ „๋‹ฌ๋œ groupedData๊ฐ€ ์žˆ์œผ๋ฉด ์šฐ์„  ์‚ฌ์šฉ + // EditModal์—์„œ ์ „๋‹ฌ๋œ groupedData๊ฐ€ ์žˆ์œผ๋ฉด ์šฐ์„  ์‚ฌ์šฉ currentValue = props.groupedData || formData?.[fieldName] || []; - - // ๋””๋ฒ„๊น… ๋กœ๊ทธ - console.log("๐Ÿ” [DynamicComponentRenderer] ModalRepeaterTable value ์„ค์ •:", { - hasGroupedData: !!props.groupedData, - groupedDataLength: props.groupedData?.length || 0, - fieldName, - formDataValue: formData?.[fieldName], - finalValueLength: Array.isArray(currentValue) ? currentValue.length : 0, - }); } else { currentValue = formData?.[fieldName] || ""; } diff --git a/frontend/lib/registry/components/conditional-container/ConditionalContainerComponent.tsx b/frontend/lib/registry/components/conditional-container/ConditionalContainerComponent.tsx index 626ee137..6f2ab183 100644 --- a/frontend/lib/registry/components/conditional-container/ConditionalContainerComponent.tsx +++ b/frontend/lib/registry/components/conditional-container/ConditionalContainerComponent.tsx @@ -13,8 +13,6 @@ import { ConditionalContainerProps, ConditionalSection } from "./types"; import { ConditionalSectionViewer } from "./ConditionalSectionViewer"; import { cn } from "@/lib/utils"; -console.log("๐Ÿš€ ConditionalContainerComponent ๋ชจ๋“ˆ ๋กœ๋“œ๋จ!"); - /** * ์กฐ๊ฑด๋ถ€ ์ปจํ…Œ์ด๋„ˆ ์ปดํฌ๋„ŒํŠธ * ์ƒ๋‹จ ์…€๋ ‰ํŠธ๋ฐ•์Šค ๊ฐ’์— ๋”ฐ๋ผ ํ•˜๋‹จ์— ๋‹ค๋ฅธ UI๋ฅผ ํ‘œ์‹œ @@ -43,11 +41,6 @@ export function ConditionalContainerComponent({ groupedData, // ๐Ÿ†• ๊ทธ๋ฃน ๋ฐ์ดํ„ฐ onSave, // ๐Ÿ†• EditModal์˜ handleSave ์ฝœ๋ฐฑ }: ConditionalContainerProps) { - console.log("๐ŸŽฏ ConditionalContainerComponent ๋ Œ๋”๋ง!", { - isDesignMode, - hasOnHeightChange: !!onHeightChange, - componentId, - }); // config prop ์šฐ์„ , ์—†์œผ๋ฉด ๊ฐœ๋ณ„ prop ์‚ฌ์šฉ const controlField = config?.controlField || propControlField || "condition"; @@ -86,24 +79,8 @@ export function ConditionalContainerComponent({ const containerRef = useRef(null); const previousHeightRef = useRef(0); - // ๐Ÿ” ๋””๋ฒ„๊ทธ: props ํ™•์ธ - useEffect(() => { - console.log("๐Ÿ” ConditionalContainer props:", { - isDesignMode, - hasOnHeightChange: !!onHeightChange, - componentId, - selectedValue, - }); - }, [isDesignMode, onHeightChange, componentId, selectedValue]); - // ๋†’์ด ๋ณ€ํ™” ๊ฐ์ง€ ๋ฐ ์ฝœ๋ฐฑ ํ˜ธ์ถœ useEffect(() => { - console.log("๐Ÿ” ResizeObserver ๋“ฑ๋ก ์กฐ๊ฑด:", { - hasContainer: !!containerRef.current, - isDesignMode, - hasOnHeightChange: !!onHeightChange, - }); - if (!containerRef.current || isDesignMode || !onHeightChange) return; const resizeObserver = new ResizeObserver((entries) => { diff --git a/frontend/lib/registry/components/modal-repeater-table/ModalRepeaterTableComponent.tsx b/frontend/lib/registry/components/modal-repeater-table/ModalRepeaterTableComponent.tsx index 59ce35a8..91d7b36f 100644 --- a/frontend/lib/registry/components/modal-repeater-table/ModalRepeaterTableComponent.tsx +++ b/frontend/lib/registry/components/modal-repeater-table/ModalRepeaterTableComponent.tsx @@ -224,13 +224,11 @@ export function ModalRepeaterTableComponent({ const configuredColumns = componentConfig?.columns || propColumns || []; if (configuredColumns.length > 0) { - console.log("โœ… ์„ค์ •๋œ columns ์‚ฌ์šฉ:", configuredColumns); return configuredColumns; } // columns๊ฐ€ ๋น„์–ด์žˆ์œผ๋ฉด sourceColumns๋กœ๋ถ€ํ„ฐ ์ž๋™ ์ƒ์„ฑ if (sourceColumns.length > 0) { - console.log("๐Ÿ”„ sourceColumns๋กœ๋ถ€ํ„ฐ ์ž๋™ ์ƒ์„ฑ:", sourceColumns); const autoColumns: RepeaterColumnConfig[] = sourceColumns.map((field) => ({ field: field, label: field, // ํ•„๋“œ๋ช…์„ ๋ผ๋ฒจ๋กœ ์‚ฌ์šฉ (๋‚˜์ค‘์— ์„ค์ •์—์„œ ๋ณ€๊ฒฝ ๊ฐ€๋Šฅ) @@ -238,85 +236,49 @@ export function ModalRepeaterTableComponent({ type: "text" as const, width: "150px", })); - console.log("๐Ÿ“‹ ์ž๋™ ์ƒ์„ฑ๋œ columns:", autoColumns); return autoColumns; } - console.warn("โš ๏ธ columns์™€ sourceColumns ๋ชจ๋‘ ๋น„์–ด์žˆ์Œ!"); + console.warn("โš ๏ธ [ModalRepeaterTable] columns์™€ sourceColumns ๋ชจ๋‘ ๋น„์–ด์žˆ์Œ!"); return []; }, [componentConfig?.columns, propColumns, sourceColumns]); - // ์ดˆ๊ธฐ props ๋กœ๊น… + // ์ดˆ๊ธฐ props ๊ฒ€์ฆ useEffect(() => { if (rawSourceColumns.length !== sourceColumns.length) { - console.warn(`โš ๏ธ sourceColumns ํ•„ํ„ฐ๋ง: ${rawSourceColumns.length}๊ฐœ โ†’ ${sourceColumns.length}๊ฐœ (๋นˆ ๋ฌธ์ž์—ด ์ œ๊ฑฐ)`); + console.warn(`โš ๏ธ [ModalRepeaterTable] sourceColumns ํ•„ํ„ฐ๋ง: ${rawSourceColumns.length}๊ฐœ โ†’ ${sourceColumns.length}๊ฐœ`); } if (rawUniqueField !== uniqueField) { - console.warn(`โš ๏ธ uniqueField ์ž๋™ ๋ณด์ •: "${rawUniqueField}" โ†’ "${uniqueField}"`); + console.warn(`โš ๏ธ [ModalRepeaterTable] uniqueField ์ž๋™ ๋ณด์ •: "${rawUniqueField}" โ†’ "${uniqueField}"`); } - console.log("๐ŸŽฌ ModalRepeaterTableComponent ๋งˆ์šดํŠธ:", { - columnsLength: columns.length, - sourceTable, - sourceColumns, - uniqueField, - }); - if (columns.length === 0) { - console.error("โŒ columns๊ฐ€ ๋น„์–ด์žˆ์Šต๋‹ˆ๋‹ค! sourceColumns:", sourceColumns); - } else { - console.log("โœ… columns ์„ค์ • ์™„๋ฃŒ:", columns.map(c => c.label || c.field).join(", ")); + console.error("โŒ [ModalRepeaterTable] columns๊ฐ€ ๋น„์–ด์žˆ์Šต๋‹ˆ๋‹ค!", { sourceColumns }); } }, []); - // value ๋ณ€๊ฒฝ ๊ฐ์ง€ - useEffect(() => { - console.log("๐Ÿ“ฆ ModalRepeaterTableComponent value ๋ณ€๊ฒฝ:", { - valueLength: value.length, - }); - }, [value]); - // ๐Ÿ†• ์ €์žฅ ์š”์ฒญ ์‹œ์—๋งŒ ๋ฐ์ดํ„ฐ ์ „๋‹ฌ (beforeFormSave ์ด๋ฒคํŠธ ๋ฆฌ์Šค๋„ˆ) useEffect(() => { const handleSaveRequest = async (event: Event) => { const componentKey = columnName || component?.id || "modal_repeater_data"; - console.log("๐Ÿ”” [ModalRepeaterTable] beforeFormSave ์ด๋ฒคํŠธ ์ˆ˜์‹ !", { - componentKey, - itemsCount: value.length, - hasOnFormDataChange: !!onFormDataChange, - columnName, - componentId: component?.id, - targetTable, - }); - if (value.length === 0) { console.warn("โš ๏ธ [ModalRepeaterTable] ์ €์žฅํ•  ๋ฐ์ดํ„ฐ ์—†์Œ"); return; } - // ๐Ÿ”ฅ sourceColumns์— ํฌํ•จ๋œ ์ปฌ๋Ÿผ ์ œ์™ธ (์กฐ์ธ๋œ ์ปฌ๋Ÿผ ์ œ๊ฑฐ) - console.log("๐Ÿ” [ModalRepeaterTable] ํ•„ํ„ฐ๋ง ์ „ ๋ฐ์ดํ„ฐ:", { - sourceColumns, - sourceTable, - targetTable, - sampleItem: value[0], - itemKeys: value[0] ? Object.keys(value[0]) : [], - }); - + // sourceColumns์— ํฌํ•จ๋œ ์ปฌ๋Ÿผ ์ œ์™ธ (์กฐ์ธ๋œ ์ปฌ๋Ÿผ ์ œ๊ฑฐ) const filteredData = value.map((item: any) => { const filtered: Record = {}; Object.keys(item).forEach((key) => { // sourceColumns์— ํฌํ•จ๋œ ์ปฌ๋Ÿผ์€ ์ œ์™ธ (item_info ํ…Œ์ด๋ธ”์˜ ์ปฌ๋Ÿผ) if (sourceColumns.includes(key)) { - console.log(` โ›” ${key} ์ œ์™ธ (sourceColumn)`); return; } // ๋ฉ”ํƒ€๋ฐ์ดํ„ฐ ํ•„๋“œ๋„ ์ œ์™ธ if (key.startsWith("_")) { - console.log(` โ›” ${key} ์ œ์™ธ (๋ฉ”ํƒ€๋ฐ์ดํ„ฐ)`); return; } filtered[key] = item[key]; @@ -325,12 +287,7 @@ export function ModalRepeaterTableComponent({ return filtered; }); - console.log("โœ… [ModalRepeaterTable] ํ•„ํ„ฐ๋ง ํ›„ ๋ฐ์ดํ„ฐ:", { - filteredItemKeys: filteredData[0] ? Object.keys(filteredData[0]) : [], - sampleFilteredItem: filteredData[0], - }); - - // ๐Ÿ”ฅ targetTable ๋ฉ”ํƒ€๋ฐ์ดํ„ฐ๋ฅผ ๋ฐฐ์—ด ํ•ญ๋ชฉ์— ์ถ”๊ฐ€ + // targetTable ๋ฉ”ํƒ€๋ฐ์ดํ„ฐ๋ฅผ ๋ฐฐ์—ด ํ•ญ๋ชฉ์— ์ถ”๊ฐ€ const dataWithTargetTable = targetTable ? filteredData.map((item: any) => ({ ...item, @@ -338,21 +295,19 @@ export function ModalRepeaterTableComponent({ })) : filteredData; - // โœ… CustomEvent์˜ detail์— ๋ฐ์ดํ„ฐ ์ถ”๊ฐ€ + // CustomEvent์˜ detail์— ๋ฐ์ดํ„ฐ ์ถ”๊ฐ€ if (event instanceof CustomEvent && event.detail) { event.detail.formData[componentKey] = dataWithTargetTable; - console.log("โœ… [ModalRepeaterTable] context.formData์— ๋ฐ์ดํ„ฐ ์ถ”๊ฐ€ ์™„๋ฃŒ:", { + console.log("โœ… [ModalRepeaterTable] ์ €์žฅ ๋ฐ์ดํ„ฐ ์ค€๋น„:", { key: componentKey, itemCount: dataWithTargetTable.length, - targetTable: targetTable || "๋ฏธ์„ค์ • (ํ™”๋ฉด ์„ค๊ณ„์—์„œ ์„ค์ • ํ•„์š”)", - sampleItem: dataWithTargetTable[0], + targetTable: targetTable || "๋ฏธ์„ค์ •", }); } // ๊ธฐ์กด onFormDataChange๋„ ํ˜ธ์ถœ (ํ˜ธํ™˜์„ฑ) if (onFormDataChange) { onFormDataChange(componentKey, dataWithTargetTable); - console.log("โœ… [ModalRepeaterTable] onFormDataChange ํ˜ธ์ถœ ์™„๋ฃŒ"); } }; diff --git a/frontend/lib/registry/components/table-list/TableListComponent.tsx b/frontend/lib/registry/components/table-list/TableListComponent.tsx index a8356721..76556ecb 100644 --- a/frontend/lib/registry/components/table-list/TableListComponent.tsx +++ b/frontend/lib/registry/components/table-list/TableListComponent.tsx @@ -2404,18 +2404,9 @@ export const TableListComponent: React.FC = ({ - ) : (() => { - console.log("๐Ÿ” [TableList] ๋ Œ๋”๋ง ์กฐ๊ฑด ์ฒดํฌ", { - groupByColumns: groupByColumns.length, - groupedDataLength: groupedData.length, - willRenderGrouped: groupByColumns.length > 0 && groupedData.length > 0, - dataLength: data.length, - }); - return groupByColumns.length > 0 && groupedData.length > 0; - })() ? ( + ) : groupByColumns.length > 0 && groupedData.length > 0 ? ( // ๊ทธ๋ฃนํ™”๋œ ๋ Œ๋”๋ง groupedData.map((group) => { - console.log("๐Ÿ“Š [TableList] ๊ทธ๋ฃน ๋ Œ๋”๋ง:", group.groupKey, group.count); const isCollapsed = collapsedGroups.has(group.groupKey); return ( @@ -2508,10 +2499,7 @@ export const TableListComponent: React.FC = ({ }) ) : ( // ์ผ๋ฐ˜ ๋ Œ๋”๋ง (๊ทธ๋ฃน ์—†์Œ) - (() => { - console.log("๐Ÿ“‹ [TableList] ์ผ๋ฐ˜ ๋ Œ๋”๋ง ์‹œ์ž‘:", data.length, "๊ฐœ ํ–‰"); - return data; - })().map((row, index) => ( + data.map((row, index) => (