From b5fc643b2ec8d8f840c801a0643e35f627f855b3 Mon Sep 17 00:00:00 2001
From: jungwoo3490 <jungwoo3490@naver.com>
Date: Sat, 20 Jan 2024 04:44:51 +0900
Subject: [PATCH] =?UTF-8?q?fix:=20=EB=92=A4=EB=A1=9C=EA=B0=80=EA=B8=B0=20?=
 =?UTF-8?q?=EC=8B=9C=20=EA=B8=B0=EC=A1=B4=20=EB=8D=B0=EC=9D=B4=ED=84=B0=20?=
 =?UTF-8?q?=EC=9C=A0=EC=A7=80=20=EB=B0=98=EC=98=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/FavoriteImageInput/index.tsx     | 15 ++++++++++++++-
 src/Target/page/TargetPage/index.tsx            | 17 ++++++++++++++++-
 2 files changed, 30 insertions(+), 2 deletions(-)

diff --git a/src/Target/components/FavoriteImageInput/index.tsx b/src/Target/components/FavoriteImageInput/index.tsx
index f2eb5352..a007a6ac 100644
--- a/src/Target/components/FavoriteImageInput/index.tsx
+++ b/src/Target/components/FavoriteImageInput/index.tsx
@@ -1,4 +1,4 @@
-import { useRef, useState } from 'react';
+import { useEffect, useRef, useState } from 'react';
 
 import { IcCamera, ImgBook } from '../../../assets';
 import * as S from './FavoriteImageInput.style';
@@ -11,6 +11,18 @@ function FavoriteImageInput({ changeFileData }: FavoriteImageInputProps) {
   const imgRef = useRef<HTMLInputElement | null>(null);
   const [imgFile, setImgFile] = useState('');
 
+  useEffect(() => {
+    if (
+      sessionStorage.getItem('image') &&
+      sessionStorage.getItem('image') !== null
+    ) {
+      const a = sessionStorage.getItem('image');
+      if (typeof a === 'string') {
+        setImgFile(a);
+      }
+    }
+  }, []);
+
   const handleImageUpload = async (): Promise<void> => {
     const fileInput = imgRef.current;
 
@@ -21,6 +33,7 @@ function FavoriteImageInput({ changeFileData }: FavoriteImageInputProps) {
       base64Reader.readAsDataURL(file);
       base64Reader.onloadend = () => {
         if (base64Reader.result !== null) {
+          sessionStorage.setItem('image', base64Reader.result as string);
           changeFileData(file);
           setImgFile(base64Reader.result as string);
         }
diff --git a/src/Target/page/TargetPage/index.tsx b/src/Target/page/TargetPage/index.tsx
index 221311bf..36dd6657 100644
--- a/src/Target/page/TargetPage/index.tsx
+++ b/src/Target/page/TargetPage/index.tsx
@@ -24,6 +24,18 @@ function TargetPage() {
   const { data, isLoading } = useGetPresignedUrl();
   const putMutation = usePutPresignedUrl();
 
+  useEffect(() => {
+    if (
+      sessionStorage.getItem('name') &&
+      sessionStorage.getItem('name') !== null
+    ) {
+      const a = sessionStorage.getItem('name');
+      if (typeof a === 'string') {
+        setName(a);
+      }
+    }
+  }, []);
+
   useEffect(() => {
     if (data) {
       const { url, fileName } = data;
@@ -71,7 +83,10 @@ function TargetPage() {
           </S.FavoriteInputWrapper>
         </S.InputSectionWrapper>
         <CompleteButton
-          isActive={fileData !== null && name.length !== 0}
+          isActive={
+            (fileData !== null || sessionStorage.getItem('image') !== null) &&
+            name.length !== 0
+          }
           onClick={handleClickCompleteButton}
         />
       </S.TargetPageBodyWrapper>