From c51cd7bc875829e8b21382ed19a5d67ae6ba07a8 Mon Sep 17 00:00:00 2001
From: kjs <kjs@wace.me>
Date: Thu, 20 Nov 2025 17:31:42 +0900
Subject: [PATCH] =?UTF-8?q?fix:=20=EC=BB=B4=ED=8F=AC=EB=84=8C=ED=8A=B8=20?=
 =?UTF-8?q?=EC=84=A4=EC=A0=95=20=ED=8C=A8=EB=84=90=20config=20=EB=B3=91?=
 =?UTF-8?q?=ED=95=A9=20=EB=B0=8F=20props=20=EC=A0=84=EB=8B=AC=20=EA=B0=9C?=
 =?UTF-8?q?=EC=84=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- TableListConfigPanel: handleNestedChange에서 전체 config 병합 로직 추가
- TableListComponent: checkbox.enabled 및 position 기본값 처리 (undefined시 기본값 사용)
- SelectedItemsDetailInputConfigPanel: handleChange에서 전체 config 병합 로직 추가
- SelectedItemsDetailInputConfigPanel: 원본 데이터 테이블 선택 disabled 조건 제거
- UnifiedPropertiesPanel: allTables 로드 및 ConfigPanel에 전달 추가

문제:
1. table-list 컴포넌트 체크박스 설정 변경 시 다른 설정 초기화
2. selected-items-detail-input 설정 변경 시 컴포넌트 이름 등 다른 속성 손실
3. 원본 데이터 테이블 선택이 비활성화되어 있음

해결:
- 모든 설정 패널에서 부분 업데이트 시 기존 config와 병합하도록 수정
- checkbox 관련 기본값 처리로 기존 컴포넌트 호환성 보장
- allTables를 별도로 로드하여 전체 테이블 목록 제공
---
 .../screen/panels/UnifiedPropertiesPanel.tsx  | 20 ++++++++
 .../SelectedItemsDetailInputConfigPanel.tsx   |  4 +-
 .../table-list/TableListComponent.tsx         |  5 +-
 .../table-list/TableListConfigPanel.tsx       | 48 +++++++++++++++++++
 4 files changed, 73 insertions(+), 4 deletions(-)

