WIP: 동영상 게시판 작업중

apps/cs/src/entities/attachment/api/attachment-service.ts

@@ -30,6 +30,10 @@ export class AttachmentApiService implements AttachmentService {
     await client.delete(`${ENDPOINT.ATTACH_SERVICE.ATTACHMENTS}/${atflId}`);
   }
 
+  public async deleteAttachmentByAtflId(atflId: string): Promise<void> {
+    await client.delete(`${ENDPOINT.ATTACH_SERVICE.ATTACHMENTS}/${atflId}`);
+  }
+
   public async deleteAttachmentByAtflCd(atflCd: string): Promise<void> {
     await client.delete(
       `${ENDPOINT.ATTACH_SERVICE.ATTACHMENTS}/atflCd/${atflCd}`,
@@ -43,10 +47,6 @@ export class AttachmentApiService implements AttachmentService {
     return URL.createObjectURL(blob);
   }
 
-  public async deleteAttachmentByAtflId(atflId: string): Promise<void> {
-    await client.delete(`${ENDPOINT.ATTACH_SERVICE.ATTACHMENTS}/${atflId}`);
-  }
-
   public async getImageUrlByAtflCd(atflCd: string): Promise<string> {
     if (!atflCd) return "";
     const response = await fetch(
@@ -56,6 +56,14 @@ export class AttachmentApiService implements AttachmentService {
     return URL.createObjectURL(blob);
   }
 
+  public async getMovieThumbnailUrl(atflId: string): Promise<string> {
+    const response = await fetch(
+      `${ENDPOINT.ATTACH_SERVICE.MOVIE_THUMBNAIL}/${atflId}`,
+    );
+    const blob = await response.blob();
+    return URL.createObjectURL(blob);
+  }
+
   public async downloadAttachmentByAtflCd(
     atflCd: string,
   ): Promise<AxiosResponse> {

apps/cs/src/entities/attachment/model/attachment-interface.ts

@@ -41,5 +41,6 @@ export interface AttachmentService {
   deleteAttachmentByAtflCd: (atflCd: string) => Promise<void>;
   getImageUrl: (atflId: string) => Promise<string>;
   getImageUrlByAtflCd: (atflCd: string) => Promise<string>;
+  getMovieThumbnailUrl: (atflId: string) => Promise<string>;
   downloadAttachmentByAtflCd: (atflCd: string) => Promise<AxiosResponse>;
 }

apps/cs/src/shared/config/api.ts

@@ -7,6 +7,7 @@ export const ENDPOINT = {
     TUS_UPLOAD: "/attach-service/api/v1/tus/upload",
     EDITOR_UPLOAD: "/attach-service/api/v1/upload/editor",
     IMAGES: "/attach-service/api/v1/images",
+    MOVIE_THUMBNAIL: "/attach-service/api/v1/movie/thumbnail",
     ATTACHMENTS: "/attach-service/api/v1/atfl/attachments",
     DOWNLOAD: "/attach-service/api/v1/atflcd/download",
   },

apps/cs/src/widgets/post/ui/post-form.tsx

@@ -412,7 +412,8 @@ function PostForm<T extends PostFormData | PostUpdateFormData>({
                 <TableRow>
                   <TableHead>첨부파일</TableHead>
                   <TableCell className="border">
-                    {bbsInfo?.bbsTypeCd === "BBSIMAGE" ? (
+                    {bbsInfo?.bbsTypeCd === "BBSIMAGE" ||
+                    bbsInfo?.bbsTypeCd === "BBSMOVIE" ? (
                       <WithPreviewFileUploader
                         form={form}
                         attachmentData={attachmentData}

apps/cs/src/widgets/post/ui/post-page.tsx

@@ -211,7 +211,7 @@ function PostPage({ bbsId }: { bbsId: string }) {
         </div>
         <div className="card !m-[1.2rem] h-full overflow-auto !p-0">
           {isFetched ? (
-            bbsType === "BBSIMAGE" ? (
+            bbsType === "BBSIMAGE" || bbsType === "BBSMOVIE" ? (
               <GridViewDataTable
                 table={gridViewTable}
                 onRowClick={handleRowClick}

apps/cs/src/widgets/post/ui/with-preview-file-uploader.tsx

@@ -7,6 +7,7 @@ import { handleTusUpload } from "@/entities/tus";
 import { AttachmentApi, type Attachment } from "@/entities/attachment";
 import type { PostFormData, PostUpdateFormData } from "@/entities/post";
 import { setCookie, useAlertStore, useMenuStore } from "@/shared/lib";
+import type { BbsType } from "@/shared/store/menu-store";
 
 function WithPreviewFileUploader<T extends PostFormData | PostUpdateFormData>({
   form,
@@ -21,6 +22,17 @@ function WithPreviewFileUploader<T extends PostFormData | PostUpdateFormData>({
   const [thumbnailUrl, setThumbnailUrl] = useState("");
   const [progress, setProgress] = useState(0);
 
+  const fileAccept = (bbsTypeCd: BbsType) => {
+    switch (bbsTypeCd) {
+      case "BBSIMAGE":
+        return ".jpeg,.jpg,.png";
+      case "BBSMOVIE":
+        return ".mp4,.mov,.avi,.wmv,.mkv";
+      default:
+        return "";
+    }
+  };
+
   const handleTusResponse = async (res: HttpResponse) => {
     const fileInfo = res.getHeader("X-File-Info");
     if (
@@ -33,7 +45,13 @@ function WithPreviewFileUploader<T extends PostFormData | PostUpdateFormData>({
     const { atflCd, atflId } = JSON.parse(fileInfo) ?? {};
     if (atflCd) form.setValue("atflCd" as FieldPath<T>, atflCd);
     if (atflId) {
-      const imageUrl = await AttachmentApi.getImageUrl(atflId);
+      let imageUrl = "";
+      if (bbsInfo?.bbsTypeCd === "BBSIMAGE") {
+        imageUrl = await AttachmentApi.getImageUrl(atflId);
+      }
+      if (bbsInfo?.bbsTypeCd === "BBSMOVIE") {
+        imageUrl = await AttachmentApi.getMovieThumbnailUrl(atflId);
+      }
       setThumbnailUrl(imageUrl);
     }
   };
@@ -78,7 +96,7 @@ function WithPreviewFileUploader<T extends PostFormData | PostUpdateFormData>({
     <FileUploader
       id="atflCd"
       className="!h-auto !max-w-none flex-col !items-start gap-4"
-      accept=".jpeg,.jpg,.png"
+      accept={fileAccept(bbsInfo?.bbsTypeCd as BbsType)}
       onUpload={onUpload}
       customPreview={
         <Label htmlFor="atflCd">