[fix] #68, #43 댓글 데이터 수정, 마이페이지 수정, 탈퇴 구현 중

[fix] #68, #43 댓글 데이터 수정, 마이페이지 수정, 탈퇴 구현 중

src/app/detail/edit/page.tsx

@@ -11,6 +11,8 @@ import Cookies from "js-cookie";
 import axios from "axios";
 import { useRecoilState } from "recoil";
 import { editBoardIdState } from "@/recoilAtom/EditDetail";
+import { WeatherIcons } from "@/recoilAtom/WeatherIcon";
+import { TemNowControl } from "@/recoilAtom/TemNow";
 import { categories } from "@/component/category";
 import Image from "next/image";
 
@@ -49,14 +51,17 @@ async function urlToFile(url: any, filename: any) {
     let mimeType = "";
     switch (extension) {
       case "jpg":
+        mimeType = "image/jpg";
+        break;
       case "jpeg":
         mimeType = "image/jpeg";
         break;
       case "png":
         mimeType = "image/png";
         break;
       default:
-        mimeType = "application/octet-stream"; // Fallback option
+        // mimeType = "application/octet-stream"; // Fallback option
+        mimeType = "image/*"; // Fallback option
     }
 
     return new File([blob], filename, { type: mimeType });
@@ -67,9 +72,14 @@ async function urlToFile(url: any, filename: any) {
 }
 
 export default function EditDetail(): JSX.Element {
+  //openweathermap에서 제공하는 icon과 현재 온도
+  const [icon, setIcon] = useRecoilState(WeatherIcons);
+  const [usetemp, setTemp] = useRecoilState(TemNowControl);
+
   const [editBoardId, setEditBoardId] = useRecoilState(editBoardIdState);
   const [selectedImages, setSelectedImages] = useState<File[]>([]);
   const [initialImages, setInitialImages] = useState<Image[]>([]);
+  const [deleteImageUrls, setDeleteImageUrls] = useState<string[]>([]);
   const [content, setContent] = useState<string>("");
   const [hashtags, setHashtags] = useState<string[]>([]);
   const [selectedCategories, setSelectedCategories] = useState<
@@ -95,7 +105,7 @@ export default function EditDetail(): JSX.Element {
 
     const initialImages = data.images.map((image: any) => ({
       imageId: image.imageId,
-      imageUrl: image.image_url,
+      imageUrl: image.imageUrl,
     }));
     setInitialImages(initialImages);
 
@@ -108,6 +118,10 @@ export default function EditDetail(): JSX.Element {
     setSelectedImages(files ? Array.from(files) : []);
   }, []);
 
+  const handleDeleteImage = (imageUrl: string) => {
+    setDeleteImageUrls((prevUrls) => [...prevUrls, imageUrl]);
+  };
+
   const handleContent = (text: string) => {
     setContent(text);
   };
@@ -133,6 +147,8 @@ export default function EditDetail(): JSX.Element {
         )
       ).filter(Boolean);
 
+      console.log(existingImagesAsFiles);
+
       const allImages = [...existingImagesAsFiles, ...selectedImages];
 
       const allSelectedSubCategories = Object.values(selectedCategories).reduce(
@@ -145,13 +161,21 @@ export default function EditDetail(): JSX.Element {
         hashTag: hashtags,
         category: allSelectedSubCategories,
         content: content,
+        temperature: usetemp, 
+        weatherIcon: `https://openweathermap.org/img/wn/${icon}.png`,
       };
 
       formData.append("board", JSON.stringify(boardData));
       allImages.forEach((image) => {
         formData.append("images", image);
       });
 
+      // deleteImageUrls.forEach((imageUrl) => {
+      //   formData.append("deletedImages", imageUrl);
+      // });
+
+      formData.append("deletedImages", JSON.stringify(deleteImageUrls));
+
       const response = await axios({
         method: "PATCH",
         url: `https://www.jerneithe.site/board/edit/${editBoardId}`,
@@ -164,7 +188,7 @@ export default function EditDetail(): JSX.Element {
 
       console.log(response.data); // 서버 응답 확인
       alert("게시물 수정 완료!");
-      window.location.href = "/feed";
+      window.location.href = "/detail";
     } catch (error) {
       if (axios.isAxiosError(error) && error.response) {
         console.error(error.response.data);
@@ -204,6 +228,7 @@ export default function EditDetail(): JSX.Element {
           <ImageUpload
             onImagesSelected={handleImagesSelected}
             initialImages={initialImages}
+            onDeleteImage={handleDeleteImage}
           />
           <br />
           <TextArea