Commit @afecbd85a7c688dc025abec0242a5f926f8403ef

임동욱 08-21

feat: 쇼츠 수정 화면이 붙어 있는 영상 파일명을 보여 준다

영상 id는 조회에서 채워 hidden input에 실려 있었지만 FoxFileUpload에
defaultFiles를 넘기지 않아 칸이 늘 비어 보였다. 어떤 영상이 붙어 있는지
알 수 없어 매번 다시 올려야 하는 것처럼 보였다.

조회 응답의 fileList[].orgnlFileNm을 함께 실어 와 그 이름을 그린다.
이름이 없으면 "등록된 영상"으로 대신한다.

Co-Authored-By: Claude Opus 5

@afecbd85a7c688dc025abec0242a5f926f8403ef

a3d6469

afecbd8

app/(protected)/(basic)/contents/_components/content-video-field.tsx

--- app/(protected)/(basic)/contents/_components/content-video-field.tsx

+++ app/(protected)/(basic)/contents/_components/content-video-field.tsx


 
 interface ContentVideoFieldProps {
   defaultFileId?: string | null;
+  /** 이미 올라가 있는 영상의 원본 파일명. 없으면 대체 문구로 그린다. */
+  defaultFileName?: string | null;
 }
 
 /**

  * 업로드가 끝나기 전에 저장하면 영상 없이 저장되므로 그동안은 `videoUploading`을 실어 보내
  * Server Action이 막게 한다.
  */
