From 4d0f450deaa8d62663e3b0450ec1501b67cbb544 Mon Sep 17 00:00:00 2001
From: rudtj <kyoungseo03@naver.com>
Date: Fri, 15 Nov 2024 17:49:53 +0900
Subject: [PATCH 01/46] fix: store api

---
 src/api/storeApi.ts | 30 ++++++++++++++++++++++++++++++
 1 file changed, 30 insertions(+)
 create mode 100644 src/api/storeApi.ts

diff --git a/src/api/storeApi.ts b/src/api/storeApi.ts
new file mode 100644
index 0000000..c54041a
--- /dev/null
+++ b/src/api/storeApi.ts
@@ -0,0 +1,30 @@
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+import { defaultApi } from "@api/axiosInstance";
+
+type StoreData = {
+  name: string;
+  address: string;
+  phone: number;
+};
+
+const useCreateStore = () => {
+  const fetcher = (storeData: StoreData) => defaultApi.post(`/api/stores`, storeData).then(({ data }) => data);
+
+  return useMutation({ mutationFn: fetcher });
+};
+
+const useUpdateStore = () => {
+  const queryClient = useQueryClient();
+
+  const fetcher = (storeData: StoreData) => defaultApi.put(`/api/stores`, storeData).then(({ data }) => data);
+
+  return useMutation({
+    mutationFn: fetcher,
+    onSuccess: () =>
+      queryClient.invalidateQueries({
+        queryKey: ["store"],
+      }),
+  });
+};
+
+export { useCreateStore, useUpdateStore };

From 3dcaecf0ce4510b987867487d5d926178bd3c52d Mon Sep 17 00:00:00 2001
From: gimdogyun <jasper12394@gmail.com>
Date: Mon, 18 Nov 2024 18:36:25 +0900
Subject: [PATCH 02/46] refactor: change localstorage key

- #140
---
 src/api/axiosInstance.ts | 4 ++--
 src/api/intercepters.ts  | 4 ++--
 src/atoms/userAtom.ts    | 4 ++--
 3 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/api/axiosInstance.ts b/src/api/axiosInstance.ts
index 254d0f5..f4bed3d 100644
--- a/src/api/axiosInstance.ts
+++ b/src/api/axiosInstance.ts
@@ -19,8 +19,8 @@ const needAuthDefaultApi = axios.create({
   baseURL: process.env.REACT_APP_API_URL,
   headers: {
     "Content-Type": "application/json",
-    Authorization: JSON.parse(localStorage.getItem("poomasi_user") || "{}")?.token
-      ? `Bearer ${JSON.parse(localStorage.getItem("poomasi_user") || "{}").token}`
+    Authorization: JSON.parse(localStorage.getItem("poomasi-user") || "{}")?.token
+      ? `Bearer ${JSON.parse(localStorage.getItem("poomasi-user") || "{}").token}`
       : undefined,
   },
   withCredentials: true,
diff --git a/src/api/intercepters.ts b/src/api/intercepters.ts
index 22e29df..e2032ea 100644
--- a/src/api/intercepters.ts
+++ b/src/api/intercepters.ts
@@ -13,10 +13,10 @@ const refrechIntercepter = async (response: AxiosResponse): Promise<AxiosRespons
       alert("로그아웃 되었습니다. 다시 로그인해주세요.");
       window.location.href = "/";
     });
