검증게시판 첨부이미지 삭제 기능

frontend/src/components/verificationBoard/VerificationIssueAttachmentsSection.tsx

@@ -53,14 +53,13 @@ interface Props {
   /** 등록 draft — 저장 전 로컬 파일 */
   draftFiles?: File[];
   onDraftFilesChange?: (files: File[]) => void;
-  /** 상세 화면 — 저장 시 삭제할 서버 이미지 ID */
-  pendingDeleteIds?: number[];
-  onPendingDeleteIdsChange?: (ids: number[]) => void;
-  /** true: 추가·삭제를 저장 버튼까지 지연 (상세 편집) */
+  /** true: 새 첨부 업로드만 저장 시 반영 (삭제는 즉시 API) */
   deferUpload?: boolean;
   disabled?: boolean;
-  /** 모달 등 좁은 영역 */
+  /** compact: 모달 등 좁은 영역 */
   compact?: boolean;
+  /** 첨부 추가·삭제 후 (목록 갱신 등) */
+  onAttachmentsChanged?: () => void;
 }
 
 interface CtxMenuState {
@@ -72,11 +71,10 @@ const VerificationIssueAttachmentsSection: React.FC<Props> = ({
   issueId = null,
   draftFiles = [],
   onDraftFilesChange,
-  pendingDeleteIds = [],
-  onPendingDeleteIdsChange,
   deferUpload = false,
   disabled = false,
   compact = false,
+  onAttachmentsChanged,
 }) => {
   const isDraft = issueId == null;
   const saveOnSubmit = deferUpload && issueId != null;
@@ -169,6 +167,7 @@ const VerificationIssueAttachmentsSection: React.FC<Props> = ({
       const prepared = await prepareAttachmentsForUpload(picked);
       await uploadVerificationIssueImages(issueId, prepared);
       await reload();
+      onAttachmentsChanged?.();
     } catch (e) {
       console.warn('[VerificationBoard] attachment upload', e);
       window.alert(uploadErrorMessage(e));
@@ -203,20 +202,16 @@ const VerificationIssueAttachmentsSection: React.FC<Props> = ({
   const handleDeleteServer = async (imageId: number) => {
     if (issueId == null) return;
     if (!window.confirm('이 첨부 파일을 삭제할까요?')) return;
-    if (saveOnSubmit) {
-      onPendingDeleteIdsChange?.(
-        pendingDeleteIds.includes(imageId)
-          ? pendingDeleteIds
-          : [...pendingDeleteIds, imageId],
-      );
-      return;
-    }
+    setUploading(true);
     try {
       await deleteVerificationIssueImage(issueId, imageId);
       await reload();
+      onAttachmentsChanged?.();
     } catch (e) {
-      console.warn('[VerificationBoard] image delete', e);
-      window.alert('이미지 삭제에 실패했습니다.');
+      console.warn('[VerificationBoard] attachment delete', e);
+      window.alert('첨부 파일 삭제에 실패했습니다.');
+    } finally {
+      setUploading(false);
     }
   };
 
@@ -275,8 +270,8 @@ const VerificationIssueAttachmentsSection: React.FC<Props> = ({
   };
 
   const visibleServerImages = useMemo(
-    () => images.filter(img => img.id != null && !pendingDeleteIds.includes(img.id)),
-    [images, pendingDeleteIds],
+    () => images.filter(img => img.id != null),
+    [images],
   );
 
   const totalCount = isDraft || saveOnSubmit