-export function ContentVideoField({ defaultFileId }: ContentVideoFieldProps) {
+export function ContentVideoField({
+  defaultFileId,
+  defaultFileName,
+}: ContentVideoFieldProps) {
   const [fileId, setFileId] = useState(defaultFileId ?? '');
   const [isUploading, setIsUploading] = useState(false);
   const [error, setError] = useState('');

       <FoxFileUpload
         mode="default"
         accept={fileModuleAccept(FILE_MODULE.vodContent)}
+        defaultFiles={
+          defaultFileId
+            ? [{ id: defaultFileId, name: defaultFileName ?? '등록된 영상' }]
+            : undefined
+        }
         selectLabel="파일선택"
         placeholder="파일을 선택해 주세요."
         description={UPLOAD_HELP_TEXT}

a3d6469

afecbd8

app/(protected)/(basic)/contents/shorts/_components/shorts-form.tsx

--- app/(protected)/(basic)/contents/shorts/_components/shorts-form.tsx

+++ app/(protected)/(basic)/contents/shorts/_components/shorts-form.tsx


         </ContentFormRow>
 
         <ContentFormRow label="영상 콘텐츠 ID">
-          <ContentVideoField defaultFileId={item?.attachmentId} />
+          <ContentVideoField
+            defaultFileId={item?.attachmentId}
+            defaultFileName={item?.attachmentFileName}
+          />
         </ContentFormRow>
 
         <ContentFormRow label="썸네일">

a3d6469

afecbd8

lib/data/repositories/content-repository.ts

--- lib/data/repositories/content-repository.ts

+++ lib/data/repositories/content-repository.ts


   return { schoolCode, grades };
 }
 
+/** 첨부의 원본 파일명 — 조회로 연 화면이 어떤 파일이 붙어 있는지 보여 줄 때 쓴다. */
+function toFirstFileName(raw: unknown): string | null {
+  if (!Array.isArray(raw)) {
+    return null;
+  }
+  for (const entry of raw) {
+    if (isRecord(entry)) {
+      const name = readString(entry, 'orgnlFileNm');
+      if (name) {
+        return name;
+      }
+    }
+  }
+  return null;
+}
+
 /** 한 `atchFileId` 아래 여러 컷이 `fileSn`으로 들어온다. */
 function toFileNumbers(raw: unknown): number[] {
   if (!Array.isArray(raw)) {

     grades: schulGrd.grades,
     keywords: toKeywords(raw.keywordList),
     attachmentId: readString(raw, 'atchFileId'),
+    attachmentFileName: toFirstFileName(raw.fileList),
     thumbnailFileId: readString(raw, 'thumbAtchFileId'),
     isVisible: readString(raw, 'useYn') !== 'N',
     modifiedAt:

a3d6469

afecbd8

lib/domain/content.ts

--- lib/domain/content.ts

+++ lib/domain/content.ts


   keywords: ContentKeyword[];
   /** 만화의 컷 이미지·쇼츠의 영상이 묶인 첨부 ID. */
   attachmentId: string | null;
+  /** 첨부의 원본 파일명. 조회로 연 화면이 붙어 있는 파일을 보여 줄 때 쓴다. */
+  attachmentFileName: string | null;
   /** 만화 컷처럼 한 첨부 아래 여러 파일이 있을 때의 파일 번호들. */
   cutFileNumbers: number[];
   thumbnailFileId: string | null;

Add a comment

Open 0
Closed 0

List

...	...	@@ -20,6 +20,8 @@
20	20
21	21	interface ContentVideoFieldProps {
22	22	defaultFileId?: string \| null;
	23	+ /** 이미 올라가 있는 영상의 원본 파일명. 없으면 대체 문구로 그린다. */
	24	+ defaultFileName?: string \| null;
23	25	}
24	26
25	27	/**
...	...	@@ -29,7 +31,10 @@
29	31	* 업로드가 끝나기 전에 저장하면 영상 없이 저장되므로 그동안은 `videoUploading`을 실어 보내
30	32	* Server Action이 막게 한다.
31	33	*/
32		-export function ContentVideoField({ defaultFileId }: ContentVideoFieldProps) {
	34	+export function ContentVideoField({
	35	+ defaultFileId,
	36	+ defaultFileName,
	37	+}: ContentVideoFieldProps) {
33	38	const [fileId, setFileId] = useState(defaultFileId ?? '');
34	39	const [isUploading, setIsUploading] = useState(false);
35	40	const [error, setError] = useState('');
...	...	@@ -86,6 +91,11 @@
86	91	<FoxFileUpload
87	92	mode="default"
88	93	accept={fileModuleAccept(FILE_MODULE.vodContent)}
	94	+ defaultFiles={
	95	+ defaultFileId
	96	+ ? [{ id: defaultFileId, name: defaultFileName ?? '등록된 영상' }]
	97	+ : undefined
	98	+ }
89	99	selectLabel="파일선택"
90	100	placeholder="파일을 선택해 주세요."
91	101	description={UPLOAD_HELP_TEXT}

...	...	@@ -129,7 +129,10 @@
129	129	</ContentFormRow>
130	130
131	131	<ContentFormRow label="영상 콘텐츠 ID">
132		- <ContentVideoField defaultFileId={item?.attachmentId} />
	132	+ <ContentVideoField
	133	+ defaultFileId={item?.attachmentId}
	134	+ defaultFileName={item?.attachmentFileName}
	135	+ />
133	136	</ContentFormRow>
134	137
135	138	<ContentFormRow label="썸네일">

...	...	@@ -86,6 +86,22 @@
86	86	return { schoolCode, grades };
87	87	}
88	88
	89	+/** 첨부의 원본 파일명 — 조회로 연 화면이 어떤 파일이 붙어 있는지 보여 줄 때 쓴다. */
	90	+function toFirstFileName(raw: unknown): string \| null {
	91	+ if (!Array.isArray(raw)) {
	92	+ return null;
	93	+ }
	94	+ for (const entry of raw) {
	95	+ if (isRecord(entry)) {
	96	+ const name = readString(entry, 'orgnlFileNm');
	97	+ if (name) {
	98	+ return name;
	99	+ }
	100	+ }
	101	+ }
	102	+ return null;
	103	+}
	104	+
89	105	/** 한 `atchFileId` 아래 여러 컷이 `fileSn`으로 들어온다. */
90	106	function toFileNumbers(raw: unknown): number[] {
91	107	if (!Array.isArray(raw)) {
...	...	@@ -120,6 +136,7 @@
120	136	grades: schulGrd.grades,
121	137	keywords: toKeywords(raw.keywordList),
122	138	attachmentId: readString(raw, 'atchFileId'),
	139	+ attachmentFileName: toFirstFileName(raw.fileList),
123	140	thumbnailFileId: readString(raw, 'thumbAtchFileId'),
124	141	isVisible: readString(raw, 'useYn') !== 'N',
125	142	modifiedAt:

...	...	@@ -86,6 +86,8 @@
86	86	keywords: ContentKeyword[];
87	87	/** 만화의 컷 이미지·쇼츠의 영상이 묶인 첨부 ID. */
88	88	attachmentId: string \| null;
	89	+ /** 첨부의 원본 파일명. 조회로 연 화면이 붙어 있는 파일을 보여 줄 때 쓴다. */
	90	+ attachmentFileName: string \| null;
89	91	/** 만화 컷처럼 한 첨부 아래 여러 파일이 있을 때의 파일 번호들. */
90	92	cutFileNumbers: number[];
91	93	thumbnailFileId: string \| null;

Delete comment