From e97fd05e75f1a739392ece5dd7c0e23e9ab27e1c Mon Sep 17 00:00:00 2001
From: kjs <kjs@wace.me>
Date: Tue, 10 Feb 2026 14:01:43 +0900
Subject: [PATCH] feat: Enhance CardDisplay and SplitPanelLayout components
 with improved table name handling and custom selection data

- Updated CardDisplayComponent to streamline table name retrieval from props or component configuration.
- Introduced custom selection data management in SplitPanelLayoutComponent, allowing for better handling of selected items in custom mode.
- Enhanced form data handling in SplitPanelLayoutComponent to utilize selected data from the left panel, improving data flow and user experience.
---
 .../v2-card-display/CardDisplayComponent.tsx      |  4 ++--
 .../SplitPanelLayoutComponent.tsx                 | 15 ++++++++++++++-
 2 files changed, 16 insertions(+), 3 deletions(-)

diff --git a/frontend/lib/registry/components/v2-card-display/CardDisplayComponent.tsx b/frontend/lib/registry/components/v2-card-display/CardDisplayComponent.tsx
index e8afb3b3..ad6c88db 100644
--- a/frontend/lib/registry/components/v2-card-display/CardDisplayComponent.tsx
+++ b/frontend/lib/registry/components/v2-card-display/CardDisplayComponent.tsx
@@ -233,8 +233,8 @@ export const CardDisplayComponent: React.FC<CardDisplayComponentProps> = ({
         return;
       }
 
-      // tableName 확인 (props에서 전달받은 tableName 사용)
-      const tableNameToUse = tableName || component.componentConfig?.tableName || 'user_info'; // 기본 테이블명 설정
+      // tableName 확인 (props에서 전달받은 tableName 또는 componentConfig에서 추출)
+      const tableNameToUse = tableName || component.componentConfig?.tableName;
 
       if (!tableNameToUse) {
         setLoading(false);
diff --git a/frontend/lib/registry/components/v2-split-panel-layout/SplitPanelLayoutComponent.tsx b/frontend/lib/registry/components/v2-split-panel-layout/SplitPanelLayoutComponent.tsx
index 9328df8c..5857e88e 100644
--- a/frontend/lib/registry/components/v2-split-panel-layout/SplitPanelLayoutComponent.tsx
+++ b/frontend/lib/registry/components/v2-split-panel-layout/SplitPanelLayoutComponent.tsx
@@ -193,6 +193,7 @@ export const SplitPanelLayoutComponent: React.FC<SplitPanelLayoutComponentProps>
   const [rightData, setRightData] = useState<any[] | any>(null); // 조인 모드는 배열, 상세 모드는 객체
   const [selectedLeftItem, setSelectedLeftItem] = useState<any>(null);
   const [expandedRightItems, setExpandedRightItems] = useState<Set<string | number>>(new Set()); // 확장된 우측 아이템
+  const [customLeftSelectedData, setCustomLeftSelectedData] = useState<Record<string, any>>({}); // 커스텀 모드: 좌측 선택 데이터
   const [leftSearchQuery, setLeftSearchQuery] = useState("");
   const [rightSearchQuery, setRightSearchQuery] = useState("");
   const [isLoadingLeft, setIsLoadingLeft] = useState(false);
@@ -2747,6 +2748,17 @@ export const SplitPanelLayoutComponent: React.FC<SplitPanelLayoutComponentProps>
                               component={componentData as any}
                               isDesignMode={false}
                               formData={{}}
+                              tableName={componentConfig.leftPanel?.tableName}
+                              onFormDataChange={(data: any) => {
+                                // 커스텀 모드: 좌측 카드/테이블 선택 시 데이터 캡처
+                                if (data?.selectedRowsData && data.selectedRowsData.length > 0) {
+                                  setCustomLeftSelectedData(data.selectedRowsData[0]);
+                                  setSelectedLeftItem(data.selectedRowsData[0]);
+                                } else if (data?.selectedRowsData && data.selectedRowsData.length === 0) {
+                                  setCustomLeftSelectedData({});
+                                  setSelectedLeftItem(null);
+                                }
+                              }}
                             />
                           </div>
                         );
@@ -3617,7 +3629,8 @@ export const SplitPanelLayoutComponent: React.FC<SplitPanelLayoutComponentProps>
                             <DynamicComponentRenderer
                               component={componentData as any}
                               isDesignMode={false}
-                              formData={{}}
+                              formData={customLeftSelectedData}
+                              tableName={componentConfig.rightPanel?.tableName || componentConfig.leftPanel?.tableName}
                             />
                           </div>
                         );