대표 이미지 저장 기능 구현

frontend/lib/api/file.ts

@@ -249,3 +249,19 @@ export const getDirectFileUrl = (filePath: string): string => {
   const baseUrl = process.env.NEXT_PUBLIC_API_URL?.replace("/api", "") || "";
   return `${baseUrl}${filePath}`;
 };
+
+/**
+ * 대표 파일 설정
+ */
+export const setRepresentativeFile = async (objid: string): Promise<{
+  success: boolean;
+  message: string;
+}> => {
+  try {
+    const response = await apiClient.put(`/files/representative/${objid}`);
+    return response.data;
+  } catch (error) {
+    console.error("대표 파일 설정 오류:", error);
+    throw new Error("대표 파일 설정에 실패했습니다.");
+  }
+};

frontend/lib/registry/components/file-upload/FileUploadComponent.tsx

@@ -802,50 +802,33 @@ const FileUploadComponent: React.FC<FileUploadComponentProps> = ({
 
   // 대표 이미지 설정 핸들러
   const handleSetRepresentative = useCallback(
-    (file: FileInfo) => {
-      const updatedFiles = uploadedFiles.map((f) => ({
-        ...f,
-        isRepresentative: f.objid === file.objid,
-      }));
-
-      setUploadedFiles(updatedFiles);
-
-      // 대표 이미지 로드
-      loadRepresentativeImage(file);
-
-      // localStorage 백업
+    async (file: FileInfo) => {
       try {
-        const backupKey = `fileUpload_${component.id}`;
-        localStorage.setItem(backupKey, JSON.stringify(updatedFiles));
-        console.log("📌 대표 파일 설정 완료:", {
+        // API 호출하여 DB에 대표 파일 설정
+        const { setRepresentativeFile } = await import("@/lib/api/file");
+        await setRepresentativeFile(file.objid);
+
+        // 상태 업데이트
+        const updatedFiles = uploadedFiles.map((f) => ({
+          ...f,
+          isRepresentative: f.objid === file.objid,
+        }));
+
+        setUploadedFiles(updatedFiles);
+
+        // 대표 이미지 로드
+        loadRepresentativeImage(file);
+
+        console.log("✅ 대표 파일 설정 완료:", {
           componentId: component.id,
           representativeFile: file.realFileName,
+          objid: file.objid,
         });
       } catch (e) {
-        console.warn("localStorage 저장 실패:", e);
+        console.error("❌ 대표 파일 설정 실패:", e);
       }
-
-      // 전역 상태 동기화
-      if (typeof window !== "undefined") {
-        (window as any).globalFileState = {
-          ...(window as any).globalFileState,
-          [component.id]: updatedFiles,
-        };
-
-        // 실시간 동기화 이벤트 발송
-        const syncEvent = new CustomEvent("fileStateChanged", {
-          detail: {
-            componentId: component.id,
-            files: updatedFiles,
-            action: "setRepresentative",
-          },
-        });
-        window.dispatchEvent(syncEvent);
-      }
-
-      toast.success(`${file.realFileName}을(를) 대표 파일로 설정했습니다.`);
     },
-    [uploadedFiles, component.id, loadRepresentativeImage],
+    [uploadedFiles, component.id, loadRepresentativeImage]
   );
 
   // uploadedFiles 변경 시 대표 이미지 로드