From f4953f12ef147030616ef6927b6be7741dc0475e Mon Sep 17 00:00:00 2001 From: sanginjeong Date: Fri, 29 Aug 2025 14:40:47 +0900 Subject: [PATCH 01/18] =?UTF-8?q?refactor:=20getProducts=20=ED=95=A8?= =?UTF-8?q?=EC=88=98=20async,=20await=20=EC=A0=9C=EA=B1=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- vite-project/src/hooks/useGetProducts.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/vite-project/src/hooks/useGetProducts.js b/vite-project/src/hooks/useGetProducts.js index 13c36521..6c675255 100644 --- a/vite-project/src/hooks/useGetProducts.js +++ b/vite-project/src/hooks/useGetProducts.js @@ -1,8 +1,8 @@ import { useQuery } from "@tanstack/react-query"; import instance from "../api/axiosInstance"; -const getProducts = async ({ page = 1, orderBy = "recent", pageSize = 10 }) => { - return await instance.get("/products", { +const getProducts = ({ page = 1, orderBy = "recent", pageSize = 10 }) => { + return instance.get("/products", { params: { page, orderBy, pageSize }, }); }; From 43b852759456a324f686489043bb0becae10f48f Mon Sep 17 00:00:00 2001 From: sanginjeong Date: Fri, 29 Aug 2025 15:11:06 +0900 Subject: [PATCH 02/18] =?UTF-8?q?refactor:=20=ED=95=9C=20=ED=8E=98?= =?UTF-8?q?=EC=9D=B4=EC=A7=80=EC=97=90=20h1=20=EC=A4=91=EB=B3=B5=EC=9D=B4?= =?UTF-8?q?=EC=8A=88=EB=A1=9C=20h2=20=EB=A1=9C=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../pages/ItemsPage/components/ProductAll/ProductAllMenuBar.jsx | 2 +- .../src/pages/ItemsPage/components/ProductBest/index.jsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/vite-project/src/pages/ItemsPage/components/ProductAll/ProductAllMenuBar.jsx b/vite-project/src/pages/ItemsPage/components/ProductAll/ProductAllMenuBar.jsx index 074edae1..c71c483a 100644 --- a/vite-project/src/pages/ItemsPage/components/ProductAll/ProductAllMenuBar.jsx +++ b/vite-project/src/pages/ItemsPage/components/ProductAll/ProductAllMenuBar.jsx @@ -18,7 +18,7 @@ const ProductAllMenuBar = ({ return (
-

전체 상품

+

전체 상품

diff --git a/vite-project/src/pages/ItemsPage/components/ProductBest/index.jsx b/vite-project/src/pages/ItemsPage/components/ProductBest/index.jsx index d53f1f4e..cf3f606b 100644 --- a/vite-project/src/pages/ItemsPage/components/ProductBest/index.jsx +++ b/vite-project/src/pages/ItemsPage/components/ProductBest/index.jsx @@ -21,7 +21,7 @@ const ProductBest = () => { if (isError) return ; return (
-

베스트 상품

+

베스트 상품

); From e49c41cae122817a903255450a564ddf7c13d56d Mon Sep 17 00:00:00 2001 From: sanginjeong Date: Fri, 29 Aug 2025 15:12:44 +0900 Subject: [PATCH 03/18] =?UTF-8?q?refactor:=20DROPDOWN=5FMENUS=20=EC=BB=B4?= =?UTF-8?q?=ED=8F=AC=EB=84=8C=ED=8A=B8=20=EB=B0=96=EC=9C=BC=EB=A1=9C=20?= =?UTF-8?q?=EB=B9=BC=EA=B8=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- vite-project/src/constants/PRODUCTS.js | 3 +++ .../ItemsPage/components/ProductAll/ProductAllMenuBar.jsx | 2 +- 2 files changed, 4 insertions(+), 1 deletion(-) diff --git a/vite-project/src/constants/PRODUCTS.js b/vite-project/src/constants/PRODUCTS.js index c08eb7c1..199f9aa5 100644 --- a/vite-project/src/constants/PRODUCTS.js +++ b/vite-project/src/constants/PRODUCTS.js @@ -2,4 +2,7 @@ export const ORDER_BYS = { 최신순: "recent", 좋아요순: "favorite", }; + +export const DROPDOWN_MENUS = Object.keys(ORDER_BYS); + export const GROUP_SIZE = 5; diff --git a/vite-project/src/pages/ItemsPage/components/ProductAll/ProductAllMenuBar.jsx b/vite-project/src/pages/ItemsPage/components/ProductAll/ProductAllMenuBar.jsx index c71c483a..c46af9b3 100644 --- a/vite-project/src/pages/ItemsPage/components/ProductAll/ProductAllMenuBar.jsx +++ b/vite-project/src/pages/ItemsPage/components/ProductAll/ProductAllMenuBar.jsx @@ -2,6 +2,7 @@ import { useNavigate } from "react-router"; import DropDown from "../../../../common/Dropdown"; import { useMediaQuery } from "react-responsive"; import { ORDER_BYS } from "../../../../constants/PRODUCTS"; +import { DROPDOWN_MENUS } from "../../../../constants/PRODUCTS"; const ProductAllMenuBar = ({ isOpenDropdown, @@ -11,7 +12,6 @@ const ProductAllMenuBar = ({ }) => { const navigate = useNavigate(); const isMobile = useMediaQuery({ maxWidth: 767 }); - const DROPDOWN_MENUS = Object.keys(ORDER_BYS); const selectedDropdownValue = DROPDOWN_MENUS.find( (key) => ORDER_BYS[key] === orderBy ); From 045005927f2a2b5bffa6db05d2302c82fdbbf167 Mon Sep 17 00:00:00 2001 From: sanginjeong Date: Fri, 29 Aug 2025 15:23:55 +0900 Subject: [PATCH 04/18] =?UTF-8?q?feat:=20ItemDetailPage=20=EC=83=9D?= =?UTF-8?q?=EC=84=B1=20=EB=B0=8F=20=EB=9D=BC=EC=9A=B0=ED=8C=85=20=EC=84=A4?= =?UTF-8?q?=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- vite-project/src/App.jsx | 6 +++++- vite-project/src/pages/ItemDetailPage/index.jsx | 5 +++++ 2 files changed, 10 insertions(+), 1 deletion(-) create mode 100644 vite-project/src/pages/ItemDetailPage/index.jsx diff --git a/vite-project/src/App.jsx b/vite-project/src/App.jsx index 8ad11bfe..6fa5a9c8 100644 --- a/vite-project/src/App.jsx +++ b/vite-project/src/App.jsx @@ -4,6 +4,7 @@ import ItemsPage from "./pages/ItemsPage"; import AddItemPage from "./pages/AddItemPage"; import Layout from "./layout/Layout"; import FreeBoard from "./pages/FreeBoardPage"; +import ItemDetailPage from "./pages/ItemDetailPage"; function App() { return ( @@ -12,7 +13,10 @@ function App() { } /> }> - } /> + + } /> + } /> + } /> {/* freeBoard : link active 테스트를 위해 미리 만듦 */} } />{" "} diff --git a/vite-project/src/pages/ItemDetailPage/index.jsx b/vite-project/src/pages/ItemDetailPage/index.jsx new file mode 100644 index 00000000..b9af7be4 --- /dev/null +++ b/vite-project/src/pages/ItemDetailPage/index.jsx @@ -0,0 +1,5 @@ +const ItemDetailPage = () => { + return
index
; +}; + +export default ItemDetailPage; From b91d9b9407aa569bcdcb96e0a84b2ff110bda4c6 Mon Sep 17 00:00:00 2001 From: sanginjeong Date: Fri, 29 Aug 2025 16:01:12 +0900 Subject: [PATCH 05/18] =?UTF-8?q?=EC=A0=80=EC=9E=A5=EC=9A=A9=20=EC=BB=A4?= =?UTF-8?q?=EB=B0=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- vite-project/package-lock.json | 6 +++--- vite-project/src/common/ProductCard/index.jsx | 12 ++++++++++-- 2 files changed, 13 insertions(+), 5 deletions(-) diff --git a/vite-project/package-lock.json b/vite-project/package-lock.json index 58b22412..2d7d880b 100644 --- a/vite-project/package-lock.json +++ b/vite-project/package-lock.json @@ -2884,9 +2884,9 @@ } }, "node_modules/react-router": { - "version": "7.7.0", - "resolved": "https://registry.npmjs.org/react-router/-/react-router-7.7.0.tgz", - "integrity": "sha512-3FUYSwlvB/5wRJVTL/aavqHmfUKe0+Xm9MllkYgGo9eDwNdkvwlJGjpPxono1kCycLt6AnDTgjmXvK3/B4QGuw==", + "version": "7.8.2", + "resolved": "https://registry.npmjs.org/react-router/-/react-router-7.8.2.tgz", + "integrity": "sha512-7M2fR1JbIZ/jFWqelpvSZx+7vd7UlBTfdZqf6OSdF9g6+sfdqJDAWcak6ervbHph200ePlu+7G8LdoiC3ReyAQ==", "license": "MIT", "dependencies": { "cookie": "^1.0.1", diff --git a/vite-project/src/common/ProductCard/index.jsx b/vite-project/src/common/ProductCard/index.jsx index 35795ae4..1e37fcb3 100644 --- a/vite-project/src/common/ProductCard/index.jsx +++ b/vite-project/src/common/ProductCard/index.jsx @@ -1,9 +1,17 @@ -import React from "react"; +import { useNavigate } from "react-router"; import "./ProductCard.style.css"; const ProductCard = ({ product, category }) => { + const navigate = useNavigate(); + + const handleClickProductCard = () => { + console.log(product.id); + // navigate("/Test"); + navigate(`/items/${product.id}`); + }; + return ( -
+
product-img Date: Sun, 31 Aug 2025 00:11:10 +0900 Subject: [PATCH 06/18] =?UTF-8?q?feat:=20=EC=83=81=ED=92=88=20=EC=83=81?= =?UTF-8?q?=EC=84=B8=20=ED=8E=98=EC=9D=B4=EC=A7=80=20=EC=9D=B4=EB=8F=99?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- vite-project/src/common/ProductCard/index.jsx | 11 +---------- vite-project/src/common/ProductList/index.jsx | 3 +-- 2 files changed, 2 insertions(+), 12 deletions(-) diff --git a/vite-project/src/common/ProductCard/index.jsx b/vite-project/src/common/ProductCard/index.jsx index 1e37fcb3..e803d0a6 100644 --- a/vite-project/src/common/ProductCard/index.jsx +++ b/vite-project/src/common/ProductCard/index.jsx @@ -1,17 +1,8 @@ -import { useNavigate } from "react-router"; import "./ProductCard.style.css"; const ProductCard = ({ product, category }) => { - const navigate = useNavigate(); - - const handleClickProductCard = () => { - console.log(product.id); - // navigate("/Test"); - navigate(`/items/${product.id}`); - }; - return ( -
+
product-img { @@ -6,7 +5,7 @@ const ProductList = ({ products, className }) => {
    {products?.map((product) => (
  • - +
    • From df24567098915a94522d888a80f14b75fb14283c Mon Sep 17 00:00:00 2001 From: sanginjeong Date: Sun, 31 Aug 2025 00:16:52 +0900 Subject: [PATCH 07/18] =?UTF-8?q?feat:=20=EC=83=81=ED=92=88=20=EC=83=81?= =?UTF-8?q?=EC=84=B8=20=EC=A0=95=EB=B3=B4=20=EB=B0=9B=EC=95=84=EC=98=A4?= =?UTF-8?q?=EB=8A=94=20Hook=20=EA=B5=AC=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- vite-project/src/hooks/useGetProductDetail.js | 15 +++++++++++++++ vite-project/src/pages/ItemDetailPage/index.jsx | 9 +++++++++ 2 files changed, 24 insertions(+) create mode 100644 vite-project/src/hooks/useGetProductDetail.js diff --git a/vite-project/src/hooks/useGetProductDetail.js b/vite-project/src/hooks/useGetProductDetail.js new file mode 100644 index 00000000..1f8c7967 --- /dev/null +++ b/vite-project/src/hooks/useGetProductDetail.js @@ -0,0 +1,15 @@ +import { useQuery } from "@tanstack/react-query"; +import instance from "../api/axiosInstance"; + +const getProductDetail = ({ productId }) => { + return instance.get(`products/${productId}`); +}; + +export const useGetProductDetailQuery = ({ productId }) => { + return useQuery({ + queryKey: ["getProductDetail"], + queryFn: () => getProductDetail({ productId }), + staleTime: 300000, + select: (response) => response.data, + }); +}; diff --git a/vite-project/src/pages/ItemDetailPage/index.jsx b/vite-project/src/pages/ItemDetailPage/index.jsx index b9af7be4..f5d27841 100644 --- a/vite-project/src/pages/ItemDetailPage/index.jsx +++ b/vite-project/src/pages/ItemDetailPage/index.jsx @@ -1,4 +1,13 @@ +import { useGetProductDetailQuery } from "../../hooks/useGetProductDetail"; +import { useParams } from "react-router"; + const ItemDetailPage = () => { + const params = useParams(); + const { productId } = params; + const { data, isLoading, isError, error } = useGetProductDetailQuery({ + productId, + }); + return
    index
    ; }; From 50b004af2a9025c4ee1827acbae3867846de019b Mon Sep 17 00:00:00 2001 From: sanginjeong Date: Sun, 31 Aug 2025 00:25:28 +0900 Subject: [PATCH 08/18] =?UTF-8?q?feat:=20=EC=83=81=ED=92=88=20=EC=BD=94?= =?UTF-8?q?=EB=A9=98=ED=8A=B8=20=EB=B0=9B=EC=95=84=EC=98=A4=EB=8A=94=20Hoo?= =?UTF-8?q?k=20=EA=B5=AC=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- vite-project/src/hooks/useGetProductComments.js | 17 +++++++++++++++++ vite-project/src/pages/ItemDetailPage/index.jsx | 8 +++++++- 2 files changed, 24 insertions(+), 1 deletion(-) create mode 100644 vite-project/src/hooks/useGetProductComments.js diff --git a/vite-project/src/hooks/useGetProductComments.js b/vite-project/src/hooks/useGetProductComments.js new file mode 100644 index 00000000..395f7fa3 --- /dev/null +++ b/vite-project/src/hooks/useGetProductComments.js @@ -0,0 +1,17 @@ +import { useQuery } from "@tanstack/react-query"; +import instance from "../api/axiosInstance"; + +const getProductComments = ({ productId, limit, cursor }) => { + return instance.get(`products/${productId}/comments`, { + params: { limit, cursor }, + }); +}; + +export const useGetProductCommentsQuery = ({ productId, limit, cursor }) => { + return useQuery({ + queryKey: ["getProductComments"], + queryFn: () => getProductComments({ productId, limit, cursor }), + staleTime: 300000, + select: (response) => response.data, + }); +}; diff --git a/vite-project/src/pages/ItemDetailPage/index.jsx b/vite-project/src/pages/ItemDetailPage/index.jsx index f5d27841..b9d793f3 100644 --- a/vite-project/src/pages/ItemDetailPage/index.jsx +++ b/vite-project/src/pages/ItemDetailPage/index.jsx @@ -1,10 +1,16 @@ +import { useGetProductCommentsQuery } from "../../hooks/useGetProductComments"; import { useGetProductDetailQuery } from "../../hooks/useGetProductDetail"; import { useParams } from "react-router"; const ItemDetailPage = () => { const params = useParams(); const { productId } = params; - const { data, isLoading, isError, error } = useGetProductDetailQuery({ + const { + data: productDetail, + isLoading, + isError, + error, + } = useGetProductDetailQuery({ productId, }); From 76c1f9038089ded12dbc92276120ac17db9c9f3a Mon Sep 17 00:00:00 2001 From: sanginjeong Date: Sun, 31 Aug 2025 16:05:07 +0900 Subject: [PATCH 09/18] =?UTF-8?q?refactor:=20item=20->=20product=20?= =?UTF-8?q?=EB=A1=9C=EC=9D=B4=EB=A6=84=20=EB=B3=80=EA=B2=BD=20=EB=B0=8F=20?= =?UTF-8?q?=ED=86=B5=EC=9D=BC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- vite-project/public/images/ic_back.svg | 4 ++ vite-project/src/App.css | 4 +- vite-project/src/App.jsx | 12 ++--- .../components/AddItemTagList/index.jsx | 9 ---- .../AddItemPage.style.css | 0 .../AddProductDescription}/index.jsx | 4 +- .../AddProductFormHeader}/index.jsx | 4 +- .../components/AddProductImage}/index.jsx | 4 +- .../components/AddProductName}/index.jsx | 4 +- .../components/AddProductPrice}/index.jsx | 6 +-- .../components/AddProductTag}/index.jsx | 4 +- .../{AddItemPage => AddProductPage}/index.jsx | 28 +++++----- .../src/pages/ItemDetailPage/index.jsx | 20 ------- .../ProductDetailPage.style.css | 20 +++++++ .../components/ProductComments/index.jsx | 5 ++ .../components/ProductDetail/index.jsx | 53 +++++++++++++++++++ .../components/ProductQuestion/index.jsx | 5 ++ .../src/pages/ProductDetailPage/index.jsx | 30 +++++++++++ .../ProductsPage.style.css} | 2 +- .../ProductAll/ProductAllMenuBar.jsx | 0 .../components/ProductAll/index.jsx | 0 .../components/ProductBest/index.jsx | 0 .../{ItemsPage => ProductsPage}/index.jsx | 9 ++-- 23 files changed, 157 insertions(+), 70 deletions(-) create mode 100644 vite-project/public/images/ic_back.svg delete mode 100644 vite-project/src/pages/AddItemPage/components/AddItemTagList/index.jsx rename vite-project/src/pages/{AddItemPage => AddProductPage}/AddItemPage.style.css (100%) rename vite-project/src/pages/{AddItemPage/components/AddItemDescription => AddProductPage/components/AddProductDescription}/index.jsx (72%) rename vite-project/src/pages/{AddItemPage/components/AddItemFormHeader => AddProductPage/components/AddProductFormHeader}/index.jsx (83%) rename vite-project/src/pages/{AddItemPage/components/AddItemImage => AddProductPage/components/AddProductImage}/index.jsx (90%) rename vite-project/src/pages/{AddItemPage/components/AddItemName => AddProductPage/components/AddProductName}/index.jsx (75%) rename vite-project/src/pages/{AddItemPage/components/AddItemPrice => AddProductPage/components/AddProductPrice}/index.jsx (70%) rename vite-project/src/pages/{AddItemPage/components/AddItemTag => AddProductPage/components/AddProductTag}/index.jsx (80%) rename vite-project/src/pages/{AddItemPage => AddProductPage}/index.jsx (83%) delete mode 100644 vite-project/src/pages/ItemDetailPage/index.jsx create mode 100644 vite-project/src/pages/ProductDetailPage/ProductDetailPage.style.css create mode 100644 vite-project/src/pages/ProductDetailPage/components/ProductComments/index.jsx create mode 100644 vite-project/src/pages/ProductDetailPage/components/ProductDetail/index.jsx create mode 100644 vite-project/src/pages/ProductDetailPage/components/ProductQuestion/index.jsx create mode 100644 vite-project/src/pages/ProductDetailPage/index.jsx rename vite-project/src/pages/{ItemsPage/ItemsPage.style.css => ProductsPage/ProductsPage.style.css} (98%) rename vite-project/src/pages/{ItemsPage => ProductsPage}/components/ProductAll/ProductAllMenuBar.jsx (100%) rename vite-project/src/pages/{ItemsPage => ProductsPage}/components/ProductAll/index.jsx (100%) rename vite-project/src/pages/{ItemsPage => ProductsPage}/components/ProductBest/index.jsx (100%) rename vite-project/src/pages/{ItemsPage => ProductsPage}/index.jsx (54%) diff --git a/vite-project/public/images/ic_back.svg b/vite-project/public/images/ic_back.svg new file mode 100644 index 00000000..9ba5ad94 --- /dev/null +++ b/vite-project/public/images/ic_back.svg @@ -0,0 +1,4 @@ + + + + diff --git a/vite-project/src/App.css b/vite-project/src/App.css index cd559b3c..25947ad8 100644 --- a/vite-project/src/App.css +++ b/vite-project/src/App.css @@ -70,8 +70,10 @@ p { } .btn-medium { + width: 240px; height: 48px; - padding: 12px 71px; + padding: 12px 64px; + white-space: nowrap; border-radius: 40px; border: none; font-weight: 600; diff --git a/vite-project/src/App.jsx b/vite-project/src/App.jsx index 6fa5a9c8..2d265dae 100644 --- a/vite-project/src/App.jsx +++ b/vite-project/src/App.jsx @@ -1,10 +1,10 @@ import "./App.css"; import { Route, Routes, Navigate } from "react-router"; -import ItemsPage from "./pages/ItemsPage"; -import AddItemPage from "./pages/AddItemPage"; +import ProductsPage from "./pages/ProductsPage"; +import AddProductPage from "./pages/AddProductPage"; import Layout from "./layout/Layout"; import FreeBoard from "./pages/FreeBoardPage"; -import ItemDetailPage from "./pages/ItemDetailPage"; +import ProductDetailPage from "./pages/ProductDetailPage"; function App() { return ( @@ -14,10 +14,10 @@ function App() { }> - } /> - } /> + } /> + } /> - } /> + } /> {/* freeBoard : link active 테스트를 위해 미리 만듦 */} } />{" "} diff --git a/vite-project/src/pages/AddItemPage/components/AddItemTagList/index.jsx b/vite-project/src/pages/AddItemPage/components/AddItemTagList/index.jsx deleted file mode 100644 index e9f81799..00000000 --- a/vite-project/src/pages/AddItemPage/components/AddItemTagList/index.jsx +++ /dev/null @@ -1,9 +0,0 @@ -import TagBadge from "../../../../common/TagBadge"; - -const AddItemTagList = ({ tags }) => { - return ( - - ); -}; - -export default AddItemTagList; diff --git a/vite-project/src/pages/AddItemPage/AddItemPage.style.css b/vite-project/src/pages/AddProductPage/AddItemPage.style.css similarity index 100% rename from vite-project/src/pages/AddItemPage/AddItemPage.style.css rename to vite-project/src/pages/AddProductPage/AddItemPage.style.css diff --git a/vite-project/src/pages/AddItemPage/components/AddItemDescription/index.jsx b/vite-project/src/pages/AddProductPage/components/AddProductDescription/index.jsx similarity index 72% rename from vite-project/src/pages/AddItemPage/components/AddItemDescription/index.jsx rename to vite-project/src/pages/AddProductPage/components/AddProductDescription/index.jsx index d7a0ec23..690256cc 100644 --- a/vite-project/src/pages/AddItemPage/components/AddItemDescription/index.jsx +++ b/vite-project/src/pages/AddProductPage/components/AddProductDescription/index.jsx @@ -1,4 +1,4 @@ -const AddItemDescription = ({ value, onChange }) => { +const AddProductDescription = ({ value, onChange }) => { return (

    상품 소개

    @@ -13,4 +13,4 @@ const AddItemDescription = ({ value, onChange }) => { ); }; -export default AddItemDescription; +export default AddProductDescription; diff --git a/vite-project/src/pages/AddItemPage/components/AddItemFormHeader/index.jsx b/vite-project/src/pages/AddProductPage/components/AddProductFormHeader/index.jsx similarity index 83% rename from vite-project/src/pages/AddItemPage/components/AddItemFormHeader/index.jsx rename to vite-project/src/pages/AddProductPage/components/AddProductFormHeader/index.jsx index 53e28e2a..de6fafca 100644 --- a/vite-project/src/pages/AddItemPage/components/AddItemFormHeader/index.jsx +++ b/vite-project/src/pages/AddProductPage/components/AddProductFormHeader/index.jsx @@ -1,4 +1,4 @@ -const AddItemFormHeader = ({ formData }) => { +const AddProductFormHeader = ({ formData }) => { const isDisabled = formData.name && formData.price && @@ -19,4 +19,4 @@ const AddItemFormHeader = ({ formData }) => { ); }; -export default AddItemFormHeader; +export default AddProductFormHeader; diff --git a/vite-project/src/pages/AddItemPage/components/AddItemImage/index.jsx b/vite-project/src/pages/AddProductPage/components/AddProductImage/index.jsx similarity index 90% rename from vite-project/src/pages/AddItemPage/components/AddItemImage/index.jsx rename to vite-project/src/pages/AddProductPage/components/AddProductImage/index.jsx index d3e87556..dd7ee4c5 100644 --- a/vite-project/src/pages/AddItemPage/components/AddItemImage/index.jsx +++ b/vite-project/src/pages/AddProductPage/components/AddProductImage/index.jsx @@ -1,6 +1,6 @@ import ErrorMessage from "../../../../common/ErrorMessage"; -const AddItemImage = ({ ref, error, image, onChange, onDelete }) => { +const AddProductImage = ({ ref, error, image, onChange, onDelete }) => { return (

    상품 이미지

    @@ -35,4 +35,4 @@ const AddItemImage = ({ ref, error, image, onChange, onDelete }) => { ); }; -export default AddItemImage; +export default AddProductImage; diff --git a/vite-project/src/pages/AddItemPage/components/AddItemName/index.jsx b/vite-project/src/pages/AddProductPage/components/AddProductName/index.jsx similarity index 75% rename from vite-project/src/pages/AddItemPage/components/AddItemName/index.jsx rename to vite-project/src/pages/AddProductPage/components/AddProductName/index.jsx index e91ad2b7..9e652eb5 100644 --- a/vite-project/src/pages/AddItemPage/components/AddItemName/index.jsx +++ b/vite-project/src/pages/AddProductPage/components/AddProductName/index.jsx @@ -1,4 +1,4 @@ -const AddItemName = ({ value, onChange }) => { +const AddProductName = ({ value, onChange }) => { return (

    상품명

    @@ -13,4 +13,4 @@ const AddItemName = ({ value, onChange }) => { ); }; -export default AddItemName; +export default AddProductName; diff --git a/vite-project/src/pages/AddItemPage/components/AddItemPrice/index.jsx b/vite-project/src/pages/AddProductPage/components/AddProductPrice/index.jsx similarity index 70% rename from vite-project/src/pages/AddItemPage/components/AddItemPrice/index.jsx rename to vite-project/src/pages/AddProductPage/components/AddProductPrice/index.jsx index 338e7ae6..b8187d32 100644 --- a/vite-project/src/pages/AddItemPage/components/AddItemPrice/index.jsx +++ b/vite-project/src/pages/AddProductPage/components/AddProductPrice/index.jsx @@ -1,6 +1,4 @@ -import React from "react"; - -const AddItemPrice = ({ value, onChange }) => { +const AddProductPrice = ({ value, onChange }) => { return (

    판매가격

    @@ -15,4 +13,4 @@ const AddItemPrice = ({ value, onChange }) => { ); }; -export default AddItemPrice; +export default AddProductPrice; diff --git a/vite-project/src/pages/AddItemPage/components/AddItemTag/index.jsx b/vite-project/src/pages/AddProductPage/components/AddProductTag/index.jsx similarity index 80% rename from vite-project/src/pages/AddItemPage/components/AddItemTag/index.jsx rename to vite-project/src/pages/AddProductPage/components/AddProductTag/index.jsx index 5c640ace..3e0f3cd2 100644 --- a/vite-project/src/pages/AddItemPage/components/AddItemTag/index.jsx +++ b/vite-project/src/pages/AddProductPage/components/AddProductTag/index.jsx @@ -1,6 +1,6 @@ import ErrorMessage from "../../../../common/ErrorMessage"; -const AddItemTag = ({ value, onChange, error }) => { +const AddProductTag = ({ value, onChange, error }) => { return (

    태그

    @@ -16,4 +16,4 @@ const AddItemTag = ({ value, onChange, error }) => { ); }; -export default AddItemTag; +export default AddProductTag; diff --git a/vite-project/src/pages/AddItemPage/index.jsx b/vite-project/src/pages/AddProductPage/index.jsx similarity index 83% rename from vite-project/src/pages/AddItemPage/index.jsx rename to vite-project/src/pages/AddProductPage/index.jsx index 3dff4efa..ae1d9dcc 100644 --- a/vite-project/src/pages/AddItemPage/index.jsx +++ b/vite-project/src/pages/AddProductPage/index.jsx @@ -1,14 +1,14 @@ import { useRef, useState } from "react"; import "./AddItemPage.style.css"; -import AddItemDescription from "./components/AddItemDescription"; -import AddItemFormHeader from "./components/AddItemFormHeader"; -import AddItemImage from "./components/AddItemImage"; -import AddItemName from "./components/AddItemName"; -import AddItemPrice from "./components/AddItemPrice"; -import AddItemTag from "./components/AddItemTag"; +import AddProductDescription from "./components/AddProductDescription"; +import AddProductFormHeader from "./components/AddProductFormHeader"; +import AddProductImage from "./components/AddProductImage"; +import AddProductName from "./components/AddProductName"; +import AddProductPrice from "./components/AddProductPrice"; +import AddProductTag from "./components/AddProductTag"; import TagList from "../../common/TagList"; -const AddItemPage = () => { +const AddProductPage = () => { const [formData, setFormData] = useState({ images: [], // required 지만 빈 배열이어도 되는듯 name: "", // required @@ -83,30 +83,30 @@ const AddItemPage = () => { return (
    - - + - handleChange(e, "name")} /> - handleChange(e, "description")} /> - handleChange(e, "price")} />
    - setInputValueTag(e.target.value)} error={errors.tag} @@ -118,4 +118,4 @@ const AddItemPage = () => { ); }; -export default AddItemPage; +export default AddProductPage; diff --git a/vite-project/src/pages/ItemDetailPage/index.jsx b/vite-project/src/pages/ItemDetailPage/index.jsx deleted file mode 100644 index b9d793f3..00000000 --- a/vite-project/src/pages/ItemDetailPage/index.jsx +++ /dev/null @@ -1,20 +0,0 @@ -import { useGetProductCommentsQuery } from "../../hooks/useGetProductComments"; -import { useGetProductDetailQuery } from "../../hooks/useGetProductDetail"; -import { useParams } from "react-router"; - -const ItemDetailPage = () => { - const params = useParams(); - const { productId } = params; - const { - data: productDetail, - isLoading, - isError, - error, - } = useGetProductDetailQuery({ - productId, - }); - - return
    index
    ; -}; - -export default ItemDetailPage; diff --git a/vite-project/src/pages/ProductDetailPage/ProductDetailPage.style.css b/vite-project/src/pages/ProductDetailPage/ProductDetailPage.style.css new file mode 100644 index 00000000..fa126dfa --- /dev/null +++ b/vite-project/src/pages/ProductDetailPage/ProductDetailPage.style.css @@ -0,0 +1,20 @@ +.productDetail-page-layout { + margin-top: 94px; + display: flex; + flex-direction: column; + gap: 64px; +} + +.productDetail-page-comments-area { + display: flex; + flex-direction: column; + gap: 24px; +} + +.back-btn { + display: flex; + justify-content: center; + align-items: center; + background-color: var(--primary100); + gap: 8px; +} diff --git a/vite-project/src/pages/ProductDetailPage/components/ProductComments/index.jsx b/vite-project/src/pages/ProductDetailPage/components/ProductComments/index.jsx new file mode 100644 index 00000000..ed2edaab --- /dev/null +++ b/vite-project/src/pages/ProductDetailPage/components/ProductComments/index.jsx @@ -0,0 +1,5 @@ +const ProductComments = () => { + return
    index
    ; +}; + +export default ProductComments; diff --git a/vite-project/src/pages/ProductDetailPage/components/ProductDetail/index.jsx b/vite-project/src/pages/ProductDetailPage/components/ProductDetail/index.jsx new file mode 100644 index 00000000..0b8e6528 --- /dev/null +++ b/vite-project/src/pages/ProductDetailPage/components/ProductDetail/index.jsx @@ -0,0 +1,53 @@ +import ErrorMessage from "../../../../common/ErrorMessage"; +import LoadingSpinner from "../../../../common/LoadingSpinner"; +import { useGetProductDetailQuery } from "../../../../hooks/useGetProductDetail"; + +const ProductDetail = ({ productId }) => { + const { + data: producInfo, + isLoading, + isError, + error, + } = useGetProductDetailQuery({ + productId, + }); + + if (isLoading) return ; + + if (isError) return ; + + return ( +
    +
    +
    +
    +
    +

    +

    +
    +
    +

    +

    +
    +
    +

    + {/* TagBadge */} +
    +
    + +
    +
    +
    +
    +
    + +
    +
    +
    + ); +}; + +export default ProductDetail; diff --git a/vite-project/src/pages/ProductDetailPage/components/ProductQuestion/index.jsx b/vite-project/src/pages/ProductDetailPage/components/ProductQuestion/index.jsx new file mode 100644 index 00000000..32c1d125 --- /dev/null +++ b/vite-project/src/pages/ProductDetailPage/components/ProductQuestion/index.jsx @@ -0,0 +1,5 @@ +const ProductQuestion = () => { + return
    index
    ; +}; + +export default ProductQuestion; diff --git a/vite-project/src/pages/ProductDetailPage/index.jsx b/vite-project/src/pages/ProductDetailPage/index.jsx new file mode 100644 index 00000000..42988cdb --- /dev/null +++ b/vite-project/src/pages/ProductDetailPage/index.jsx @@ -0,0 +1,30 @@ +import "./ProductDetailPage.style.css"; +import ProductDetail from "./components/ProductDetail"; +import ProductQuestion from "./components/ProductQuestion"; +import ProductComments from "./components/ProductComments"; +import { useParams } from "react-router"; + +const ProductDetailPage = () => { + const params = useParams(); + const { productId } = params; + + return ( +
    + +
    + + +
    + +
    + ); +}; + +export default ProductDetailPage; diff --git a/vite-project/src/pages/ItemsPage/ItemsPage.style.css b/vite-project/src/pages/ProductsPage/ProductsPage.style.css similarity index 98% rename from vite-project/src/pages/ItemsPage/ItemsPage.style.css rename to vite-project/src/pages/ProductsPage/ProductsPage.style.css index d08794c0..e7ea77b3 100644 --- a/vite-project/src/pages/ItemsPage/ItemsPage.style.css +++ b/vite-project/src/pages/ProductsPage/ProductsPage.style.css @@ -1,4 +1,4 @@ -.item-page-layout { +.products-page-layout { margin-top: 70px; height: 1206px; display: flex; diff --git a/vite-project/src/pages/ItemsPage/components/ProductAll/ProductAllMenuBar.jsx b/vite-project/src/pages/ProductsPage/components/ProductAll/ProductAllMenuBar.jsx similarity index 100% rename from vite-project/src/pages/ItemsPage/components/ProductAll/ProductAllMenuBar.jsx rename to vite-project/src/pages/ProductsPage/components/ProductAll/ProductAllMenuBar.jsx diff --git a/vite-project/src/pages/ItemsPage/components/ProductAll/index.jsx b/vite-project/src/pages/ProductsPage/components/ProductAll/index.jsx similarity index 100% rename from vite-project/src/pages/ItemsPage/components/ProductAll/index.jsx rename to vite-project/src/pages/ProductsPage/components/ProductAll/index.jsx diff --git a/vite-project/src/pages/ItemsPage/components/ProductBest/index.jsx b/vite-project/src/pages/ProductsPage/components/ProductBest/index.jsx similarity index 100% rename from vite-project/src/pages/ItemsPage/components/ProductBest/index.jsx rename to vite-project/src/pages/ProductsPage/components/ProductBest/index.jsx diff --git a/vite-project/src/pages/ItemsPage/index.jsx b/vite-project/src/pages/ProductsPage/index.jsx similarity index 54% rename from vite-project/src/pages/ItemsPage/index.jsx rename to vite-project/src/pages/ProductsPage/index.jsx index b6ddf5f1..fefd8cbd 100644 --- a/vite-project/src/pages/ItemsPage/index.jsx +++ b/vite-project/src/pages/ProductsPage/index.jsx @@ -1,15 +1,14 @@ -import React from "react"; -import "./ItemsPage.style.css"; +import "./ProductsPage.style.css"; import ProductBest from "./components/ProductBest"; import ProductAll from "./components/ProductAll"; -const ItemsPage = () => { +const ProductsPage = () => { return ( -
    +
    ); }; -export default ItemsPage; +export default ProductsPage; From 7d76bd0bbd6e725859b7065c932b1ba8fd17688d Mon Sep 17 00:00:00 2001 From: sanginjeong Date: Sun, 31 Aug 2025 16:12:17 +0900 Subject: [PATCH 10/18] =?UTF-8?q?refactor:=20addItem=20->=20addProduct=20?= =?UTF-8?q?=EB=A1=9C=20=ED=81=B4=EB=9E=98=EC=8A=A4=EB=AA=85=20=ED=86=B5?= =?UTF-8?q?=EC=9D=BC=20=EB=B0=8F=20=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- ...age.style.css => AddProductPage.style.css} | 42 +++++++++---------- .../AddProductDescription/index.jsx | 2 +- .../components/AddProductFormHeader/index.jsx | 6 +-- .../components/AddProductImage/index.jsx | 8 ++-- .../components/AddProductName/index.jsx | 2 +- .../components/AddProductPrice/index.jsx | 2 +- .../components/AddProductTag/index.jsx | 2 +- .../src/pages/AddProductPage/index.jsx | 8 ++-- 8 files changed, 36 insertions(+), 36 deletions(-) rename vite-project/src/pages/AddProductPage/{AddItemPage.style.css => AddProductPage.style.css} (64%) diff --git a/vite-project/src/pages/AddProductPage/AddItemPage.style.css b/vite-project/src/pages/AddProductPage/AddProductPage.style.css similarity index 64% rename from vite-project/src/pages/AddProductPage/AddItemPage.style.css rename to vite-project/src/pages/AddProductPage/AddProductPage.style.css index dc13d896..7396b3f9 100644 --- a/vite-project/src/pages/AddProductPage/AddItemPage.style.css +++ b/vite-project/src/pages/AddProductPage/AddProductPage.style.css @@ -1,4 +1,4 @@ -.addItem-page-layout { +.addProduct-page-layout { margin-top: 90px; display: flex; flex-direction: column; @@ -6,35 +6,35 @@ padding-bottom: 50px; } -.addItem-form { +.addProduct-form { display: flex; flex-direction: column; gap: 16px; } -.addItem-form-header { +.addProduct-form-header { display: flex; justify-content: space-between; align-items: center; } -.addItem-form-header-title { +.addProduct-form-header-title { font-weight: 700; font-size: 20px; color: var(--gray800); } -.addItem-form-submit-btn { +.addProduct-form-submit-btn { background-color: var(--primary100); } -.addItem-form-submit-btn:disabled { +.addProduct-form-submit-btn:disabled { background-color: var(--gray400); } -.addItem-input, -.addItem-textArea, -.addItem-image-input { +.addProduct-input, +.addProduct-textArea, +.addProduct-image-input { background-color: var(--gray100); padding: 16px 24px; border-radius: 12px; @@ -44,12 +44,12 @@ color: #1f2937; } -.addItem-input, -.addItem-textArea { +.addProduct-input, +.addProduct-textArea { width: 100%; } -.addItem-image-input { +.addProduct-image-input { cursor: pointer; display: flex; flex-direction: column; @@ -59,38 +59,38 @@ color: var(--gray400); } -.addItem-image-input, -.addItem-image-card { +.addProduct-image-input, +.addProduct-image-card { aspect-ratio: 1; width: 282px; } -.addItem-textArea { +.addProduct-textArea { height: 282px; resize: none; } -.addItem-image-area { +.addProduct-image-area { display: flex; gap: 16px; } -.addItem-image-card { +.addProduct-image-card { position: relative; } -.addItem-image-card > button { +.addProduct-image-card > button { position: absolute; right: 10px; top: 10px; } @media screen and (max-width: 767px) { - .addItem-image-input, - .addItem-image-card { + .addProduct-image-input, + .addProduct-image-card { width: 160px; } - .addItem-image-area { + .addProduct-image-area { gap: 10px; } } diff --git a/vite-project/src/pages/AddProductPage/components/AddProductDescription/index.jsx b/vite-project/src/pages/AddProductPage/components/AddProductDescription/index.jsx index 690256cc..f195400e 100644 --- a/vite-project/src/pages/AddProductPage/components/AddProductDescription/index.jsx +++ b/vite-project/src/pages/AddProductPage/components/AddProductDescription/index.jsx @@ -4,7 +4,7 @@ const AddProductDescription = ({ value, onChange }) => {

    상품 소개