frontend/lib/registry/components/v2-split-panel-layout/SplitPanelLayoutComponent.tsx

@@ -462,6 +462,7 @@ export const SplitPanelLayoutComponent: React.FC<SplitPanelLayoutComponentProps>
   const [showDeleteModal, setShowDeleteModal] = useState(false);
   const [deleteModalPanel, setDeleteModalPanel] = useState<"left" | "right" | null>(null);
   const [deleteModalItem, setDeleteModalItem] = useState<any>(null);
+  const [deleteModalTableName, setDeleteModalTableName] = useState<string | null>(null); // 추가 탭 삭제 시 테이블명
 
   // 리사이저 드래그 상태
   const [isDragging, setIsDragging] = useState(false);
@@ -2197,32 +2198,39 @@ export const SplitPanelLayoutComponent: React.FC<SplitPanelLayoutComponentProps>
     loadRightData,
   ]);
 
-  // 삭제 버튼 핸들러
+  // 삭제 버튼 핸들러 (tableName: 추가 탭 등 특정 테이블 지정 시 사용)
-  const handleDeleteClick = useCallback((panel: "left" | "right", item: any) => {
+  const handleDeleteClick = useCallback((panel: "left" | "right", item: any, tableName?: string) => {
     setDeleteModalPanel(panel);
     setDeleteModalItem(item);
+    setDeleteModalTableName(tableName || null);
     setShowDeleteModal(true);
   }, []);
 
   // 삭제 확인
   const handleDeleteConfirm = useCallback(async () => {
-    // 우측 패널 삭제 시 중계 테이블 확인
+    // 1. 테이블명 결정: deleteModalTableName이 있으면 우선 사용 (추가 탭 등)
-    let tableName =
+    let tableName = deleteModalTableName;
-      deleteModalPanel === "left" ? componentConfig.leftPanel?.tableName : componentConfig.rightPanel?.tableName;
 
-    // 우측 패널 + 중계 테이블 모드인 경우
+    if (!tableName) {
-    if (deleteModalPanel === "right" && componentConfig.rightPanel?.addConfig?.targetTable) {
+      tableName =
-      tableName = componentConfig.rightPanel.addConfig.targetTable;
+        deleteModalPanel === "left" ? componentConfig.leftPanel?.tableName : componentConfig.rightPanel?.tableName;
-      console.log("🔗 중계 테이블 모드: 삭제 대상 테이블 =", tableName);
+
+      // 우측 패널 + 중계 테이블 모드인 경우
+      if (deleteModalPanel === "right" && componentConfig.rightPanel?.addConfig?.targetTable) {
+        tableName = componentConfig.rightPanel.addConfig.targetTable;
+        console.log("🔗 중계 테이블 모드: 삭제 대상 테이블 =", tableName);
+      }
     }
 
-    const sourceColumn = componentConfig.leftPanel?.itemAddConfig?.sourceColumn || "id";
+    // 2. Primary Key 추출: id 필드를 우선 사용, 없으면 전체 객체 전달 (복합키)
-    let primaryKey: any = deleteModalItem[sourceColumn] || deleteModalItem.id || deleteModalItem.ID;
+    let primaryKey: any = deleteModalItem?.id || deleteModalItem?.ID;
 
-    // 복합키 처리: deleteModalItem 전체를 전달 (백엔드에서 복합키 자동 처리)
+    if (!primaryKey && deleteModalItem && typeof deleteModalItem === "object") {
-    if (deleteModalItem && typeof deleteModalItem === "object") {
+      // id가 없는 경우에만 전체 객체 전달 (복합키 테이블)
       primaryKey = deleteModalItem;
-      console.log("🔑 복합키 가능성: 전체 객체 전달", primaryKey);
+      console.log("🔑 복합키: 전체 객체 전달", Object.keys(primaryKey));
+    } else {
+      console.log("🔑 단일키 삭제: id =", primaryKey, "테이블 =", tableName);
     }
 
     if (!tableName || !primaryKey) {
@@ -2290,6 +2298,7 @@ export const SplitPanelLayoutComponent: React.FC<SplitPanelLayoutComponentProps>
         // 모달 닫기
         setShowDeleteModal(false);
         setDeleteModalItem(null);
+        setDeleteModalTableName(null);
 
         // 데이터 새로고침
         if (deleteModalPanel === "left") {
@@ -2300,7 +2309,12 @@ export const SplitPanelLayoutComponent: React.FC<SplitPanelLayoutComponentProps>
             setRightData(null);
           }
         } else if (deleteModalPanel === "right") {
-          loadRightData(selectedLeftItem);
+          // 추가 탭에서 삭제한 경우 해당 탭 데이터 리로드
+          if (deleteModalTableName && activeTabIndex > 0) {
+            loadTabData(activeTabIndex, selectedLeftItem);
+          } else {
+            loadRightData(selectedLeftItem);
+          }
         }
       } else {
         toast({
@@ -2324,7 +2338,7 @@ export const SplitPanelLayoutComponent: React.FC<SplitPanelLayoutComponentProps>
         variant: "destructive",
       });
     }
-  }, [deleteModalPanel, componentConfig, deleteModalItem, toast, selectedLeftItem, loadLeftData, loadRightData]);
+  }, [deleteModalPanel, deleteModalTableName, componentConfig, deleteModalItem, toast, selectedLeftItem, loadLeftData, loadRightData, loadTabData, activeTabIndex]);
 
   // 항목별 추가 버튼 핸들러 (좌측 항목의 + 버튼 - 하위 항목 추가)
   const handleItemAddClick = useCallback(
@@ -3541,7 +3555,7 @@ export const SplitPanelLayoutComponent: React.FC<SplitPanelLayoutComponentProps>
                                     )}
                                     {currentTabConfig?.showDelete && (
                                       <Button size="sm" variant="ghost" className="text-destructive h-7 px-2 text-xs"
-                                        onClick={() => handleDeleteClick("right", item)}
+                                        onClick={() => handleDeleteClick("right", item, currentTabConfig?.tableName)}
                                       >
                                         <Trash2 className="h-3 w-3" />
                                       </Button>
@@ -3585,7 +3599,7 @@ export const SplitPanelLayoutComponent: React.FC<SplitPanelLayoutComponentProps>
                             )}
                             {currentTabConfig?.showDelete && (
                               <Button size="sm" variant="ghost" className="text-destructive h-7 px-2 text-xs"
-                                onClick={() => handleDeleteClick("right", item)}
+                                onClick={() => handleDeleteClick("right", item, currentTabConfig?.tableName)}
                               >
                                 <Trash2 className="h-3 w-3" />
                               </Button>