From 730126665edb87a48a2a221346fb20b22421413e Mon Sep 17 00:00:00 2001 From: Jeon Eonseok Date: Wed, 31 Jul 2024 20:45:59 +0900 Subject: [PATCH 01/29] =?UTF-8?q?fix:=20=ED=8C=8C=EC=9D=BC=20=EC=97=85?= =?UTF-8?q?=EB=A1=9C=EB=93=9C=20=ED=95=98=EA=B3=A0=20=ED=8C=8C=ED=8A=B8=20?= =?UTF-8?q?=EB=B3=80=EA=B2=BD=20=EC=8B=9C=20=EA=B8=B0=EC=A1=B4=20=ED=8C=8C?= =?UTF-8?q?=EC=9D=BC=20=EC=97=86=EC=96=B4=EC=A7=80=EB=8A=94=20=EC=97=90?= =?UTF-8?q?=EB=9F=AC=20=ED=95=B4=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ApplyPage/components/FileInput/index.tsx | 37 ++++++++++++------- 1 file changed, 23 insertions(+), 14 deletions(-) diff --git a/src/views/ApplyPage/components/FileInput/index.tsx b/src/views/ApplyPage/components/FileInput/index.tsx index 1e73cf1f..9f8bfd5b 100644 --- a/src/views/ApplyPage/components/FileInput/index.tsx +++ b/src/views/ApplyPage/components/FileInput/index.tsx @@ -82,7 +82,7 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr const handleClickIcon = () => { if (inputRef.current) { - if (file) { + if (file || getValues(`file${id}`)) { inputRef.current.value = ''; setFile(null); setValue(`file${id}`, undefined); @@ -109,6 +109,9 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr }); } }, [defaultFileId, defaultFileUrl, defaultFileName, setValue]); + console.log(fileName); + console.log(getValues(`file${id}`)); + console.log(uploadPercent); return (
@@ -132,19 +135,25 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr className={fileLabelVar[isError ? 'error' : fileName === '' ? 'default' : 'selected']}>
파일 - {(uploadPercent !== -1 || !defaultFileName) && ( - - {uploadPercent < 0 && fileName === '' - ? '50mb 이하 | pdf, pptx' - : uploadPercent < 100 - ? `업로드 중... ${uploadPercent}/100% 완료` - : uploadPercent === 100 && fileName === '' - ? '파일을 전송하고 있어요... 잠시만 기다려주세요...' - : fileName} - - )} - {uploadPercent === -1 && defaultFileName && ( - {defaultFileName} + {getValues(`file${id}`) ? ( + {getValues(`file${id}`)?.fileName} + ) : ( + <> + {(uploadPercent !== -1 || !defaultFileName) && ( + + {uploadPercent < 0 && fileName === '' + ? '50mb 이하 | pdf, pptx' + : uploadPercent < 100 + ? `업로드 중... ${uploadPercent}/100% 완료` + : uploadPercent === 100 && fileName === '' + ? '파일을 전송하고 있어요... 잠시만 기다려주세요...' + : fileName} + + )} + {uploadPercent === -1 && (defaultFileName || getValues(`file${id}`)) && ( + {defaultFileName} + )} + )}
Date: Wed, 31 Jul 2024 20:50:52 +0900 Subject: [PATCH 02/29] =?UTF-8?q?fix:=20=ED=8C=8C=EC=9D=BC=20=EC=97=85?= =?UTF-8?q?=EB=A1=9C=EB=93=9C=20=EC=8B=9C=20=EB=B2=84=ED=8A=BC=20disabled?= =?UTF-8?q?=20=EC=B2=98=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ApplyPage/components/FileInput/index.tsx | 21 ++++++------------- 1 file changed, 6 insertions(+), 15 deletions(-) diff --git a/src/views/ApplyPage/components/FileInput/index.tsx b/src/views/ApplyPage/components/FileInput/index.tsx index 9f8bfd5b..342ad394 100644 --- a/src/views/ApplyPage/components/FileInput/index.tsx +++ b/src/views/ApplyPage/components/FileInput/index.tsx @@ -21,12 +21,15 @@ const LIMIT_SIZE = 1024 ** 2 * 50; // 50MB const ACCEPTED_FORMATS = '.pdf, .pptx'; const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputProps) => { + const inputRef = useRef(null); + const [isError, setIsError] = useState(false); const [uploadPercent, setUploadPercent] = useState(-1); const [file, setFile] = useState(null); const fileName = file ? file.name : ''; - const inputRef = useRef(null); + const disabledStatus = + disabled || isReview || (uploadPercent >= 0 && uploadPercent < 100) || (uploadPercent === 100 && fileName === ''); const { register, setValue, clearErrors, getValues } = useFormContext(); const { id: defaultFileId, file: defaultFileUrl, fileName: defaultFileName } = defaultFile || {}; @@ -109,9 +112,6 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr }); } }, [defaultFileId, defaultFileUrl, defaultFileName, setValue]); - console.log(fileName); - console.log(getValues(`file${id}`)); - console.log(uploadPercent); return (
@@ -123,12 +123,7 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr onChange={(e) => handleFileChange(e, id)} ref={inputRef} className={`amp-unmask ${fileInput}`} - disabled={ - disabled || - isReview || - (uploadPercent >= 0 && uploadPercent < 100) || - (uploadPercent === 100 && fileName === '') - } + disabled={disabledStatus} />
- + {isError &&

첨부파일 용량을 초과했어요

}
From 26325704f0cdbc5d8b44bcaa4c63b507612d2455 Mon Sep 17 00:00:00 2001 From: Jeon Eonseok Date: Thu, 1 Aug 2024 21:27:41 +0900 Subject: [PATCH 03/29] =?UTF-8?q?feat:=20=EC=B2=A8=EB=B6=80=ED=8C=8C?= =?UTF-8?q?=EC=9D=BC=20=EC=9A=A9=EB=9F=89=20=EC=B4=88=EA=B3=BC=20=EC=8B=9C?= =?UTF-8?q?=20=EA=B8=B0=EC=A1=B4=20=ED=8C=8C=EC=9D=BC=20=EC=A0=9C=EA=B1=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/ApplyPage/components/FileInput/index.tsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/views/ApplyPage/components/FileInput/index.tsx b/src/views/ApplyPage/components/FileInput/index.tsx index 342ad394..1e396c49 100644 --- a/src/views/ApplyPage/components/FileInput/index.tsx +++ b/src/views/ApplyPage/components/FileInput/index.tsx @@ -18,7 +18,7 @@ interface FileInputProps { } const LIMIT_SIZE = 1024 ** 2 * 50; // 50MB -const ACCEPTED_FORMATS = '.pdf, .pptx'; +const ACCEPTED_FORMATS = '.pdf, .pptx, .mov'; const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputProps) => { const inputRef = useRef(null); @@ -71,6 +71,8 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr if (file) { if (LIMIT_SIZE < file.size) { setIsError(true); + setValue(`file${id}`, undefined); + getValues(`${section}${id}`) === '파일 제출' && setValue(`${section}${id}`, ''); if (inputRef.current) { inputRef.current.value = ''; } From 0b0ff8bb19d7307b6e4198f2c9fdadee72e1b665 Mon Sep 17 00:00:00 2001 From: Jeon Eonseok Date: Thu, 1 Aug 2024 21:33:53 +0900 Subject: [PATCH 04/29] =?UTF-8?q?fix:=20=EC=97=90=EB=9F=AC=20=EB=A9=94?= =?UTF-8?q?=EC=84=B8=EC=A7=80=EC=99=80=20textbox=20=EA=B2=B9=EC=B9=98?= =?UTF-8?q?=EB=8A=94=20=EC=97=90=EB=9F=AC=20=ED=95=B4=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/ApplyPage/components/FileInput/style.css.ts | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/views/ApplyPage/components/FileInput/style.css.ts b/src/views/ApplyPage/components/FileInput/style.css.ts index b90bda0b..0f771f93 100644 --- a/src/views/ApplyPage/components/FileInput/style.css.ts +++ b/src/views/ApplyPage/components/FileInput/style.css.ts @@ -5,8 +5,6 @@ import { theme } from 'styles/theme.css'; export const container = style({ position: 'relative', width: 720, - height: 53, - maxHeight: 53, }); export const fileInput = style({ From ec37a6ec29f22e5c2f04234bce311a2f02a86ff0 Mon Sep 17 00:00:00 2001 From: Jeon Eonseok Date: Thu, 1 Aug 2024 21:36:37 +0900 Subject: [PATCH 05/29] =?UTF-8?q?fix:=20=ED=8C=8C=EC=9D=BC=20=EC=82=AD?= =?UTF-8?q?=EC=A0=9C=20=EC=8B=9C=20placeholder=20=EC=95=88=20=EB=9C=A8?= =?UTF-8?q?=EB=8A=94=20=EC=97=90=EB=9F=AC=20=ED=95=B4=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/ApplyPage/components/FileInput/index.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/src/views/ApplyPage/components/FileInput/index.tsx b/src/views/ApplyPage/components/FileInput/index.tsx index 1e396c49..40366ee2 100644 --- a/src/views/ApplyPage/components/FileInput/index.tsx +++ b/src/views/ApplyPage/components/FileInput/index.tsx @@ -71,6 +71,7 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr if (file) { if (LIMIT_SIZE < file.size) { setIsError(true); + setUploadPercent(-1); setValue(`file${id}`, undefined); getValues(`${section}${id}`) === '파일 제출' && setValue(`${section}${id}`, ''); if (inputRef.current) { From bc9f1c20968e7507eb7e188ef99e1ee6dc27d39b Mon Sep 17 00:00:00 2001 From: Jeon Eonseok Date: Thu, 1 Aug 2024 21:43:04 +0900 Subject: [PATCH 06/29] =?UTF-8?q?refactor:=20=EB=B6=88=ED=95=84=EC=9A=94?= =?UTF-8?q?=ED=95=9C=20state=20=EC=A0=9C=EA=B1=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/common/constants/validationCheck.ts | 3 +++ .../ApplyPage/components/FileInput/index.tsx | 22 ++++++++++++------- 2 files changed, 17 insertions(+), 8 deletions(-) diff --git a/src/common/constants/validationCheck.ts b/src/common/constants/validationCheck.ts index c0a69866..45697408 100644 --- a/src/common/constants/validationCheck.ts +++ b/src/common/constants/validationCheck.ts @@ -59,4 +59,7 @@ export const VALIDATION_CHECK = { maxLength: 40, errorText: '잘못된 입력 형식이에요.', }, + fileInput: { + errorText: '파일 크기가 너무 커요. 50MB 이하로 선택해주세요.', + }, }; diff --git a/src/views/ApplyPage/components/FileInput/index.tsx b/src/views/ApplyPage/components/FileInput/index.tsx index 40366ee2..034b9503 100644 --- a/src/views/ApplyPage/components/FileInput/index.tsx +++ b/src/views/ApplyPage/components/FileInput/index.tsx @@ -5,6 +5,7 @@ import { useFormContext } from 'react-hook-form'; import 'firebase/compat/storage'; import { STATE_CHANGED, storage } from '@constants/firebase.ts'; +import { VALIDATION_CHECK } from '@constants/validationCheck'; import IconPlusButton from './icons/IconPlusButton'; import { container, errorText, fileInput, fileLabelVar, fileNameVar, textWrapper } from './style.css'; @@ -18,12 +19,11 @@ interface FileInputProps { } const LIMIT_SIZE = 1024 ** 2 * 50; // 50MB -const ACCEPTED_FORMATS = '.pdf, .pptx, .mov'; +const ACCEPTED_FORMATS = '.pdf, .pptx'; const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputProps) => { const inputRef = useRef(null); - const [isError, setIsError] = useState(false); const [uploadPercent, setUploadPercent] = useState(-1); const [file, setFile] = useState(null); @@ -31,7 +31,14 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr const disabledStatus = disabled || isReview || (uploadPercent >= 0 && uploadPercent < 100) || (uploadPercent === 100 && fileName === ''); - const { register, setValue, clearErrors, getValues } = useFormContext(); + const { + register, + setValue, + setError, + clearErrors, + getValues, + formState: { errors }, + } = useFormContext(); const { id: defaultFileId, file: defaultFileUrl, fileName: defaultFileName } = defaultFile || {}; const handleFileUpload = (file: File, id: number) => { @@ -70,7 +77,7 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr const file = e.target.files?.[0]; if (file) { if (LIMIT_SIZE < file.size) { - setIsError(true); + setError(`file${id}`, { type: 'maxLength', message: VALIDATION_CHECK.fileInput.errorText }); setUploadPercent(-1); setValue(`file${id}`, undefined); getValues(`${section}${id}`) === '파일 제출' && setValue(`${section}${id}`, ''); @@ -79,8 +86,7 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr } setFile(null); } else { - setIsError(false); - setFile(null); + clearErrors(`file${id}`); handleFileUpload(file, id); } } @@ -130,7 +136,7 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr /> - {isError &&

첨부파일 용량을 초과했어요

} + {errors[`file${id}`] &&

{errors[`file${id}`]?.message as string}

} ); }; From 5b0d9c3b431b634ab975b820dcd104acbe820c94 Mon Sep 17 00:00:00 2001 From: Jeon Eonseok Date: Thu, 1 Aug 2024 21:54:19 +0900 Subject: [PATCH 07/29] =?UTF-8?q?refactor:=20=EC=BD=94=EB=93=9C=20?= =?UTF-8?q?=EB=A6=AC=ED=8C=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 1. file state와 fileName 변수 하나로 합치기 2. 반복되는 계산 변수화 --- .../ApplyPage/components/FileInput/index.tsx | 20 +++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) diff --git a/src/views/ApplyPage/components/FileInput/index.tsx b/src/views/ApplyPage/components/FileInput/index.tsx index 034b9503..b59fc97f 100644 --- a/src/views/ApplyPage/components/FileInput/index.tsx +++ b/src/views/ApplyPage/components/FileInput/index.tsx @@ -25,11 +25,11 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr const inputRef = useRef(null); const [uploadPercent, setUploadPercent] = useState(-1); - const [file, setFile] = useState(null); + const [fileName, setFileName] = useState(''); - const fileName = file ? file.name : ''; - const disabledStatus = - disabled || isReview || (uploadPercent >= 0 && uploadPercent < 100) || (uploadPercent === 100 && fileName === ''); + const isFileUploading = uploadPercent < 100 && uploadPercent >= 0; + const isFileSending = uploadPercent === 100 && fileName === ''; + const disabledStatus = disabled || isReview || isFileUploading || isFileSending; const { register, @@ -59,7 +59,7 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr () => { uploadTask.snapshot.ref.getDownloadURL().then((url) => { const urlWithoutToken = url.split('&token=')[0]; - setFile(file); + setFileName(file.name); setValue(`file${id}`, { recruitingQuestionId: id, file: urlWithoutToken, @@ -84,7 +84,7 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr if (inputRef.current) { inputRef.current.value = ''; } - setFile(null); + setFileName(''); } else { clearErrors(`file${id}`); handleFileUpload(file, id); @@ -94,9 +94,9 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr const handleClickIcon = () => { if (inputRef.current) { - if (file || getValues(`file${id}`)) { + if (fileName || getValues(`file${id}`)) { inputRef.current.value = ''; - setFile(null); + setFileName(''); setValue(`file${id}`, undefined); setUploadPercent(-1); getValues(`${section}${id}`) === '파일 제출' && setValue(`${section}${id}`, ''); @@ -147,9 +147,9 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr {uploadPercent < 0 && fileName === '' ? '50mb 이하 | pdf, pptx' - : uploadPercent < 100 + : isFileUploading ? `업로드 중... ${uploadPercent}/100% 완료` - : uploadPercent === 100 && fileName === '' + : isFileSending ? '파일을 전송하고 있어요... 잠시만 기다려주세요...' : fileName} From 2308c3f60eac7f0000a9898c9c6127fec1343cc4 Mon Sep 17 00:00:00 2001 From: Jeon Eonseok Date: Thu, 1 Aug 2024 22:44:32 +0900 Subject: [PATCH 08/29] =?UTF-8?q?fix:=20=EB=91=90=20=EB=B2=88=EC=A7=B8=20?= =?UTF-8?q?=ED=8C=8C=EC=9D=BC=20=EB=B6=80=ED=84=B0=20=ED=8C=8C=EC=9D=BC=20?= =?UTF-8?q?=EC=A0=84=EC=86=A1=20=EC=A4=91=20=EB=AC=B8=EA=B5=AC=20=EC=95=88?= =?UTF-8?q?=20=EB=9C=A8=EB=8A=94=20=EC=97=90=EB=9F=AC=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ApplyPage/components/FileInput/index.tsx | 43 +++++++++---------- 1 file changed, 20 insertions(+), 23 deletions(-) diff --git a/src/views/ApplyPage/components/FileInput/index.tsx b/src/views/ApplyPage/components/FileInput/index.tsx index b59fc97f..0812098b 100644 --- a/src/views/ApplyPage/components/FileInput/index.tsx +++ b/src/views/ApplyPage/components/FileInput/index.tsx @@ -28,7 +28,7 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr const [fileName, setFileName] = useState(''); const isFileUploading = uploadPercent < 100 && uploadPercent >= 0; - const isFileSending = uploadPercent === 100 && fileName === ''; + const isFileSending = uploadPercent === 100; const disabledStatus = disabled || isReview || isFileUploading || isFileSending; const { @@ -66,6 +66,7 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr fileName: file.name, }); getValues(`${section}${id}`) === '' && setValue(`${section}${id}`, '파일 제출'); + setUploadPercent(-1); clearErrors(`${section}${id}`); track(`done-apply-add_file${id}`); }); @@ -94,7 +95,7 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr const handleClickIcon = () => { if (inputRef.current) { - if (fileName || getValues(`file${id}`)) { + if (fileName) { inputRef.current.value = ''; setFileName(''); setValue(`file${id}`, undefined); @@ -139,28 +140,24 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr className={fileLabelVar[errors[`file${id}`] ? 'error' : fileName === '' ? 'default' : 'selected']}>
파일 - {getValues(`file${id}`) ? ( - {getValues(`file${id}`)?.fileName} - ) : ( - <> - {(uploadPercent !== -1 || !defaultFileName) && ( - - {uploadPercent < 0 && fileName === '' - ? '50mb 이하 | pdf, pptx' - : isFileUploading - ? `업로드 중... ${uploadPercent}/100% 완료` - : isFileSending - ? '파일을 전송하고 있어요... 잠시만 기다려주세요...' - : fileName} - - )} - {uploadPercent === -1 && (defaultFileName || getValues(`file${id}`)) && ( - {defaultFileName} - )} - - )} + <> + {(uploadPercent !== -1 || !defaultFileName) && ( + + {uploadPercent < 0 && fileName === '' + ? '50mb 이하 | pdf, pptx' + : isFileUploading + ? `업로드 중... ${uploadPercent}/100% 완료` + : isFileSending + ? '파일을 전송하고 있어요... 잠시만 기다려주세요...' + : fileName} + + )} + {uploadPercent === -1 && defaultFileName && ( + {defaultFileName} + )} +
- + {errors[`file${id}`] &&

{errors[`file${id}`]?.message as string}

} From 87937176a74c1b95ff2c6f82fd1badc49df26a5e Mon Sep 17 00:00:00 2001 From: Jeon Eonseok Date: Thu, 1 Aug 2024 22:55:52 +0900 Subject: [PATCH 09/29] =?UTF-8?q?fix:=20=EC=83=88=EB=A1=9C=20=EC=98=AC?= =?UTF-8?q?=EB=A6=B0=20=20=ED=8C=8C=EC=9D=BC=20=EC=A7=80=EC=9A=B0=EB=A9=B4?= =?UTF-8?q?=20=EC=9E=84=EC=8B=9C=EC=A0=80=EC=9E=A5=EB=90=9C=20=EB=8D=B0?= =?UTF-8?q?=EC=9D=B4=ED=84=B0=20=EB=84=98=EC=96=B4=EC=98=A4=EB=8A=94=20?= =?UTF-8?q?=EC=97=90=EB=9F=AC=20=ED=95=B4=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ApplyPage/components/FileInput/index.tsx | 16 +++++++++++----- 1 file changed, 11 insertions(+), 5 deletions(-) diff --git a/src/views/ApplyPage/components/FileInput/index.tsx b/src/views/ApplyPage/components/FileInput/index.tsx index 0812098b..cb539c8d 100644 --- a/src/views/ApplyPage/components/FileInput/index.tsx +++ b/src/views/ApplyPage/components/FileInput/index.tsx @@ -19,7 +19,7 @@ interface FileInputProps { } const LIMIT_SIZE = 1024 ** 2 * 50; // 50MB -const ACCEPTED_FORMATS = '.pdf, .pptx'; +const ACCEPTED_FORMATS = '.pdf, .pptx, .mov'; const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputProps) => { const inputRef = useRef(null); @@ -85,7 +85,7 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr if (inputRef.current) { inputRef.current.value = ''; } - setFileName(''); + setFileName('delete-file'); } else { clearErrors(`file${id}`); handleFileUpload(file, id); @@ -97,7 +97,7 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr if (inputRef.current) { if (fileName) { inputRef.current.value = ''; - setFileName(''); + setFileName('delete-file'); setValue(`file${id}`, undefined); setUploadPercent(-1); getValues(`${section}${id}`) === '파일 제출' && setValue(`${section}${id}`, ''); @@ -153,11 +153,17 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr )} {uploadPercent === -1 && defaultFileName && ( - {defaultFileName} + + {fileName === 'delete-file' ? '50mb 이하 | pdf, pptx' : defaultFileName} + )} - + {errors[`file${id}`] &&

{errors[`file${id}`]?.message as string}

} From 09903fb72a6bb4a2371cb2cc57eafef23cf65e69 Mon Sep 17 00:00:00 2001 From: Jeon Eonseok Date: Thu, 1 Aug 2024 23:03:04 +0900 Subject: [PATCH 10/29] =?UTF-8?q?fix:=20=EC=9E=84=EC=8B=9C=EC=84=9C?= =?UTF-8?q?=EC=9E=A5=EB=90=9C=20=ED=8C=8C=EC=9D=BC=EC=97=90=20=EC=83=88?= =?UTF-8?q?=EB=A1=9C=EC=9A=B4=20=ED=8C=8C=EC=9D=BC=20=EC=97=85=EB=A1=9C?= =?UTF-8?q?=EB=93=9C=20=ED=96=88=EC=9D=84=20=EB=95=8C=20=EA=B8=B0=EC=A1=B4?= =?UTF-8?q?=20=ED=8C=8C=EC=9D=BC=EC=9D=B4=20=EA=B7=B8=EB=8C=80=EB=A1=9C=20?= =?UTF-8?q?=EB=B3=B4=EC=9D=B4=EB=8A=94=20=EC=97=90=EB=9F=AC=20=ED=95=B4?= =?UTF-8?q?=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/ApplyPage/components/FileInput/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/views/ApplyPage/components/FileInput/index.tsx b/src/views/ApplyPage/components/FileInput/index.tsx index cb539c8d..544f04a7 100644 --- a/src/views/ApplyPage/components/FileInput/index.tsx +++ b/src/views/ApplyPage/components/FileInput/index.tsx @@ -66,7 +66,7 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr fileName: file.name, }); getValues(`${section}${id}`) === '' && setValue(`${section}${id}`, '파일 제출'); - setUploadPercent(-1); + setUploadPercent(-2); clearErrors(`${section}${id}`); track(`done-apply-add_file${id}`); }); From ac1e6b0aac770431d9ee6c0d88c58b5e6f1664da Mon Sep 17 00:00:00 2001 From: Jeon Eonseok Date: Thu, 1 Aug 2024 23:10:43 +0900 Subject: [PATCH 11/29] =?UTF-8?q?fix:=20part=20=EB=B0=94=EA=BF=A8=EB=8B=A4?= =?UTF-8?q?=EA=B0=80=20=EB=8B=A4=EC=8B=9C=20=EB=8F=8C=EC=95=84=EC=99=94?= =?UTF-8?q?=EC=9D=84=20=EB=95=8C=20=ED=8C=8C=EC=9D=BC=20value=20=EA=B3=84?= =?UTF-8?q?=EC=86=8D=20=EB=82=A8=EC=95=84=EC=9E=88=EB=8A=94=20=EC=97=90?= =?UTF-8?q?=EB=9F=AC=20=ED=95=B4=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/ApplyPage/components/FileInput/index.tsx | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/src/views/ApplyPage/components/FileInput/index.tsx b/src/views/ApplyPage/components/FileInput/index.tsx index 544f04a7..6130531f 100644 --- a/src/views/ApplyPage/components/FileInput/index.tsx +++ b/src/views/ApplyPage/components/FileInput/index.tsx @@ -121,7 +121,12 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr recruitingQuestionId: defaultFileId, }); } - }, [defaultFileId, defaultFileUrl, defaultFileName, setValue]); + + return () => { + setValue(`file${id}`, undefined); + getValues(`${section}${id}`) === '파일 제출' && setValue(`${section}${id}`, ''); + }; + }, [section, id, defaultFileId, defaultFileUrl, defaultFileName, getValues, setValue]); return (
From 14a7f5cbd82189fddde2a4369cc483ba0df1e0a9 Mon Sep 17 00:00:00 2001 From: Jeon Eonseok Date: Thu, 1 Aug 2024 23:14:46 +0900 Subject: [PATCH 12/29] =?UTF-8?q?fix:=20=EC=A4=91=EB=B3=B5=EB=90=9C=20key?= =?UTF-8?q?=20=EC=A0=9C=EA=B1=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/ApplyPage/components/Info/index.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/views/ApplyPage/components/Info/index.tsx b/src/views/ApplyPage/components/Info/index.tsx index 2c52a492..225ad8b6 100644 --- a/src/views/ApplyPage/components/Info/index.tsx +++ b/src/views/ApplyPage/components/Info/index.tsx @@ -4,8 +4,8 @@ const Info = ({ value }: { value: string }) => { return (
    - {value?.split('\n').map((text) => ( -
  1. + {value?.split('\n').map((text, idx) => ( +
  2. {text}
    3. ))} From 724e7ed2eff0e24bfe7ad0a168945572cb9cb3ba Mon Sep 17 00:00:00 2001 From: Jeon Eonseok Date: Thu, 1 Aug 2024 23:32:21 +0900 Subject: [PATCH 13/29] =?UTF-8?q?fix:=20=EC=83=88=EB=A1=9C=EA=B3=A0?= =?UTF-8?q?=EC=B9=A8=20=EC=8B=9C=20=ED=8C=8C=EC=9D=BC=20=EC=A0=9C=EC=B6=9C?= =?UTF-8?q?=20=EB=AC=B8=EA=B5=AC=20=EC=97=86=EC=96=B4=EC=A7=80=EB=8A=94=20?= =?UTF-8?q?=EC=97=90=EB=9F=AC=20=ED=95=B4=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/ApplyPage/components/FileInput/index.tsx | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/views/ApplyPage/components/FileInput/index.tsx b/src/views/ApplyPage/components/FileInput/index.tsx index 6130531f..0e7432ca 100644 --- a/src/views/ApplyPage/components/FileInput/index.tsx +++ b/src/views/ApplyPage/components/FileInput/index.tsx @@ -122,6 +122,8 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr }); } + if (getValues(`file${id}`) && getValues(`${section}${id}`) === '') setValue(`${section}${id}`, '파일 제출'); + return () => { setValue(`file${id}`, undefined); getValues(`${section}${id}`) === '파일 제출' && setValue(`${section}${id}`, ''); From da6628b76ea8589387913b061de690da553ffbce Mon Sep 17 00:00:00 2001 From: Jeon Eonseok Date: Thu, 1 Aug 2024 23:37:57 +0900 Subject: [PATCH 14/29] =?UTF-8?q?fix:=20=ED=8C=8C=EC=9D=BC=20=ED=99=95?= =?UTF-8?q?=EC=9E=A5=EC=9E=90=20=EC=9B=90=EB=9E=98=EB=8C=80=EB=A1=9C=20?= =?UTF-8?q?=EB=8F=8C=EB=A6=AC=EA=B8=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/ApplyPage/components/FileInput/index.tsx | 2 +- src/views/ApplyPage/components/FileInput/style.css.ts | 2 ++ 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/src/views/ApplyPage/components/FileInput/index.tsx b/src/views/ApplyPage/components/FileInput/index.tsx index 0e7432ca..8316865c 100644 --- a/src/views/ApplyPage/components/FileInput/index.tsx +++ b/src/views/ApplyPage/components/FileInput/index.tsx @@ -19,7 +19,7 @@ interface FileInputProps { } const LIMIT_SIZE = 1024 ** 2 * 50; // 50MB -const ACCEPTED_FORMATS = '.pdf, .pptx, .mov'; +const ACCEPTED_FORMATS = '.pdf, .pptx'; const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputProps) => { const inputRef = useRef(null); diff --git a/src/views/ApplyPage/components/FileInput/style.css.ts b/src/views/ApplyPage/components/FileInput/style.css.ts index 0f771f93..b90bda0b 100644 --- a/src/views/ApplyPage/components/FileInput/style.css.ts +++ b/src/views/ApplyPage/components/FileInput/style.css.ts @@ -5,6 +5,8 @@ import { theme } from 'styles/theme.css'; export const container = style({ position: 'relative', width: 720, + height: 53, + maxHeight: 53, }); export const fileInput = style({ From 77b87e26e7750a91444cab46c739134deaed724c Mon Sep 17 00:00:00 2001 From: Jeon Eonseok Date: Thu, 1 Aug 2024 23:50:07 +0900 Subject: [PATCH 15/29] =?UTF-8?q?chore:=20=ED=8C=8C=EC=9D=BC=20=ED=98=95?= =?UTF-8?q?=EC=8B=9D=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/ApplyPage/components/FileInput/index.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/views/ApplyPage/components/FileInput/index.tsx b/src/views/ApplyPage/components/FileInput/index.tsx index 8316865c..f4d2d786 100644 --- a/src/views/ApplyPage/components/FileInput/index.tsx +++ b/src/views/ApplyPage/components/FileInput/index.tsx @@ -19,7 +19,7 @@ interface FileInputProps { } const LIMIT_SIZE = 1024 ** 2 * 50; // 50MB -const ACCEPTED_FORMATS = '.pdf, .pptx'; +const ACCEPTED_FORMATS = '.pdf'; const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputProps) => { const inputRef = useRef(null); @@ -151,7 +151,7 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr {(uploadPercent !== -1 || !defaultFileName) && ( {uploadPercent < 0 && fileName === '' - ? '50mb 이하 | pdf, pptx' + ? '50mb 이하 | pdf' : isFileUploading ? `업로드 중... ${uploadPercent}/100% 완료` : isFileSending @@ -161,7 +161,7 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr )} {uploadPercent === -1 && defaultFileName && ( - {fileName === 'delete-file' ? '50mb 이하 | pdf, pptx' : defaultFileName} + {fileName === 'delete-file' ? '50mb 이하 | pdf' : defaultFileName} )} From f8c9b5be4396ea2faa114df93501b96a346c8029 Mon Sep 17 00:00:00 2001 From: Jeon Eonseok Date: Fri, 2 Aug 2024 00:13:07 +0900 Subject: [PATCH 16/29] =?UTF-8?q?refactor:=20=ED=8C=8C=EC=9D=BC=20?= =?UTF-8?q?=EC=9D=B4=EB=A6=84=20=EB=B0=8F=20placeholder=20=EB=A0=8C?= =?UTF-8?q?=EB=8D=94=20=ED=95=A8=EC=88=98=EB=A1=9C=20=EB=B6=84=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ApplyPage/components/FileInput/index.tsx | 38 ++++++++++--------- 1 file changed, 20 insertions(+), 18 deletions(-) diff --git a/src/views/ApplyPage/components/FileInput/index.tsx b/src/views/ApplyPage/components/FileInput/index.tsx index f4d2d786..e8cc3434 100644 --- a/src/views/ApplyPage/components/FileInput/index.tsx +++ b/src/views/ApplyPage/components/FileInput/index.tsx @@ -113,6 +113,25 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr } }; + const getFileNameClass = () => { + if (uploadPercent === -1 && defaultFileName) { + return fileName === 'delete-file' ? 'default' : 'selected'; + } else { + return fileName === '' ? 'default' : 'selected'; + } + }; + + const getDisplayText = () => { + if (uploadPercent === -1 && defaultFileName) { + return fileName === 'delete-file' ? '50mb 이하 | pdf' : defaultFileName; + } else { + if (uploadPercent < 0 && fileName === '') return '50mb 이하 | pdf'; + else if (isFileUploading) return `업로드 중... ${uploadPercent}/100% 완료`; + else if (isFileSending) return '파일을 전송하고 있어요... 잠시만 기다려주세요...'; + else return fileName; + } + }; + useEffect(() => { if (defaultFileId && defaultFileUrl && defaultFileName) { setValue(`file${defaultFileId}`, { @@ -147,24 +166,7 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr className={fileLabelVar[errors[`file${id}`] ? 'error' : fileName === '' ? 'default' : 'selected']}>
    파일 - <> - {(uploadPercent !== -1 || !defaultFileName) && ( - - {uploadPercent < 0 && fileName === '' - ? '50mb 이하 | pdf' - : isFileUploading - ? `업로드 중... ${uploadPercent}/100% 완료` - : isFileSending - ? '파일을 전송하고 있어요... 잠시만 기다려주세요...' - : fileName} - - )} - {uploadPercent === -1 && defaultFileName && ( - - {fileName === 'delete-file' ? '50mb 이하 | pdf' : defaultFileName} - - )} - + {getDisplayText()}
    Date: Fri, 2 Aug 2024 00:53:38 +0900 Subject: [PATCH 17/29] =?UTF-8?q?chore:=20import=20=EC=88=9C=EC=84=9C=20?= =?UTF-8?q?=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ApplyPage/components/FileInput/index.tsx | 16 ---------------- 1 file changed, 16 deletions(-) diff --git a/src/views/ApplyPage/components/FileInput/index.tsx b/src/views/ApplyPage/components/FileInput/index.tsx index e8cc3434..aebc8b42 100644 --- a/src/views/ApplyPage/components/FileInput/index.tsx +++ b/src/views/ApplyPage/components/FileInput/index.tsx @@ -17,20 +17,15 @@ interface FileInputProps { disabled?: boolean; defaultFile?: { id: number; file?: string; fileName?: string }; } - const LIMIT_SIZE = 1024 ** 2 * 50; // 50MB const ACCEPTED_FORMATS = '.pdf'; - const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputProps) => { const inputRef = useRef(null); - const [uploadPercent, setUploadPercent] = useState(-1); const [fileName, setFileName] = useState(''); - const isFileUploading = uploadPercent < 100 && uploadPercent >= 0; const isFileSending = uploadPercent === 100; const disabledStatus = disabled || isReview || isFileUploading || isFileSending; - const { register, setValue, @@ -40,12 +35,10 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr formState: { errors }, } = useFormContext(); const { id: defaultFileId, file: defaultFileUrl, fileName: defaultFileName } = defaultFile || {}; - const handleFileUpload = (file: File, id: number) => { const storageRef = storage.ref(); const uploadTask = storageRef.child(`recruiting/applicants/question/${file.name}${nanoid(7)}`).put(file); track(`click-apply-add_file${id}`); - uploadTask.on( STATE_CHANGED, (snapshot) => { @@ -73,7 +66,6 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr }, ); }; - const handleFileChange = (e: ChangeEvent, id: number) => { const file = e.target.files?.[0]; if (file) { @@ -92,7 +84,6 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr } } }; - const handleClickIcon = () => { if (inputRef.current) { if (fileName) { @@ -112,7 +103,6 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr } } }; - const getFileNameClass = () => { if (uploadPercent === -1 && defaultFileName) { return fileName === 'delete-file' ? 'default' : 'selected'; @@ -120,7 +110,6 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr return fileName === '' ? 'default' : 'selected'; } }; - const getDisplayText = () => { if (uploadPercent === -1 && defaultFileName) { return fileName === 'delete-file' ? '50mb 이하 | pdf' : defaultFileName; @@ -131,7 +120,6 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr else return fileName; } }; - useEffect(() => { if (defaultFileId && defaultFileUrl && defaultFileName) { setValue(`file${defaultFileId}`, { @@ -140,15 +128,12 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr recruitingQuestionId: defaultFileId, }); } - if (getValues(`file${id}`) && getValues(`${section}${id}`) === '') setValue(`${section}${id}`, '파일 제출'); - return () => { setValue(`file${id}`, undefined); getValues(`${section}${id}`) === '파일 제출' && setValue(`${section}${id}`, ''); }; }, [section, id, defaultFileId, defaultFileUrl, defaultFileName, getValues, setValue]); - return (
    ); }; - export default FileInput; From 1b553c45b97235a755b8f3254872d081d32677b3 Mon Sep 17 00:00:00 2001 From: Jeon Eonseok Date: Fri, 2 Aug 2024 00:55:36 +0900 Subject: [PATCH 18/29] =?UTF-8?q?chore:=20=EC=82=AC=EB=9D=BC=EC=A7=84=20?= =?UTF-8?q?=EB=9D=84=EC=96=B4=EC=93=B0=EA=B8=B0=20=EB=8F=8C=EB=A6=AC?= =?UTF-8?q?=EA=B8=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ApplyPage/components/FileInput/index.tsx | 20 +++++++++++++++++++ 1 file changed, 20 insertions(+) diff --git a/src/views/ApplyPage/components/FileInput/index.tsx b/src/views/ApplyPage/components/FileInput/index.tsx index aebc8b42..9c6029b7 100644 --- a/src/views/ApplyPage/components/FileInput/index.tsx +++ b/src/views/ApplyPage/components/FileInput/index.tsx @@ -17,15 +17,20 @@ interface FileInputProps { disabled?: boolean; defaultFile?: { id: number; file?: string; fileName?: string }; } + const LIMIT_SIZE = 1024 ** 2 * 50; // 50MB const ACCEPTED_FORMATS = '.pdf'; + const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputProps) => { const inputRef = useRef(null); + const [uploadPercent, setUploadPercent] = useState(-1); const [fileName, setFileName] = useState(''); + const isFileUploading = uploadPercent < 100 && uploadPercent >= 0; const isFileSending = uploadPercent === 100; const disabledStatus = disabled || isReview || isFileUploading || isFileSending; + const { register, setValue, @@ -34,11 +39,15 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr getValues, formState: { errors }, } = useFormContext(); + const { id: defaultFileId, file: defaultFileUrl, fileName: defaultFileName } = defaultFile || {}; + const handleFileUpload = (file: File, id: number) => { const storageRef = storage.ref(); const uploadTask = storageRef.child(`recruiting/applicants/question/${file.name}${nanoid(7)}`).put(file); + track(`click-apply-add_file${id}`); + uploadTask.on( STATE_CHANGED, (snapshot) => { @@ -52,6 +61,7 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr () => { uploadTask.snapshot.ref.getDownloadURL().then((url) => { const urlWithoutToken = url.split('&token=')[0]; + setFileName(file.name); setValue(`file${id}`, { recruitingQuestionId: id, @@ -66,14 +76,17 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr }, ); }; + const handleFileChange = (e: ChangeEvent, id: number) => { const file = e.target.files?.[0]; + if (file) { if (LIMIT_SIZE < file.size) { setError(`file${id}`, { type: 'maxLength', message: VALIDATION_CHECK.fileInput.errorText }); setUploadPercent(-1); setValue(`file${id}`, undefined); getValues(`${section}${id}`) === '파일 제출' && setValue(`${section}${id}`, ''); + if (inputRef.current) { inputRef.current.value = ''; } @@ -84,6 +97,7 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr } } }; + const handleClickIcon = () => { if (inputRef.current) { if (fileName) { @@ -103,6 +117,7 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr } } }; + const getFileNameClass = () => { if (uploadPercent === -1 && defaultFileName) { return fileName === 'delete-file' ? 'default' : 'selected'; @@ -110,6 +125,7 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr return fileName === '' ? 'default' : 'selected'; } }; + const getDisplayText = () => { if (uploadPercent === -1 && defaultFileName) { return fileName === 'delete-file' ? '50mb 이하 | pdf' : defaultFileName; @@ -120,6 +136,7 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr else return fileName; } }; + useEffect(() => { if (defaultFileId && defaultFileUrl && defaultFileName) { setValue(`file${defaultFileId}`, { @@ -128,12 +145,15 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr recruitingQuestionId: defaultFileId, }); } + if (getValues(`file${id}`) && getValues(`${section}${id}`) === '') setValue(`${section}${id}`, '파일 제출'); + return () => { setValue(`file${id}`, undefined); getValues(`${section}${id}`) === '파일 제출' && setValue(`${section}${id}`, ''); }; }, [section, id, defaultFileId, defaultFileUrl, defaultFileName, getValues, setValue]); + return (
    Date: Wed, 7 Aug 2024 13:56:21 +0900 Subject: [PATCH 19/29] =?UTF-8?q?fix:=20=ED=8C=8C=EC=9D=BC=20=EC=A0=9C?= =?UTF-8?q?=EA=B1=B0=20=EC=8B=9C=20placeholder=20=EC=95=88=20=EB=9C=A8?= =?UTF-8?q?=EB=8A=94=20=EC=97=90=EB=9F=AC=20=ED=95=B4=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/ApplyPage/components/FileInput/index.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/views/ApplyPage/components/FileInput/index.tsx b/src/views/ApplyPage/components/FileInput/index.tsx index 9c6029b7..9715b438 100644 --- a/src/views/ApplyPage/components/FileInput/index.tsx +++ b/src/views/ApplyPage/components/FileInput/index.tsx @@ -100,7 +100,7 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr const handleClickIcon = () => { if (inputRef.current) { - if (fileName) { + if (fileName && fileName !== 'delete-file') { inputRef.current.value = ''; setFileName('delete-file'); setValue(`file${id}`, undefined); @@ -122,7 +122,7 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr if (uploadPercent === -1 && defaultFileName) { return fileName === 'delete-file' ? 'default' : 'selected'; } else { - return fileName === '' ? 'default' : 'selected'; + return fileName === '' || fileName === 'delete-file' ? 'default' : 'selected'; } }; @@ -130,7 +130,7 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr if (uploadPercent === -1 && defaultFileName) { return fileName === 'delete-file' ? '50mb 이하 | pdf' : defaultFileName; } else { - if (uploadPercent < 0 && fileName === '') return '50mb 이하 | pdf'; + if (uploadPercent < 0 && (fileName === '' || fileName === 'delete-file')) return '50mb 이하 | pdf'; else if (isFileUploading) return `업로드 중... ${uploadPercent}/100% 완료`; else if (isFileSending) return '파일을 전송하고 있어요... 잠시만 기다려주세요...'; else return fileName; From 8d6f9b13c915c62047500319bf586313c0d2d725 Mon Sep 17 00:00:00 2001 From: Jeon Eonseok Date: Wed, 7 Aug 2024 14:04:51 +0900 Subject: [PATCH 20/29] =?UTF-8?q?refactor:=20=EB=B0=98=EB=B3=B5=EB=90=98?= =?UTF-8?q?=EB=8A=94=20=EC=BD=94=EB=93=9C=20=EB=B6=84=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/ApplyPage/components/FileInput/index.tsx | 14 ++++++++------ 1 file changed, 8 insertions(+), 6 deletions(-) diff --git a/src/views/ApplyPage/components/FileInput/index.tsx b/src/views/ApplyPage/components/FileInput/index.tsx index 9715b438..737e9aa1 100644 --- a/src/views/ApplyPage/components/FileInput/index.tsx +++ b/src/views/ApplyPage/components/FileInput/index.tsx @@ -77,6 +77,11 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr ); }; + const handleDeleteFileValue = () => { + setValue(`file${id}`, undefined); + getValues(`${section}${id}`) === '파일 제출' && setValue(`${section}${id}`, ''); + }; + const handleFileChange = (e: ChangeEvent, id: number) => { const file = e.target.files?.[0]; @@ -84,8 +89,7 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr if (LIMIT_SIZE < file.size) { setError(`file${id}`, { type: 'maxLength', message: VALIDATION_CHECK.fileInput.errorText }); setUploadPercent(-1); - setValue(`file${id}`, undefined); - getValues(`${section}${id}`) === '파일 제출' && setValue(`${section}${id}`, ''); + handleDeleteFileValue(); if (inputRef.current) { inputRef.current.value = ''; @@ -103,14 +107,12 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr if (fileName && fileName !== 'delete-file') { inputRef.current.value = ''; setFileName('delete-file'); - setValue(`file${id}`, undefined); + handleDeleteFileValue(); setUploadPercent(-1); - getValues(`${section}${id}`) === '파일 제출' && setValue(`${section}${id}`, ''); track(`click-apply-remove_file${id}`); } else if (uploadPercent !== -2 && defaultFileName) { setUploadPercent(-2); - setValue(`file${id}`, undefined); - getValues(`${section}${id}`) === '파일 제출' && setValue(`${section}${id}`, ''); + handleDeleteFileValue(); track(`click-apply-remove_file${id}`); } else { inputRef.current.click(); From 9abae27864c9a90faf9d0ce0b07a4cbb4ad880de Mon Sep 17 00:00:00 2001 From: Jeon Eonseok Date: Wed, 7 Aug 2024 17:47:40 +0900 Subject: [PATCH 21/29] =?UTF-8?q?fix:=20=ED=8C=8C=EC=9D=BC=20=EC=A0=9C?= =?UTF-8?q?=EC=B6=9C=20=EC=8B=9C=20=ED=85=8D=EC=8A=A4=ED=8A=B8=20=EB=B0=95?= =?UTF-8?q?=EC=8A=A4=20=EC=97=90=EB=9F=AC=20=EC=82=AC=EB=9D=BC=EC=A7=80?= =?UTF-8?q?=EB=8A=94=20=EC=9D=B4=EC=8A=88=20=ED=95=B4=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/ApplyPage/components/FileInput/index.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/src/views/ApplyPage/components/FileInput/index.tsx b/src/views/ApplyPage/components/FileInput/index.tsx index 737e9aa1..a277d017 100644 --- a/src/views/ApplyPage/components/FileInput/index.tsx +++ b/src/views/ApplyPage/components/FileInput/index.tsx @@ -70,7 +70,6 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr }); getValues(`${section}${id}`) === '' && setValue(`${section}${id}`, '파일 제출'); setUploadPercent(-2); - clearErrors(`${section}${id}`); track(`done-apply-add_file${id}`); }); }, From 32aca01f905c6d6d72ac96faa680c30853b315bd Mon Sep 17 00:00:00 2001 From: Jeon Eonseok Date: Wed, 7 Aug 2024 17:55:11 +0900 Subject: [PATCH 22/29] =?UTF-8?q?feat:=20=ED=8C=8C=EC=9D=BC=20=EC=97=85?= =?UTF-8?q?=EB=A1=9C=EB=93=9C=20=EC=97=90=EB=9F=AC=20=EB=B0=9C=EC=83=9D=20?= =?UTF-8?q?=EC=8B=9C=20=EC=95=88=EB=82=B4=20=EB=AC=B8=EA=B5=AC=20=EB=9C=A8?= =?UTF-8?q?=EB=8F=84=EB=A1=9D=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/common/constants/validationCheck.ts | 2 ++ src/views/ApplyPage/components/FileInput/index.tsx | 2 +- 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/src/common/constants/validationCheck.ts b/src/common/constants/validationCheck.ts index 45697408..d796e2cb 100644 --- a/src/common/constants/validationCheck.ts +++ b/src/common/constants/validationCheck.ts @@ -61,5 +61,7 @@ export const VALIDATION_CHECK = { }, fileInput: { errorText: '파일 크기가 너무 커요. 50MB 이하로 선택해주세요.', + errorTextUnknownError: + '파일 업로드에 실패했어요. 다시 시도해주세요. 문제가 반복된다면 상단 문의하기 버튼을 통해 문의주세요.', }, }; diff --git a/src/views/ApplyPage/components/FileInput/index.tsx b/src/views/ApplyPage/components/FileInput/index.tsx index a277d017..fcc91222 100644 --- a/src/views/ApplyPage/components/FileInput/index.tsx +++ b/src/views/ApplyPage/components/FileInput/index.tsx @@ -56,7 +56,7 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr }, (error) => { console.error(error); - throw error; + setError(`file${id}`, { type: 'unknownError', message: VALIDATION_CHECK.fileInput.errorTextUnknownError }); }, () => { uploadTask.snapshot.ref.getDownloadURL().then((url) => { From 1694d3dc5d3c9f333a91128f3d0c0010edf556de Mon Sep 17 00:00:00 2001 From: Jeon Eonseok Date: Wed, 7 Aug 2024 18:32:47 +0900 Subject: [PATCH 23/29] =?UTF-8?q?refactor:=20=ED=8C=8C=EC=9D=BC=20?= =?UTF-8?q?=EC=A0=9C=EA=B1=B0=20=EB=A1=9C=EC=A7=81=20=EB=8B=A8=EC=88=9C?= =?UTF-8?q?=ED=99=94?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/ApplyPage/components/FileInput/index.tsx | 10 +++------- 1 file changed, 3 insertions(+), 7 deletions(-) diff --git a/src/views/ApplyPage/components/FileInput/index.tsx b/src/views/ApplyPage/components/FileInput/index.tsx index fcc91222..08733934 100644 --- a/src/views/ApplyPage/components/FileInput/index.tsx +++ b/src/views/ApplyPage/components/FileInput/index.tsx @@ -69,7 +69,7 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr fileName: file.name, }); getValues(`${section}${id}`) === '' && setValue(`${section}${id}`, '파일 제출'); - setUploadPercent(-2); + setUploadPercent(-1); track(`done-apply-add_file${id}`); }); }, @@ -88,12 +88,12 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr if (LIMIT_SIZE < file.size) { setError(`file${id}`, { type: 'maxLength', message: VALIDATION_CHECK.fileInput.errorText }); setUploadPercent(-1); + setFileName('delete-file'); handleDeleteFileValue(); if (inputRef.current) { inputRef.current.value = ''; } - setFileName('delete-file'); } else { clearErrors(`file${id}`); handleFileUpload(file, id); @@ -103,16 +103,12 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr const handleClickIcon = () => { if (inputRef.current) { - if (fileName && fileName !== 'delete-file') { + if (fileName !== 'delete-file' && (fileName || defaultFile)) { inputRef.current.value = ''; setFileName('delete-file'); handleDeleteFileValue(); setUploadPercent(-1); track(`click-apply-remove_file${id}`); - } else if (uploadPercent !== -2 && defaultFileName) { - setUploadPercent(-2); - handleDeleteFileValue(); - track(`click-apply-remove_file${id}`); } else { inputRef.current.click(); } From 7e310ceba31a52a84bb4f38e47cf8a023ad8afa5 Mon Sep 17 00:00:00 2001 From: Jeon Eonseok Date: Wed, 7 Aug 2024 19:30:12 +0900 Subject: [PATCH 24/29] =?UTF-8?q?refactor:=20file=20placeholder=20?= =?UTF-8?q?=EB=B0=8F=20class=20name=20=EB=A1=9C=EC=A7=81=20=EB=8B=A8?= =?UTF-8?q?=EC=88=9C=ED=99=94?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ApplyPage/components/FileInput/index.tsx | 21 +++++++------------ 1 file changed, 7 insertions(+), 14 deletions(-) diff --git a/src/views/ApplyPage/components/FileInput/index.tsx b/src/views/ApplyPage/components/FileInput/index.tsx index 08733934..3a89bcae 100644 --- a/src/views/ApplyPage/components/FileInput/index.tsx +++ b/src/views/ApplyPage/components/FileInput/index.tsx @@ -103,7 +103,7 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr const handleClickIcon = () => { if (inputRef.current) { - if (fileName !== 'delete-file' && (fileName || defaultFile)) { + if (fileName !== 'delete-file' && (fileName || defaultFileName)) { inputRef.current.value = ''; setFileName('delete-file'); handleDeleteFileValue(); @@ -116,22 +116,15 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr }; const getFileNameClass = () => { - if (uploadPercent === -1 && defaultFileName) { - return fileName === 'delete-file' ? 'default' : 'selected'; - } else { - return fileName === '' || fileName === 'delete-file' ? 'default' : 'selected'; - } + return (!defaultFileName && fileName === '') || fileName === 'delete-file' ? 'default' : 'selected'; }; const getDisplayText = () => { - if (uploadPercent === -1 && defaultFileName) { - return fileName === 'delete-file' ? '50mb 이하 | pdf' : defaultFileName; - } else { - if (uploadPercent < 0 && (fileName === '' || fileName === 'delete-file')) return '50mb 이하 | pdf'; - else if (isFileUploading) return `업로드 중... ${uploadPercent}/100% 완료`; - else if (isFileSending) return '파일을 전송하고 있어요... 잠시만 기다려주세요...'; - else return fileName; - } + if (uploadPercent === -1 && fileName === '' && defaultFileName) return defaultFileName; + else if (uploadPercent === -1 && (fileName === '' || fileName === 'delete-file')) return '50mb 이하 | pdf'; + else if (isFileUploading) return `업로드 중... ${uploadPercent}/100% 완료`; + else if (isFileSending) return '파일을 전송하고 있어요... 잠시만 기다려주세요...'; + else return fileName; }; useEffect(() => { From e30a7e7839d0361015714cbf2ba7339dc37c9c47 Mon Sep 17 00:00:00 2001 From: Jeon Eonseok Date: Wed, 7 Aug 2024 20:25:15 +0900 Subject: [PATCH 25/29] =?UTF-8?q?feat:=20part=20=EC=9D=B4=EB=8F=99=20?= =?UTF-8?q?=EB=90=98=EC=96=B4=EB=8F=84=20=ED=8C=8C=EC=9D=BC=20=EA=B7=B8?= =?UTF-8?q?=EB=8C=80=EB=A1=9C=20=EC=9C=A0=EC=A7=80=ED=95=98=EA=B8=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/ApplyPage/components/FileInput/index.tsx | 7 ++----- 1 file changed, 2 insertions(+), 5 deletions(-) diff --git a/src/views/ApplyPage/components/FileInput/index.tsx b/src/views/ApplyPage/components/FileInput/index.tsx index 3a89bcae..6da7c24a 100644 --- a/src/views/ApplyPage/components/FileInput/index.tsx +++ b/src/views/ApplyPage/components/FileInput/index.tsx @@ -128,6 +128,8 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr }; useEffect(() => { + if (getValues(`file${id}`)) return; + if (defaultFileId && defaultFileUrl && defaultFileName) { setValue(`file${defaultFileId}`, { file: defaultFileUrl, @@ -137,11 +139,6 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr } if (getValues(`file${id}`) && getValues(`${section}${id}`) === '') setValue(`${section}${id}`, '파일 제출'); - - return () => { - setValue(`file${id}`, undefined); - getValues(`${section}${id}`) === '파일 제출' && setValue(`${section}${id}`, ''); - }; }, [section, id, defaultFileId, defaultFileUrl, defaultFileName, getValues, setValue]); return ( From a177907631cb21bfdcceeaa50fae1c780831b00c Mon Sep 17 00:00:00 2001 From: Jeon Eonseok Date: Wed, 7 Aug 2024 20:35:29 +0900 Subject: [PATCH 26/29] =?UTF-8?q?fix:=20=ED=8C=8C=ED=8A=B8=20=EC=99=94?= =?UTF-8?q?=EB=8B=A4=EA=B0=94=EB=8B=A4=20=ED=95=A0=20=EC=8B=9C=20=ED=8C=8C?= =?UTF-8?q?=EC=9D=BC=EB=AA=85=20defaultFile=EB=A1=9C=20=EB=82=98=ED=83=80?= =?UTF-8?q?=EB=82=98=EB=8A=94=20=EC=97=90=EB=9F=AC=20=ED=95=B4=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/ApplyPage/components/FileInput/index.tsx | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/src/views/ApplyPage/components/FileInput/index.tsx b/src/views/ApplyPage/components/FileInput/index.tsx index 6da7c24a..b103ba6d 100644 --- a/src/views/ApplyPage/components/FileInput/index.tsx +++ b/src/views/ApplyPage/components/FileInput/index.tsx @@ -128,7 +128,10 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr }; useEffect(() => { - if (getValues(`file${id}`)) return; + if (getValues(`file${id}`)) { + setFileName(getValues(`file${id}`).fileName); + return; + } if (defaultFileId && defaultFileUrl && defaultFileName) { setValue(`file${defaultFileId}`, { From f805bfb12dee03b70a06dd8b5468013cc1ad6fdc Mon Sep 17 00:00:00 2001 From: Jeon Eonseok Date: Wed, 7 Aug 2024 20:39:24 +0900 Subject: [PATCH 27/29] =?UTF-8?q?chore:=20=EC=97=90=EB=9F=AC=20=EB=AC=B8?= =?UTF-8?q?=EA=B5=AC=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/common/constants/validationCheck.ts | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/common/constants/validationCheck.ts b/src/common/constants/validationCheck.ts index d796e2cb..0a713959 100644 --- a/src/common/constants/validationCheck.ts +++ b/src/common/constants/validationCheck.ts @@ -61,7 +61,6 @@ export const VALIDATION_CHECK = { }, fileInput: { errorText: '파일 크기가 너무 커요. 50MB 이하로 선택해주세요.', - errorTextUnknownError: - '파일 업로드에 실패했어요. 다시 시도해주세요. 문제가 반복된다면 상단 문의하기 버튼을 통해 문의주세요.', + errorTextUnknownError: '파일 업로드에 실패했어요. 문제가 반복된다면 상단 ‘문의하기’를 이용해주세요.', }, }; From f46615cffa2b3add4d937d1531ab924ee261d13a Mon Sep 17 00:00:00 2001 From: Jeon Eonseok Date: Wed, 7 Aug 2024 20:50:24 +0900 Subject: [PATCH 28/29] =?UTF-8?q?fix:=20=ED=8C=8C=EC=9D=BC=20=EC=A0=9C?= =?UTF-8?q?=EA=B1=B0=20=ED=95=98=EA=B3=A0=20=ED=8C=8C=ED=8A=B8=20=EB=B3=80?= =?UTF-8?q?=EA=B2=BD=20=EC=8B=9C=20default=20file=20=EA=B7=B8=EB=8C=80?= =?UTF-8?q?=EB=A1=9C=20=EB=8F=8C=EC=95=84=EC=98=A4=EB=8A=94=20=EC=97=90?= =?UTF-8?q?=EB=9F=AC=20=ED=95=B4=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/ApplyPage/components/FileInput/index.tsx | 13 +++++++++++-- 1 file changed, 11 insertions(+), 2 deletions(-) diff --git a/src/views/ApplyPage/components/FileInput/index.tsx b/src/views/ApplyPage/components/FileInput/index.tsx index b103ba6d..4b909708 100644 --- a/src/views/ApplyPage/components/FileInput/index.tsx +++ b/src/views/ApplyPage/components/FileInput/index.tsx @@ -69,6 +69,7 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr fileName: file.name, }); getValues(`${section}${id}`) === '' && setValue(`${section}${id}`, '파일 제출'); + setValue(`file${id}Deleted`, false); setUploadPercent(-1); track(`done-apply-add_file${id}`); }); @@ -78,6 +79,7 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr const handleDeleteFileValue = () => { setValue(`file${id}`, undefined); + setValue(`file${id}Deleted`, true); getValues(`${section}${id}`) === '파일 제출' && setValue(`${section}${id}`, ''); }; @@ -116,11 +118,16 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr }; const getFileNameClass = () => { - return (!defaultFileName && fileName === '') || fileName === 'delete-file' ? 'default' : 'selected'; + return (!defaultFileName && fileName === '') || + (defaultFileName && getValues(`file${id}Deleted`)) || + fileName === 'delete-file' + ? 'default' + : 'selected'; }; const getDisplayText = () => { - if (uploadPercent === -1 && fileName === '' && defaultFileName) return defaultFileName; + if (uploadPercent === -1 && fileName === '' && defaultFileName && !getValues(`file${id}Deleted`)) + return defaultFileName; else if (uploadPercent === -1 && (fileName === '' || fileName === 'delete-file')) return '50mb 이하 | pdf'; else if (isFileUploading) return `업로드 중... ${uploadPercent}/100% 완료`; else if (isFileSending) return '파일을 전송하고 있어요... 잠시만 기다려주세요...'; @@ -128,6 +135,8 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr }; useEffect(() => { + if (getValues(`file${id}Deleted`)) return; + if (getValues(`file${id}`)) { setFileName(getValues(`file${id}`).fileName); return; From 4a1a6aebbebce003a890d102919dd55ee958f4ba Mon Sep 17 00:00:00 2001 From: Jeon Eonseok Date: Wed, 7 Aug 2024 21:25:37 +0900 Subject: [PATCH 29/29] =?UTF-8?q?refactor:=20=EB=B0=98=EB=B3=B5=EB=90=98?= =?UTF-8?q?=EB=8A=94=20=EC=BD=94=EB=93=9C=20=EB=B3=80=EC=88=98=ED=99=94?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ApplyPage/components/FileInput/index.tsx | 27 ++++++++++--------- 1 file changed, 14 insertions(+), 13 deletions(-) diff --git a/src/views/ApplyPage/components/FileInput/index.tsx b/src/views/ApplyPage/components/FileInput/index.tsx index 4b909708..b3e01def 100644 --- a/src/views/ApplyPage/components/FileInput/index.tsx +++ b/src/views/ApplyPage/components/FileInput/index.tsx @@ -40,6 +40,10 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr formState: { errors }, } = useFormContext(); + const fileAnswer = getValues(`${section}${id}`); + const isFileDeleted = getValues(`file${id}Deleted`); + const fileValue = getValues(`file${id}`); + const { id: defaultFileId, file: defaultFileUrl, fileName: defaultFileName } = defaultFile || {}; const handleFileUpload = (file: File, id: number) => { @@ -68,7 +72,7 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr file: urlWithoutToken, fileName: file.name, }); - getValues(`${section}${id}`) === '' && setValue(`${section}${id}`, '파일 제출'); + fileAnswer === '' && setValue(`${section}${id}`, '파일 제출'); setValue(`file${id}Deleted`, false); setUploadPercent(-1); track(`done-apply-add_file${id}`); @@ -80,7 +84,7 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr const handleDeleteFileValue = () => { setValue(`file${id}`, undefined); setValue(`file${id}Deleted`, true); - getValues(`${section}${id}`) === '파일 제출' && setValue(`${section}${id}`, ''); + fileAnswer === '파일 제출' && setValue(`${section}${id}`, ''); }; const handleFileChange = (e: ChangeEvent, id: number) => { @@ -118,16 +122,13 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr }; const getFileNameClass = () => { - return (!defaultFileName && fileName === '') || - (defaultFileName && getValues(`file${id}Deleted`)) || - fileName === 'delete-file' + return (!defaultFileName && fileName === '') || (defaultFileName && isFileDeleted) || fileName === 'delete-file' ? 'default' : 'selected'; }; const getDisplayText = () => { - if (uploadPercent === -1 && fileName === '' && defaultFileName && !getValues(`file${id}Deleted`)) - return defaultFileName; + if (uploadPercent === -1 && fileName === '' && defaultFileName && !isFileDeleted) return defaultFileName; else if (uploadPercent === -1 && (fileName === '' || fileName === 'delete-file')) return '50mb 이하 | pdf'; else if (isFileUploading) return `업로드 중... ${uploadPercent}/100% 완료`; else if (isFileSending) return '파일을 전송하고 있어요... 잠시만 기다려주세요...'; @@ -135,10 +136,10 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr }; useEffect(() => { - if (getValues(`file${id}Deleted`)) return; + if (isFileDeleted) return; - if (getValues(`file${id}`)) { - setFileName(getValues(`file${id}`).fileName); + if (fileValue) { + setFileName(fileValue.fileName); return; } @@ -150,8 +151,8 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr }); } - if (getValues(`file${id}`) && getValues(`${section}${id}`) === '') setValue(`${section}${id}`, '파일 제출'); - }, [section, id, defaultFileId, defaultFileUrl, defaultFileName, getValues, setValue]); + if (fileValue && fileAnswer === '') setValue(`${section}${id}`, '파일 제출'); + }, [section, id, defaultFileId, defaultFileUrl, defaultFileName, fileValue, fileAnswer, isFileDeleted, setValue]); return (
    @@ -173,7 +174,7 @@ const FileInput = ({ section, id, isReview, disabled, defaultFile }: FileInputPr {getDisplayText()}