모달열기 액션 통합

frontend/lib/registry/components/select-basic/SelectBasicComponent.tsx

@@ -63,15 +63,6 @@ const SelectBasicComponent: React.FC<SelectBasicComponentProps> = ({
   // 화면 컨텍스트 (데이터 제공자로 등록)
   const screenContext = useScreenContextOptional();
 
-  // 🚨 최초 렌더링 확인용 (테스트 후 제거)
-  console.log("🚨🚨🚨 [SelectBasicComponent] 렌더링됨!!!!", {
-    componentId: component.id,
-    componentType: (component as any).componentType,
-    columnName: (component as any).columnName,
-    "props.multiple": (props as any).multiple,
-    "componentConfig.multiple": componentConfig?.multiple,
-  });
-
   const [isOpen, setIsOpen] = useState(false);
 
   // webTypeConfig 또는 componentConfig 사용 (DynamicWebTypeRenderer 호환성)
@@ -80,30 +71,6 @@ const SelectBasicComponent: React.FC<SelectBasicComponentProps> = ({
   // 🆕 multiple 값: props.multiple (spread된 값) > config.multiple 순서로 우선순위
   const isMultiple = (props as any).multiple ?? config?.multiple ?? false;
 
-  // 🔍 디버깅: config 및 multiple 확인
-  useEffect(() => {
-    console.log("🔍 [SelectBasicComponent] ========== 다중선택 디버깅 ==========");
-    console.log("   컴포넌트 ID:", component.id);
-    console.log("   최종 isMultiple 값:", isMultiple);
-    console.log("   ----------------------------------------");
-    console.log("   props.multiple:", (props as any).multiple);
-    console.log("   config.multiple:", config?.multiple);
-    console.log("   componentConfig.multiple:", componentConfig?.multiple);
-    console.log("   component.componentConfig.multiple:", component.componentConfig?.multiple);
-    console.log("   ----------------------------------------");
-    console.log("   config 전체:", config);
-    console.log("   componentConfig 전체:", componentConfig);
-    console.log("   component.componentConfig 전체:", component.componentConfig);
-    console.log("   =======================================");
-
-    // 다중선택이 활성화되었는지 알림
-    if (isMultiple) {
-      console.log("✅ 다중선택 모드 활성화됨!");
-    } else {
-      console.log("❌ 단일선택 모드 (다중선택 비활성화)");
-    }
-  }, [(props as any).multiple, config?.multiple, componentConfig?.multiple, component.componentConfig?.multiple]);
-
   // webType에 따른 세부 타입 결정 (TextInputComponent와 동일한 방식)
   const webType = component.componentConfig?.webType || "select";
 
@@ -176,17 +143,8 @@ const SelectBasicComponent: React.FC<SelectBasicComponentProps> = ({
   // 1순위: 동적으로 조회된 값 (테이블 타입관리에서 설정)
   // 2순위: config에서 전달된 값
   const hierarchyRole = columnHierarchy?.hierarchyRole || config?.hierarchyRole || componentConfig?.hierarchyRole;
-  const hierarchyParentField = columnHierarchy?.hierarchyParentField || config?.hierarchyParentField || componentConfig?.hierarchyParentField;
-
-  // 디버깅 로그
-  console.log("🔍 [SelectBasic] 계층구조 설정:", {
-    columnName: component.columnName,
-    tableName: component.tableName,
-    columnHierarchy,
-    hierarchyRole,
-    hierarchyParentField,
-    codeCategory,
-  });
+  const hierarchyParentField =
+    columnHierarchy?.hierarchyParentField || config?.hierarchyParentField || componentConfig?.hierarchyParentField;
 
   // 🆕 자식 역할일 때 부모 값 추출 (단일 또는 다중)
   const rawParentValue =
@@ -206,27 +164,9 @@ const SelectBasicComponent: React.FC<SelectBasicComponentProps> = ({
   // 최종 비활성화 상태
   const isFieldDisabled = isFieldDisabledBase || isHierarchyDisabled;
 
-  console.log("🔍 [SelectBasic] 비활성화 상태:", {
-    columnName: component.columnName,
-    hierarchyRole,
-    hierarchyParentValue,
-    isHierarchyDisabled,
-    isFieldDisabled,
-  });
-
   // 🆕 계층구조 역할에 따라 옵션 필터링
   const filteredCodeOptions = useMemo(() => {
-    console.log("🔍 [SelectBasic] 옵션 필터링:", {
-      columnName: component.columnName,
-      hierarchyRole,
-      hierarchyParentField,
-      hierarchyParentValue,
-      codeOptionsCount: codeOptions?.length || 0,
-      sampleOptions: codeOptions?.slice(0, 3),
-    });
-
     if (!hierarchyRole || !codeOptions || codeOptions.length === 0) {
-      console.log("🔍 [SelectBasic] 필터링 스킵 - hierarchyRole 없음 또는 옵션 없음");
       return codeOptions;
     }
 
@@ -237,7 +177,6 @@ const SelectBasicComponent: React.FC<SelectBasicComponentProps> = ({
         const parentCodeValue = opt.parentCodeValue || opt.parent_code_value;
         return depth === 1 || !parentCodeValue;
       });
-      console.log("🔍 [SelectBasic] 대분류 필터링 결과:", filtered.length, "개");
       return filtered;
     }
 
@@ -247,18 +186,16 @@ const SelectBasicComponent: React.FC<SelectBasicComponentProps> = ({
         const parentCodeValue = opt.parentCodeValue || opt.parent_code_value;
         return parentCodeValue === hierarchyParentValue;
       });
-      console.log("🔍 [SelectBasic] 중/소분류 필터링 결과:", filtered.length, "개");
       return filtered;
     }
 
     // 부모 값이 없으면 빈 배열 반환 (선택 불가 상태)
     if (hierarchyRole === "medium" || hierarchyRole === "small") {
-      console.log("🔍 [SelectBasic] 중/소분류 - 부모값 없음, 빈 배열 반환");
       return [];
     }
 
     return codeOptions;
-  }, [codeOptions, hierarchyRole, hierarchyParentValue, hierarchyParentField, component.columnName]);
+  }, [codeOptions, hierarchyRole, hierarchyParentValue]);
 
   // 🆕 부모값이 콤마로 구분된 문자열이면 배열로 변환 (다중 선택 지원)
   const parentValues: string[] | undefined = useMemo(() => {
@@ -295,44 +232,22 @@ const SelectBasicComponent: React.FC<SelectBasicComponentProps> = ({
 
   useEffect(() => {
     if (webType === "category" && component.tableName && component.columnName) {
-      console.log("🔍 [SelectBasic] 카테고리 값 로딩 시작:", {
-        tableName: component.tableName,
-        columnName: component.columnName,
-        webType,
-      });
-
       setIsLoadingCategories(true);
 
       import("@/lib/api/tableCategoryValue").then(({ getCategoryValues }) => {
         getCategoryValues(component.tableName!, component.columnName!)
           .then((response) => {
-            console.log("🔍 [SelectBasic] 카테고리 API 응답:", response);
-
-            if (response.success && response.data) {
-              console.log("🔍 [SelectBasic] 원본 데이터 샘플:", {
-                firstItem: response.data[0],
-                keys: response.data[0] ? Object.keys(response.data[0]) : [],
-              });
-
-              const activeValues = response.data.filter((v) => v.isActive !== false);
-              const options = activeValues.map((v) => ({
+            if (response.success && "data" in response && response.data) {
+              const activeValues = response.data.filter((v: any) => v.isActive !== false);
+              const options = activeValues.map((v: any) => ({
                 value: v.valueCode,
                 label: v.valueLabel || v.valueCode,
               }));
-
-              console.log("✅ [SelectBasic] 카테고리 옵션 설정:", {
-                activeValuesCount: activeValues.length,
-                options,
-                sampleOption: options[0],
-              });
-
               setCategoryOptions(options);
-            } else {
-              console.error("❌ [SelectBasic] 카테고리 응답 실패:", response);
             }
           })
-          .catch((error) => {
-            console.error("❌ [SelectBasic] 카테고리 값 조회 실패:", error);
+          .catch(() => {
+            // 카테고리 값 조회 실패 시 무시
           })
           .finally(() => {
             setIsLoadingCategories(false);
@@ -341,35 +256,10 @@ const SelectBasicComponent: React.FC<SelectBasicComponentProps> = ({
     }
   }, [webType, component.tableName, component.columnName]);
 
-  // 디버깅: menuObjid가 제대로 전달되는지 확인
-  useEffect(() => {
-    if (codeCategory && codeCategory !== "none") {
-      console.log(`🎯 [SelectBasicComponent ${component.id}] 코드 옵션 로드:`, {
-        codeCategory,
-        menuObjid,
-        hasMenuObjid: !!menuObjid,
-        isCodeCategoryValid,
-        codeOptionsCount: codeOptions.length,
-        isLoading: isLoadingCodes,
-      });
-    }
-  }, [component.id, codeCategory, menuObjid, codeOptions.length, isLoadingCodes, isCodeCategoryValid]);
-
   // 외부 value prop 변경 시 selectedValue 업데이트
   useEffect(() => {
     const newValue = externalValue || config?.value || "";
 
-    console.log("🔍 [SelectBasic] 외부 값 변경 감지:", {
-      componentId: component.id,
-      columnName: (component as any).columnName,
-      isMultiple,
-      newValue,
-      selectedValue,
-      selectedValues,
-      externalValue,
-      "config.value": config?.value,
-    });
-
     // 다중선택 모드인 경우
     if (isMultiple) {
       if (typeof newValue === "string" && newValue) {
@@ -380,14 +270,9 @@ const SelectBasicComponent: React.FC<SelectBasicComponentProps> = ({
         const currentValuesStr = selectedValues.join(",");
 
         if (newValue !== currentValuesStr) {
-          console.log("✅ [SelectBasic] 다중선택 값 업데이트:", {
-            from: selectedValues,
-            to: values,
-          });
           setSelectedValues(values);
         }
       } else if (!newValue && selectedValues.length > 0) {
-        console.log("✅ [SelectBasic] 다중선택 값 초기화");
         setSelectedValues([]);
       }
     } else {
@@ -544,32 +429,12 @@ const SelectBasicComponent: React.FC<SelectBasicComponentProps> = ({
 
     const configOptions = config.options || [];
     // 🆕 계층구조 역할이 설정된 경우 필터링된 옵션 사용
-    console.log("🔍 [SelectBasic] getAllOptions 호출:", {
-      columnName: component.columnName,
-      hierarchyRole,
-      codeOptionsCount: codeOptions?.length || 0,
-      filteredCodeOptionsCount: filteredCodeOptions?.length || 0,
-      categoryOptionsCount: categoryOptions?.length || 0,
-      configOptionsCount: configOptions?.length || 0,
-    });
     return [...filteredCodeOptions, ...categoryOptions, ...configOptions];
   };
 
   const allOptions = getAllOptions();
   const placeholder = componentConfig.placeholder || "선택하세요";
 
-  // 🔍 디버깅: 최종 옵션 확인
-  useEffect(() => {
-    if (webType === "category" && allOptions.length > 0) {
-      console.log("🔍 [SelectBasic] 최종 allOptions:", {
-        count: allOptions.length,
-        categoryOptionsCount: categoryOptions.length,
-        codeOptionsCount: codeOptions.length,
-        sampleOptions: allOptions.slice(0, 3),
-      });
-    }
-  }, [webType, allOptions.length, categoryOptions.length, codeOptions.length]);
-
   // DOM props에서 React 전용 props 필터링
   const {
     component: _component,