From 995d57fc21162e6f85f9874f1e8e94537b210d32 Mon Sep 17 00:00:00 2001
From: hyuna <hyuna_0525@dsm.hs.kr>
Date: Wed, 14 Aug 2024 11:19:42 +0900
Subject: [PATCH] =?UTF-8?q?=EB=AF=B8=EB=A6=AC=EB=B3=B4=EA=B8=B0=20img=20?=
 =?UTF-8?q?=EC=82=AD=EC=A0=9C=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/bugReport/page.tsx | 27 +++++++++++++++++++++------
 1 file changed, 21 insertions(+), 6 deletions(-)

diff --git a/src/app/bugReport/page.tsx b/src/app/bugReport/page.tsx
index bd9cc58..8fe517e 100644
--- a/src/app/bugReport/page.tsx
+++ b/src/app/bugReport/page.tsx
@@ -74,6 +74,13 @@ const BugReport = () => {
     });
   };
 
+  const handleRemoveImage = (index: number) => {
+    setData((prevData) => ({
+      ...prevData,
+      file_name: prevData.file_name.filter((_, i) => i !== index),
+    }));
+  };
+
   return (
     <TopBack
       linkChildren="버그 제보"
@@ -130,12 +137,20 @@ const BugReport = () => {
           ) : (
             <div className=" flex gap-1">
               {data.file_name.map((item, index) => (
-                <img
-                  key={index}
-                  src={`${process.env.NEXT_PUBLIC_FILE_APP}${item}`}
-                  width={200}
-                  height={200}
-                />
+                <div key={index} className="relative w-25 h-25 overflow-hidden">
+                  <img
+                    key={index}
+                    src={`${process.env.NEXT_PUBLIC_FILE_APP}${item}`}
+                    width={200}
+                    height={200}
+                  />
+                  <button
+                    onClick={() => handleRemoveImage(index)}
+                    className="absolute top-1 right-1 text-white bg-black bg-opacity-50 rounded-full px-2 py-1"
+                  >
+                    &times;
+                  </button>
+                </div>
               ))}
               <label
                 htmlFor="file-input"