From b8185d73529a0cfb21aea2c0efeff44dd974ad11 Mon Sep 17 00:00:00 2001
From: anjaemin <t01089416422@gmail.com>
Date: Wed, 1 Feb 2023 12:04:38 +0900
Subject: [PATCH 1/3] feat: file drag&drop upload

---
 src/components/common/FileFind/index.tsx | 27 +++++++++++++++++++-----
 src/components/common/FileFind/styled.ts |  2 +-
 2 files changed, 23 insertions(+), 6 deletions(-)

diff --git a/src/components/common/FileFind/index.tsx b/src/components/common/FileFind/index.tsx
index 8883216..0c76b49 100644
--- a/src/components/common/FileFind/index.tsx
+++ b/src/components/common/FileFind/index.tsx
@@ -4,12 +4,24 @@ import * as S from './styled';
 
 type FileFindProps = {
   handleChangeFile: any;
+  handleDrop: any;
+  handleDragOver: any;
   fileProps: any;
 };
 
-export const FileFind: React.FC<FileFindProps> = ({ handleChangeFile, fileProps }) => (
+export const FileFind: React.FC<FileFindProps> = ({
+  handleChangeFile,
+  fileProps,
+  handleDrop,
+  handleDragOver,
+}) => (
   <S.FileFindContainer>
-    <S.FileFindTextBox>
+    <S.FileFindLabelBox
+      id="label-file-upload"
+      htmlFor="input-file-upload"
+      onDrop={handleDrop}
+      onDragOver={handleDragOver}
+    >
       {fileProps.filename != '' && fileProps.size != '' && fileProps.fileType != ''
         ? '이름:' +
           fileProps.filename +
@@ -18,9 +30,14 @@ export const FileFind: React.FC<FileFindProps> = ({ handleChangeFile, fileProps
           ' / 타입:' +
           fileProps.fileType
         : '업로드 할 파일을 선택해주세요....'}
-    </S.FileFindTextBox>
+    </S.FileFindLabelBox>
 
-    <S.FileFindButton htmlFor="file">찾아보기</S.FileFindButton>
-    <input type={'file'} id="file" style={{ display: 'none' }} onChange={handleChangeFile} />
+    <S.FileFindButton htmlFor="input-file-upload">찾아보기</S.FileFindButton>
+    <input
+      id="input-file-upload"
+      type={'file'}
+      style={{ display: 'none' }}
+      onChange={handleChangeFile}
+    />
   </S.FileFindContainer>
 );
diff --git a/src/components/common/FileFind/styled.ts b/src/components/common/FileFind/styled.ts
index f733bcf..a424939 100644
--- a/src/components/common/FileFind/styled.ts
+++ b/src/components/common/FileFind/styled.ts
@@ -7,7 +7,7 @@ export const FileFindContainer = styled.div`
   margin-top: 2rem;
 `;
 
-export const FileFindTextBox = styled.div`
+export const FileFindLabelBox = styled.label`
   border: 0.4rem solid var(--color-border);
   border-radius: 1rem;
   width: 45rem;

From 656ebfce30307fa8e284e18d2920d42865926111 Mon Sep 17 00:00:00 2001
From: anjaemin <t01089416422@gmail.com>
Date: Wed, 1 Feb 2023 12:04:49 +0900
Subject: [PATCH 2/3] feat: file drag&drop upload

---
 src/pages/main/index.tsx | 24 +++++++++++++++++++++++-
 1 file changed, 23 insertions(+), 1 deletion(-)

diff --git a/src/pages/main/index.tsx b/src/pages/main/index.tsx
index 2c9d774..c467d2b 100644
--- a/src/pages/main/index.tsx
+++ b/src/pages/main/index.tsx
@@ -47,6 +47,7 @@ export const MainPage: React.FC = () => {
   const { SetDownloadFileProps } = bindActionCreators(actionCreators, dispatch);
 
   const handleChangeFile = (event: any) => {
+    event.preventDefault();
     setFileProps({
       filename: event.target.files[0].name,
       size: getFileSize(event.target.files[0].size),
@@ -56,6 +57,22 @@ export const MainPage: React.FC = () => {
     });
   };
 
+  const handleDrop = function (event: any) {
+    event.preventDefault();
+    setFileProps({
+      filename: event.dataTransfer.files[0].name,
+      size: getFileSize(event.dataTransfer.files[0].size),
+      fileType:
+        event.dataTransfer.files[0].type === ''
+          ? 'application/actet-stream'
+          : event.dataTransfer.files[0].type,
+      fileData: event.dataTransfer.files[0],
+    });
+  };
+  const dragOver = (event: any) => {
+    event.preventDefault();
+  };
+
   const UpLoad = async () => {
     if (fileProps.filename != '' && fileProps.size != '') {
       const formdata = new FormData();
@@ -168,7 +185,12 @@ export const MainPage: React.FC = () => {
               placeholder="비밀번호를 입력해주세요."
             />
           )}
-          <FileFind handleChangeFile={handleChangeFile} fileProps={fileProps} />
+          <FileFind
+            handleDrop={handleDrop}
+            handleDragOver={dragOver}
+            handleChangeFile={handleChangeFile}
+            fileProps={fileProps}
+          />
           <UpLoadButton type={'button'} value={'업로드'} onClick={UpLoad} />
         </>
       ) : (

From 4d1e5f681cf20354196c411488fb72b03996df35 Mon Sep 17 00:00:00 2001
From: anjaemin <t01089416422@gmail.com>
Date: Wed, 1 Feb 2023 12:05:03 +0900
Subject: [PATCH 3/3] =?UTF-8?q?docs:=20test=20code=20=EC=82=AD=EC=A0=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/utils/getDate.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/utils/getDate.ts b/src/utils/getDate.ts
index 6ca2690..80bb4d1 100644
--- a/src/utils/getDate.ts
+++ b/src/utils/getDate.ts
@@ -10,7 +10,7 @@ export const getExpireTime = (date: string) => {
   const differenceTime = expireTime.getTime() - today.getTime();
   const differenceTimeDay =
     differenceTime / (1000 * 60 * 60 * 24) >= 0 ? differenceTime / (1000 * 60 * 60 * 24) : 0;
-  console.log(differenceTimeDay);
+
   let differenceTimeHour = differenceTime / (1000 * 60 * 60);
   while (true) {
     differenceTimeHour %= 24;