-    const user = JSON.parse(localStorage.getItem("poomasi_user") || "{}");
+    const user = JSON.parse(localStorage.getItem("poomasi-user") || "{}");
 
     localStorage.setItem(
-      "poomasi_user",
+      "poomasi-user",
       JSON.stringify({
         ...user,
         token: result,
diff --git a/src/atoms/userAtom.ts b/src/atoms/userAtom.ts
index fac45de..8b0cbfc 100644
--- a/src/atoms/userAtom.ts
+++ b/src/atoms/userAtom.ts
@@ -7,7 +7,7 @@ type UserAtomValue = {
   role: string;
 };
 
-const userAtom = atom(localStorage.getItem("poomasi_user") ?? "");
+const userAtom = atom(localStorage.getItem("poomasi-user") ?? "");
 
 const userAtomWithPersistence = atom(
   get => {
@@ -16,7 +16,7 @@ const userAtomWithPersistence = atom(
   },
   (_, set, data: UserAtomValue | null) => {
     set(userAtom, JSON.stringify(data));
-    localStorage.setItem("poomasi_user", JSON.stringify(data));
+    localStorage.setItem("poomasi-user", JSON.stringify(data));
   },
 );
 

From a75d6d682bb8ab6e89bb163305ff6c9704a766a5 Mon Sep 17 00:00:00 2001
From: gimdogyun <jasper12394@gmail.com>
Date: Mon, 18 Nov 2024 18:36:53 +0900
Subject: [PATCH 03/46] refactor: header

- #140
---
 src/components/layouts/Header.tsx | 150 +++++++++++++-----------------
 src/hooks/useLogin.ts             |   2 +-
 2 files changed, 67 insertions(+), 85 deletions(-)

diff --git a/src/components/layouts/Header.tsx b/src/components/layouts/Header.tsx
index 6f2960d..d07f259 100644
--- a/src/components/layouts/Header.tsx
+++ b/src/components/layouts/Header.tsx
@@ -1,109 +1,91 @@
-import { useState } from "react";
-import { Link } from "react-router-dom";
-import { HeartOutlined, ShoppingCartOutlined } from "@ant-design/icons";
-import { Box, Flex, Text, Icon } from "@chakra-ui/react";
+import { Link, useLocation } from "react-router-dom";
+import { HeartOutlined, ShoppingCartOutlined, LogoutOutlined } from "@ant-design/icons";
+import { Flex, Text, Icon } from "@chakra-ui/react";
 import poomasi from "@assets/logo/logo.png";
+import Avatar from "@components/common/Avatar";
 import Image from "@components/common/Image";
 import useLogin from "@hooks/useLogin";
 
-const Header = () => {
-  const [activeMenu, setActiveMenu] = useState<string>("");
+const menuLinks = [
+  {
+    name: "소개",
+    link: "/introduction",
+  },
+  {
+    name: "상점",
+    link: "/store",
+  },
+  {
+    name: "농장",
+    link: "/schedule",
+  },
+];
 
-  const { loginCheck, logout, sellerCheck } = useLogin();
+const Header = () => {
+  const location = useLocation();
 
-  const handleMenuClick = (menu: string) => {
-    setActiveMenu(menu);
-  };
+  const { user, loginCheck, logout, sellerCheck } = useLogin();
   return (
     <Flex pos="relative" direction="column" shadow="lg" bgColor="#FFFFFF">
-      <Flex justify="flex-end" p="1px 60px" color="#1C4532" fontSize="8px" fontWeight="regular">
-        {loginCheck()
-          ? [
-              <Text as={Link} mr="12px" to="/me">
-                마이페이지
-              </Text>,
-              <Text cursor="pointer" onClick={logout}>
-                로그아웃
-              </Text>,
-            ]
-          : [
-              <Text as={Link} mr="12px" to="/email/register">
-                회원가입
-              </Text>,
-              <Text as={Link} to="/login">
-                로그인
-              </Text>,
-            ]}
-        {sellerCheck() && (
-          <Text as={Link} ml="12px" to="/seller">
-            판매자 페이지
-          </Text>
-        )}
-      </Flex>
-
-      <Flex align="center" justify="space-between" p="10px 50px">
-        <Link to="/">
-          <Image h="30px" objectFit="contain" alt="poomasi" src={poomasi} />
-        </Link>
-
-        <Flex align="center" mx="20px" ml={-70}>
-          <Link to="/introduction">
-            <Text
-              mx="30px"
-              color={activeMenu === "소개" ? "#1C4532" : "#999999"}
-              fontSize="20px"
-              fontWeight="regular"
-              cursor="pointer"
-              onClick={() => handleMenuClick("소개")}
-            >
-              소개
-            </Text>
+      <Flex align="center" justify="space-between" p="5">
+        <Flex>
+          <Link to="/">
+            <Image h="30px" objectFit="contain" alt="poomasi" src={poomasi} />
           </Link>
-          <Link to="/store">
+          {sellerCheck() && (
             <Text
-              mx="30px"
-              color={activeMenu === "상점" ? "#1C4532" : "#999999"}
-              fontSize="20px"
+              as={Link}
+              align="center"
+              ml="3"
+              p="2"
+              color="white"
+              fontSize="12px"
               fontWeight="regular"
+              bg="#1C4532"
+              borderRadius="xl"
               cursor="pointer"
-              onClick={() => handleMenuClick("상점")}
+              to="/seller"
             >
-              상점
+              farmer
             </Text>
-          </Link>
-          <Link to="/schedule">
+          )}
+          {menuLinks.map(menuLink => (
             <Text
-              mx="30px"
-              color={activeMenu === "농장" ? "#1C4532" : "#999999"}
+              as={Link}
+              mx="5"
+              color={menuLink.link === location.pathname ? "#1C4532" : "#999999"}
               fontSize="20px"
               fontWeight="regular"
               cursor="pointer"
-              onClick={() => handleMenuClick("농장")}
+              to={menuLink.link}
             >
-              농장
+              {menuLink.name}
             </Text>
-          </Link>
+          ))}
         </Flex>
 
-        {/* <Input
-          w="400px"
-          h="40px"
-          ml={10}
-          px="20px"
-          border="2px solid #1C4532"
-          borderColor="#1C4532"
-          borderRadius="12px"
-          _placeholder={{ color: "#B3B3B3" }}
-          placeholder="검색어를 입력해주세요."
-        /> */}
-
-        <Flex ml={250}>
-          <Box mx="10px" color="#1C4532" cursor="pointer">
-            <Icon as={HeartOutlined} fontSize="25px" />
-          </Box>
-          <Box mx="10px" color="#1C4532" cursor="pointer">
-            <Icon as={ShoppingCartOutlined} fontSize="25px" />
-          </Box>
+        <Flex align="center" gap="5">
+          {loginCheck() ? (
+            [
+              <Link to="/me/wish">
+                <Icon as={HeartOutlined} color="#1C4532" fontSize="25px" />
+              </Link>,
+              <Link to="/cart">
+                <Icon as={ShoppingCartOutlined} color="#1C4532" fontSize="25px" />
+              </Link>,
+              <Flex as={Link} gap="1" to="/me">
+                <Avatar size="sm" src={user.profile} />
+                <Text color="#1C4532" fontSize="20px" fontWeight="regular" cursor="pointer">
+                  {user.name}님
+                </Text>
+              </Flex>,
+              <Icon as={LogoutOutlined} color="#1C4532" fontSize="25px" cursor="pointer" onClick={() => logout()} />,
+            ]
+          ) : (
+            <Text as={Link} color="#1C4532" fontSize="20px" fontWeight="regular" cursor="pointer" to="/login">
+              로그인
+            </Text>
+          )}
         </Flex>
       </Flex>
     </Flex>
diff --git a/src/hooks/useLogin.ts b/src/hooks/useLogin.ts
index b46a42b..a8bb89b 100644
--- a/src/hooks/useLogin.ts
+++ b/src/hooks/useLogin.ts
@@ -30,7 +30,7 @@ const useLogin = () => {
 
   const sellerCheck = () => user?.role === "ROLE_FARMER";
 
-  return { login, logout, loginCheck, sellerCheck };
+  return { user, login, logout, loginCheck, sellerCheck };
 };
 
 export default useLogin;

From e505c4d839936a0862ec034a39415f2523d84e98 Mon Sep 17 00:00:00 2001
From: gimdogyun <jasper12394@gmail.com>
Date: Mon, 18 Nov 2024 21:59:24 +0900
Subject: [PATCH 04/46] test: localtest

- #140
---
 src/components/common/KaKaoLoginButton.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/common/KaKaoLoginButton.tsx b/src/components/common/KaKaoLoginButton.tsx
index 489d350..38a3ede 100644
--- a/src/components/common/KaKaoLoginButton.tsx
+++ b/src/components/common/KaKaoLoginButton.tsx
@@ -4,7 +4,7 @@ import Image from "@components/common/Image";
 type KaKaoLoginButtonProps = ImageProps;
 
 const KaKaoLoginButton = ({ ...props }: KaKaoLoginButtonProps) => {
-  const link = "https://api.poomasi.shop/oauth2/authentication/kakao";
+  const link = "http://172.22.42.12:8080/oauth2/authentication/kakao";
 
   return (
     <Link href={link} isExternal>

From ec9e46a6ef8274b104d1cecb91c99ce8cdeba0df Mon Sep 17 00:00:00 2001
From: rudtj <kyoungseo03@naver.com>
Date: Mon, 18 Nov 2024 23:06:00 +0900
Subject: [PATCH 05/46] =?UTF-8?q?refactor:=20farmlist=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../features/MyPage/Order/FarmList.tsx        | 110 +++++++++++-------
 1 file changed, 68 insertions(+), 42 deletions(-)

diff --git a/src/components/features/MyPage/Order/FarmList.tsx b/src/components/features/MyPage/Order/FarmList.tsx
index 25a161d..90ce464 100644
--- a/src/components/features/MyPage/Order/FarmList.tsx
+++ b/src/components/features/MyPage/Order/FarmList.tsx
@@ -1,56 +1,82 @@
+import { useState } from "react";
 import { Flex, Button, Text } from "@chakra-ui/react";
 import farm1 from "@assets/Image/Farm/Farm1.png";
 import Image from "@components/common/Image";
+import ReviewModal from "./ReviewModal";
 
-const FarmList = () => (
-  <Flex justify="space-between" direction="row" mt={10}>
+const FarmList = () => {
+  const [isModalOpen, setModalOpen] = useState(false);
+
+  const handleOpenModal = () => {
+    setModalOpen(true);
+  };
+
+  const handleCloseModal = () => {
+    setModalOpen(false);
+  };
+
+  return (
     <Flex direction="column">
-      <Text color="#000000" fontSize="20px" fontWeight="bold">
+      <Text mt={10} color="#000000" fontSize="20px" fontWeight="bold">
         2024.09.14
       </Text>
       <Text mt={3} color="#000000" fontSize="16px" fontWeight="bold">
         지민이네 복숭아 농장
       </Text>
-      <Flex align="center" direction="row" gap="10px">
-        <Image mt={3} w="150px" h="150px" src={farm1} alt="Farm image" />
-        <Text w="250px" color="#000000" fontSize="16px" fontWeight="medium">
-          가끔 지민은 학교에서 심각하게 집에 가고싶을 때가 있어요. 그럴 때면 로만이나 자스민에서 산 달달한 복숭아
-          아이스티를 마시며 향수병을 달랩니다.
-        </Text>
-      </Flex>
-    </Flex>
+      <Flex align="center" justify="space-between" direction="row" gap="10px">
+        <Image mt={3} w="150px" borderRadius="xl" h="150px" src={farm1} alt="Farm image" />
+        <Flex align="flex-start" justify="flex-start" direction="column" ml={-10}>
+          <Flex direction="row">
+            <Text color="#000000" fontSize="16px" fontWeight="bold">
+              주소 :&nbsp;
+            </Text>
+            <Text color="#000000" fontSize="16px" fontWeight="medium">
+              부산대학교 금정구 중앙대로 1616
+            </Text>
+          </Flex>
 
-    <Flex justify="center" direction="column" gap="10px">
-      <Button
-        w="230px"
-        h="50px"
-        color="#22543D"
-        fontSize="24px"
-        fontWeight="bold"
-        borderWidth="1px"
-        borderColor="#22543D"
-        borderRadius="12px"
-        _hover={{ bgColor: "#FFFFFF" }}
-        bgColor="#FFFFFF"
-      >
-        문의하기
-      </Button>
-      <Button
-        w="230px"
-        h="50px"
-        color="#FFFFFF"
-        fontSize="24px"
-        fontWeight="bold"
-        borderWidth="1px"
-        borderColor="#22543D"
-        borderRadius="12px"
-        _hover={{ bgColor: "#22543D" }}
-        bgColor="#22543D"
-      >
-        후기쓰기
-      </Button>
+          <Text color="#000000" fontSize="16px" fontWeight="bold">
+            한 줄 소개
+          </Text>
+          <Text w="300px" color="#000000" fontSize="16px" fontWeight="medium">
+            가끔 지민은 학교에서 심각하게 집에 가고싶을 때마다 달달한 복숭아 아이스티를 마시며 향수병을 달랩니다.
+          </Text>
+        </Flex>
+        <Flex justify="center" direction="column" gap="10px">
+          <Button
+            w="200px"
+            h="45px"
+            color="#22543D"
+            fontSize="20px"
+            fontWeight="bold"
+            borderWidth="1px"
+            borderColor="#22543D"
+            borderRadius="12px"
+            _hover={{ bgColor: "#FFFFFF" }}
+            bgColor="#FFFFFF"
+          >
+            📞 문의
+          </Button>
+          <Button
+            w="200px"
+            h="45px"
+            color="#FFFFFF"
+            fontSize="20px"
+            fontWeight="bold"
+            borderWidth="1px"
+            borderColor="#22543D"
+            borderRadius="12px"
+            _hover={{ bgColor: "#22543D" }}
+            bgColor="#22543D"
+            onClick={handleOpenModal}
+          >
+            ✍️ 후기 쓰기
+          </Button>
+          {isModalOpen && <ReviewModal isOpen={isModalOpen} onClose={handleCloseModal} />}
+        </Flex>
+      </Flex>
     </Flex>
-  </Flex>
-);
+  );
+};
 
 export default FarmList;

From 123e01873fb5ca522ed67b8100ff0629e44fa385 Mon Sep 17 00:00:00 2001
From: rudtj <kyoungseo03@naver.com>
Date: Mon, 18 Nov 2024 23:06:25 +0900
Subject: [PATCH 06/46] =?UTF-8?q?refactor:=20review=20modal=20=EC=88=98?=
 =?UTF-8?q?=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../features/MyPage/Order/ReviewModal.tsx     | 40 ++++++++++---------
 1 file changed, 21 insertions(+), 19 deletions(-)

diff --git a/src/components/features/MyPage/Order/ReviewModal.tsx b/src/components/features/MyPage/Order/ReviewModal.tsx
index 6f2f578..cf29efe 100644
--- a/src/components/features/MyPage/Order/ReviewModal.tsx
+++ b/src/components/features/MyPage/Order/ReviewModal.tsx
@@ -10,7 +10,7 @@ import {
   Divider,
   Icon,
   Input,
-  Box,
+  Textarea,
 } from "@chakra-ui/react";
 import Image from "@components/common/Image";
 import StarRating from "@components/common/StarRating";
@@ -39,7 +39,7 @@ const ReviewModal: React.FC<ReviewModalProps> = ({ isOpen, onClose, productId })
     setRating(newRating);
   };
 
-  const handleReviewTextChange = (event: React.ChangeEvent<HTMLInputElement>) => {
+  const handleReviewTextChange = (event: React.ChangeEvent<HTMLTextAreaElement>) => {
     setReviewText(event.target.value);
   };
 
@@ -54,7 +54,7 @@ const ReviewModal: React.FC<ReviewModalProps> = ({ isOpen, onClose, productId })
   };
 
   return (
-    <BasicModal isOpen={isOpen} onClose={onClose} maxW="800px" maxH="1000px">
+    <BasicModal isOpen={isOpen} onClose={onClose} maxW="800px" maxH="1100px">
       <ModalCloseButton _hover={{ bg: "#FFFFFF" }} />
       <ModalHeader color="#22543D" fontSize="25px" fontWeight="bold">
         후기 쓰기
@@ -80,32 +80,34 @@ const ReviewModal: React.FC<ReviewModalProps> = ({ isOpen, onClose, productId })
               as={UploadOutlined}
               mx="5"
               mt={12}
-              ml={-200}
+              ml={-230}
               color="#000000"
               fontSize="30px"
               cursor="pointer"
               onClick={() => mainImageInputRef.current?.click()}
             />
-            <Flex pos="relative" align="flex-end" justify="flex-end" w="100%" h="200px" mt="5" mr={95}>
+            <Flex pos="relative" align="flex-end" justify="flex-end" w="100%" h="200px" mt="5" mr={100}>
               <Image flexShrink="0" w="200px" h="200px" objectFit="cover" alt="main image" src={imageUrl} />
               <Input ref={mainImageInputRef} display="none" accept="image/*" onChange={handleImageChange} type="file" />
             </Flex>
           </Flex>
 
-          <Box w="600px" h="150px" mt={10} borderWidth="0.4px" borderColor="#000000" bgColor="#FFFFFF">
-            <Input
-              w="500px"
-              mt={2}
-              ml={2}
-              border="none"
-              _focus={{ borderColor: "transparent", boxShadow: "none" }}
-              _placeholder={{ color: "#D9D9D9", fontWeight: "bold", fontSize: "16px" }}
-              onChange={handleReviewTextChange}
-              placeholder="구매하신 상품의 후기를 남겨주시면 다른 구매자들에게도 도움이 됩니다."
-              value={reviewText}
-            />
-          </Box>
-          <Flex justify="center" direction="row" gap="5px" mt={10}>
+          <Textarea
+            w="600px"
+            h="150px"
+            mt={10}
+            p="10px"
+            borderWidth="0.4px"
+            borderColor="#000000"
+            _focus={{ borderColor: "#000000", boxShadow: "none" }}
+            _placeholder={{ color: "#D9D9D9", fontWeight: "bold", fontSize: "16px" }}
+            bgColor="#FFFFFF"
+            onChange={handleReviewTextChange}
+            placeholder="구매하신 상품의 후기를 남겨주시면 다른 구매자들에게도 도움이 됩니다."
+            value={reviewText}
+          />
+
+          <Flex justify="center" direction="row" gap="5px" mt={10} mb={10}>
             <Button
               w="230px"
               h="50px"

From f1b666080353f816c5f5d6e411a6aafb49177eb6 Mon Sep 17 00:00:00 2001
From: rudtj <kyoungseo03@naver.com>
Date: Mon, 18 Nov 2024 23:06:36 +0900
Subject: [PATCH 07/46] =?UTF-8?q?remove:=20=EB=B6=88=ED=95=84=EC=9A=94?=
 =?UTF-8?q?=ED=95=9C=20=EA=B2=BD=EB=A1=9C=20=EC=A0=9C=EA=B1=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/routes/AppRouter.tsx | 10 ----------
 1 file changed, 10 deletions(-)

diff --git a/src/routes/AppRouter.tsx b/src/routes/AppRouter.tsx
index cd9a0e8..b065ce7 100644
--- a/src/routes/AppRouter.tsx
+++ b/src/routes/AppRouter.tsx
@@ -2,7 +2,6 @@ import { createBrowserRouter, RouterProvider } from "react-router-dom";
 import MainLayout from "@components/layouts/MainLayout";
 import MyPageLayout from "@components/layouts/MyPageLayout";
 import SellerLayout from "@components/layouts/SellerLayout";
-import BuyerMyPage from "@pages/BuyerMyPage";
 import CallbackPage from "@pages/CallbackPage";
 import EmailLoginPage from "@pages/EmailLoginPage";
 import EmailRegisterPage from "@pages/EmailRegisterPage";
@@ -21,7 +20,6 @@ import WithdrawPage from "@pages/MyPage/WithdrawPage";
 import ProductCartPage from "@pages/ProductCartPage";
 import RegisterPage from "@pages/RegisterPage";
 import SchedulePage from "@pages/SchedulePage";
-import SellerMyPage from "@pages/SellerMyPage";
 import SellerPage from "@pages/SellerPage";
 import BizRegister from "@pages/SellerPage/BizRegister";
 import FarmEdit from "@pages/SellerPage/FarmEdit";
@@ -51,14 +49,6 @@ const AppRouter = () => {
           path: "introduction",
           element: <IntroductionPage />,
         },
-        {
-          path: "BuyerMyPage",
-          element: <BuyerMyPage />,
-        },
-        {
-          path: "SellerMyPage",
-          element: <SellerMyPage />,
-        },
         {
           path: "StoreDetail",
           element: <StoreDetailPage />,

From 76ce76f507bd8f20a1bf1b603774015dd1b4a770 Mon Sep 17 00:00:00 2001
From: rudtj <kyoungseo03@naver.com>
Date: Mon, 18 Nov 2024 23:20:34 +0900
Subject: [PATCH 08/46] =?UTF-8?q?refactor:=20=EB=AA=A8=EB=8B=AC=20?=
 =?UTF-8?q?=EC=97=B0=EA=B2=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../features/MyPage/Order/FarmList.tsx        | 26 ++++++++++++++-----
 1 file changed, 19 insertions(+), 7 deletions(-)

diff --git a/src/components/features/MyPage/Order/FarmList.tsx b/src/components/features/MyPage/Order/FarmList.tsx
index 90ce464..55a57d5 100644
--- a/src/components/features/MyPage/Order/FarmList.tsx
+++ b/src/components/features/MyPage/Order/FarmList.tsx
@@ -2,17 +2,27 @@ import { useState } from "react";
 import { Flex, Button, Text } from "@chakra-ui/react";
 import farm1 from "@assets/Image/Farm/Farm1.png";
 import Image from "@components/common/Image";
+import ContactNumberModal from "./ContactNumberModal";
 import ReviewModal from "./ReviewModal";
 
 const FarmList = () => {
-  const [isModalOpen, setModalOpen] = useState(false);
+  const [isReviewModalOpen, setIsReviewModalOpen] = useState(false);
+  const [isContactModalOpen, setIsContactModalOpen] = useState(false);
 
-  const handleOpenModal = () => {
-    setModalOpen(true);
+  const handleOpenReviewModal = () => {
+    setIsReviewModalOpen(true);
   };
 
-  const handleCloseModal = () => {
-    setModalOpen(false);
+  const handleCloseReviewModal = () => {
+    setIsReviewModalOpen(false);
+  };
+
+  const handleOpenContactModal = () => {
+    setIsContactModalOpen(true);
+  };
+
+  const handleCloseContactModal = () => {
+    setIsContactModalOpen(false);
   };
 
   return (
@@ -54,9 +64,11 @@ const FarmList = () => {
             borderRadius="12px"
             _hover={{ bgColor: "#FFFFFF" }}
             bgColor="#FFFFFF"
+            onClick={handleOpenContactModal}
           >
             📞 문의
           </Button>
+          {isContactModalOpen && <ContactNumberModal isOpen={isContactModalOpen} onClose={handleCloseContactModal} />}
           <Button
             w="200px"
             h="45px"
@@ -68,11 +80,11 @@ const FarmList = () => {
             borderRadius="12px"
             _hover={{ bgColor: "#22543D" }}
             bgColor="#22543D"
-            onClick={handleOpenModal}
+            onClick={handleOpenReviewModal}
           >
             ✍️ 후기 쓰기
           </Button>
-          {isModalOpen && <ReviewModal isOpen={isModalOpen} onClose={handleCloseModal} />}
+          {isReviewModalOpen && <ReviewModal isOpen={isReviewModalOpen} onClose={handleCloseReviewModal} />}
         </Flex>
       </Flex>
     </Flex>

From fb5d0b08c23b08fb0f0350890abbc0c00fa8bb71 Mon Sep 17 00:00:00 2001
From: rudtj <kyoungseo03@naver.com>
Date: Mon, 18 Nov 2024 23:20:51 +0900
Subject: [PATCH 09/46] =?UTF-8?q?refactor:=20handleCancel=20=EC=B6=94?=
 =?UTF-8?q?=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/features/MyPage/Order/ReviewModal.tsx | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/src/components/features/MyPage/Order/ReviewModal.tsx b/src/components/features/MyPage/Order/ReviewModal.tsx
index cf29efe..5b3c4de 100644
--- a/src/components/features/MyPage/Order/ReviewModal.tsx
+++ b/src/components/features/MyPage/Order/ReviewModal.tsx
@@ -53,6 +53,10 @@ const ReviewModal: React.FC<ReviewModalProps> = ({ isOpen, onClose, productId })
     postMessage(reviewData);
   };
 
+  const handleCancel = () => {
+    onClose();
+  };
+
   return (
     <BasicModal isOpen={isOpen} onClose={onClose} maxW="800px" maxH="1100px">
       <ModalCloseButton _hover={{ bg: "#FFFFFF" }} />
@@ -119,6 +123,7 @@ const ReviewModal: React.FC<ReviewModalProps> = ({ isOpen, onClose, productId })
               borderRadius="12px"
               _hover={{ bgColor: "#FFFFFF" }}
               bgColor="#FFFFFF"
+              onClick={handleCancel}
             >
               작성 취소
             </Button>

From 45dcd03fe1261ae1e629006cc6ab5fb0e2c6765d Mon Sep 17 00:00:00 2001
From: rudtj <kyoungseo03@naver.com>
Date: Mon, 18 Nov 2024 23:44:39 +0900
Subject: [PATCH 10/46] =?UTF-8?q?refactor:=20listview=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages/MyPage/FarmListPage.tsx | 15 ++++++++++++++-
 1 file changed, 14 insertions(+), 1 deletion(-)

diff --git a/src/pages/MyPage/FarmListPage.tsx b/src/pages/MyPage/FarmListPage.tsx
index be3d060..e89e018 100644
--- a/src/pages/MyPage/FarmListPage.tsx
+++ b/src/pages/MyPage/FarmListPage.tsx
@@ -1,9 +1,22 @@
+import farm6 from "@assets/Image/Farm/Farm6.png";
+import ListView from "@components/ItemView/ListView";
 import Card from "@components/common/Card";
 import FarmList from "@components/features/MyPage/Order/FarmList";
+import mockFarms from "@mocks/mockItem/mockFarms";
+import { Farm } from "@type/index";
+
+const farmListData: Farm[] = mockFarms.map((farm, index) => ({
+  id: farm.id,
+  date: `2024.09.${index + 14}`,
+  name: farm.name,
+  address: farm.address,
+  description: "기본 설명입니다.",
+  profile: farm6,
+}));
 
 const FarmListPage = () => (
   <Card title="농장 체험 내역" w="100%" h="fit-content" p="10">
-    <FarmList />
+    <ListView items={farmListData} ItemComponent={FarmList} />
   </Card>
 );
 

From 41e4dfdac9d8b022d5a7e59778d19c9079986a24 Mon Sep 17 00:00:00 2001
From: rudtj <kyoungseo03@naver.com>
Date: Tue, 19 Nov 2024 20:22:09 +0900
Subject: [PATCH 11/46] =?UTF-8?q?refactor:=20api=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/businessApi.ts |  4 +--
 src/api/farmApi.ts     | 58 ++++++++++++++++++++++++++++--
 src/api/productApi.ts  | 16 ++++++---
 src/api/reviewApi.ts   | 80 ++++++++++++++++++++++++++++++++++++++++++
 src/api/wishlistApi.ts | 30 ++++++++++++++++
 5 files changed, 179 insertions(+), 9 deletions(-)
 create mode 100644 src/api/reviewApi.ts
 create mode 100644 src/api/wishlistApi.ts

diff --git a/src/api/businessApi.ts b/src/api/businessApi.ts
index 6213e86..c6b98ee 100644
--- a/src/api/businessApi.ts
+++ b/src/api/businessApi.ts
@@ -13,6 +13,6 @@ const useCreateBusiness = () => {
   return useMutation({ mutationFn: fetcher });
 };
 
-const useGetBusinessDetail = () => null;
+const useGetBusiness = () => null;
 
-export { useCreateBusiness, useGetBusinessDetail };
+export { useCreateBusiness, useGetBusiness };
diff --git a/src/api/farmApi.ts b/src/api/farmApi.ts
index 49691c3..266d025 100644
--- a/src/api/farmApi.ts
+++ b/src/api/farmApi.ts
@@ -18,6 +18,22 @@ type FarmData = {
   endTime: string;
 };
 
+type ReservationData = {
+  farmId: number;
+  startTime: string;
+  endTime: string;
+  date: ["startDate", "endDate"];
+};
+
+const useGetFarm = () => {
+  const fetcher = () => defaultApi.get(`/api/farms/{farmId}/detail`).then(({ data }) => data);
+
+  return useQuery({
+    queryKey: ["farms"],
+    queryFn: fetcher,
+  });
+};
+
 const useGetFarms = () => {
   const fetcher = () => defaultApi.get(`/api/farms`).then(({ data }) => data);
 
@@ -37,7 +53,7 @@ const useGetFarmDetail = (farmId: number) => {
 };
 
 const useCreateFarms = () => {
-  const fetcher = (farmData: FarmData) => defaultApi.post(`/api/farms`, farmData).then(({ data }) => data);
+  const fetcher = (farmData: FarmData) => defaultApi.post(`/api/farmer/farms`, farmData).then(({ data }) => data);
 
   return useMutation({ mutationFn: fetcher });
 };
@@ -57,4 +73,42 @@ const useUpdateFarms = (farmId: number) => {
   });
 };
 
-export { useGetFarms, useGetFarmDetail, useCreateFarms, useUpdateFarms };
+const useDeleteFarms = (farmId: number) => {
+  const queryClient = useQueryClient();
+
+  const fetcher = () => defaultApi.delete(`/api/farmer/farms/${farmId}`).then(({ data }) => data);
+
+  return useMutation({
+    mutationFn: fetcher,
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ["farms"] });
+    },
+  });
+};
+
+const useCreateReservations = () => {
+  const fetcher = (reservationData: ReservationData) =>
+    defaultApi.post(`/api/farms/schedule`, reservationData).then(({ data }) => data);
+
+  return useMutation({ mutationFn: fetcher });
+};
+
+const useGetReservations = (farmId: number) => {
+  const fetcher = () => defaultApi.get(`/api/farms/schedule?farmId=17&year=2024&month=10`).then(({ data }) => data);
+
+  return useQuery({
+    queryKey: ["reservations", farmId],
+    queryFn: fetcher,
+  });
+};
+
+export {
+  useGetFarm,
+  useGetFarms,
+  useGetFarmDetail,
+  useCreateFarms,
+  useUpdateFarms,
+  useDeleteFarms,
+  useCreateReservations,
+  useGetReservations,
+};
diff --git a/src/api/productApi.ts b/src/api/productApi.ts
index 72fa8ca..49b315a 100644
--- a/src/api/productApi.ts
+++ b/src/api/productApi.ts
@@ -5,16 +5,22 @@ type ProductData = {
   categoryId: number;
   name: string;
   description: string;
-  imageUrl: string;
   stock: string;
   price: string;
   growEnv: string;
   shippingFee: string;
   phoneNumber: string;
+  mainTitle: string;
+  subTitle1: string;
+  subDesc1: string;
+  subTitle2: string;
+  subDesc2: string;
+  subTitle3: string;
+  subDesc3: string;
 };
 
 const useGetProducts = () => {
-  const fetcher = () => defaultApi.get(`/api/products`).then(({ data }) => data);
+  const fetcher = () => defaultApi.get(`/products`).then(({ data }) => data);
 
   return useQuery({
     queryKey: ["products"],
@@ -23,7 +29,7 @@ const useGetProducts = () => {
 };
 
 const useGetProductDetail = (productId: number) => {
-  const fetcher = () => defaultApi.get(`/api/products/${productId}`).then(({ data }) => data);
+  const fetcher = () => defaultApi.get(`/products/${productId}`).then(({ data }) => data);
   return useQuery({
     queryKey: ["products", productId],
     queryFn: fetcher,
@@ -32,7 +38,7 @@ const useGetProductDetail = (productId: number) => {
 };
 
 const useCreateProducts = () => {
-  const fetcher = (productData: ProductData) => defaultApi.post(`/api/products`, productData).then(({ data }) => data);
+  const fetcher = (productData: ProductData) => defaultApi.post(`/products`, productData).then(({ data }) => data);
 
   return useMutation({ mutationFn: fetcher });
 };
@@ -41,7 +47,7 @@ const useUpdateProducts = (productId: number) => {
   const queryClient = useQueryClient();
 
   const fetcher = (productData: ProductData) =>
-    defaultApi.put(`/api/products/${productId}`, productData).then(({ data }) => data);
+    defaultApi.put(`/products/${productId}`, productData).then(({ data }) => data);
 
   return useMutation({
     mutationFn: fetcher,
diff --git a/src/api/reviewApi.ts b/src/api/reviewApi.ts
new file mode 100644
index 0000000..3cc1c70
--- /dev/null
+++ b/src/api/reviewApi.ts
@@ -0,0 +1,80 @@
+import { useQuery, useMutation, useQueryClient } from "@tanstack/react-query";
+import { defaultApi } from "@api/axiosInstance";
+
+type ReviewData = {
+  rating: number;
+  content: string;
+  product_id?: number;
+  farm_id?: number;
+};
+
+const useGetProductReviews = (reviewId: number) => {
+  const fetcher = () => defaultApi.get(`/api/products/{product_id}/reviews`).then(({ data }) => data);
+
+  return useQuery({
+    queryKey: ["reviews", reviewId],
+    queryFn: fetcher,
+  });
+};
+
+const useCreateProductReviews = () => {
+  const fetcher = (reviewData: ReviewData) =>
+    defaultApi.post(`/api/products/{product_id}/reviews`, reviewData).then(({ data }) => data);
+
+  return useMutation({ mutationFn: fetcher });
+};
+
+const useUpdateReviews = (reviewId: number) => {
+  const queryClient = useQueryClient();
+
+  const fetcher = (reviewData: ReviewData) =>
+    defaultApi.put(`/api/reviews/{review_id}`, reviewData).then(({ data }) => data);
+
+  return useMutation({
+    mutationFn: fetcher,
+    onSuccess: () =>
+      queryClient.invalidateQueries({
+        queryKey: ["reviews", reviewId],
+      }),
+  });
+};
+
+const useDeleteReviews = (reviewId: number) => {
+  const queryClient = useQueryClient();
+
+  const fetcher = () => defaultApi.delete(`/api/reviews/${reviewId}`).then(({ data }) => data);
+
+  return useMutation({
+    mutationFn: fetcher,
+    onSuccess: () => {
+      queryClient.invalidateQueries({
+        queryKey: ["reviews", reviewId],
+      });
+    },
+  });
+};
+
+const useGetFarmReviews = (reviewId: number) => {
+  const fetcher = () => defaultApi.get(`/api/farms/{farm_id}/reviews`).then(({ data }) => data);
+
+  return useQuery({
+    queryKey: ["reviews", reviewId],
+    queryFn: fetcher,
+  });
+};
+
+const useCreateFarmReviews = () => {
+  const fetcher = (reviewData: ReviewData) =>
+    defaultApi.post(`/api/farms/{reservationId}/reviews`, reviewData).then(({ data }) => data);
+
+  return useMutation({ mutationFn: fetcher });
+};
+
+export {
+  useGetProductReviews,
+  useCreateProductReviews,
+  useUpdateReviews,
+  useDeleteReviews,
+  useGetFarmReviews,
+  useCreateFarmReviews,
+};
diff --git a/src/api/wishlistApi.ts b/src/api/wishlistApi.ts
new file mode 100644
index 0000000..8625908
--- /dev/null
+++ b/src/api/wishlistApi.ts
@@ -0,0 +1,30 @@
+import { useQuery, useMutation } from "@tanstack/react-query";
+import { defaultApi, needAuthDefaultApi } from "@api/axiosInstance";
+
+type WishlistData = {
+  product_id: number;
+};
+
+const useCreateWishlists = () => {
+  const fetcher = (wishlistData: WishlistData) =>
+    defaultApi.post(`/api/wishlist/{product_id}`, wishlistData).then(({ data }) => data);
+
+  return useMutation({ mutationFn: fetcher });
+};
+
+const useGetWishlists = () => {
+  const fetcher = () => needAuthDefaultApi.get(`/api/wishlist`).then(({ data }) => data);
+
+  return useQuery({
+    queryKey: ["wishlists"],
+    queryFn: fetcher,
+  });
+};
+
+const useDeleteWishlists = () => {
+  const fetcher = (wishlistId: number) => defaultApi.delete(`/api/wishlist/${wishlistId}`).then(({ data }) => data);
+
+  return useMutation({ mutationFn: fetcher });
+};
+
+export { useCreateWishlists, useGetWishlists, useDeleteWishlists };

From 88d74d52f7521a29167ac2b8cd9f6d0e03c806a8 Mon Sep 17 00:00:00 2001
From: rudtj <kyoungseo03@naver.com>
Date: Tue, 19 Nov 2024 20:22:37 +0900
Subject: [PATCH 12/46] =?UTF-8?q?refactor:=20wishpage=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/routes/AppRouter.tsx | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/src/routes/AppRouter.tsx b/src/routes/AppRouter.tsx
index b065ce7..2328e07 100644
--- a/src/routes/AppRouter.tsx
+++ b/src/routes/AppRouter.tsx
@@ -15,6 +15,7 @@ import DeliveryPage from "@pages/MyPage/DeliveryPage";
 import FarmListPage from "@pages/MyPage/FarmListPage";
 import MyInfoPage from "@pages/MyPage/MyInfoPage";
 import MyOrdersPage from "@pages/MyPage/OrdersPage";
+import ProductWishlistPage from "@pages/MyPage/ProductWishlistPage";
 import ReviewListPage from "@pages/MyPage/ReviewListPage";
 import WithdrawPage from "@pages/MyPage/WithdrawPage";
 import ProductCartPage from "@pages/ProductCartPage";
@@ -34,6 +35,7 @@ import SoldOuts from "@pages/SellerPage/SoldOuts";
 import TaxCalculator from "@pages/SellerPage/TaxCalculator";
 import StoreDetailPage from "@pages/StoreDetailPage";
 import StorePage from "@pages/StorePage";
+import WishPage from "@pages/WishPage";
 
 const AppRouter = () => {
   const routers = createBrowserRouter([
@@ -49,6 +51,10 @@ const AppRouter = () => {
           path: "introduction",
           element: <IntroductionPage />,
         },
+        {
+          path: "wish",
+          element: <WishPage />,
+        },
         {
           path: "StoreDetail",
           element: <StoreDetailPage />,
@@ -124,6 +130,10 @@ const AppRouter = () => {
               index: true,
               element: <MyPage />,
             },
+            {
+              path: "product-wish",
+              element: <ProductWishlistPage />,
+            },
             {
               path: "orders",
               element: <MyOrdersPage />,

From d122df7f6b13cb666145f6af4fcefecf62aa1876 Mon Sep 17 00:00:00 2001
From: rudtj <kyoungseo03@naver.com>
Date: Tue, 19 Nov 2024 20:22:59 +0900
Subject: [PATCH 13/46] =?UTF-8?q?remove:=20=EB=86=8D=EC=9E=A5=20=EC=9C=84?=
 =?UTF-8?q?=EC=8B=9C=EB=A6=AC=EC=8A=A4=ED=8A=B8=20=EC=82=AD=EC=A0=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/features/MyPage/Category.tsx | 17 ++++++++++++-----
 1 file changed, 12 insertions(+), 5 deletions(-)

diff --git a/src/components/features/MyPage/Category.tsx b/src/components/features/MyPage/Category.tsx
index d4607e2..e34c8bf 100644
--- a/src/components/features/MyPage/Category.tsx
+++ b/src/components/features/MyPage/Category.tsx
@@ -11,11 +11,18 @@ const Category = () => (
           위시리스트
         </Text>
       </Flex>
-      <ChakraLink as={Link} w="50px" h="20px" mt={3} ml={5} color="#5C5C5C" fontSize="16px" fontWeight="medium">
-        농산품
-      </ChakraLink>
-      <ChakraLink as={Link} w="68px" h="20px" mt={1} ml={5} color="#5C5C5C" fontSize="16px" fontWeight="medium">
-        농장 체험
+      <ChakraLink
+        as={Link}
+        w="50px"
+        h="20px"
+        mt={3}
+        ml={5}
+        color="#5C5C5C"
+        fontSize="16px"
+        fontWeight="medium"
+        to="/me/product-wish"
+      >
+        위시리스트
       </ChakraLink>
       <Flex direction="row" mt={10} ml={5}>
         <Icon as={ProfileOutlined} color="#22543D" fontSize="25px" />

From deeab49ab684d2de2833673a9a8736db0e7df742 Mon Sep 17 00:00:00 2001
From: rudtj <kyoungseo03@naver.com>
Date: Tue, 19 Nov 2024 20:23:34 +0900
Subject: [PATCH 14/46] =?UTF-8?q?refactor:=20review=20list=20=EC=88=98?=
 =?UTF-8?q?=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../features/MyPage/Order/ReviewList.tsx      | 140 +++++++++++-------
 .../features/MyPage/Order/ReviewModal.tsx     |  80 +++++++++-
 2 files changed, 164 insertions(+), 56 deletions(-)

diff --git a/src/components/features/MyPage/Order/ReviewList.tsx b/src/components/features/MyPage/Order/ReviewList.tsx
index 14e5d3a..30a1088 100644
--- a/src/components/features/MyPage/Order/ReviewList.tsx
+++ b/src/components/features/MyPage/Order/ReviewList.tsx
@@ -1,54 +1,94 @@
-import { Flex, Button, Text } from "@chakra-ui/react";
-import store8 from "@assets/Image/Store/Store8.png";
+import { useState } from "react";
+import { Flex, Button, Text, Alert } from "@chakra-ui/react";
+
+import { useDeleteReviews } from "@api/reviewApi";
 import Image from "@components/common/Image";
+import { Review } from "@type/index";
+import ReviewModal from "./ReviewModal";
+
+const ReviewList = ({ item }: { item: Review }) => {
+  const [isEditModalOpen, setIsEditModalOpen] = useState(false);
+  const { mutate: deleteReview } = useDeleteReviews(item.id);
+
+  const handleDelete = () => {
+    deleteReview(undefined, {
+      onSuccess: () => {
+        <Alert title="해당 리뷰가 삭제되었습니다." />;
+      },
+      onError: () => {
+        <Alert title="삭제에 실패했습니다. 다시 시도해주세요." />;
+      },
+    });
+  };
+
+  const handleEditClick = () => {
+    setIsEditModalOpen(true);
+  };
+
+  const handleEditModalClose = () => {
+    setIsEditModalOpen(false);
+  };
+
+  return (
+    <>
+      <Flex direction="column">
+        <Flex justify="space-between" direction="row" flex="1" mt={3}>
+          <Flex justify="flex-start" direction="column">
+            <Text mt={3} color="#000000" fontSize="16px" fontWeight="medium">
+              {item.name}
+            </Text>
+            <Image mt={3} w="150px" h="150px" borderRadius="xl" src={item.image} alt="Review image" />
+            <Text mt={3} color="#000000" fontSize="16px" fontWeight="medium">
+              {item.description}
+            </Text>
+          </Flex>
 
-const ReviewList = () => (
-  <Flex justify="space-between" direction="row" mt={10}>
-    <Flex direction="column">
-      <Text color="#000000" fontSize="20px" fontWeight="bold">
-        2024.09.14
-      </Text>
-
-      <Text mt={3} color="#000000" fontSize="16px" fontWeight="medium">
-        건호네 하나뿐인 미나리
-      </Text>
-      <Image mt={3} w="150px" h="150px" src={store8} alt="Review image" />
-      <Text mt={3} color="#000000" fontSize="16px" fontWeight="medium">
-        기대 안하고 샀는데 생각보다 괜찮아요.
-      </Text>
-    </Flex>
-
-    <Flex justify="center" direction="column" gap="10px">
-      <Button
-        w="230px"
-        h="50px"
-        color="#22543D"
-        fontSize="24px"
-        fontWeight="bold"
-        borderWidth="1px"
-        borderColor="#22543D"
-        borderRadius="12px"
-        _hover={{ bgColor: "#FFFFFF" }}
-        bgColor="#FFFFFF"
-      >
-        리뷰 삭제
-      </Button>
-      <Button
-        w="230px"
-        h="50px"
-        color="#FFFFFF"
-        fontSize="24px"
-        fontWeight="bold"
-        borderWidth="1px"
-        borderColor="#22543D"
-        borderRadius="12px"
-        _hover={{ bgColor: "#22543D" }}
-        bgColor="#22543D"
-      >
-        리뷰 수정
-      </Button>
-    </Flex>
-  </Flex>
-);
+          <Flex justify="center" direction="column" gap="10px">
+            <Button
+              w="200px"
+              h="45px"
+              color="#22543D"
+              fontSize="20px"
+              fontWeight="bold"
+              borderWidth="1px"
+              borderColor="#22543D"
+              borderRadius="12px"
+              _hover={{ bgColor: "#FFFFFF" }}
+              bgColor="#FFFFFF"
+              onClick={handleDelete}
+            >
+              리뷰 삭제
+            </Button>
+            <Button
+              w="200px"
+              h="45px"
+              color="#FFFFFF"
+              fontSize="20px"
+              fontWeight="bold"
+              borderWidth="1px"
+              borderColor="#22543D"
+              borderRadius="12px"
+              _hover={{ bgColor: "#22543D" }}
+              bgColor="#22543D"
+              onClick={handleEditClick}
+            >
+              리뷰 수정
+            </Button>
+          </Flex>
+        </Flex>
+      </Flex>
+      <ReviewModal
+        isOpen={isEditModalOpen}
+        onClose={handleEditModalClose}
+        isEditing
+        initialData={{
+          rating: item.rating,
+          content: item.description,
+          id: item.id,
+        }}
+      />
+    </>
+  );
+};
 
 export default ReviewList;
diff --git a/src/components/features/MyPage/Order/ReviewModal.tsx b/src/components/features/MyPage/Order/ReviewModal.tsx
index 5b3c4de..ebf0695 100644
--- a/src/components/features/MyPage/Order/ReviewModal.tsx
+++ b/src/components/features/MyPage/Order/ReviewModal.tsx
@@ -1,4 +1,4 @@
-import React, { useRef, useState } from "react";
+import React, { useRef, useState, useEffect } from "react";
 import { UploadOutlined } from "@ant-design/icons";
 import {
   Flex,
@@ -11,7 +11,9 @@ import {
   Icon,
   Input,
   Textarea,
+  Alert,
 } from "@chakra-ui/react";
+import { useCreateFarmReviews, useCreateProductReviews, useUpdateReviews } from "@api/reviewApi";
 import Image from "@components/common/Image";
 import StarRating from "@components/common/StarRating";
 import BasicModal from "@components/common/modal/BasicModal";
@@ -20,14 +22,39 @@ type ReviewModalProps = {
   isOpen: boolean;
   onClose: () => void;
   productId?: number;
+  farmId?: number;
+  isEditing?: boolean;
+  initialData?: {
+    rating: number;
+    content: string;
+    id: number;
+  };
 };
 
-const ReviewModal: React.FC<ReviewModalProps> = ({ isOpen, onClose, productId }) => {
+const ReviewModal: React.FC<ReviewModalProps> = ({
+  isOpen,
+  onClose,
+  productId,
+  farmId,
+  isEditing = false,
+  initialData,
+}) => {
   const mainImageInputRef = useRef<HTMLInputElement>(null);
   const [imageUrl, setImageUrl] = useState<string>();
   const [rating, setRating] = useState<number>(0);
   const [reviewText, setReviewText] = useState<string>("");
 
+  const { mutate: createProductReview } = useCreateProductReviews();
+  const { mutate: createFarmReview } = useCreateFarmReviews();
+  const { mutate: updateReview } = useUpdateReviews(initialData?.id || 0);
+
+  useEffect(() => {
+    if (isEditing && initialData) {
+      setRating(initialData.rating);
+      setReviewText(initialData.content);
+    }
+  }, [isEditing, initialData]);
+
   const handleImageChange = (event: React.ChangeEvent<HTMLInputElement>) => {
     const file = event.target.files?.[0];
     if (file) {
@@ -45,12 +72,53 @@ const ReviewModal: React.FC<ReviewModalProps> = ({ isOpen, onClose, productId })
 
   const handleReviewSubmit = () => {
     const reviewData = {
-      productId,
       rating,
-      reviewText,
-      imageUrl,
+      content: reviewText,
     };
-    postMessage(reviewData);
+    if (isEditing && initialData) {
+      updateReview(
+        { ...reviewData, farm_id: initialData.id },
+        {
+          onSuccess: () => {
+            <Alert title="리뷰가 성공적으로 수정되었습니다." />;
+            setTimeout(onClose, 2000);
+          },
+          onError: () => {
+            <Alert title="리뷰 수정 중 오류가 발생했습니다." />;
+          },
+        },
+      );
+    } else {
+      if (productId) {
+        createProductReview(
+          { ...reviewData, product_id: productId },
+          {
+            onSuccess: () => {
+              <Alert title="상품 리뷰가 성공적으로 등록되었습니다." />;
+              setTimeout(onClose, 2000);
+            },
+            onError: () => {
+              <Alert title="상품 리뷰 등록 중 오류가 발생했습니다." />;
+            },
+          },
+        );
+      }
+
+      if (farmId) {
+        createFarmReview(
+          { ...reviewData, farm_id: farmId },
+          {
+            onSuccess: () => {
+              <Alert title="농장 리뷰가 성공적으로 등록되었습니다." />;
+              setTimeout(onClose, 2000);
+            },
+            onError: () => {
+              <Alert title="농장 리뷰 등록 중 오류가 발생했습니다." />;
+            },
+          },
+        );
+      }
+    }
   };
 
   const handleCancel = () => {

From 7362bf662a2b1268d2c3c0c512d38587b9d9011d Mon Sep 17 00:00:00 2001
From: rudtj <kyoungseo03@naver.com>
Date: Tue, 19 Nov 2024 20:23:46 +0900
Subject: [PATCH 15/46] =?UTF-8?q?refactor:=20spelling=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/features/MyPage/Order/ContactModal.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/features/MyPage/Order/ContactModal.tsx b/src/components/features/MyPage/Order/ContactModal.tsx
index 391868c..088fd32 100644
--- a/src/components/features/MyPage/Order/ContactModal.tsx
+++ b/src/components/features/MyPage/Order/ContactModal.tsx
@@ -6,7 +6,7 @@ import CancelOrderModal from "./CancelOrderModal";
 import ContactNumberModal from "./ContactNumberModal";
 
 interface ContactModalProps {
-  status: "CANCANCLE" | "CANREFUND" | "OTHER";
+  status: "CANCANCEL" | "CANREFUND" | "OTHER";
   isOpen: boolean;
   onClose: () => void;
   maxW?: string;
@@ -101,7 +101,7 @@ const ContactModal: React.FC<ContactModalProps> = ({
         {status === "CANREFUND" && (
           <RefundModal isOpen={isRefundModalOpen} onClose={handleCloseRefundModal} productId={productId} />
         )}
-        {status === "CANCANCLE" && (
+        {status === "CANCANCEL" && (
           <CancelOrderModal isOpen={isRefundModalOpen} onClose={handleCloseRefundModal} productId={productId} />
         )}
       </ModalBody>

From b2465c9ab9a9591127bc7c029695b024e6e33340 Mon Sep 17 00:00:00 2001
From: rudtj <kyoungseo03@naver.com>
Date: Tue, 19 Nov 2024 20:24:00 +0900
Subject: [PATCH 16/46] =?UTF-8?q?refactor:=20spelling=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/features/MyPage/OrderItem/ProductOrderItem.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/features/MyPage/OrderItem/ProductOrderItem.tsx b/src/components/features/MyPage/OrderItem/ProductOrderItem.tsx
index d5953c1..5d419d3 100644
--- a/src/components/features/MyPage/OrderItem/ProductOrderItem.tsx
+++ b/src/components/features/MyPage/OrderItem/ProductOrderItem.tsx
@@ -27,7 +27,7 @@ const nonButton = (status: ProductOrderStatus) =>
 const other = (status: ProductOrderStatus) => !canReview(status) && !nonButton(status);
 
 const contactStatus = (status: ProductOrderStatus) => {
-  if (other(status)) return "CANCANCLE";
+  if (other(status)) return "CANCANCEL";
   if (status === "DELIVERED") return "CANREFUND";
   return "OTHER";
 };

From dcbbc2185a63c47deec6aae545c615b5c616555d Mon Sep 17 00:00:00 2001
From: rudtj <kyoungseo03@naver.com>
Date: Tue, 19 Nov 2024 20:24:28 +0900
Subject: [PATCH 17/46] refactor

---
 .../features/FarmDetailPage/Product.tsx       |  18 +--
 .../features/MyPage/Wishlist/ProductWish.tsx  | 114 ++++++++++++++++++
 .../features/SellerPage/AddFarm/index.tsx     |   1 +
 .../features/SellerPage/AddProduct/index.tsx  |  32 ++++-
 4 files changed, 144 insertions(+), 21 deletions(-)
 create mode 100644 src/components/features/MyPage/Wishlist/ProductWish.tsx

diff --git a/src/components/features/FarmDetailPage/Product.tsx b/src/components/features/FarmDetailPage/Product.tsx
index e422c52..d75cef2 100644
--- a/src/components/features/FarmDetailPage/Product.tsx
+++ b/src/components/features/FarmDetailPage/Product.tsx
@@ -1,7 +1,5 @@
 import { useState, useEffect } from "react";
-
-import { HeartOutlined } from "@ant-design/icons";
-import { Box, Button, Text, Flex, Icon, Divider, Select } from "@chakra-ui/react";
+import { Box, Button, Text, Flex, Divider, Select } from "@chakra-ui/react";
 import { useGetFarmDetail } from "@api/farmApi";
 import Image from "@components/common/Image";
 
@@ -53,20 +51,6 @@ const Product = ({ scheduleId }: { scheduleId: number }) => {
               {farmDetail.price}원 / {farmDetail.maxTeam}팀(최대인원: {farmDetail.maxPeople}명)
             </Text>
           </Flex>
-          <Flex
-            align="center"
-            justify="center"
-            w="50px"
-            h="50px"
-            mt={100}
-            ml={10}
-            color="#FFFFFF"
-            borderRadius="12px"
-            cursor="pointer"
-            bgColor="#FC8181"
-          >
-            <Icon as={HeartOutlined} fontSize="30px" />
-          </Flex>
         </Flex>
         <Divider
           w="500px"
diff --git a/src/components/features/MyPage/Wishlist/ProductWish.tsx b/src/components/features/MyPage/Wishlist/ProductWish.tsx
new file mode 100644
index 0000000..b18a65a
--- /dev/null
+++ b/src/components/features/MyPage/Wishlist/ProductWish.tsx
@@ -0,0 +1,114 @@
+import { Flex, Button, Text, Box, Alert, Spinner } from "@chakra-ui/react";
+import { useDeleteWishlists, useGetWishlists } from "@api/wishlistApi";
+import farm1 from "@assets/Image/Farm/Farm1.png";
+import Image from "@components/common/Image";
+
+type Product = {
+  id: number;
+  name: string;
+  tag: string;
+  price: number;
+  deliveryFee: number;
+};
+
+const ProductWish = () => {
+  const { data: wishlists, isLoading, refetch } = useGetWishlists();
+  const { mutate: deleteWishlist } = useDeleteWishlists();
+
+  const handleDelete = (wishlistId: number) => {
+    deleteWishlist(wishlistId, {
+      onSuccess: () => {
+        <Alert title="해당 상품이 위시리스트에서 삭제되었습니다." />;
+        refetch();
+      },
+      onError: () => {
+        <Alert title="삭제에 실패했습니다. 다시 시도해주세요." />;
+      },
+    });
+  };
+
+  if (isLoading) {
+    return <Spinner color="#22543D" size="xl" />;
+  }
+
+  return (
+    <Flex direction="column">
+      {wishlists?.map((product: Product) => (
+        <Flex direction="row" gap="10px">
+          <Image mt={3} w="150px" borderRadius="xl" h="150px" src={farm1} alt="Farm image" />
+          <Flex justify="space-between" flex="1">
+            <Flex justify="center" direction="column">
+              <Flex direction="row">
+                <Text color="#000000" fontSize="20px" fontWeight="bold">
+                  {product.name}
+                </Text>
+                <Box as={Flex} justify="center" w="70px" h="25px" mt={1} ml={5} borderRadius="12px" bgColor="#22543D">
+                  <Text color="#FFFFFF" fontSize="16px" fontWeight="medium">
+                    {product.tag}
+                  </Text>
+                </Box>
+              </Flex>
+
+              <Flex direction="row">
+                <Text color="#000000" fontSize="16px" fontWeight="bold">
+                  가격:
+                </Text>
+                <Text ml={2} color="#22543D" fontSize="16px" fontWeight="bold">
+                  {product.price.toLocaleString()}
+                </Text>
+                <Text color="#000000" fontSize="16px" fontWeight="bold">
+                  원
+                </Text>
+              </Flex>
+
+              <Flex direction="row">
+                <Text color="#000000" fontSize="16px" fontWeight="bold">
+                  배송비:
+                </Text>
+                <Text ml={2} color="#22543D" fontSize="16px" fontWeight="bold">
+                  {product.deliveryFee}
+                </Text>
+                <Text color="#000000" fontSize="16px" fontWeight="bold">
+                  원
+                </Text>
+              </Flex>
+            </Flex>
+            <Flex justify="center" direction="column" gap="10px">
+              <Button
+                w="200px"
+                h="45px"
+                color="#22543D"
+                fontSize="20px"
+                fontWeight="bold"
+                borderWidth="1px"
+                borderColor="#22543D"
+                borderRadius="12px"
+                _hover={{ bgColor: "#FFFFFF" }}
+                bgColor="#FFFFFF"
+                onClick={() => handleDelete(product.id)}
+              >
+                삭제
+              </Button>
+              <Button
+                w="200px"
+                h="45px"
+                color="#FFFFFF"
+                fontSize="20px"
+                fontWeight="bold"
+                borderWidth="1px"
+                borderColor="#22543D"
+                borderRadius="12px"
+                _hover={{ bgColor: "#22543D" }}
+                bgColor="#22543D"
+              >
+                장바구니
+              </Button>
+            </Flex>
+          </Flex>
+        </Flex>
+      ))}
+    </Flex>
+  );
+};
+
+export default ProductWish;
diff --git a/src/components/features/SellerPage/AddFarm/index.tsx b/src/components/features/SellerPage/AddFarm/index.tsx
index b541e1d..e13956b 100644
--- a/src/components/features/SellerPage/AddFarm/index.tsx
+++ b/src/components/features/SellerPage/AddFarm/index.tsx
@@ -111,6 +111,7 @@ const AddFarm = ({ isEdit, originFarm }: AddFarm) => {
     setFormData(prevData => ({
       ...prevData,
       ...data,
+      date: [prevData.startDate, prevData.endDate],
     }));
   };
 
diff --git a/src/components/features/SellerPage/AddProduct/index.tsx b/src/components/features/SellerPage/AddProduct/index.tsx
index 998032e..dca770c 100644
--- a/src/components/features/SellerPage/AddProduct/index.tsx
+++ b/src/components/features/SellerPage/AddProduct/index.tsx
@@ -6,6 +6,7 @@ import { useCreateProducts, useUpdateProducts } from "@api/productApi";
 import BasicInfo from "./BasicInfo";
 import DetailInfo from "./DetailInfo";
 import PriceInfo from "./PriceInfo";
+import { Info } from "./type";
 
 type FormData = {
   categoryId: number;
@@ -18,6 +19,7 @@ type FormData = {
   addressDetail: string;
   shippingFee: string;
   phoneNumber: string;
+  isEdit: boolean;
 };
 
 const defaultFormData = {
@@ -49,7 +51,8 @@ type AddProduct = {
 
 const AddProduct = ({ isEdit, originProduct }: AddProduct) => {
   const [formData, setFormData] = useState<FormData>(originProduct || defaultFormData);
-  const [info, setInfo] = useState(defaultInfo);
+  const [info, setInfo] = useState<Info>(defaultInfo);
+
   const [address, setAddress] = useState<string>("");
   const navigate = useNavigate();
 
@@ -84,7 +87,16 @@ const AddProduct = ({ isEdit, originProduct }: AddProduct) => {
 
   const handleSubmit = async () => {
     if (isEdit) {
-      updateProduct(formData)
+      updateProduct({
+        ...formData,
+        mainTitle: info.title,
+        subTitle1: info.detailTitles[0],
+        subTitle2: info.detailTitles[1],
+        subTitle3: info.detailTitles[2],
+        subDesc1: info.detailDescriptions[0],
+        subDesc2: info.detailDescriptions[1],
+        subDesc3: info.detailDescriptions[2],
+      })
         .then(() => {
           setAlert({ message: `Product updated successfully!`, status: "success" });
         })
@@ -92,7 +104,16 @@ const AddProduct = ({ isEdit, originProduct }: AddProduct) => {
           setAlert({ message: "Error updating product.", status: "error" });
         });
     } else {
-      createProduct(formData)
+      createProduct({
+        ...formData,
+        mainTitle: info.title,
+        subTitle1: info.detailTitles[0],
+        subTitle2: info.detailTitles[1],
+        subTitle3: info.detailTitles[2],
+        subDesc1: info.detailDescriptions[0],
+        subDesc2: info.detailDescriptions[1],
+        subDesc3: info.detailDescriptions[2],
+      })
         .then(() => {
           setAlert({ message: `Product registered successfully!`, status: "success" });
           setFormData(defaultFormData);
@@ -116,9 +137,12 @@ const AddProduct = ({ isEdit, originProduct }: AddProduct) => {
         )}
         <BasicInfo formData={formData} onChange={handleBasicInfoChange} />
         <DetailInfo
+          infoProps={{
+            info,
+            setInfo,
+          }}
           onAddressChange={handleAddressChange}
           address={address}
-          infoProps={{ info, setInfo }}
           formData={formData}
           onChange={handleDetailInfoChange}
         />

From b9c51f53e37947292420f66e3c4adc0fba319a1b Mon Sep 17 00:00:00 2001
From: rudtj <kyoungseo03@naver.com>
Date: Tue, 19 Nov 2024 20:24:40 +0900
Subject: [PATCH 18/46] =?UTF-8?q?refactor:=20type=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/features/SellerPage/AddProduct/type.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/features/SellerPage/AddProduct/type.ts b/src/components/features/SellerPage/AddProduct/type.ts
index b177df3..58972fe 100644
--- a/src/components/features/SellerPage/AddProduct/type.ts
+++ b/src/components/features/SellerPage/AddProduct/type.ts
@@ -1,6 +1,6 @@
 export type Info = {
   title: string;
-  productImageState: string;
+  mainImage: string;
   detailTitles: string[];
   detailDescriptions: string[];
   detailImages: string[];

From 91f8656638dfc4e55ba3fb44a7849da45688c49b Mon Sep 17 00:00:00 2001
From: rudtj <kyoungseo03@naver.com>
Date: Tue, 19 Nov 2024 20:24:55 +0900
Subject: [PATCH 19/46] =?UTF-8?q?refactor:=20minH=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/features/SellerPage/BusinessRegister/index.tsx | 2 +-
 src/components/features/SellerPage/Tax.tsx/index.tsx          | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/features/SellerPage/BusinessRegister/index.tsx b/src/components/features/SellerPage/BusinessRegister/index.tsx
index 214438c..aee2764 100644
--- a/src/components/features/SellerPage/BusinessRegister/index.tsx
+++ b/src/components/features/SellerPage/BusinessRegister/index.tsx
@@ -68,7 +68,7 @@ const BusinessRegister = () => {
   };
 
   return (
-    <Box w="900px" h="100%" mx="auto" border="none" borderRadius="12px" bgColor="#FFFFFF">
+    <Box w="900px" minH="100vh" mx="auto" border="none" borderRadius="12px" bgColor="#FFFFFF">
       <Flex direction="column">
         {alert && (
           <Alert mb={4} status={alert.status}>
diff --git a/src/components/features/SellerPage/Tax.tsx/index.tsx b/src/components/features/SellerPage/Tax.tsx/index.tsx
index 64adfe3..cdcb510 100644
--- a/src/components/features/SellerPage/Tax.tsx/index.tsx
+++ b/src/components/features/SellerPage/Tax.tsx/index.tsx
@@ -24,7 +24,7 @@ const Tax = () => {
   };
 
   return (
-    <Box w="900px" h="770px" mx="auto" border="none" borderRadius="12px" bgColor="#FFFFFF">
+    <Box w="900px" minH="100vh" mx="auto" border="none" borderRadius="12px" bgColor="#FFFFFF">
       <Flex direction="column">
         <Text mt={10} ml={10} color="#22543D" fontSize="20px" fontWeight="bold">
           세금 계산기

From 0527c958e91ae5139ca89ed2ba7614db289207b9 Mon Sep 17 00:00:00 2001
From: rudtj <kyoungseo03@naver.com>
Date: Tue, 19 Nov 2024 20:25:59 +0900
Subject: [PATCH 20/46] =?UTF-8?q?feat:=20mock=20review=20=EC=B6=94?=
 =?UTF-8?q?=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/mocks/mockItem/mockReviews.ts | 52 +++++++++++++++++++++++++++++++
 1 file changed, 52 insertions(+)
 create mode 100644 src/mocks/mockItem/mockReviews.ts

diff --git a/src/mocks/mockItem/mockReviews.ts b/src/mocks/mockItem/mockReviews.ts
new file mode 100644
index 0000000..3b0e4d5
--- /dev/null
+++ b/src/mocks/mockItem/mockReviews.ts
@@ -0,0 +1,52 @@
+const mockReviews = [
+  {
+    id: 1,
+    name: "건호네 미나리",
+    image: "/assets/image/fresh_veggies.png",
+    description: "신선하고 맛있는 미나리! 무농약으로 재배되어 믿고 먹을 수 있어요.",
+    rating: 5,
+    date: "2024-09-14",
+  },
+  {
+    id: 2,
+    name: "토맛 토마토",
+    image: "/assets/image/fresh_veggies.png",
+    description: "달콤하고 신선한 토마토, 정말 맛있어요! 샐러드에 넣어 먹으면 최고입니다.",
+    rating: 4,
+    date: "2024-09-14",
+  },
+  {
+    id: 3,
+    name: "깻잎장수 지민",
+    image: "/assets/image/fresh_veggies.png",
+    description: "향긋한 깻잎, 엄마의 손맛이 느껴져요. 쌈으로 먹으면 더욱 맛있습니다.",
+    rating: 5,
+    date: "2024-09-24",
+  },
+  {
+    id: 4,
+    name: "할로윈 늙은 호박",
+    image: "/assets/image/fresh_veggies.png",
+    description: "늙은 호박으로 만든 전이 너무 맛있어요. 할로윈에 꼭 추천합니다!",
+    rating: 5,
+    date: "2024-09-04",
+  },
+  {
+    id: 5,
+    name: "몸에 좋은척 하는 기이이이이이이이이이이이인 가지",
+    image: "/assets/image/fresh_veggies.png",
+    description: "가지의 다양한 요리를 시도해보세요. 건강에도 좋고 맛도 좋습니다.",
+    rating: 5,
+    date: "2024-09-14",
+  },
+  {
+    id: 6,
+    name: "집에 가고싶을 땐 복숭아를",
+    image: "/assets/image/fresh_veggies.png",
+    description: "달콤한 복숭아 아이스티로 더위를 날려보세요. 기분이 좋아지는 맛입니다.",
+    rating: 4.5,
+    date: "2024-09-21",
+  },
+];
+
+export default mockReviews;

From f4196bcef7a4b655e1c5f7d5c65bb7968f8f340e Mon Sep 17 00:00:00 2001
From: rudtj <kyoungseo03@naver.com>
Date: Tue, 19 Nov 2024 20:26:16 +0900
Subject: [PATCH 21/46] =?UTF-8?q?feat:=20wish=20page=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages/WishPage/index.tsx | 14 ++++++++++++++
 1 file changed, 14 insertions(+)
 create mode 100644 src/pages/WishPage/index.tsx

diff --git a/src/pages/WishPage/index.tsx b/src/pages/WishPage/index.tsx
new file mode 100644
index 0000000..44d4b46
--- /dev/null
+++ b/src/pages/WishPage/index.tsx
@@ -0,0 +1,14 @@
+import { Flex } from "@chakra-ui/react";
+import Card from "@components/common/Card";
+
+import ProductWish from "@components/features/MyPage/Wishlist/ProductWish";
+
+const WishPage = () => (
+  <Flex align="center" justify="center" h="100%">
+    <Card title="위시리스트" w="80%" h="fit-content" p="10">
+      <ProductWish />
+    </Card>
+  </Flex>
+);
+
+export default WishPage;

From b8a0aa2d60dfb03fe41a13671d29602f72c7d12a Mon Sep 17 00:00:00 2001
From: rudtj <kyoungseo03@naver.com>
Date: Tue, 19 Nov 2024 20:26:53 +0900
Subject: [PATCH 22/46] =?UTF-8?q?refactor:=20wishlist=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../features/StoreDetailPage/Product.tsx      | 25 +++++++++++++++++--
 1 file changed, 23 insertions(+), 2 deletions(-)

diff --git a/src/components/features/StoreDetailPage/Product.tsx b/src/components/features/StoreDetailPage/Product.tsx
index 6ff7038..78c6b24 100644
--- a/src/components/features/StoreDetailPage/Product.tsx
+++ b/src/components/features/StoreDetailPage/Product.tsx
@@ -1,8 +1,13 @@
 import { HeartOutlined } from "@ant-design/icons";
-import { Box, Button, Image, Text, Flex, Icon, Divider, HStack, Input, useNumberInput } from "@chakra-ui/react";
+import { Box, Button, Image, Text, Flex, Icon, Divider, Alert, HStack, Input, useNumberInput } from "@chakra-ui/react";
+import { useCreateWishlists } from "@api/wishlistApi";
 import store1 from "@assets/Image/Store/Store1.png";
 
-const Product = () => {
+type ProductProps = {
+  productId: number;
+};
+
+const Product: React.FC<ProductProps> = ({ productId }) => {
   const { getInputProps, getIncrementButtonProps, getDecrementButtonProps } = useNumberInput({
     step: 1,
     defaultValue: 1,
@@ -14,6 +19,21 @@ const Product = () => {
   const dec = getDecrementButtonProps();
   const input = getInputProps();
 
+  const createWishlistMutation = useCreateWishlists();
+
+  const handleAddToWishlist = () => {
+    const wishlistData = { product_id: productId };
+
+    createWishlistMutation.mutate(wishlistData, {
+      onSuccess: () => {
+        <Alert title="위시리스트에 추가되었습니다!" />;
+      },
+      onError: () => {
+        <Alert title="위시리스트 추가 중 문제가 발생했습니다." />;
+      },
+    });
+  };
+
   return (
     <Flex direction="row">
       <Box mt={100} ml={200}>
@@ -56,6 +76,7 @@ const Product = () => {
             borderRadius="12px"
             cursor="pointer"
             bgColor="#FC8181"
+            onClick={handleAddToWishlist}
           >
             <Icon as={HeartOutlined} fontSize="30px" />
           </Flex>

From 7f79161ea8b2437fc1cc473b019c1ae90a574a3f Mon Sep 17 00:00:00 2001
From: rudtj <kyoungseo03@naver.com>
Date: Tue, 19 Nov 2024 20:27:02 +0900
Subject: [PATCH 23/46] =?UTF-8?q?refactor:=20=EA=B2=BD=EB=A1=9C=20?=
 =?UTF-8?q?=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/layouts/Header.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/layouts/Header.tsx b/src/components/layouts/Header.tsx
index d07f259..6f63bc7 100644
--- a/src/components/layouts/Header.tsx
+++ b/src/components/layouts/Header.tsx
@@ -67,7 +67,7 @@ const Header = () => {
         <Flex align="center" gap="5">
           {loginCheck() ? (
             [
-              <Link to="/me/wish">
+              <Link to="/wish">
                 <Icon as={HeartOutlined} color="#1C4532" fontSize="25px" />
               </Link>,
               <Link to="/cart">

From b229f8b2110fb13c3247348b5b31aeb861c5367c Mon Sep 17 00:00:00 2001
From: rudtj <kyoungseo03@naver.com>
Date: Tue, 19 Nov 2024 20:27:19 +0900
Subject: [PATCH 24/46] =?UTF-8?q?feat:=20wishlist=20page=20=EC=B6=94?=
 =?UTF-8?q?=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages/MyPage/ProductWishlistPage.tsx | 11 +++++++++++
 1 file changed, 11 insertions(+)
 create mode 100644 src/pages/MyPage/ProductWishlistPage.tsx

diff --git a/src/pages/MyPage/ProductWishlistPage.tsx b/src/pages/MyPage/ProductWishlistPage.tsx
new file mode 100644
index 0000000..3cc4d91
--- /dev/null
+++ b/src/pages/MyPage/ProductWishlistPage.tsx
@@ -0,0 +1,11 @@
+import Card from "@components/common/Card";
+
+import ProductWish from "@components/features/MyPage/Wishlist/ProductWish";
+
+const ProductWishlistPage = () => (
+  <Card title="위시리스트-농산물" w="100%" h="fit-content" p="10">
+    <ProductWish />
+  </Card>
+);
+
+export default ProductWishlistPage;

From d776878cb514551db9b3a9cb2ea77e77973e33e6 Mon Sep 17 00:00:00 2001
From: rudtj <kyoungseo03@naver.com>
Date: Tue, 19 Nov 2024 20:28:05 +0900
Subject: [PATCH 25/46] refactor

---
 src/pages/MyPage/ReviewListPage.tsx | 25 ++++++++++++++++++++++++-
 src/pages/StoreDetailPage/index.tsx |  2 +-
 src/types/index.ts                  |  8 ++++++++
 3 files changed, 33 insertions(+), 2 deletions(-)

diff --git a/src/pages/MyPage/ReviewListPage.tsx b/src/pages/MyPage/ReviewListPage.tsx
index 25aa435..70e71fa 100644
--- a/src/pages/MyPage/ReviewListPage.tsx
+++ b/src/pages/MyPage/ReviewListPage.tsx
@@ -1,10 +1,33 @@
+import { Flex, Text } from "@chakra-ui/react";
+import ListView from "@components/ItemView/ListView";
 import Card from "@components/common/Card";
 
 import ReviewList from "@components/features/MyPage/Order/ReviewList";
+import mockReviews from "@mocks/mockItem/mockReviews";
+import { Review } from "@type/index";
+
+const sortedReviews = mockReviews.sort((a, b) => new Date(b.date).getTime() - new Date(a.date).getTime());
+
+const groupedReviews = sortedReviews.reduce<Review[][]>((acc, cur) => {
+  const last = acc[acc.length - 1];
+  if (!last || last[0].date !== cur.date) {
+    acc.push([cur]);
+  } else {
+    last.push(cur);
+  }
+  return acc;
+}, []);
 
 const ReviewListPage = () => (
   <Card title="리뷰 관리" w="100%" h="fit-content" p="10">
-    <ReviewList />
+    {groupedReviews.map(reviews => (
+      <Flex key={reviews[0].date} direction="column" mb={4}>
+        <Text py="2" fontWeight="bold" borderBottom="0.7px solid #000000">
+          {reviews[0].date}
+        </Text>
+        <ListView items={reviews} ItemComponent={ReviewList} />
+      </Flex>
+    ))}
   </Card>
 );
 
diff --git a/src/pages/StoreDetailPage/index.tsx b/src/pages/StoreDetailPage/index.tsx
index b55bc9c..e29788f 100644
--- a/src/pages/StoreDetailPage/index.tsx
+++ b/src/pages/StoreDetailPage/index.tsx
@@ -5,7 +5,7 @@ import ReviewList from "@components/features/StoreDetailPage/ReviewList";
 
 const StoreDetailPage = () => (
   <>
-    <Product />
+    <Product productId={1} />
     <Tabs mt={100} ml={200}>
       <TabList w="1100px">
         <Tab _selected={{ color: "#1C4532", fontSize: "24px", fontWeight: "bold", bg: "none" }}>상품 설명</Tab>
diff --git a/src/types/index.ts b/src/types/index.ts
index 4ee6565..d810f3d 100644
--- a/src/types/index.ts
+++ b/src/types/index.ts
@@ -20,6 +20,14 @@ export type Product = Item & {
   farm: Farm;
 };
 
+export type Review = Item & {
+  name: string;
+  description: string;
+  rating: number;
+  image?: string;
+  date: string;
+};
+
 export type Schedule = Item & {
   name: string;
   farm: Farm;

From 8ec5c6083be603ca32ec1ae878fdbb8600bbcd35 Mon Sep 17 00:00:00 2001
From: rudtj <kyoungseo03@naver.com>
Date: Tue, 19 Nov 2024 20:33:53 +0900
Subject: [PATCH 26/46] refactor

---
 src/components/features/MyPage/Category.tsx | 2 +-
 src/pages/MyPage/ProductWishlistPage.tsx    | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/features/MyPage/Category.tsx b/src/components/features/MyPage/Category.tsx
index e34c8bf..ed49546 100644
--- a/src/components/features/MyPage/Category.tsx
+++ b/src/components/features/MyPage/Category.tsx
@@ -13,7 +13,7 @@ const Category = () => (
       </Flex>
       <ChakraLink
         as={Link}
-        w="50px"
+        w="100px"
         h="20px"
         mt={3}
         ml={5}
diff --git a/src/pages/MyPage/ProductWishlistPage.tsx b/src/pages/MyPage/ProductWishlistPage.tsx
index 3cc4d91..d5d591a 100644
--- a/src/pages/MyPage/ProductWishlistPage.tsx
+++ b/src/pages/MyPage/ProductWishlistPage.tsx
@@ -3,7 +3,7 @@ import Card from "@components/common/Card";
 import ProductWish from "@components/features/MyPage/Wishlist/ProductWish";
 
 const ProductWishlistPage = () => (
-  <Card title="위시리스트-농산물" w="100%" h="fit-content" p="10">
+  <Card title="위시리스트" w="100%" h="fit-content" p="10">
     <ProductWish />
   </Card>
 );

From 9bbc5d72b696d1d991ffbad601871476df43b550 Mon Sep 17 00:00:00 2001
From: gimdogyun <jasper12394@gmail.com>
Date: Tue, 19 Nov 2024 21:32:10 +0900
Subject: [PATCH 27/46] feat: scroll saver

- #145
---
 src/components/layouts/MainLayout.tsx  |  2 ++
 src/components/layouts/ScrollSaver.tsx | 19 +++++++++++++++++++
 src/hooks/useScrollSaver.ts            | 26 ++++++++++++++++++++++++++
 src/routes/AppRouter.tsx               | 25 +++++++++++++++++++------
 4 files changed, 66 insertions(+), 6 deletions(-)
 create mode 100644 src/components/layouts/ScrollSaver.tsx
 create mode 100644 src/hooks/useScrollSaver.ts

diff --git a/src/components/layouts/MainLayout.tsx b/src/components/layouts/MainLayout.tsx
index 836eb33..6f9a671 100644
--- a/src/components/layouts/MainLayout.tsx
+++ b/src/components/layouts/MainLayout.tsx
@@ -2,10 +2,12 @@ import { Outlet } from "react-router-dom";
 import { Box } from "@chakra-ui/react";
 import Footer from "@components/layouts/Footer";
 import Header from "@components/layouts/Header";
+import ScrollSaver from "@components/layouts/ScrollSaver";
 import size from "@constants/size";
 
 const MainLayout = () => (
   <div className="main-layout">
+    <ScrollSaver />
     <Header />
     <Box w="100vw" minH={`calc(100vh - ${size.header.h})`}>
       <Outlet />
diff --git a/src/components/layouts/ScrollSaver.tsx b/src/components/layouts/ScrollSaver.tsx
new file mode 100644
index 0000000..b81c45d
--- /dev/null
+++ b/src/components/layouts/ScrollSaver.tsx
@@ -0,0 +1,19 @@
+import { useEffect, useState } from "react";
+import { useLocation } from "react-router-dom";
+import useScrollSaver from "@hooks/useScrollSaver";
+
+const ScrollSaver = () => {
+  const location = useLocation();
+  const [prevLocation, setPrevLocation] = useState(location.pathname);
+  const { getScroll, setScroll } = useScrollSaver();
+
+  useEffect(() => {
+    setScroll(prevLocation, window.scrollY);
+    setPrevLocation(location.pathname);
+    window.scrollTo(0, getScroll(location.pathname));
+  }, [location]);
+
+  return null;
+};
+
+export default ScrollSaver;
diff --git a/src/hooks/useScrollSaver.ts b/src/hooks/useScrollSaver.ts
new file mode 100644
index 0000000..0e260e8
--- /dev/null
+++ b/src/hooks/useScrollSaver.ts
@@ -0,0 +1,26 @@
+const useScrollSaver = () => {
+  const initScroll = () => {
+    const originScrolls = sessionStorage.getItem("poomasi-scroll-index");
+    if (!originScrolls) {
+      sessionStorage.setItem("poomasi-scroll-index", JSON.stringify({}));
+    }
+  };
+
+  const setScroll = (location: string, scroll: number) => {
+    initScroll();
+    const scrolls = sessionStorage.getItem("poomasi-scroll-index");
+    const scrollsObj = JSON.parse(scrolls || "{}");
+    scrollsObj[location] = scroll;
+    sessionStorage.setItem("poomasi-scroll-index", JSON.stringify(scrollsObj));
+  };
+
+  const getScroll = (location: string) => {
+    const scrolls = sessionStorage.getItem("poomasi-scroll-index");
+    const scroll = JSON.parse(scrolls || "{}")[location];
+    return scroll || 0;
+  };
+
+  return { initScroll, setScroll, getScroll };
+};
+
+export default useScrollSaver;
diff --git a/src/routes/AppRouter.tsx b/src/routes/AppRouter.tsx
index cd9a0e8..3963050 100644
--- a/src/routes/AppRouter.tsx
+++ b/src/routes/AppRouter.tsx
@@ -1,7 +1,9 @@
+import { useEffect } from "react";
 import { createBrowserRouter, RouterProvider } from "react-router-dom";
 import MainLayout from "@components/layouts/MainLayout";
 import MyPageLayout from "@components/layouts/MyPageLayout";
 import SellerLayout from "@components/layouts/SellerLayout";
+import useScrollSaver from "@hooks/useScrollSaver";
 import BuyerMyPage from "@pages/BuyerMyPage";
 import CallbackPage from "@pages/CallbackPage";
 import EmailLoginPage from "@pages/EmailLoginPage";
@@ -19,6 +21,7 @@ import MyOrdersPage from "@pages/MyPage/OrdersPage";
 import ReviewListPage from "@pages/MyPage/ReviewListPage";
 import WithdrawPage from "@pages/MyPage/WithdrawPage";
 import ProductCartPage from "@pages/ProductCartPage";
+import ProductDetailPage from "@pages/ProductDetailPage";
 import RegisterPage from "@pages/RegisterPage";
 import SchedulePage from "@pages/SchedulePage";
 import SellerMyPage from "@pages/SellerMyPage";
@@ -34,10 +37,15 @@ import SellerProductListPage from "@pages/SellerPage/SellerProductList";
 import SellerWithdraw from "@pages/SellerPage/SellerWithdraw";
 import SoldOuts from "@pages/SellerPage/SoldOuts";
 import TaxCalculator from "@pages/SellerPage/TaxCalculator";
-import StoreDetailPage from "@pages/StoreDetailPage";
 import StorePage from "@pages/StorePage";
 
 const AppRouter = () => {
+  const { initScroll } = useScrollSaver();
+
+  useEffect(() => {
+    initScroll();
+  }, []);
+
   const routers = createBrowserRouter([
     {
       path: "/",
@@ -59,10 +67,6 @@ const AppRouter = () => {
           path: "SellerMyPage",
           element: <SellerMyPage />,
         },
-        {
-          path: "StoreDetail",
-          element: <StoreDetailPage />,
-        },
         {
           path: "schedule/:scheduleId",
           element: <FarmDetailPage />,
@@ -178,7 +182,16 @@ const AppRouter = () => {
         },
         {
           path: "store",
-          element: <StorePage />,
+          children: [
+            {
+              index: true,
+              element: <StorePage />,
+            },
+            {
+              path: ":productId",
+              element: <ProductDetailPage />,
+            },
+          ],
         },
         {
           path: "callback/:provider",

From 1dccc32f5d3d288fac3ec2656b3f278a1589324e Mon Sep 17 00:00:00 2001
From: gimdogyun <jasper12394@gmail.com>
Date: Tue, 19 Nov 2024 21:34:29 +0900
Subject: [PATCH 28/46] feat: refreshLogin

- #145
---
 src/hooks/useLogin.ts | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/hooks/useLogin.ts b/src/hooks/useLogin.ts
index a8bb89b..4a8efaa 100644
--- a/src/hooks/useLogin.ts
+++ b/src/hooks/useLogin.ts
@@ -5,7 +5,7 @@ import { userAtomWithPersistence } from "@atom/userAtom";
 const useLogin = () => {
   const [user, setUser] = useAtom(userAtomWithPersistence);
 
-  const login = (accessToken: string) => {
+  const login = async (accessToken: string) =>
     defaultApi
       .get("/api/members/self", {
         headers: {
@@ -20,7 +20,8 @@ const useLogin = () => {
           role: data.role,
         });
       });
-  };
+
+  const refreshLogin = async () => login(user?.token || "");
 
   const logout = () => {
     setUser(null);
@@ -30,7 +31,7 @@ const useLogin = () => {
 
   const sellerCheck = () => user?.role === "ROLE_FARMER";
 
-  return { user, login, logout, loginCheck, sellerCheck };
+  return { user, login, logout, refreshLogin, loginCheck, sellerCheck };
 };
 
 export default useLogin;

From bb8527ddbf9642132be4c3c77c33995d8ceb3a22 Mon Sep 17 00:00:00 2001
From: gimdogyun <jasper12394@gmail.com>
Date: Tue, 19 Nov 2024 21:36:15 +0900
Subject: [PATCH 29/46] design: Product

- #145
---
 .../features/StorePage/ProductList/ProductFilter/index.tsx      | 2 +-
 src/components/features/StorePage/ProductList/index.tsx         | 2 +-
 src/pages/Home/index.tsx                                        | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/features/StorePage/ProductList/ProductFilter/index.tsx b/src/components/features/StorePage/ProductList/ProductFilter/index.tsx
index 74d4266..66c6bb3 100644
--- a/src/components/features/StorePage/ProductList/ProductFilter/index.tsx
+++ b/src/components/features/StorePage/ProductList/ProductFilter/index.tsx
@@ -10,7 +10,7 @@ type ProductFilterProps = {
 };
 
 const ProductFilter = ({ items = [], filterState = useFilters() }: ProductFilterProps) => (
-  <Flex direction="column" w="250px" h="100%">
+  <Flex direction="column" w="250px" h="100%" pt="10">
     <Text w="full" py="5" fontSize="xl" fontWeight="bold">
       필터
     </Text>
diff --git a/src/components/features/StorePage/ProductList/index.tsx b/src/components/features/StorePage/ProductList/index.tsx
index bada6b4..abb04fc 100644
--- a/src/components/features/StorePage/ProductList/index.tsx
+++ b/src/components/features/StorePage/ProductList/index.tsx
@@ -12,7 +12,7 @@ const ProductList = () => {
     <Flex gap="5" w="100%" h="100vh">
       <ProductFilter filterState={productFilterState} items={mockCategory.map(encodeCategory)} />
       <Flex overflow="scroll" w="100%" h="100%">
-        <ProductsView filters={productFilterState.filters} columns={3} gap="25px" />
+        <ProductsView filters={productFilterState.filters} py="10" columns={3} gap="25px" />
       </Flex>
     </Flex>
   );
diff --git a/src/pages/Home/index.tsx b/src/pages/Home/index.tsx
index 1be401c..8206528 100644
--- a/src/pages/Home/index.tsx
+++ b/src/pages/Home/index.tsx
@@ -24,7 +24,7 @@ const Home = () => {
           <Review />
         </Flex>
         <BestScheduleSection />
-        <GridView items={products || []} ItemComponent={ProductCard} columns={3} gap="25px" />
+        <GridView items={products || []} ItemComponent={ProductCard} py="10" columns={3} gap="25px" />
       </Flex>
     </Flex>
   );

From b7673fe45127e6614263248733891b5e755e7665 Mon Sep 17 00:00:00 2001
From: gimdogyun <jasper12394@gmail.com>
Date: Tue, 19 Nov 2024 21:36:35 +0900
Subject: [PATCH 30/46] fix: kakaologin url

-- #145
---
 src/components/common/KaKaoLoginButton.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/common/KaKaoLoginButton.tsx b/src/components/common/KaKaoLoginButton.tsx
index 38a3ede..0034fbe 100644
--- a/src/components/common/KaKaoLoginButton.tsx
+++ b/src/components/common/KaKaoLoginButton.tsx
@@ -4,7 +4,7 @@ import Image from "@components/common/Image";
 type KaKaoLoginButtonProps = ImageProps;
 
 const KaKaoLoginButton = ({ ...props }: KaKaoLoginButtonProps) => {
-  const link = "http://172.22.42.12:8080/oauth2/authentication/kakao";
+  const link = `${process.env.REACT_APP_API_URL}/oauth2/authentication/kakao`;
 
   return (
     <Link href={link} isExternal>

From 5e6b5876a90e2fb8b19aae2dbbf51379c43fd287 Mon Sep 17 00:00:00 2001
From: gimdogyun <jasper12394@gmail.com>
Date: Tue, 19 Nov 2024 21:37:28 +0900
Subject: [PATCH 31/46] fix: redirect after login

- #145
---
 src/pages/CallbackPage/index.tsx | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/src/pages/CallbackPage/index.tsx b/src/pages/CallbackPage/index.tsx
index 99774a4..fe3443f 100644
--- a/src/pages/CallbackPage/index.tsx
+++ b/src/pages/CallbackPage/index.tsx
@@ -1,14 +1,17 @@
-import { useSearchParams } from "react-router-dom";
+import { useNavigate, useSearchParams } from "react-router-dom";
 import useLogin from "@hooks/useLogin";
 
 const CallbackPage = () => {
   const [searchParams] = useSearchParams();
+  const navigate = useNavigate();
   const { login } = useLogin();
 
   const accessToken = searchParams.get("access");
 
   if (accessToken) {
-    login(accessToken);
+    login(accessToken).then(() => {
+      navigate("/");
+    });
   }
 
   return null;

From 9f672f3ff0b00a64e8a0ae5974f007cec0bb9f8d Mon Sep 17 00:00:00 2001
From: gimdogyun <jasper12394@gmail.com>
Date: Tue, 19 Nov 2024 21:37:45 +0900
Subject: [PATCH 32/46] fix: header

- #145
---
 src/components/layouts/Header.tsx | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/components/layouts/Header.tsx b/src/components/layouts/Header.tsx
index d07f259..d4d73e0 100644
--- a/src/components/layouts/Header.tsx
+++ b/src/components/layouts/Header.tsx
@@ -51,6 +51,7 @@ const Header = () => {
           )}
           {menuLinks.map(menuLink => (
             <Text
+              key={menuLink.link}
               as={Link}
               mx="5"
               color={menuLink.link === location.pathname ? "#1C4532" : "#999999"}
@@ -70,7 +71,7 @@ const Header = () => {
               <Link to="/me/wish">
                 <Icon as={HeartOutlined} color="#1C4532" fontSize="25px" />
               </Link>,
-              <Link to="/cart">
+              <Link to="/cart/product">
                 <Icon as={ShoppingCartOutlined} color="#1C4532" fontSize="25px" />
               </Link>,
               <Flex as={Link} gap="1" to="/me">

From b9b73750055e8abffbd2f0d23dea153b569c7430 Mon Sep 17 00:00:00 2001
From: gimdogyun <jasper12394@gmail.com>
Date: Tue, 19 Nov 2024 21:38:30 +0900
Subject: [PATCH 33/46] fix: file name

- #145
---
 src/pages/{StoreDetailPage => ProductDetailPage}/index.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)
 rename src/pages/{StoreDetailPage => ProductDetailPage}/index.tsx (92%)

diff --git a/src/pages/StoreDetailPage/index.tsx b/src/pages/ProductDetailPage/index.tsx
similarity index 92%
rename from src/pages/StoreDetailPage/index.tsx
rename to src/pages/ProductDetailPage/index.tsx
index b55bc9c..6b01edb 100644
--- a/src/pages/StoreDetailPage/index.tsx
+++ b/src/pages/ProductDetailPage/index.tsx
@@ -3,7 +3,7 @@ import Product from "@components/features/StoreDetailPage/Product";
 import ProductDescription from "@components/features/StoreDetailPage/ProductDescription";
 import ReviewList from "@components/features/StoreDetailPage/ReviewList";
 
-const StoreDetailPage = () => (
+const ProductDetailPage = () => (
   <>
     <Product />
     <Tabs mt={100} ml={200}>
@@ -24,4 +24,4 @@ const StoreDetailPage = () => (
   </>
 );
 
-export default StoreDetailPage;
+export default ProductDetailPage;

From 19988bd2cdda4b12c7ccef9cbaaa872c21b6ebe2 Mon Sep 17 00:00:00 2001
From: gimdogyun <jasper12394@gmail.com>
Date: Tue, 19 Nov 2024 21:38:58 +0900
Subject: [PATCH 34/46] feat: product detail

- #145
---
 .../features/StorePage/ProductCard.tsx        | 47 ++++++++++---------
 1 file changed, 25 insertions(+), 22 deletions(-)

diff --git a/src/components/features/StorePage/ProductCard.tsx b/src/components/features/StorePage/ProductCard.tsx
index 3da6eda..1f15241 100644
--- a/src/components/features/StorePage/ProductCard.tsx
+++ b/src/components/features/StorePage/ProductCard.tsx
@@ -1,3 +1,4 @@
+import { Link } from "react-router-dom";
 import { Flex, Text } from "@chakra-ui/react";
 import Avatar from "@components/common/Avatar";
 import Card, { CardProps } from "@components/common/Card";
@@ -9,29 +10,31 @@ export type ProductCardProps = {
 } & CardProps;
 
 const ProductCard = ({ item, ...props }: ProductCardProps) => (
-  <Card {...props}>
-    <Image w="full" borderRadius="2xl" alt={item.name} aspectRatio="1" src={item.mainImage} />
-    <Flex py="3">
-      <Text maxW="70%" fontSize="lg" fontWeight="bold" isTruncated>
-        {item.name}
-      </Text>
-      {item?.tag && (
-        <Text ml="auto" px="3" color="white" bg="#22543D" borderRadius="lg">
-          {item.tag}
+  <Link to={`/store/${item.id}`}>
+    <Card {...props} _hover={{ transform: "translateY(-10px)" }}>
+      <Image w="full" borderRadius="2xl" alt={item.name} aspectRatio="1" src={item.mainImage} />
+      <Flex py="3">
+        <Text maxW="70%" fontSize="lg" fontWeight="bold" isTruncated>
+          {item.name}
         </Text>
-      )}
-    </Flex>
-    <Text>{item.unit}</Text>
-    <Text my="3">{item.pricePerGram}</Text>
-    <Text overflow="hidden" color="#999" noOfLines={3}>
-      {item.description}
-    </Text>
-    <Text color="#999">{item.farm.address}</Text>
-    <Flex align="center" py="3">
-      <Avatar src={item.farm.profile} />
-      <Text ml="1">{item.farm.name}</Text>
-    </Flex>
-  </Card>
+        {item?.tag && (
+          <Text ml="auto" px="3" color="white" bg="#22543D" borderRadius="lg">
+            {item.tag}
+          </Text>
+        )}
+      </Flex>
+      <Text>{item.unit}</Text>
+      <Text my="3">{item.pricePerGram}</Text>
+      <Text overflow="hidden" color="#999" noOfLines={3}>
+        {item.description}
+      </Text>
+      <Text color="#999">{item.farm.address}</Text>
+      <Flex align="center" py="3">
+        <Avatar src={item.farm.profile} />
+        <Text ml="1">{item.farm.name}</Text>
+      </Flex>
+    </Card>
+  </Link>
 );
 
 export default ProductCard;

From c689457b203ea3bf0ca177173ceab6553999a559 Mon Sep 17 00:00:00 2001
From: rudtj <kyoungseo03@naver.com>
Date: Tue, 19 Nov 2024 21:46:53 +0900
Subject: [PATCH 35/46] =?UTF-8?q?refactor:=20=EA=B8=80=EC=9E=90=20?=
 =?UTF-8?q?=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/features/StorePage/StoreBanner.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/features/StorePage/StoreBanner.tsx b/src/components/features/StorePage/StoreBanner.tsx
index 22c9f44..d0a64df 100644
--- a/src/components/features/StorePage/StoreBanner.tsx
+++ b/src/components/features/StorePage/StoreBanner.tsx
@@ -8,7 +8,7 @@ const StoreBanner = () => (
       <Image h="full" src="/assets/image/vegetables.png" />
       <Flex align="center" justify="center" direction="column" w="470px" h="full" color="white">
         <Text fontSize="xl" fontWeight="bold">
-          믿고 먹는 건간한 먹거리,{" "}
+          믿고 먹는 건강한 먹거리,{" "}
           <Text as="span" color="#48BB78">
             품앗이
           </Text>{" "}

From 71f34525c224a3d527f135d4033771c50d5249ba Mon Sep 17 00:00:00 2001
From: rudtj <kyoungseo03@naver.com>
Date: Tue, 19 Nov 2024 21:51:17 +0900
Subject: [PATCH 36/46] =?UTF-8?q?refactor:=20api=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/emailApi.ts | 38 +++++++++++++++++++++++++++++++++++---
 1 file changed, 35 insertions(+), 3 deletions(-)

diff --git a/src/api/emailApi.ts b/src/api/emailApi.ts
index b633852..71ba09f 100644
--- a/src/api/emailApi.ts
+++ b/src/api/emailApi.ts
@@ -13,11 +13,21 @@ type LoginData = {
   password: string;
 };
 
-type FarmerData = {
+type FarmerRegisterData = {
   name: string;
   address: string;
   phone: string;
 };
+
+type FarmerData = {
+  name: string;
+  email: string;
+  password: string;
+  phoneNumber: string;
+  storeName: string;
+  storeAddress: string;
+};
+
 type AddressData = {
   defaultAddress: string;
   addressDetail: string;
@@ -39,7 +49,7 @@ const useLoginEmail = () => {
 };
 
 const useCreateFarmer = () => {
-  const fetcher = (farmerData: FarmerData) =>
+  const fetcher = (farmerData: FarmerRegisterData) =>
     needAuthDefaultApi.put(`/api/members/to-farmer`, farmerData).then(({ data }) => data);
   return useMutation({ mutationFn: fetcher });
 };
@@ -58,6 +68,20 @@ const useUpdateEmail = () => {
   });
 };
 
+const useUpdateFarmer = () => {
+  const queryClient = useQueryClient();
+  const fetcher = (updateData: FarmerData) =>
+    needAuthDefaultApi.put(`/api/members/update/farmer`, updateData).then(({ data }) => data);
+
+  return useMutation({
+    mutationFn: fetcher,
+    onSuccess: () =>
+      queryClient.invalidateQueries({
+        queryKey: ["farmer"],
+      }),
+  });
+};
+
 const useUpdateAddress = () => {
   const queryClient = useQueryClient();
   const fetcher = (updateData: AddressData) =>
@@ -82,4 +106,12 @@ const useDeleteAccount = () => {
   });
 };
 
-export { useCreateEmail, useLoginEmail, useUpdateEmail, useUpdateAddress, useCreateFarmer, useDeleteAccount };
+export {
+  useCreateEmail,
+  useLoginEmail,
+  useUpdateEmail,
+  useUpdateAddress,
+  useCreateFarmer,
+  useUpdateFarmer,
+  useDeleteAccount,
+};

From ba3f938fdbc024ad636f15ca17872b75e9959594 Mon Sep 17 00:00:00 2001
From: rudtj <kyoungseo03@naver.com>
Date: Tue, 19 Nov 2024 21:52:14 +0900
Subject: [PATCH 37/46] =?UTF-8?q?refactor:=20api=20=EA=B2=BD=EB=A1=9C=20?=
 =?UTF-8?q?=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/productApi.ts | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/api/productApi.ts b/src/api/productApi.ts
index 49b315a..3e91d80 100644
--- a/src/api/productApi.ts
+++ b/src/api/productApi.ts
@@ -20,7 +20,7 @@ type ProductData = {
 };
 
 const useGetProducts = () => {
-  const fetcher = () => defaultApi.get(`/products`).then(({ data }) => data);
+  const fetcher = () => defaultApi.get(`/api/products`).then(({ data }) => data);
 
   return useQuery({
     queryKey: ["products"],
@@ -29,7 +29,7 @@ const useGetProducts = () => {
 };
 
 const useGetProductDetail = (productId: number) => {
-  const fetcher = () => defaultApi.get(`/products/${productId}`).then(({ data }) => data);
+  const fetcher = () => defaultApi.get(`/api/products/${productId}`).then(({ data }) => data);
   return useQuery({
     queryKey: ["products", productId],
     queryFn: fetcher,
@@ -38,7 +38,7 @@ const useGetProductDetail = (productId: number) => {
 };
 
 const useCreateProducts = () => {
-  const fetcher = (productData: ProductData) => defaultApi.post(`/products`, productData).then(({ data }) => data);
+  const fetcher = (productData: ProductData) => defaultApi.post(`/api/products`, productData).then(({ data }) => data);
 
   return useMutation({ mutationFn: fetcher });
 };
@@ -47,7 +47,7 @@ const useUpdateProducts = (productId: number) => {
   const queryClient = useQueryClient();
 
   const fetcher = (productData: ProductData) =>
-    defaultApi.put(`/products/${productId}`, productData).then(({ data }) => data);
+    defaultApi.put(`/api/products/${productId}`, productData).then(({ data }) => data);
 
   return useMutation({
     mutationFn: fetcher,

From 63d21667891b91a428ef610cca1a78bb309df6a1 Mon Sep 17 00:00:00 2001
From: gimdogyun <jasper12394@gmail.com>
Date: Tue, 19 Nov 2024 21:55:26 +0900
Subject: [PATCH 38/46] feat: schedule link

- #145
---
 .../features/SchedulePage/ScheduleCard.tsx    | 43 +++++++++++--------
 src/routes/AppRouter.tsx                      | 15 ++++---
 2 files changed, 35 insertions(+), 23 deletions(-)

diff --git a/src/components/features/SchedulePage/ScheduleCard.tsx b/src/components/features/SchedulePage/ScheduleCard.tsx
index 2f2087f..be926cb 100644
--- a/src/components/features/SchedulePage/ScheduleCard.tsx
+++ b/src/components/features/SchedulePage/ScheduleCard.tsx
@@ -1,4 +1,5 @@
-import { Flex, Text } from "@chakra-ui/react";
+import { Link } from "react-router-dom";
+import { Box, Flex, Text } from "@chakra-ui/react";
 import ImageCard, { ImageCardProps } from "@components/common/ImageCard";
 import { Schedule } from "@type/index";
 
@@ -7,23 +8,29 @@ type ScheduleCardProps = ImageCardProps & {
 };
 
 const ScheduleCard = ({ item, ...props }: ScheduleCardProps) => (
-  <ImageCard
-    {...props}
-    imageProps={{
-      filter: "auto",
-      brightness: item?.mainImage ? 1 : 0.6,
-    }}
-    bgImg={item.mainImage}
-  >
-    <Flex align="center" direction="column" w="full" mt="auto" mb="10">
-      <Text px="5" color="green" bg="white" borderRadius="xl">
-        {item.farm.address}
-      </Text>
-      <Text color="white" fontSize="2xl" fontWeight="bold">
-        {item.name}
-      </Text>
-    </Flex>
-  </ImageCard>
+  <Box as={Link} to={`/schedule/${item.id}`}>
+    <ImageCard
+      h="full"
+      {...props}
+      imageProps={{
+        filter: "auto",
+        brightness: item?.mainImage ? 1 : 0.6,
+      }}
+      bgImg={item.mainImage}
+      _hover={{
+        transform: "scale(1.05)",
+      }}
+    >
+      <Flex align="center" direction="column" w="full" mt="auto" mb="10">
+        <Text px="5" color="green" bg="white" borderRadius="xl">
+          {item.farm.address}
+        </Text>
+        <Text color="white" fontSize="2xl" fontWeight="bold">
+          {item.name}
+        </Text>
+      </Flex>
+    </ImageCard>
+  </Box>
 );
 
 export default ScheduleCard;
diff --git a/src/routes/AppRouter.tsx b/src/routes/AppRouter.tsx
index 3963050..a0950a0 100644
--- a/src/routes/AppRouter.tsx
+++ b/src/routes/AppRouter.tsx
@@ -67,10 +67,6 @@ const AppRouter = () => {
           path: "SellerMyPage",
           element: <SellerMyPage />,
         },
-        {
-          path: "schedule/:scheduleId",
-          element: <FarmDetailPage />,
-        },
         {
           path: "seller",
           element: <SellerLayout />,
@@ -199,7 +195,16 @@ const AppRouter = () => {
         },
         {
           path: "schedule",
-          element: <SchedulePage />,
+          children: [
+            {
+              index: true,
+              element: <SchedulePage />,
+            },
+            {
+              path: ":scheduleId",
+              element: <FarmDetailPage />,
+            },
+          ],
         },
         {
           path: "cart/product",

From e198d47b22766d9d9d167ded4c75bf0f345e8514 Mon Sep 17 00:00:00 2001
From: gimdogyun <jasper12394@gmail.com>
Date: Tue, 19 Nov 2024 22:50:19 +0900
Subject: [PATCH 39/46] refactor: intro

- #146
---
 .../features/IntroductionPage/Introduction.tsx        | 11 ++++++-----
 1 file changed, 6 insertions(+), 5 deletions(-)

diff --git a/src/components/features/IntroductionPage/Introduction.tsx b/src/components/features/IntroductionPage/Introduction.tsx
index eb49bb7..5a5f858 100644
--- a/src/components/features/IntroductionPage/Introduction.tsx
+++ b/src/components/features/IntroductionPage/Introduction.tsx
@@ -8,17 +8,18 @@ import Intro7 from "@assets/Image/Intro/Intro7.png";
 import Intro8 from "@assets/Image/Intro/Intro8.png";
 import Image from "@components/common/Image";
 import ImageCard from "@components/common/ImageCard";
+import size from "@constants/size";
 
 const Introduction = () => (
-  <Box overflowY="auto" w="100vw" h="100vh">
+  <Flex align="center" direction="column" w="full" h="full" minH={`calc(100vh - ${size.footer.h} - ${size.header.h})`}>
     <Flex direction="column" w="full" h="fit-content">
-      <ImageCard bgImg={Intro1}>
+      <ImageCard borderRadius="none" bgImg={Intro1}>
         <Text m="auto" color="#FFFFFF" fontSize="32px" fontWeight="bold" textAlign="center">
           우리가 꿈꾸는 내일, 농민과 고객이 함께 만드는 새로운 유통
         </Text>
       </ImageCard>
     </Flex>
-    <Flex direction="column" w="full" h="100vh" mt="20">
+    <Flex direction="column" w="full" mt="20">
       <Text mb={1} color="#000000" fontSize="20px" fontWeight="bold" textAlign="center">
         품앗이 이야기
       </Text>
@@ -87,7 +88,7 @@ const Introduction = () => (
       <Image w="500px" h="800px" alt="Intro6" src={Intro6} />
     </Flex>
 
-    <Flex align="center" justify="center" direction="column" mt={200}>
+    <Flex align="center" justify="center" direction="column" my={200}>
       <Text mb={20} color="#1C4532" fontSize="32px" fontWeight="bold" textAlign="center">
         농업인의 땀과 소비자의 마음을 직접 이어,
         <br />
@@ -132,7 +133,7 @@ const Introduction = () => (
         </Box>
       </Flex>
     </Flex>
-  </Box>
+  </Flex>
 );
 
 export default Introduction;

From 8c22d65256cfa919682d19177c4b0373193e4cb2 Mon Sep 17 00:00:00 2001
From: rudtj <kyoungseo03@naver.com>
Date: Wed, 20 Nov 2024 00:07:53 +0900
Subject: [PATCH 40/46] =?UTF-8?q?refactor:=20farm=20list=20=EC=88=98?=
 =?UTF-8?q?=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../features/MyPage/Order/FarmList.tsx        | 12 ++++----
 src/mocks/mockItem/mockFarms.ts               | 14 +++++++++
 src/pages/MyPage/FarmListPage.tsx             | 30 ++++++++++++-------
 src/types/index.ts                            |  2 ++
 4 files changed, 41 insertions(+), 17 deletions(-)

diff --git a/src/components/features/MyPage/Order/FarmList.tsx b/src/components/features/MyPage/Order/FarmList.tsx
index 55a57d5..77f4fd5 100644
--- a/src/components/features/MyPage/Order/FarmList.tsx
+++ b/src/components/features/MyPage/Order/FarmList.tsx
@@ -2,10 +2,11 @@ import { useState } from "react";
 import { Flex, Button, Text } from "@chakra-ui/react";
 import farm1 from "@assets/Image/Farm/Farm1.png";
 import Image from "@components/common/Image";
+import { Farm } from "@type/index";
 import ContactNumberModal from "./ContactNumberModal";
 import ReviewModal from "./ReviewModal";
 
-const FarmList = () => {
+const FarmList = ({ item }: { item: Farm }) => {
   const [isReviewModalOpen, setIsReviewModalOpen] = useState(false);
   const [isContactModalOpen, setIsContactModalOpen] = useState(false);
 
@@ -27,11 +28,8 @@ const FarmList = () => {
 
   return (
     <Flex direction="column">
-      <Text mt={10} color="#000000" fontSize="20px" fontWeight="bold">
-        2024.09.14
-      </Text>
       <Text mt={3} color="#000000" fontSize="16px" fontWeight="bold">
-        지민이네 복숭아 농장
+        {item.name}
       </Text>
       <Flex align="center" justify="space-between" direction="row" gap="10px">
         <Image mt={3} w="150px" borderRadius="xl" h="150px" src={farm1} alt="Farm image" />
@@ -41,7 +39,7 @@ const FarmList = () => {
               주소 :&nbsp;
             </Text>
             <Text color="#000000" fontSize="16px" fontWeight="medium">
-              부산대학교 금정구 중앙대로 1616
+              {item.address}
             </Text>
           </Flex>
 
@@ -49,7 +47,7 @@ const FarmList = () => {
             한 줄 소개
           </Text>
           <Text w="300px" color="#000000" fontSize="16px" fontWeight="medium">
-            가끔 지민은 학교에서 심각하게 집에 가고싶을 때마다 달달한 복숭아 아이스티를 마시며 향수병을 달랩니다.
+            {item.description}
           </Text>
         </Flex>
         <Flex justify="center" direction="column" gap="10px">
diff --git a/src/mocks/mockItem/mockFarms.ts b/src/mocks/mockItem/mockFarms.ts
index b725c57..ba0df62 100644
--- a/src/mocks/mockItem/mockFarms.ts
+++ b/src/mocks/mockItem/mockFarms.ts
@@ -5,26 +5,40 @@ const mockFarms: Farm[] = [
     id: 1,
     name: "건호 농장",
     address: "부산진구 개금동",
+    description:
+      "가끔 지민은 학교에서 심각하게 집에 가고싶을 때마다 달달한 복숭아 아이스티를 마시며 향수병을 달랩니다.",
+    date: "2024.09.14",
   },
   {
     id: 2,
     name: "토마토 농장",
     address: "부산 장전동",
+    description:
+      "가끔 지민은 학교에서 심각하게 집에 가고싶을 때마다 달달한 복숭아 아이스티를 마시며 향수병을 달랩니다.",
+    date: "2024.10.14",
   },
   {
     id: 3,
     name: "지민 농장",
     address: "경남 양산시 덕게동",
+    description:
+      "가끔 지민은 학교에서 심각하게 집에 가고싶을 때마다 달달한 복숭아 아이스티를 마시며 향수병을 달랩니다.",
+    date: "2024.09.24",
   },
   {
     id: 4,
     name: "할로윈 농장",
     address: "청담 에이프릴 영어학원",
+    description:
+      "가끔 지민은 학교에서 심각하게 집에 가고싶을 때마다 달달한 복숭아 아이스티를 마시며 향수병을 달랩니다.",
+    date: "2024.09.12",
   },
   {
     id: 5,
     name: "가지싫어 농장",
     address: "부산 해운대구 반송동",
+    description: "가끔 지민은 학교에서 심각하게 집에 가고싶을 때마다 가지를 먹으며 향수병을 달랩니다.",
+    date: "2024.09.04",
   },
 ];
 
diff --git a/src/pages/MyPage/FarmListPage.tsx b/src/pages/MyPage/FarmListPage.tsx
index e89e018..35d75ae 100644
--- a/src/pages/MyPage/FarmListPage.tsx
+++ b/src/pages/MyPage/FarmListPage.tsx
@@ -1,22 +1,32 @@
-import farm6 from "@assets/Image/Farm/Farm6.png";
+import { Flex, Text } from "@chakra-ui/react";
 import ListView from "@components/ItemView/ListView";
 import Card from "@components/common/Card";
 import FarmList from "@components/features/MyPage/Order/FarmList";
 import mockFarms from "@mocks/mockItem/mockFarms";
 import { Farm } from "@type/index";
 
-const farmListData: Farm[] = mockFarms.map((farm, index) => ({
-  id: farm.id,
-  date: `2024.09.${index + 14}`,
-  name: farm.name,
-  address: farm.address,
-  description: "기본 설명입니다.",
-  profile: farm6,
-}));
+const sortedFarms = mockFarms.sort((a, b) => new Date(b.date).getTime() - new Date(a.date).getTime());
+
+const groupedFarms = sortedFarms.reduce<Farm[][]>((acc, cur) => {
+  const last = acc[acc.length - 1];
+  if (!last || last[0].date !== cur.date) {
+    acc.push([cur]);
+  } else {
+    last.push(cur);
+  }
+  return acc;
+}, []);
 
 const FarmListPage = () => (
   <Card title="농장 체험 내역" w="100%" h="fit-content" p="10">
-    <ListView items={farmListData} ItemComponent={FarmList} />
+    {groupedFarms.map(farms => (
+      <Flex key={farms[0].date} direction="column" mb={4}>
+        <Text py="2" fontWeight="bold" borderBottom="0.7px solid #000000">
+          {farms[0].date}
+        </Text>
+        <ListView items={farms} ItemComponent={FarmList} />
+      </Flex>
+    ))}
   </Card>
 );
 
diff --git a/src/types/index.ts b/src/types/index.ts
index d810f3d..ca29c5f 100644
--- a/src/types/index.ts
+++ b/src/types/index.ts
@@ -6,6 +6,8 @@ export type Farm = Item & {
   name: string;
   address: string;
   profile?: string;
+  description: string;
+  date: string;
 };
 
 export type Product = Item & {

From d8329a0c29e82b428fcd3993706a5f11b3225b68 Mon Sep 17 00:00:00 2001
From: gimdogyun <jasper12394@gmail.com>
Date: Wed, 20 Nov 2024 00:16:39 +0900
Subject: [PATCH 41/46] fix: wishlist api

- #146
---
 src/api/wishlistApi.ts | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/api/wishlistApi.ts b/src/api/wishlistApi.ts
index 8625908..1a777e2 100644
--- a/src/api/wishlistApi.ts
+++ b/src/api/wishlistApi.ts
@@ -7,13 +7,13 @@ type WishlistData = {
 
 const useCreateWishlists = () => {
   const fetcher = (wishlistData: WishlistData) =>
-    defaultApi.post(`/api/wishlist/{product_id}`, wishlistData).then(({ data }) => data);
+    defaultApi.post(`/api/v1/wishlist/{product_id}`, wishlistData).then(({ data }) => data);
 
   return useMutation({ mutationFn: fetcher });
 };
 
-const useGetWishlists = () => {
-  const fetcher = () => needAuthDefaultApi.get(`/api/wishlist`).then(({ data }) => data);
+const useGetWishlists = (type: "product" | "farm") => {
+  const fetcher = () => needAuthDefaultApi.get(`/api/v1/wishlist`, { params: { type } }).then(({ data }) => data);
 
   return useQuery({
     queryKey: ["wishlists"],
@@ -22,7 +22,7 @@ const useGetWishlists = () => {
 };
 
 const useDeleteWishlists = () => {
-  const fetcher = (wishlistId: number) => defaultApi.delete(`/api/wishlist/${wishlistId}`).then(({ data }) => data);
+  const fetcher = (wishlistId: number) => defaultApi.delete(`/api/v1/wishlist/${wishlistId}`).then(({ data }) => data);
 
   return useMutation({ mutationFn: fetcher });
 };

From 0004e24b81f6490208f19a999a12fbcb909c1f1a Mon Sep 17 00:00:00 2001
From: gimdogyun <jasper12394@gmail.com>
Date: Wed, 20 Nov 2024 00:19:39 +0900
Subject: [PATCH 42/46] fix: farmdetail

- #146
---
 .../FarmDetailPage/ProductDescription.tsx     | 93 -------------------
 .../{Product.tsx => Schedule.tsx}             |  6 +-
 src/pages/FarmDetailPage/index.tsx            | 24 +++--
 3 files changed, 19 insertions(+), 104 deletions(-)
 delete mode 100644 src/components/features/FarmDetailPage/ProductDescription.tsx
 rename src/components/features/FarmDetailPage/{Product.tsx => Schedule.tsx} (97%)

diff --git a/src/components/features/FarmDetailPage/ProductDescription.tsx b/src/components/features/FarmDetailPage/ProductDescription.tsx
deleted file mode 100644
index 3d99cf7..0000000
--- a/src/components/features/FarmDetailPage/ProductDescription.tsx
+++ /dev/null
@@ -1,93 +0,0 @@
-import { Box, Text, Flex } from "@chakra-ui/react";
-import { useGetFarmDetail } from "@api/farmApi";
-import Image from "@components/common/Image";
-
-const defaultInfo = {
-  title: "",
-  mainImage: "",
-  detailTitles: ["", "", ""],
-  detailDescriptions: ["", "", ""],
-  detailImages: ["", "", ""],
-};
-
-const ProductDescription = ({ scheduleId }: { scheduleId: number }) => {
-  const { data: farmDetail = defaultInfo } = useGetFarmDetail(scheduleId);
-
-  return (
-    <Flex direction="column">
-      <Text mt={5} color="#000000" fontSize="32px" fontWeight="bold">
-        {farmDetail.title}
-      </Text>
-      <Flex direction="row">
-        <Image w="500px" h="490px" mt={10} borderRadius="12px" alt="mainImage" src={farmDetail.mainImage} />
-        <Flex direction="column">
-          <Box w="520px" h="150px" mt={10} ml={10} borderRadius="12px" bgColor="#22543D">
-            <Flex direction="row">
-              <Flex direction="column" ml={8}>
-                <Text mt={7} color="#FFFFFF" fontSize="27px" fontWeight="bold">
-                  {farmDetail.detailTitles[0]}
-                </Text>
-                <Text color="#FFFFFF" fontSize="15px" fontWeight="medium">
-                  {farmDetail.detailDescriptions[0]}
-                </Text>
-              </Flex>
-              <Image
-                w="120px"
-                h="120px"
-                mt={4}
-                ml={67}
-                borderRadius="100px"
-                alt="detailImage"
-                src={farmDetail.detailImages[0]}
-              />
-            </Flex>
-          </Box>
-          <Box w="520px" h="150px" mt={5} ml={10} borderRadius="12px" bgColor="#22543D">
-            <Flex direction="row">
-              <Flex direction="column" ml={8}>
-                <Text mt={7} color="#FFFFFF" fontSize="27px" fontWeight="bold">
-                  {farmDetail.detailTitles[1]}
-                </Text>
-                <Text color="#FFFFFF" fontSize="15px" fontWeight="medium">
-                  {farmDetail.detailDescriptions[1]}
-                </Text>
-              </Flex>
-              <Image
-                w="120px"
-                h="120px"
-                mt={4}
-                ml={41}
-                borderRadius="100px"
-                alt="detailImage"
-                src={farmDetail.detailImages[0]}
-              />
-            </Flex>
-          </Box>
-          <Box w="520px" h="150px" mt={5} ml={10} borderRadius="12px" bgColor="#22543D">
-            <Flex direction="row">
-              <Flex direction="column" ml={8}>
-                <Text mt={7} color="#FFFFFF" fontSize="27px" fontWeight="bold">
-                  {farmDetail.detailTitles[2]}
-                </Text>
-                <Text color="#FFFFFF" fontSize="15px" fontWeight="medium">
-                  {farmDetail.detailDescriptions[2]}
-                </Text>
-              </Flex>
-              <Image
-                w="120px"
-                h="120px"
-                mt={4}
-                ml={41}
-                borderRadius="100px"
-                alt="detailImage"
-                src={farmDetail.detailImages[0]}
-              />
-            </Flex>
-          </Box>
-        </Flex>
-      </Flex>
-    </Flex>
-  );
-};
-
-export default ProductDescription;
diff --git a/src/components/features/FarmDetailPage/Product.tsx b/src/components/features/FarmDetailPage/Schedule.tsx
similarity index 97%
rename from src/components/features/FarmDetailPage/Product.tsx
rename to src/components/features/FarmDetailPage/Schedule.tsx
index d75cef2..7fd53f9 100644
--- a/src/components/features/FarmDetailPage/Product.tsx
+++ b/src/components/features/FarmDetailPage/Schedule.tsx
@@ -17,7 +17,7 @@ const defaultFormData = {
   endTime: "",
 };
 
-const Product = ({ scheduleId }: { scheduleId: number }) => {
+const Schedule = ({ scheduleId }: { scheduleId: number }) => {
   const { data: farmDetail = defaultFormData } = useGetFarmDetail(scheduleId);
 
   const [dateOptions, setDateOptions] = useState<string[]>([]);
@@ -38,7 +38,7 @@ const Product = ({ scheduleId }: { scheduleId: number }) => {
 
   return (
     <Flex direction="row">
-      <Box mt={100} ml={200}>
+      <Box mt={100}>
         <Image w="500px" h="530px" borderRadius="12px" alt="farmImage" src={farmDetail.imageUrl} />
       </Box>
       <Flex direction="column" maxW="600px">
@@ -144,4 +144,4 @@ const Product = ({ scheduleId }: { scheduleId: number }) => {
   );
 };
 
-export default Product;
+export default Schedule;
diff --git a/src/pages/FarmDetailPage/index.tsx b/src/pages/FarmDetailPage/index.tsx
index 7473b06..c5ff0a0 100644
--- a/src/pages/FarmDetailPage/index.tsx
+++ b/src/pages/FarmDetailPage/index.tsx
@@ -1,9 +1,9 @@
 import { useParams } from "react-router-dom";
-import { Tab, Tabs, TabList, TabPanels, TabPanel } from "@chakra-ui/react";
+import { Tab, Tabs, TabList, TabPanels, TabPanel, Flex } from "@chakra-ui/react";
+import AddPreview from "@components/common/AddPreview";
 import Direction from "@components/features/FarmDetailPage/Direciton";
-import Product from "@components/features/FarmDetailPage/Product";
-import ProductDescription from "@components/features/FarmDetailPage/ProductDescription";
 import ReviewList from "@components/features/FarmDetailPage/ReviewList";
+import Schedule from "@components/features/FarmDetailPage/Schedule";
 
 const FarmDetailPage = () => {
   const params = useParams();
@@ -11,10 +11,10 @@ const FarmDetailPage = () => {
   const scheduleId = Number(params?.scheduleId);
 
   return (
-    <>
-      <Product scheduleId={scheduleId} />
+    <Flex align="center" direction="column" w="100vw">
+      <Schedule scheduleId={scheduleId} />
 
-      <Tabs mt={100} ml={200}>
+      <Tabs mt={100}>
         <TabList w="1100px">
           <Tab _selected={{ color: "#1C4532", fontSize: "24px", fontWeight: "bold", bg: "none" }}>상품 설명</Tab>
           <Tab _selected={{ color: "#1C4532", fontSize: "24px", fontWeight: "bold", bg: "none" }}>후기</Tab>
@@ -22,7 +22,15 @@ const FarmDetailPage = () => {
 
         <TabPanels py="10px">
           <TabPanel>
-            <ProductDescription scheduleId={scheduleId} />
+            <AddPreview
+              info={{
+                title: "",
+                mainImage: "",
+                detailTitles: ["", "", ""],
+                detailDescriptions: ["", "", ""],
+                detailImages: ["", "", ""],
+              }}
+            />
           </TabPanel>
           <TabPanel>
             <ReviewList />
@@ -31,7 +39,7 @@ const FarmDetailPage = () => {
       </Tabs>
 
       <Direction key="userId" lat={43} lng={128} />
-    </>
+    </Flex>
   );
 };
 

From f201f724349081fac4432e75d428202078beee0a Mon Sep 17 00:00:00 2001
From: gimdogyun <jasper12394@gmail.com>
Date: Wed, 20 Nov 2024 00:20:01 +0900
Subject: [PATCH 43/46] fix: storedetail

- #146
---
 .../features/StoreDetailPage/Product.tsx      |  2 +-
 .../StoreDetailPage/ProductDescription.tsx    | 69 -------------------
 src/pages/StoreDetailPage/index.tsx           | 20 ++++--
 3 files changed, 15 insertions(+), 76 deletions(-)
 delete mode 100644 src/components/features/StoreDetailPage/ProductDescription.tsx

diff --git a/src/components/features/StoreDetailPage/Product.tsx b/src/components/features/StoreDetailPage/Product.tsx
index 78c6b24..b615310 100644
--- a/src/components/features/StoreDetailPage/Product.tsx
+++ b/src/components/features/StoreDetailPage/Product.tsx
@@ -36,7 +36,7 @@ const Product: React.FC<ProductProps> = ({ productId }) => {
 
   return (
     <Flex direction="row">
-      <Box mt={100} ml={200}>
+      <Box mt={100}>
         <Image w="500px" h="460px" borderRadius="12px" alt="product" src={store1} />
       </Box>
       <Flex direction="column" maxW="600px">
diff --git a/src/components/features/StoreDetailPage/ProductDescription.tsx b/src/components/features/StoreDetailPage/ProductDescription.tsx
deleted file mode 100644
index 18f23b7..0000000
--- a/src/components/features/StoreDetailPage/ProductDescription.tsx
+++ /dev/null
@@ -1,69 +0,0 @@
-import { Box, Image, Text, Flex } from "@chakra-ui/react";
-import store1 from "@assets/Image/Store/Store1.png";
-import store5 from "@assets/Image/Store/Store5.png";
-import store6 from "@assets/Image/Store/Store6.png";
-import store7 from "@assets/Image/Store/Store7.png";
-
-const ProductDescription = () => (
-  <Flex direction="column" mb={50}>
-    <Text mt={10} color="#000000" fontSize="32px" fontWeight="bold">
-      건호네 포도에 대해서 소개합니다😀
-    </Text>
-    <Flex direction="row">
-      <Image w="500px" h="490px" mt={10} borderRadius="12px" alt="store1" src={store1} />
-      <Flex direction="column">
-        <Box w="520px" h="150px" mt={10} ml={10} borderRadius="12px" bgColor="#22543D">
-          <Flex direction="row">
-            <Flex direction="column" ml={8}>
-              <Text mt={7} color="#FFFFFF" fontSize="27px" fontWeight="bold">
-                신선함의 상징
-              </Text>
-              <Text color="#FFFFFF" fontSize="15px" fontWeight="medium">
-                매일 아침 수확한 포도를 즉시 배송하여,
-                <br />
-                여러분의 식탁에 가장 신선한 맛을 전해드립니다.
-              </Text>
-            </Flex>
-            <Image w="120px" h="120px" mt={4} ml={50} borderRadius="100px" alt="store5" src={store5} />
-          </Flex>
-        </Box>
-        <Box w="520px" h="150px" mt={5} ml={10} borderRadius="12px" bgColor="#22543D">
-          <Flex direction="row">
-            <Flex direction="column" ml={8}>
-              <Text mt={6} color="#FFFFFF" fontSize="27px" fontWeight="bold">
-                건강한 선택
-              </Text>
-              <Text color="#FFFFFF" fontSize="13px" fontWeight="medium">
-                포도는 비타민과 항산화 물질이 풍부하여
-                <br />
-                면역력 강화와 피부 건강에 도움을 줍니다.
-                <br />
-                자연 그대로의 맛을 느끼며 건강을 챙기세요.
-              </Text>
-            </Flex>
-            <Image w="120px" h="120px" mt={4} ml={109} borderRadius="100px" alt="store6" src={store6} />
-          </Flex>
-        </Box>
-        <Box w="520px" h="150px" mt={5} ml={10} borderRadius="12px" bgColor="#22543D">
-          <Flex direction="row">
-            <Flex direction="column" ml={8}>
-              <Text mt={6} color="#FFFFFF" fontSize="27px" fontWeight="bold">
-                다채로운 활용
-              </Text>
-              <Text color="#FFFFFF" fontSize="13px" fontWeight="medium">
-                포도는 샐러드, 디저트, 주스 등
-                <br />
-                다양한 요리에 활용할 수 있습니다.
-                <br />
-                창의적인 레시피와 함께 포도의 매력을 만끽하세요!
-              </Text>
-            </Flex>
-            <Image w="120px" h="120px" mt={4} ml={76} borderRadius="100px" alt="store7" src={store7} />
-          </Flex>
-        </Box>
-      </Flex>
-    </Flex>
-  </Flex>
-);
-
-export default ProductDescription;
diff --git a/src/pages/StoreDetailPage/index.tsx b/src/pages/StoreDetailPage/index.tsx
index e29788f..4cb3c81 100644
--- a/src/pages/StoreDetailPage/index.tsx
+++ b/src/pages/StoreDetailPage/index.tsx
@@ -1,12 +1,12 @@
-import { Tab, Tabs, TabList, TabPanels, TabPanel } from "@chakra-ui/react";
+import { Tab, Tabs, TabList, TabPanels, TabPanel, Flex } from "@chakra-ui/react";
+import AddPreview from "@components/common/AddPreview";
 import Product from "@components/features/StoreDetailPage/Product";
-import ProductDescription from "@components/features/StoreDetailPage/ProductDescription";
 import ReviewList from "@components/features/StoreDetailPage/ReviewList";
 
 const StoreDetailPage = () => (
-  <>
+  <Flex align="center" direction="column" w="100vw">
     <Product productId={1} />
-    <Tabs mt={100} ml={200}>
+    <Tabs mt={100}>
       <TabList w="1100px">
         <Tab _selected={{ color: "#1C4532", fontSize: "24px", fontWeight: "bold", bg: "none" }}>상품 설명</Tab>
         <Tab _selected={{ color: "#1C4532", fontSize: "24px", fontWeight: "bold", bg: "none" }}>후기</Tab>
@@ -14,14 +14,22 @@ const StoreDetailPage = () => (
 
       <TabPanels py="10px">
         <TabPanel>
-          <ProductDescription />
+          <AddPreview
+            info={{
+              title: "",
+              mainImage: "",
+              detailTitles: ["", "", ""],
+              detailDescriptions: ["", "", ""],
+              detailImages: ["", "", ""],
+            }}
+          />
         </TabPanel>
         <TabPanel>
           <ReviewList />
         </TabPanel>
       </TabPanels>
     </Tabs>
-  </>
+  </Flex>
 );
 
 export default StoreDetailPage;

From af133c44b64626f47cead30e3f21c660883cf5e7 Mon Sep 17 00:00:00 2001
From: gimdogyun <jasper12394@gmail.com>
Date: Wed, 20 Nov 2024 00:20:18 +0900
Subject: [PATCH 44/46] fix: mypage

- #146
---
 src/components/features/MyPage/Category.tsx             | 2 +-
 src/components/features/MyPage/Wishlist/ProductWish.tsx | 2 +-
 src/components/layouts/MyPageLayout.tsx                 | 3 ++-
 src/pages/MyPage/OrdersPage.tsx                         | 2 +-
 4 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/src/components/features/MyPage/Category.tsx b/src/components/features/MyPage/Category.tsx
index ed49546..36227da 100644
--- a/src/components/features/MyPage/Category.tsx
+++ b/src/components/features/MyPage/Category.tsx
@@ -3,7 +3,7 @@ import { HeartOutlined, ProfileOutlined, UserOutlined } from "@ant-design/icons"
 import { Text, Flex, Box, Icon, Link as ChakraLink } from "@chakra-ui/react";
 
 const Category = () => (
-  <Box flexShrink="1" w="330px" h="800px" border="none" borderRadius="20px" bgColor="#FFFFFF">
+  <Box pos="sticky" top="10" flexShrink="1" w="330px" h="800px" border="none" borderRadius="20px" bgColor="#FFFFFF">
     <Flex direction="column">
       <Flex direction="row" mt={10} ml={5}>
         <Icon as={HeartOutlined} color="#22543D" fontSize="25px" />
diff --git a/src/components/features/MyPage/Wishlist/ProductWish.tsx b/src/components/features/MyPage/Wishlist/ProductWish.tsx
index b18a65a..a4cf0e0 100644
--- a/src/components/features/MyPage/Wishlist/ProductWish.tsx
+++ b/src/components/features/MyPage/Wishlist/ProductWish.tsx
@@ -12,7 +12,7 @@ type Product = {
 };
 
 const ProductWish = () => {
-  const { data: wishlists, isLoading, refetch } = useGetWishlists();
+  const { data: wishlists, isLoading, refetch } = useGetWishlists("product");
   const { mutate: deleteWishlist } = useDeleteWishlists();
 
   const handleDelete = (wishlistId: number) => {
diff --git a/src/components/layouts/MyPageLayout.tsx b/src/components/layouts/MyPageLayout.tsx
index 271fec3..c615d7f 100644
--- a/src/components/layouts/MyPageLayout.tsx
+++ b/src/components/layouts/MyPageLayout.tsx
@@ -1,9 +1,10 @@
 import { Outlet } from "react-router-dom";
 import { Flex } from "@chakra-ui/react";
 import Category from "@components/features/MyPage/Category";
+import size from "@constants/size";
 
 const MyPageLayout = () => (
-  <Flex justify="center" direction="row" w="100vw" h="100vh" py="10" bg="#F5F5F5">
+  <Flex justify="center" direction="row" w="100vw" minH={`calc(100vh - ${size.header.h})`} py="10" bg="#F5F5F5">
     <Flex gap="10" w="1100px">
       <Category />
       <Outlet />
diff --git a/src/pages/MyPage/OrdersPage.tsx b/src/pages/MyPage/OrdersPage.tsx
index 1341c76..b4a7f2e 100644
--- a/src/pages/MyPage/OrdersPage.tsx
+++ b/src/pages/MyPage/OrdersPage.tsx
@@ -18,7 +18,7 @@ const splitedOrders = sortedOrders.reduce<Order[][]>((acc, cur) => {
 }, []);
 
 const MyOrdersPage = () => (
-  <Card title="상품 주문 내역" w="100%" h="800px" overflowY="scroll" overflowX="hidden" p="10">
+  <Card title="상품 주문 내역" w="100%" p="10">
     {splitedOrders.map(orders => (
       <Flex key={orders[0].orderDate} direction="column">
         <Text py="2">{orders[0].orderDate}</Text>

From 5b9fb29c4169a9b73401c49211669237c1433062 Mon Sep 17 00:00:00 2001
From: gimdogyun <jasper12394@gmail.com>
Date: Wed, 20 Nov 2024 00:20:34 +0900
Subject: [PATCH 45/46] fix: sellerpage

- #146
---
 src/components/features/SellerPage/BusinessRegister/index.tsx | 2 +-
 src/components/features/SellerPage/MyInfo/Logout.tsx          | 2 +-
 src/components/features/SellerPage/Tax.tsx/index.tsx          | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/features/SellerPage/BusinessRegister/index.tsx b/src/components/features/SellerPage/BusinessRegister/index.tsx
index aee2764..9bfc3b3 100644
--- a/src/components/features/SellerPage/BusinessRegister/index.tsx
+++ b/src/components/features/SellerPage/BusinessRegister/index.tsx
@@ -68,7 +68,7 @@ const BusinessRegister = () => {
   };
 
   return (
-    <Box w="900px" minH="100vh" mx="auto" border="none" borderRadius="12px" bgColor="#FFFFFF">
+    <Box w="900px" mx="auto" border="none" borderRadius="12px" bgColor="#FFFFFF">
       <Flex direction="column">
         {alert && (
           <Alert mb={4} status={alert.status}>
diff --git a/src/components/features/SellerPage/MyInfo/Logout.tsx b/src/components/features/SellerPage/MyInfo/Logout.tsx
index 1baf3e9..04e72a7 100644
--- a/src/components/features/SellerPage/MyInfo/Logout.tsx
+++ b/src/components/features/SellerPage/MyInfo/Logout.tsx
@@ -9,7 +9,7 @@ const Logout = () => {
   };
 
   return (
-    <Box w="700px" h="300px" mt={-550} ml={500} border="none" borderRadius="12px" bgColor="#FFFFFF">
+    <Box w="700px" h="300px" mx="auto" border="none" borderRadius="12px" bgColor="#FFFFFF">
       <Flex direction="column">
         <Text mt={10} ml={10} color="#22543D" fontSize="20px" fontWeight="bold">
           회원 탈퇴
diff --git a/src/components/features/SellerPage/Tax.tsx/index.tsx b/src/components/features/SellerPage/Tax.tsx/index.tsx
index cdcb510..69aafed 100644
--- a/src/components/features/SellerPage/Tax.tsx/index.tsx
+++ b/src/components/features/SellerPage/Tax.tsx/index.tsx
@@ -24,7 +24,7 @@ const Tax = () => {
   };
 
   return (
-    <Box w="900px" minH="100vh" mx="auto" border="none" borderRadius="12px" bgColor="#FFFFFF">
+    <Box w="900px" mx="auto" pb="20" border="none" borderRadius="12px" bgColor="#FFFFFF">
       <Flex direction="column">
         <Text mt={10} ml={10} color="#22543D" fontSize="20px" fontWeight="bold">
           세금 계산기

From be97a81e9b81af2aa23d94226e2114e7435e0373 Mon Sep 17 00:00:00 2001
From: gimdogyun <jasper12394@gmail.com>
Date: Wed, 20 Nov 2024 00:20:43 +0900
Subject: [PATCH 46/46] fix: header

- #146
---
 src/components/layouts/Header.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/layouts/Header.tsx b/src/components/layouts/Header.tsx
index 6f63bc7..3cc42ec 100644
--- a/src/components/layouts/Header.tsx
+++ b/src/components/layouts/Header.tsx
@@ -67,7 +67,7 @@ const Header = () => {
         <Flex align="center" gap="5">
           {loginCheck() ? (
             [
-              <Link to="/wish">
+              <Link to="/me/product-wish">
                 <Icon as={HeartOutlined} color="#1C4532" fontSize="25px" />
               </Link>,
               <Link to="/cart">