chore: attachment 인터페이스 수정

This commit is contained in:
2025-05-14 13:55:04 +09:00
parent d9a4e365ba
commit b0235808f8
12 changed files with 57 additions and 46 deletions
@@ -26,7 +26,7 @@ export class AttachmentApiService implements AttachmentService {
return response.data;
}
public async deleteAttachment(atflId: string): Promise<void> {
public async deleteAttachmentByAtflId(atflId: string): Promise<void> {
await client.delete(`${ENDPOINT.ATTACH_SERVICE.ATTACHMENTS}/${atflId}`);
}
@@ -36,17 +36,13 @@ export class AttachmentApiService implements AttachmentService {
);
}
public async getImageUrl(atflId: string): Promise<string> {
public async getImageUrlByAtflId(atflId: string): Promise<string> {
if (!atflId) return "";
const response = await fetch(`${ENDPOINT.ATTACH_SERVICE.IMAGES}/${atflId}`);
const blob = await response.blob();
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 +52,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> {
@@ -36,10 +36,10 @@ export type AttachmentList = PageableList<Attachment>;
export interface AttachmentService {
getAttachmentsList: (params: AttachmentParams) => Promise<AttachmentList>;
getAttachmentsInfo: (atflCd: string) => Promise<Attachment[]>;
deleteAttachment: (atflId: string) => Promise<void>;
deleteAttachmentByAtflId: (atflId: string) => Promise<void>;
deleteAttachmentByAtflCd: (atflCd: string) => Promise<void>;
getImageUrl: (atflId: string) => Promise<string>;
getImageUrlByAtflId: (atflId: string) => Promise<string>;
getImageUrlByAtflCd: (atflCd: string) => Promise<string>;
getMovieThumbnailUrl: (atflId: string) => Promise<string>;
downloadAttachmentByAtflCd: (atflCd: string) => Promise<AxiosResponse>;
}
@@ -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",
},
@@ -48,22 +48,17 @@ export const createColumns = (
{
id: "atflCd",
cell: ({ row }) => {
const atflCd = row.original.atflCd;
return (
<ThumbImage
atflCd={atflCd}
pstNo={row.original.pstNo}
thumbRefs={thumbRefs}
/>
);
const { atflCd, pstNo } = row.original;
return <ThumbImage atflCd={atflCd} pstNo={pstNo} thumbRefs={thumbRefs} />;
},
},
{
id: "rgtrNm",
cell: ({ row }) => {
const { rgtrNm } = row.original;
return (
<span className="text-[1.4rem] font-bold text-label">{rgtrNm}</span>
<span className="text-[1.4rem] font-bold text-label">
{row.original.rgtrNm}
</span>
);
},
},
@@ -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.getImageUrlByAtflId(atflId);
}
if (bbsInfo?.bbsTypeCd === "BBSMOVIE") {
imageUrl = await AttachmentApi.getMovieThumbnailUrl(atflId);
}
setThumbnailUrl(imageUrl);
}
};
@@ -67,7 +85,7 @@ function WithPreviewFileUploader<T extends PostFormData | PostUpdateFormData>({
useEffect(() => {
if (!attachmentData || attachmentData.length === 0) return;
(async () => {
const imageUrl = await AttachmentApi.getImageUrl(
const imageUrl = await AttachmentApi.getImageUrlByAtflId(
attachmentData[0]?.atflId as string,
);
setThumbnailUrl(imageUrl);
@@ -77,8 +95,8 @@ function WithPreviewFileUploader<T extends PostFormData | PostUpdateFormData>({
return (
<FileUploader
id="atflCd"
className="!h-auto !max-w-none flex-col !items-start gap-4"
accept=".jpeg,.jpg,.png"
className="!h-auto !max-w-none flex-col !items-start gap-4 [&_.file-uploader-label]:h-[3.2rem]"
accept={fileAccept(bbsInfo?.bbsTypeCd as BbsType)}
onUpload={onUpload}
customPreview={
<Label htmlFor="atflCd">
@@ -26,10 +26,6 @@ export class AttachmentApiService implements AttachmentService {
return response.data;
}
public async deleteAttachment(atflId: string): Promise<void> {
await client.delete(`${ENDPOINT.ATTACH_SERVICE.ATTACHMENTS}/${atflId}`);
}
public async deleteAttachmentByAtflId(atflId: string): Promise<void> {
await client.delete(`${ENDPOINT.ATTACH_SERVICE.ATTACHMENTS}/${atflId}`);
}
@@ -40,7 +36,7 @@ export class AttachmentApiService implements AttachmentService {
);
}
public async getImageUrl(atflId: string): Promise<string> {
public async getImageUrlByAtflId(atflId: string): Promise<string> {
if (!atflId) return "";
const response = await fetch(`${ENDPOINT.ATTACH_SERVICE.IMAGES}/${atflId}`);
const blob = await response.blob();
@@ -36,10 +36,9 @@ export type AttachmentList = PageableList<Attachment>;
export interface AttachmentService {
getAttachmentsList: (params: AttachmentParams) => Promise<AttachmentList>;
getAttachmentsInfo: (atflCd: string) => Promise<Attachment[]>;
deleteAttachment: (atflId: string) => Promise<void>;
deleteAttachmentByAtflId: (atflId: string) => Promise<void>;
deleteAttachmentByAtflCd: (atflCd: string) => Promise<void>;
getImageUrl: (atflId: string) => Promise<string>;
getImageUrlByAtflId: (atflId: string) => Promise<string>;
getImageUrlByAtflCd: (atflCd: string) => Promise<string>;
getMovieThumbnailUrl: (atflId: string) => Promise<string>;
downloadAttachmentByAtflCd: (atflCd: string) => Promise<AxiosResponse>;
+4 -2
View File
@@ -59,7 +59,7 @@ function BannerForm({ form, bnrSn, ...props }: BannerFormProps) {
const { atflCd, atflId } = JSON.parse(fileInfo) ?? {};
if (atflCd) form.setValue("atflCd", atflCd);
if (atflId) setImageUrl(await AttachmentApi.getImageUrl(atflId));
if (atflId) setImageUrl(await AttachmentApi.getImageUrlByAtflId(atflId));
if (attachmentData)
await AttachmentApi.deleteAttachmentByAtflCd(attachmentData.atflCd);
};
@@ -68,7 +68,9 @@ function BannerForm({ form, bnrSn, ...props }: BannerFormProps) {
if (!attachmentData) return;
(async () => {
setImageUrl(await AttachmentApi.getImageUrl(attachmentData.atflId));
setImageUrl(
await AttachmentApi.getImageUrlByAtflId(attachmentData.atflId),
);
})();
}, [attachmentData]);
+2 -1
View File
@@ -39,7 +39,8 @@ function FilePage() {
});
const { mutate: deleteAttachment } = useMutation({
mutationFn: (atflId: string) => AttachmentApi.deleteAttachment(atflId),
mutationFn: (atflId: string) =>
AttachmentApi.deleteAttachmentByAtflId(atflId),
onSuccess: () => {
refetch();
alert("삭제되었습니다.");
+1 -1
View File
@@ -60,7 +60,7 @@ function ImageForm({ form, imgSn, ...props }: ImageFormProps) {
const { atflCd, atflId } = JSON.parse(fileInfo) ?? {};
if (atflCd) form.setValue("atflCd", atflCd);
if (atflId) setImageUrl(await AttachmentApi.getImageUrl(atflId));
if (atflId) setImageUrl(await AttachmentApi.getImageUrlByAtflId(atflId));
if (attachmentData)
await AttachmentApi.deleteAttachmentByAtflCd(attachmentData.atflCd);
};
@@ -48,22 +48,17 @@ export const createColumns = (
{
id: "atflCd",
cell: ({ row }) => {
const atflCd = row.original.atflCd;
return (
<ThumbImage
atflCd={atflCd}
pstNo={row.original.pstNo}
thumbRefs={thumbRefs}
/>
);
const { atflCd, pstNo } = row.original;
return <ThumbImage atflCd={atflCd} pstNo={pstNo} thumbRefs={thumbRefs} />;
},
},
{
id: "rgtrNm",
cell: ({ row }) => {
const { rgtrNm } = row.original;
return (
<span className="text-[1.4rem] font-bold text-label">{rgtrNm}</span>
<span className="text-[1.4rem] font-bold text-label">
{row.original.rgtrNm}
</span>
);
},
},
@@ -47,7 +47,7 @@ function WithPreviewFileUploader<T extends PostFormData | PostUpdateFormData>({
if (atflId) {
let imageUrl = "";
if (bbsInfo?.bbsTypeCd === "BBSIMAGE") {
imageUrl = await AttachmentApi.getImageUrl(atflId);
imageUrl = await AttachmentApi.getImageUrlByAtflId(atflId);
}
if (bbsInfo?.bbsTypeCd === "BBSMOVIE") {
imageUrl = await AttachmentApi.getMovieThumbnailUrl(atflId);
@@ -85,7 +85,7 @@ function WithPreviewFileUploader<T extends PostFormData | PostUpdateFormData>({
useEffect(() => {
if (!attachmentData || attachmentData.length === 0) return;
(async () => {
const imageUrl = await AttachmentApi.getImageUrl(
const imageUrl = await AttachmentApi.getImageUrlByAtflId(
attachmentData[0]?.atflId as string,
);
setThumbnailUrl(imageUrl);
@@ -95,7 +95,7 @@ function WithPreviewFileUploader<T extends PostFormData | PostUpdateFormData>({
return (
<FileUploader
id="atflCd"
className="!h-auto !max-w-none flex-col !items-start gap-4"
className="!h-auto !max-w-none flex-col !items-start gap-4 [&_.file-uploader-label]:h-[3.2rem]"
accept={fileAccept(bbsInfo?.bbsTypeCd as BbsType)}
onUpload={onUpload}
customPreview={