feat: Update screen management service and UI components for main table handling

- Enhanced the `ScreenManagementService` to update the main table name in the database when saving layout data, improving data integrity and tracking.
- Modified the `ScreenDesigner` component to include the main table name in the save request, ensuring the correct table is referenced.
- Updated the `TablesPanel` to generate unique keys for join tables based on source columns, preventing key collisions and improving rendering performance.
- Refactored the `TabsWidget` to streamline screen information loading and removed redundant screen info loading logic, enhancing efficiency and user experience.

frontend/components/screen/widgets/TabsWidget.tsx

@@ -135,8 +135,27 @@ export function TabsWidget({
   const [screenLayouts, setScreenLayouts] = useState<Record<string, ComponentData[]>>({});
   const [screenLoadingStates, setScreenLoadingStates] = useState<Record<string, boolean>>({});
   const [screenErrors, setScreenErrors] = useState<Record<string, string>>({});
-  // 탭별 화면 정보 (screenId, tableName) 저장
-  const [screenInfoMap, setScreenInfoMap] = useState<Record<string, { id: number; tableName?: string }>>({});
+  // 탭별 화면 정보 (screenId, tableName) - 인라인 컴포넌트의 테이블 설정에서 추출
+  const screenInfoMap = React.useMemo(() => {
+    const map: Record<string, { id?: number; tableName?: string }> = {};
+    for (const tab of tabs as ExtendedTabItem[]) {
+      const inlineComponents = tab.components || [];
+      if (inlineComponents.length > 0) {
+        // 인라인 컴포넌트에서 테이블 컴포넌트의 selectedTable 추출
+        const tableComp = inlineComponents.find(
+          (c) => c.componentType === "v2-table-list" || c.componentType === "table-list",
+        );
+        const selectedTable = tableComp?.componentConfig?.selectedTable;
+        if (selectedTable || tab.screenId) {
+          map[tab.id] = {
+            id: tab.screenId,
+            tableName: selectedTable,
+          };
+        }
+      }
+    }
+    return map;
+  }, [tabs]);
 
   // 컴포넌트 탭 목록 변경 시 동기화
   useEffect(() => {
@@ -157,21 +176,10 @@ export function TabsWidget({
         ) {
           setScreenLoadingStates((prev) => ({ ...prev, [tab.id]: true }));
           try {
-            // 레이아웃과 화면 정보를 병렬로 로드
-            const [layoutData, screenDef] = await Promise.all([
-              screenApi.getLayout(extTab.screenId),
-              screenApi.getScreen(extTab.screenId),
-            ]);
+            const layoutData = await screenApi.getLayout(extTab.screenId);
             if (layoutData && layoutData.components) {
               setScreenLayouts((prev) => ({ ...prev, [tab.id]: layoutData.components }));
             }
-            // 탭의 화면 정보 저장 (tableName 포함)
-            if (screenDef) {
-              setScreenInfoMap((prev) => ({
-                ...prev,
-                [tab.id]: { id: extTab.screenId!, tableName: screenDef.tableName },
-              }));
-            }
           } catch (error) {
             console.error(`탭 "${tab.label}" 화면 로드 실패:`, error);
             setScreenErrors((prev) => ({ ...prev, [tab.id]: "화면을 불러올 수 없습니다." }));
@@ -185,31 +193,6 @@ export function TabsWidget({
     loadScreenLayouts();
   }, [visibleTabs, screenLayouts, screenLoadingStates]);
 
-  // screenInfoMap이 없는 탭의 화면 정보 보충 로드
-  // screenId가 있지만 screenInfoMap에 아직 없는 탭의 화면 정보를 로드
-  useEffect(() => {
-    const loadMissingScreenInfo = async () => {
-      for (const tab of visibleTabs) {
-        const extTab = tab as ExtendedTabItem;
-        // screenId가 있고 screenInfoMap에 아직 없는 경우 로드
-        if (extTab.screenId && !screenInfoMap[tab.id]) {
-          try {
-            const screenDef = await screenApi.getScreen(extTab.screenId);
-            if (screenDef) {
-              setScreenInfoMap((prev) => ({
-                ...prev,
-                [tab.id]: { id: extTab.screenId!, tableName: screenDef.tableName },
-              }));
-            }
-          } catch (error) {
-            console.error(`탭 "${tab.label}" 화면 정보 로드 실패:`, error);
-          }
-        }
-      }
-    };
-    loadMissingScreenInfo();
-  }, [visibleTabs, screenInfoMap]);
-
   // 선택된 탭 변경 시 localStorage에 저장 + ActiveTab Context 업데이트
   useEffect(() => {
     if (persistSelection && typeof window !== "undefined") {