Feat : AddModal에서 링크 생성 기능 - 테스트 필요

Author: hongggyelim

components/modal/AddFolderModal.tsx

@@ -22,7 +22,7 @@ const AddFolderModal = ({ folderName }: { folderName: string }) => {
         const res = await postFolders(body);
         console.log(res);
       } catch (error) {
-        console.log(error);
+        console.log(error, "폴더 생성 에러");
       }
     }
     closeModal();

components/modal/AddModal.tsx

@@ -3,12 +3,24 @@ import FolderList from "./modalComponents/FolderList";
 import ModalContainer from "./modalComponents/ModalContainer";
 import SubmitButton from "../SubMitButton";
 import { useState } from "react";
+import { postLink } from "@/lib/api/link";
 
 const AddModal = ({ list, link }: { list: FolderItemType[]; link: string }) => {
   const [selectedId, setSelectedId] = useState<number | null>(null);
 
-  const handleSubmit = () => {
-    //링크 생성 api 요청 또는 id 전달
+  const handleSubmit = async () => {
+    const body = {
+      url: link,
+      folderId: Number(selectedId),
+    };
+    if (link !== "" && selectedId) {
+      try {
+        const res = await postLink(body); // 테스트 필요 (상위에서 list, link받아서)
+        console.log(res);
+      } catch (error) {
+        console.log(error, "링크 생성 에러");
+      }
+    }
   };
 
   const handleClickFolderItem = (id: number) => {

pages/api/links/index.ts

@@ -0,0 +1,34 @@
+import axiosInstance from "@/lib/api/axiosInstanceApi";
+import axios, { isAxiosError } from "axios";
+import { NextApiRequest, NextApiResponse } from "next";
+
+const handler = async (req: NextApiRequest, res: NextApiResponse) => {
+  const token = req.cookies.accessToken;
+  console.log("Token:", token);
+
+  if (!token) {
+    return res.status(401).json({ error: "사용자 정보를 찾을 수 없습니다." });
+  }
+
+  if (req.method === "POST") {
+    try {
+      const response = await axiosInstance.post("/folders", req.body, {
+        headers: {
+          Authorization: `Bearer ${token}`,
+        },
+      });
+      console.log(response);
+      return res.status(201).json({ message: "링크 추가 성공" }); // 테스트 필요
+    } catch (error) {
+      if (isAxiosError(error) && error.response) {
+        const status = error.response.status;
+        const message = error.response.data?.message || "알 수 없는 오류 발생";
+        return res.status(status).json({ message });
+      }
+    }
+  } else {
+    res.status(405).json({ message: "허용되지 않은 접근 방법" });
+  }
+};
+
+export default handler;