diff --git a/frontend/components/screen/panels/UnifiedPropertiesPanel.tsx b/frontend/components/screen/panels/UnifiedPropertiesPanel.tsx
index 1d4829bb..61051439 100644
--- a/frontend/components/screen/panels/UnifiedPropertiesPanel.tsx
+++ b/frontend/components/screen/panels/UnifiedPropertiesPanel.tsx
@@ -119,6 +119,25 @@ export const UnifiedPropertiesPanel: React.FC<UnifiedPropertiesPanelProps> = ({
   const [localHeight, setLocalHeight] = useState<string>("");
   const [localWidth, setLocalWidth] = useState<string>("");
 
+  // 🆕 전체 테이블 목록 (selected-items-detail-input 등에서 사용)
+  const [allTables, setAllTables] = useState<Array<{ tableName: string; displayName?: string }>>([]);
+
+  // 🆕 전체 테이블 목록 로드
+  useEffect(() => {
+    const loadAllTables = async () => {
+      try {
+        const { tableManagementApi } = await import("@/lib/api/tableManagement");
+        const response = await tableManagementApi.getTableList();
+        if (response.success && response.data) {
+          setAllTables(response.data);
+        }
+      } catch (error) {
+        console.error("전체 테이블 목록 로드 실패:", error);
+      }
+    };
+    loadAllTables();
+  }, []);
+
   // 새로운 컴포넌트 시스템의 webType 동기화
   useEffect(() => {
     if (selectedComponent?.type === "component") {
@@ -326,6 +345,7 @@ export const UnifiedPropertiesPanel: React.FC<UnifiedPropertiesPanelProps> = ({
                 config={config} 
                 onChange={handleConfigChange}
                 tables={tables} // 테이블 정보 전달
+                allTables={allTables} // 🆕 전체 테이블 목록 전달 (selected-items-detail-input 등에서 사용)
                 screenTableName={selectedComponent.tableName || currentTable?.tableName || currentTableName} // 🔧 화면 테이블명 전달
                 tableColumns={currentTable?.columns || []} // 🔧 테이블 컬럼 정보 전달
               />
diff --git a/frontend/lib/registry/components/selected-items-detail-input/SelectedItemsDetailInputConfigPanel.tsx b/frontend/lib/registry/components/selected-items-detail-input/SelectedItemsDetailInputConfigPanel.tsx
index 408934e2..fa4813c2 100644
--- a/frontend/lib/registry/components/selected-items-detail-input/SelectedItemsDetailInputConfigPanel.tsx
+++ b/frontend/lib/registry/components/selected-items-detail-input/SelectedItemsDetailInputConfigPanel.tsx
@@ -180,7 +180,8 @@ export const SelectedItemsDetailInputConfigPanel: React.FC<SelectedItemsDetailIn
   }, [screenTableName]); // config.targetTable은 의존성에서 제외 (한 번만 실행)
 
   const handleChange = (key: keyof SelectedItemsDetailInputConfig, value: any) => {
-    onChange({ [key]: value });
+    // 🔧 기존 config와 병합하여 다른 속성 유지
+    onChange({ ...config, [key]: value });
   };
 
   const handleFieldsChange = (fields: AdditionalFieldDefinition[]) => {
@@ -403,7 +404,6 @@ export const SelectedItemsDetailInputConfigPanel: React.FC<SelectedItemsDetailIn
               role="combobox"
               aria-expanded={sourceTableSelectOpen}
               className="h-8 w-full justify-between text-xs sm:text-sm"
-              disabled={allTables.length === 0}
             >
               {selectedSourceTableLabel}
               <ChevronsUpDown className="ml-2 h-3 w-3 shrink-0 opacity-50 sm:h-4 sm:w-4" />
diff --git a/frontend/lib/registry/components/table-list/TableListComponent.tsx b/frontend/lib/registry/components/table-list/TableListComponent.tsx
index 24b80975..4a6aec26 100644
--- a/frontend/lib/registry/components/table-list/TableListComponent.tsx
+++ b/frontend/lib/registry/components/table-list/TableListComponent.tsx
@@ -1228,8 +1228,9 @@ export const TableListComponent: React.FC<TableListComponentProps> = ({
     }
 
     // 체크박스 컬럼 (나중에 위치 결정)
+    // 기본값: enabled가 undefined면 true로 처리
     let checkboxCol: ColumnConfig | null = null;
-    if (tableConfig.checkbox?.enabled) {
+    if (tableConfig.checkbox?.enabled ?? true) {
       checkboxCol = {
         columnName: "__checkbox__",
         displayName: "",
@@ -1258,7 +1259,7 @@ export const TableListComponent: React.FC<TableListComponentProps> = ({
 
     // 체크박스를 맨 앞 또는 맨 뒤에 추가
     if (checkboxCol) {
-      if (tableConfig.checkbox.position === "right") {
+      if (tableConfig.checkbox?.position === "right") {
         cols = [...cols, checkboxCol];
       } else {
         cols = [checkboxCol, ...cols];
diff --git a/frontend/lib/registry/components/table-list/TableListConfigPanel.tsx b/frontend/lib/registry/components/table-list/TableListConfigPanel.tsx
index 6d76cfc8..c5ed9aaa 100644
--- a/frontend/lib/registry/components/table-list/TableListConfigPanel.tsx
+++ b/frontend/lib/registry/components/table-list/TableListConfigPanel.tsx
@@ -269,7 +269,9 @@ export const TableListConfigPanel: React.FC<TableListConfigPanelProps> = ({
     // });
 
     const parentValue = config[parentKey] as any;
+    // 전체 config와 병합하여 다른 속성 유지
     const newConfig = {
+      ...config,
       [parentKey]: {
         ...parentValue,
         [childKey]: value,
@@ -754,6 +756,52 @@ export const TableListConfigPanel: React.FC<TableListConfigPanelProps> = ({
           </div>
         </div>
 
+        {/* 체크박스 설정 */}
+        <div className="space-y-3">
+          <div>
+            <h3 className="text-sm font-semibold">체크박스 설정</h3>
+          </div>
+          <hr className="border-border" />
+          <div className="space-y-2">
+            <div className="flex items-center space-x-2">
+              <Checkbox
+                id="checkboxEnabled"
+                checked={config.checkbox?.enabled ?? true}
+                onCheckedChange={(checked) => handleNestedChange("checkbox", "enabled", checked)}
+              />
+              <Label htmlFor="checkboxEnabled">체크박스 표시</Label>
+            </div>
+            
+            {config.checkbox?.enabled && (
+              <>
+                <div className="flex items-center space-x-2">
+                  <Checkbox
+                    id="checkboxSelectAll"
+                    checked={config.checkbox?.selectAll ?? true}
+                    onCheckedChange={(checked) => handleNestedChange("checkbox", "selectAll", checked)}
+                  />
+                  <Label htmlFor="checkboxSelectAll">전체 선택 체크박스 표시</Label>
+                </div>
+                
+                <div className="space-y-1">
+                  <Label htmlFor="checkboxPosition" className="text-xs">
+                    체크박스 위치
+                  </Label>
+                  <select
+                    id="checkboxPosition"
+                    value={config.checkbox?.position || "left"}
+                    onChange={(e) => handleNestedChange("checkbox", "position", e.target.value)}
+                    className="w-full h-8 text-xs border rounded-md px-2"
+                  >
+                    <option value="left">왼쪽</option>
+                    <option value="right">오른쪽</option>
+                  </select>
+                </div>
+              </>
+            )}
+          </div>
+        </div>
+
         {/* 가로 스크롤 및 컬럼 고정 */}
         <div className="space-y-3">
           <div>