From 4cdc951805636129ec7725a68b7baebed49dd85e Mon Sep 17 00:00:00 2001
From: Brokyeom
Date: Fri, 15 Jul 2022 14:54:29 +0900
Subject: [PATCH 01/68] =?UTF-8?q?[=20=20chore=20=20]=20svg=20=ED=8C=8C?=
=?UTF-8?q?=EC=9D=BC=EB=AA=85=20=EB=B3=80=EA=B2=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
public/assets/icons/CommentIcon.svg | 3 ---
public/assets/icons/commentIcon.svg | 4 ++--
2 files changed, 2 insertions(+), 5 deletions(-)
delete mode 100644 public/assets/icons/CommentIcon.svg
diff --git a/public/assets/icons/CommentIcon.svg b/public/assets/icons/CommentIcon.svg
deleted file mode 100644
index 561d409..0000000
--- a/public/assets/icons/CommentIcon.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-
diff --git a/public/assets/icons/commentIcon.svg b/public/assets/icons/commentIcon.svg
index 45db5bd..561d409 100644
--- a/public/assets/icons/commentIcon.svg
+++ b/public/assets/icons/commentIcon.svg
@@ -1,3 +1,3 @@
-
-
+
From 88ce3f901fab7f37a2fda281afcdd5d10204ac1f Mon Sep 17 00:00:00 2001
From: seohee0112
Date: Wed, 20 Jul 2022 20:04:42 +0900
Subject: [PATCH 58/68] =?UTF-8?q?[=20docs=20]=20=ED=95=84=EC=9A=94?=
=?UTF-8?q?=EC=97=86=EB=8A=94=20=ED=8C=8C=EC=9D=BC=20=EC=82=AD=EC=A0=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
types/environment.d 2.ts | 19 -------------------
1 file changed, 19 deletions(-)
delete mode 100644 types/environment.d 2.ts
diff --git a/types/environment.d 2.ts b/types/environment.d 2.ts
deleted file mode 100644
index 4b7f9ab..0000000
--- a/types/environment.d 2.ts
+++ /dev/null
@@ -1,19 +0,0 @@
-namespace NodeJS {
- interface ProcessEnv extends NodeJS.ProcessEnv {
- // ...
- KAKAO_ID: string;
- KAKAO_SECRET: string;
-
- NEXTAUTH_UR: string;
- SECRET: string;
-
- KAKAO_API_KEY: string;
- KAKAO_SECRECT: string;
-
- NAVER_ID: string;
- NAVER_SECRET: string;
-
- GOOGLE_CLIENT_ID: string;
- GOOGLE_CLIENT_SECRET: string;
- }
-}
From 60bfea36dd61445e2aa41b32b62980c7f0bba36c Mon Sep 17 00:00:00 2001
From: seohee0112
Date: Wed, 20 Jul 2022 20:04:58 +0900
Subject: [PATCH 59/68] =?UTF-8?q?[=20docs=20]=20=ED=95=84=EC=9A=94?=
=?UTF-8?q?=EC=97=86=EB=8A=94=20=ED=8C=8C=EC=9D=BC=20=EC=82=AD=EC=A0=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
types/next-auth.d 2.ts | 12 ------------
1 file changed, 12 deletions(-)
delete mode 100644 types/next-auth.d 2.ts
diff --git a/types/next-auth.d 2.ts b/types/next-auth.d 2.ts
deleted file mode 100644
index c92b6a7..0000000
--- a/types/next-auth.d 2.ts
+++ /dev/null
@@ -1,12 +0,0 @@
-import { DefaultUser } from 'next-auth';
-
-declare module 'next-auth' {
- /**
- * Returned by `useSession`, `getSession` and received as a prop on the `SessionProvider` React Context
- */
- interface Session {
- user: DefaultUser & {
- id: string;
- };
- }
-}
From 501f8106fd0e6c4193799d4410917546063b79ac Mon Sep 17 00:00:00 2001
From: seohee0112
Date: Wed, 20 Jul 2022 20:05:43 +0900
Subject: [PATCH 60/68] =?UTF-8?q?[=20feat=20]=20=EA=B0=80=EA=B2=A9?=
=?UTF-8?q?=EC=A0=95=EB=A0=AC=20=ED=95=84=ED=84=B0=20=EA=B5=AC=ED=98=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
components/common/PriceFilter.tsx | 45 +++++++++++++++++++++++++++++++
components/common/index.ts | 1 +
pages/collectionProduct.tsx | 2 +-
3 files changed, 47 insertions(+), 1 deletion(-)
create mode 100644 components/common/PriceFilter.tsx
diff --git a/components/common/PriceFilter.tsx b/components/common/PriceFilter.tsx
new file mode 100644
index 0000000..f85bed0
--- /dev/null
+++ b/components/common/PriceFilter.tsx
@@ -0,0 +1,45 @@
+import styled from '@emotion/styled';
+
+export interface PriceFilterProps {
+ priceDesc: boolean;
+ handleClickPrice: (clickPrice: string) => void;
+}
+
+export default function PriceFilter(props: PriceFilterProps) {
+ const { priceDesc, handleClickPrice } = props;
+
+ return (
+
+ handleClickPrice('price-desc')}
+ priceDesc={priceDesc}
+ >
+ 낮은 가격순
+
+ |
+ handleClickPrice('price-asc')}
+ priceDesc={!priceDesc}
+ >
+ 높은 가격순
+
+
+ );
+}
+
+const StPriceSection = styled.section`
+ display: flex;
+ align-items: center;
+ column-gap: 1.4rem;
+
+ height: 2rem;
+ margin-top: 2rem;
+
+ color: ${({ theme }) => theme.colors.gray005};
+ ${({ theme }) => theme.fonts.b5_14_medium_140};
+`;
+const StPriceTitle = styled.span<{ priceDesc: boolean }>`
+ color: ${({ priceDesc, theme: { colors } }) =>
+ priceDesc ? colors.black : colors.gray005};
+ cursor: pointer;
+`;
diff --git a/components/common/index.ts b/components/common/index.ts
index a45dedf..81c01a2 100644
--- a/components/common/index.ts
+++ b/components/common/index.ts
@@ -2,3 +2,4 @@ export { default as Error404 } from './Error404';
export { default as Header } from './Header';
export { default as Footer } from './Footer';
export { default as WriteHeader } from './WriteHeader';
+export { default as PriceFilter } from './PriceFilter';
diff --git a/pages/collectionProduct.tsx b/pages/collectionProduct.tsx
index 99e1ace..42db721 100644
--- a/pages/collectionProduct.tsx
+++ b/pages/collectionProduct.tsx
@@ -6,7 +6,7 @@ import {
CollectionList,
} from '../components/collectionProduct';
import { useEffect, useState } from 'react';
-import { getCollectionProduct, useGetCollectionProduct } from '../core/api/toy';
+import { useGetCollectionProduct } from '../core/api/toy';
import { GetCollectionProduct, ToyData } from '../types/toy';
import {
LandingCollectionList,
From ce26340097f957c45517063c4ec33e8035357fb8 Mon Sep 17 00:00:00 2001
From: seohee0112
Date: Wed, 20 Jul 2022 23:09:16 +0900
Subject: [PATCH 61/68] =?UTF-8?q?[=20fix=20]=20=EB=AA=A9=EB=8D=B0=EC=9D=B4?=
=?UTF-8?q?=ED=84=B0=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
core/atom.ts | 57 +++++++++++++++++++
mocks/data/toyMockData.ts | 114 +++++++++++++++++++-------------------
2 files changed, 114 insertions(+), 57 deletions(-)
diff --git a/core/atom.ts b/core/atom.ts
index eea0187..e1838c3 100644
--- a/core/atom.ts
+++ b/core/atom.ts
@@ -2,6 +2,7 @@ import { atom } from 'recoil';
import { recoilPersist } from 'recoil-persist'; //페이지가 변경되더라도 상태관리를 유지
import { PostCommunityBody } from '../types/community';
import { PostLoginBody, UserData } from '../types/user';
+import { FilterTagProps } from '../types/viewProduct';
const { persistAtom } = recoilPersist();
@@ -25,3 +26,59 @@ export const newPostInfoState = atom({
},
effects_UNSTABLE: [persistAtom],
});
+export const filterListState = atom({
+ key: 'filterListState',
+ default: {
+ filterList: {
+ 스토어: [
+ '국민장난감',
+ '그린키드',
+ '러브로',
+ '리틀베이비',
+ '빌리바바',
+ '어텐션홈이벤트',
+ '장난감점빵',
+ '젤리바운스',
+ '해피장난감',
+ ],
+ '사용 연령': [
+ '0~5개월',
+ '6~11개월',
+ '12~17개월',
+ '18~23개월',
+ '24~35개월',
+ '36~47개월',
+ '48~60개월',
+ '기타',
+ ],
+ 가격: ['1만원 미만', '1-3만원', '3-5만원', '5-8만원', '8만원이상'],
+ 특성: ['타고 노는', '만지고 노는', '기타'],
+ '장난감 종류': [
+ '아기체육관',
+ '모빌',
+ '바운서',
+ '쏘서',
+ '점퍼루',
+ '위고',
+ '보행기',
+ '걸음마 보조기',
+ '러닝홈',
+ '러닝테이블',
+ '기타 학습완구',
+ '미끄럼틀',
+ '에어바운스',
+ '트램펄린',
+ '어린이 자동차',
+ '흔들말',
+ '그네',
+ '소꿉놀이',
+ '역할놀이',
+ '기타',
+ ],
+ },
+ },
+});
+export const filterTagState = atom({
+ key: 'filterTagState',
+ default: [],
+});
diff --git a/mocks/data/toyMockData.ts b/mocks/data/toyMockData.ts
index caee170..9d227e8 100644
--- a/mocks/data/toyMockData.ts
+++ b/mocks/data/toyMockData.ts
@@ -7,7 +7,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220517_138/1652797518851PNyB4_JPEG/53933353675306804_1875513620.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/5603097039',
title: '[대여][미개봉새상품] 코니스 알루 에듀하우스',
- month: [2, 3, 4],
+ month: '234',
playHow: 2,
type: 15,
},
@@ -19,7 +19,7 @@ export const toyMockData: ToyData[] = [
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/5603097039',
title: '[대여][미개봉새상품] 코니스 알루 에듀하우스',
- month: [2, 3, 4],
+ month: '234',
playHow: 2,
type: 15,
},
@@ -30,7 +30,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220517_279/1652797636875ob68I_JPEG/53933471468419450_1352510442.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/652873122',
title: '[대여][이벤트] 치코보행기 워키토키보행기 색상랜덤',
- month: [1, 2, 3, 4],
+ month: '1234',
playHow: 1.2,
type: 4,
},
@@ -41,7 +41,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220527_133/16535857670904bdbF_JPEG/54721655802622575_363605804.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/340528065',
title: '[대여] 타이니러브 수더앤그루브 모빌',
- month: [1],
+ month: '1',
playHow: 3,
type: 16,
},
@@ -52,7 +52,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220517_280/1652792980517EnCcu_JPEG/53928826236023069_1936050182.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/4114803348',
title: '[대여][미개봉새상품] 피셔프라이스 클래식 러닝홈(한글+영어)',
- month: [1, 2, 3, 4],
+ month: '1234',
playHow: 2,
type: 15,
},
@@ -63,7 +63,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220527_125/1653583723089GvouY_JPEG/54719568804452882_1435815200.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/347390761',
title: '[대여][놀이매트대여] 피셔프라이스 스마트아기체육관',
- month: [1],
+ month: '1',
playHow: 2,
type: 16,
},
@@ -74,7 +74,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220517_251/1652798916457gfi46_JPEG/53934696167209181_226202150.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/4841766998',
title: '[대여][러닝테이블대여] 립프로그 오피스 러닝테이블',
- month: [1, 2, 3, 4],
+ month: '1234',
playHow: 2,
type: 15,
},
@@ -85,7 +85,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220513_114/1652426483792ULvVN_JPEG/53562329497465240_438575217.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/3365611461',
title: '[대여][미개봉새상품] 아이코닉스 뽀로로플레이하우스 [러닝홈대여]',
- month: [1, 2, 3, 4],
+ month: '1234',
playHow: 2,
type: 15,
},
@@ -97,7 +97,7 @@ export const toyMockData: ToyData[] = [
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/409702101',
title: '[대여][바운서대여] 피셔프라이스 인펀트바운서 (사파리바니)',
- month: [1],
+ month: '1',
playHow: 1.2,
type: 16,
},
@@ -109,7 +109,7 @@ export const toyMockData: ToyData[] = [
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/5402574160',
title: '리락쿠마스프링카뉴어라운드위고잼세션점퍼루레인포레스트점퍼루',
- month: [7],
+ month: '7',
playHow: 1.2,
type: 16,
},
@@ -120,7 +120,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20161106_25/funny819_14784164485977NbFz_JPEG/2762750353457556_-1424658577.JPG?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/340552945',
title: '[대여] 이븐플로 트리플펀 애니멀 쏘서',
- month: [1.2],
+ month: '1',
playHow: 1.2,
type: 1,
},
@@ -131,7 +131,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220527_175/1653580292282GTWXU_JPEG/54716180994878872_2126553779.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/743114098',
title: '[대여][아기체육관대여] 뽀로로 냠냠 러닝테이블',
- month: [1, 2, 3, 4],
+ month: '1234',
playHow: 2,
type: 16,
},
@@ -142,7 +142,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220105_295/1641326636737rUduN_JPEG/42462525234087104_1544321832.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/652861589',
title: '[대여][이벤트] 뉴 레인포레스트점퍼루',
- month: [1, 2, 3],
+ month: '123',
playHow: 1.2,
type: 2,
},
@@ -153,7 +153,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220527_66/1653582018240CoLrP_JPEG/54717851842664330_783982689.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/347390980',
title: '[대여][주말특가] 브이텍 액티비티 아기체육관 놀이매트',
- month: [1],
+ month: '1',
playHow: 2,
type: 16,
},
@@ -164,7 +164,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220104_128/16412357318018IiQi_JPEG/42371577513218573_1831992680.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/478450038',
title: '[대여][특A급] 코코몽스프링카',
- month: [2, 3, 4, 5, 6],
+ month: '23456',
playHow: 1,
type: 12,
},
@@ -175,7 +175,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220104_130/1641237955192H1HM6_JPEG/42373789014307039_791521141.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/2149323729',
title: '[대여][쏘서대여] 이븐플로 더블펀 범블리 쏘서',
- month: [1.2],
+ month: '1',
playHow: 1.2,
type: 1,
},
@@ -187,7 +187,7 @@ export const toyMockData: ToyData[] = [
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/352076171',
title: '[대여][에듀볼대여] 코니스 에듀플러스',
- month: [7],
+ month: '7',
playHow: 2,
type: 9,
},
@@ -200,7 +200,7 @@ export const toyMockData: ToyData[] = [
title:
'[대여][새상품 대여] 레인포레스트 개구리 점퍼루 클래식러닝홈 에듀 하우스 뉴 액티비티 가든',
- month: [7],
+ month: '7',
playHow: 1.2,
type: 16,
},
@@ -211,7 +211,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220513_216/1652428561188U7kfo_JPEG/53564395966025185_1431614193.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/343326711',
title: '[대여][러닝홈대여] 피셔프라이스 클래식 러닝홈',
- month: [1, 2, 3, 4],
+ month: '1234',
playHow: 2,
type: 15,
},
@@ -222,7 +222,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220517_261/1652797896674aUx5h_JPEG/53933731496935812_724646728.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/5587848225',
title: '[대여][미개봉새상품] 브라이트스타트 2in1 어라운드위고 (핑크그린)',
- month: [1.2],
+ month: '1',
playHow: 1.2,
type: 3,
},
@@ -234,7 +234,7 @@ export const toyMockData: ToyData[] = [
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/4714347849',
title: '[대여][최신상] 졸리점퍼 오리지널 스탠드 점퍼루 한달대여',
- month: [1, 2, 3],
+ month: '123',
playHow: 1,
type: 2,
},
@@ -245,7 +245,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220515_198/1652621177625au1RO_JPEG/53757066111720943_1647866967.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/4833029139',
title: '[대여][1회대여품] 콤비 아기보행기 YT-180 색상랜덤',
- month: [1, 2, 3, 4],
+ month: '1234',
playHow: 1,
type: 4,
},
@@ -256,7 +256,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220517_61/1652724368346qWtdV_JPEG/53860202156236210_670098478.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/528777872',
title: '[대여][이벤트] 피셔프라이스 레인포레스트 개구리 점퍼루',
- month: [1, 2, 3],
+ month: '123',
playHow: 1.2,
type: 2,
},
@@ -267,7 +267,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220515_37/16526266991919qUys_JPEG/53762597900683658_1841871787.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/343324464',
title: '[대여][점퍼루대여] 이븐플로 엑서쏘서 점프앤런 퀘스트점퍼루',
- month: [1, 2, 3],
+ month: '123',
playHow: 1.2,
type: 2,
},
@@ -279,7 +279,7 @@ export const toyMockData: ToyData[] = [
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/3365473515',
title: '[대여][발판만무음] 피셔프라이스 스텝앤플레이 [쏘서대여]',
- month: [1, 2, 3, 4],
+ month: '1234',
playHow: 1.2,
type: 1,
},
@@ -291,7 +291,7 @@ export const toyMockData: ToyData[] = [
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/347391125',
title: '[대여][바운서대여][새상품대여] 컴포트커브바운서',
- month: [1],
+ month: '1',
playHow: 1,
type: 16,
},
@@ -303,7 +303,7 @@ export const toyMockData: ToyData[] = [
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/488261903',
title: '[대여][러닝테이블대여] 코니토이즈 에듀테이블',
- month: [1, 2, 3, 4, 5],
+ month: '12345',
playHow: 2,
type: 16,
},
@@ -314,7 +314,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220517_16/1652795910857kjUHI_JPEG/53931745690420048_1892994417.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/409703696',
title: '[대여][빠른출고] 이븐플로 아마존 엑서 쏘서 대여',
- month: [1.2],
+ month: '1',
playHow: 1.2,
type: 1,
},
@@ -326,7 +326,7 @@ export const toyMockData: ToyData[] = [
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/5700723461',
title: '[대여][러닝홈대여] 코니스 알루 에듀하우스',
- month: [2, 3, 4],
+ month: '234',
playHow: 2,
type: 15,
},
@@ -337,7 +337,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220515_222/1652626583722h3CLI_JPEG/53762481776957935_920408372.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/343324436',
title: '[대여][점퍼루대여] 이븐플로 엑서쏘서 점프앤런 잼세션점퍼루',
- month: [1.2],
+ month: '1',
playHow: 1.2,
type: 1.2,
},
@@ -348,7 +348,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220512_225/16523649823680E0Be_JPEG/53500881065446036_1470656795.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/4924597183',
title: '[대여][스프링카대여] 리락쿠마 스프링카',
- month: [2, 3, 4, 5, 6],
+ month: '23456',
playHow: 1,
type: 12,
},
@@ -359,7 +359,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220517_255/1652794864079O0TDy_JPEG/53930643628975707_728414434.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/3365515882',
title: '[대여][1회대여품] 아이코닉스 뽀로로플레이하우스 [러닝홈대여]',
- month: [1, 2, 3, 4],
+ month: '1234',
playHow: 2,
type: 15,
},
@@ -370,7 +370,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220620_156/1655728419945HWgbi_JPEG/56864315682474276_491766810.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/5651507914',
title: '[대여][최신상위고] 브라이트스타트 2in1 어라운드위고 (그린)',
- month: [1.2],
+ month: '1',
playHow: 1.2,
type: 3,
},
@@ -381,7 +381,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20191030_60/1572425264829BjvtI_JPEG/9786807434903694_1661144876.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/448042081',
title: '[대여][미개봉새상품] 이븐플로 뉴 트리플펀 아마존쏘서',
- month: [1.2],
+ month: '1',
playHow: 1.2,
type: 1,
},
@@ -392,7 +392,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220104_116/164123662398474VnF_JPEG/42372469705063959_1418040237.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/343326192',
title: '[대여][걸음마보조기대여] 브이텍 한영걸음마보조기',
- month: [1, 2, 3, 4],
+ month: '1234',
playHow: 2,
type: 5,
},
@@ -403,7 +403,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220104_27/1641231139215wkdfg_JPEG/42366981931166593_660902197.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/4840331199',
title: '[대여][미개봉새상품] 브이텍 뉴 걸음마보조기 스마트폴딩 (한영)',
- month: [2, 3, 4],
+ month: '234',
playHow: 2,
type: 5,
},
@@ -415,7 +415,7 @@ export const toyMockData: ToyData[] = [
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/509708593',
title:
'[대여][주말특가] 피셔프라이스 피아노짐 아기체육관 놀이매트 블루블루블루블루블루블루블루블루블루블루블루블루블루블루블루블루',
- month: [1],
+ month: '1',
playHow: 2,
type: 16,
},
@@ -426,7 +426,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220517_80/1652755478356Kfnk7_JPEG/53891366698867973_1174016960.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/5481860024',
title: '[대여][최신상] 피셔프라이스 동물친구 액티비티 점퍼루',
- month: [1, 2, 3],
+ month: '123',
playHow: 1.2,
type: 2,
},
@@ -438,7 +438,7 @@ export const toyMockData: ToyData[] = [
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/3922165177',
title:
'[대여][주말특가] 피셔프라이스 디럭스 피아노아기체육관 놀이매트 (그린핑크)',
- month: [1],
+ month: '1',
playHow: 2,
type: 16,
},
@@ -449,7 +449,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220517_4/1652797783737MdRkz_JPEG/53933618477874952_1598877067.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/5544475519',
title: '[대여][미개봉새상품] 브라이트스타트 2in1 어라운드위고 (그린핑크)',
- month: [1.2],
+ month: '1',
playHow: 1.2,
type: 3,
},
@@ -461,7 +461,7 @@ export const toyMockData: ToyData[] = [
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/3365610176',
title: '[대여][발판정상] 피셔프라이스 스텝앤플레이 [쏘서대여]',
- month: [1, 2, 3, 4],
+ month: '1234',
playHow: 1.2,
type: 1,
},
@@ -472,7 +472,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220527_120/1653581582785h4CXq_JPEG/54717478511931572_1689731001.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/4841736386',
title: '[대여][놀이매트대여] 뽀로로 아기체육관',
- month: [1],
+ month: '1',
playHow: 2,
type: 16,
},
@@ -483,7 +483,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220104_116/1641237884844qVxeE_JPEG/42373718664743351_272214533.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/5133814524',
title: '[대여][쏘서대여] 브라이트스타트 액티비티 짐앤쏘서',
- month: [1.2],
+ month: '1',
playHow: 1.2,
type: 1,
},
@@ -494,7 +494,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220517_11/1652755333412DpjW8_JPEG/53891221871157916_314454492.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/575460370',
title: '[대여][미개봉새상품] 리틀타익스 뉴액티비티가든',
- month: [1, 2, 3, 4],
+ month: '1234',
playHow: 2,
type: 15,
},
@@ -505,7 +505,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220517_21/16527930808023OcQf_JPEG/53928926521118129_908567588.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/6030139358',
title: '[대여][최신상점퍼루] 디즈니 미니마우스 액티비티 점퍼루',
- month: [1, 2, 3],
+ month: '123',
playHow: 1.2,
type: 2,
},
@@ -517,7 +517,7 @@ export const toyMockData: ToyData[] = [
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/359905354',
title:
'[대여][당일출고][1회대여품] 브라이트스타트 뉴 어라운드위고 [위고대여]',
- month: [1.2],
+ month: '1',
playHow: 1.2,
type: 3,
},
@@ -528,7 +528,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220517_149/1652798435635vL4FT_JPEG/53934324347534643_2036632789.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/4815430882',
title: '[대여][러닝테이블대여] 피셔프라이스 래프앤런 더타운 뉴 러닝테이블',
- month: [1, 2, 3, 4],
+ month: '1234',
playHow: 2,
type: 16,
},
@@ -539,7 +539,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20161130_184/funny819_1480447322835hzWc2_JPEG/4712111391855414_-1901234396.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/352075709',
title: '[대여][흔들말대여] 스텝투 파란말',
- month: [2, 3, 4, 5, 6],
+ month: '23456',
playHow: 1,
type: 13,
},
@@ -550,7 +550,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220517_261/1652797896674aUx5h_JPEG/53933731496935812_724646728.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/5639322937',
title: '[대여][최신상위고] 브라이트스타트 2in1 어라운드위고 (핑크)',
- month: [1.2],
+ month: '1',
playHow: 1.2,
type: 3,
},
@@ -561,7 +561,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220527_184/1653578639562uikPV_JPEG/54714467391159718_929992659.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/4957820454',
title: '[대여][걸음마대여] 브이텍 뉴 걸음마보조기 스마트폴딩 (한글영어)',
- month: [1, 2, 3, 4],
+ month: '1234',
playHow: 2,
type: 5,
},
@@ -572,7 +572,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220620_217/1655728508035xuXss_JPEG/56864403652682863_1698835152.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/5391501795',
title: '[대여][최신상위고] 뉴 피아노 어라운드위고 베이비아인슈타인',
- month: [1.2],
+ month: '1',
playHow: 1.2,
type: 3,
},
@@ -585,7 +585,7 @@ export const toyMockData: ToyData[] = [
title:
'[대여][아기의자대여] 마마스앤파파스 스너그 (트레이완구포함) [스너그대여]',
- month: [1.2],
+ month: '1',
playHow: 1.2,
type: 16,
},
@@ -596,7 +596,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20161130_100/funny819_14804468422911jfrn_JPEG/4793144049060314_-1814703675.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/343324309',
title: '[대여] 이븐플로 트리플펀 월드익스플로러쏘서',
- month: [1.2],
+ month: '1',
playHow: 1.2,
type: 1,
},
@@ -607,7 +607,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220517_16/1652795910857kjUHI_JPEG/53931745690420048_1892994417.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/4945079387',
title: '[대여][1회대여품] 이븐플로 트리플펀 아마존쏘서',
- month: [1.2],
+ month: '1',
playHow: 1.2,
type: 1,
},
@@ -619,7 +619,7 @@ export const toyMockData: ToyData[] = [
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/409701531',
title:
'[대여][특A급][1회대여품] 2017 피셔프라이스 컴포트커브바운서 [바운서대여]',
- month: [1],
+ month: '1',
playHow: 1,
type: 16,
},
@@ -630,7 +630,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220517_11/1652755333412DpjW8_JPEG/53891221871157916_314454492.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/575080464',
title: '[대여][러닝홈대여] 리틀타익스 뉴액티비티가든',
- month: [1, 2, 3, 4],
+ month: '1234',
playHow: 2,
type: 15,
},
@@ -641,7 +641,7 @@ export const toyMockData: ToyData[] = [
'https://shop-phinf.pstatic.net/20220517_291/1652755240176KfL3q_JPEG/53891128414300240_395706309.jpg?type=f295_381',
siteUrl: 'https://smartstore.naver.com/kukmintoy/products/5973546077',
title: '[대여][최신상점퍼루] 니모 액티비티 점퍼루',
- month: [1, 2, 3],
+ month: '123',
playHow: 1.2,
type: 2,
},
From b5e77d64b52f7d9291aedd8a01ca61d1c92ec00d Mon Sep 17 00:00:00 2001
From: seohee0112
Date: Wed, 20 Jul 2022 23:11:02 +0900
Subject: [PATCH 62/68] =?UTF-8?q?[=20feat=20]=20=EA=B0=80=EA=B2=A9=20?=
=?UTF-8?q?=EC=A0=95=EB=A0=AC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
pages/viewProduct.tsx | 60 ++++++++++++-------------------------------
types/viewProduct.ts | 7 +++++
2 files changed, 23 insertions(+), 44 deletions(-)
diff --git a/pages/viewProduct.tsx b/pages/viewProduct.tsx
index 02a6e41..535d41f 100644
--- a/pages/viewProduct.tsx
+++ b/pages/viewProduct.tsx
@@ -4,7 +4,6 @@ import {
ViewProductBanner,
} from '../components/viewProduct';
import styled from '@emotion/styled';
-import { IcPriceLine, IcTopBtn, IcWriteBtn } from '../public/assets/icons';
import { useState } from 'react';
import { ToyList } from '../components/viewProduct';
import {
@@ -13,25 +12,25 @@ import {
LandingPriceSort,
LandingProductFilter,
} from '../components/landing/viewProduct';
+import { PriceFilter } from '../components/common';
+import { ToyData } from '../types/toy';
export default function viewProduct() {
//default는 낮은 가격순
- const [selectPrice, setSelectPrice] = useState([true, false]);
- // useSWR로 로딩 판단할 것임
- const isLoading = false;
- const handlePriceSort = (idx: number) => {
- //이미 해당 버튼이 눌려져있다면 return
- if (selectPrice[idx]) return;
- setSelectPrice({
- ...selectPrice,
- [0]: !selectPrice[0],
- [1]: !selectPrice[1],
- });
+ const [priceDesc, setPriceDesc] = useState(true);
+ const [toyList, setToyList] = useState([]);
+
+ const handleClickPrice = (clickPrice: string) => {
+ clickPrice === 'price-desc' ? setPriceDesc(true) : setPriceDesc(false);
};
+ // let { productList, isLoading, isError } = priceDesc
+ // ? (useGetCollectionProduct('price-desc') as GetCollectionProduct)
+ // : (useGetCollectionProduct('price-asc') as GetCollectionProduct);
+
return (
- {isLoading ? (
+ {false ? (
<>
@@ -55,21 +54,10 @@ export default function viewProduct() {
-
- handlePriceSort(0)}
- isClicked={selectPrice[0]}
- >
- 낮은 가격순
-
-
- handlePriceSort(1)}
- isClicked={selectPrice[1]}
- >
- 높은 가격순
-
-
+
@@ -102,22 +90,6 @@ const StFilterBarWrapper = styled.div`
display: flex;
justify-content: flex-end;
`;
-const StPriceSort = styled.div`
- display: flex;
- align-items: center;
- column-gap: 1.4rem;
-
- height: 2rem;
- margin-top: 2rem;
-
- ${({ theme }) => theme.fonts.b5_14_medium_140};
-
- cursor: pointer;
-`;
-const StPriceStandard = styled.h3<{ isClicked: boolean }>`
- color: ${({ isClicked, theme: { colors } }) =>
- isClicked ? colors.black : colors.gray005};
-`;
const StContentSection = styled.section`
display: flex;
flex-direction: column;
diff --git a/types/viewProduct.ts b/types/viewProduct.ts
index 9f58656..d394b46 100644
--- a/types/viewProduct.ts
+++ b/types/viewProduct.ts
@@ -4,5 +4,12 @@ export interface FilterDropdownProps {
isDrop: boolean;
isExcept: boolean;
checkedItem: Set;
+ categoryKey: string;
handleCheckedItems: (copyCheckedItem: Set, idx: number) => void;
}
+export interface FilterTagProps {
+ categoryIdx: number;
+ elementIdx: number;
+ categoryKey: string;
+ tagText: string;
+}
From 687378f774238e4daabee568ded69f137fea3ac1 Mon Sep 17 00:00:00 2001
From: seohee0112
Date: Wed, 20 Jul 2022 23:11:35 +0900
Subject: [PATCH 63/68] =?UTF-8?q?[=20feat=20]=20api=20=EC=97=B0=EA=B2=B0?=
=?UTF-8?q?=20=ED=86=B5=EC=8B=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
core/api/viewProduct.ts | 19 +++++++++++++++++++
1 file changed, 19 insertions(+)
create mode 100644 core/api/viewProduct.ts
diff --git a/core/api/viewProduct.ts b/core/api/viewProduct.ts
new file mode 100644
index 0000000..e0eb76e
--- /dev/null
+++ b/core/api/viewProduct.ts
@@ -0,0 +1,19 @@
+import useSWR from 'swr';
+import { baseInstance } from '../axios';
+
+export const useGetViewProduct = () => {};
+export const getViewProduct = () => {};
+
+export const useGetBannerViewProduct = (params: { category: number }) => {
+ const { data, error } = useSWR(['/toy/list', params], baseInstance.get, {
+ errorRetryCount: 3,
+ });
+ return {
+ toyFilterList: data,
+ isLoading: !error && !data,
+ isError: error,
+ };
+};
+export const getBannerViewProduct = () => {
+ return;
+};
From c29326c40c81da0efaf508518805758f5a55a090 Mon Sep 17 00:00:00 2001
From: seohee0112
Date: Wed, 20 Jul 2022 23:15:13 +0900
Subject: [PATCH 64/68] =?UTF-8?q?[=20fix=20]=20atom=20=EC=A0=81=EC=9A=A9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
components/viewProduct/ProductFilter.tsx | 55 +++---------------------
1 file changed, 7 insertions(+), 48 deletions(-)
diff --git a/components/viewProduct/ProductFilter.tsx b/components/viewProduct/ProductFilter.tsx
index a2747b7..c6efe29 100644
--- a/components/viewProduct/ProductFilter.tsx
+++ b/components/viewProduct/ProductFilter.tsx
@@ -3,59 +3,15 @@ import { LoaderValue } from 'next/dist/shared/lib/image-config';
import React, { EventHandler, useState } from 'react';
import { IcClose, IcOpen } from '../../public/assets/icons';
import FilterDropdown from './FilterDropdown';
-
+import { useRecoilState, useRecoilValue } from 'recoil';
+import { filterListState } from '../../core/atom';
interface ProductFilterIcon {
title: string;
value: boolean;
}
export default function ProductFilter() {
- const filterList = {
- 스토어: [
- '국민장난감',
- '그린키드',
- '러브로',
- '리틀베이비',
- '빌리바바',
- '어텐션홈이벤트',
- '장난감점빵',
- '젤리바운스',
- '해피장난감',
- ],
- '사용 연령': [
- '0~5개월',
- '6~11개월',
- '12~17개월',
- '18~23개월',
- '24~35개월',
- '36~47개월',
- '48~60개월',
- '기타',
- ],
- 가격: ['1만원 미만', '1-3만원', '3-5만원', '5-8만원', '8만원이상'],
- 특성: ['타고 노는', '만지고 노는', '기타'],
- '장난감 종류': [
- '아기체육관',
- '모빌',
- '바운서',
- '쏘서',
- '점퍼루',
- '위고',
- '보행기',
- '걸음마 보조기',
- '러닝홈',
- '러닝테이블',
- '기타 학습완구',
- '미끄럼틀',
- '에어바운스',
- '트램펄린',
- '어린이 자동차',
- '흔들말',
- '그네',
- '소꿉놀이',
- '역할놀이',
- '기타',
- ],
- };
+ const { filterList } = useRecoilValue(filterListState);
+
const filterListData = Object.values(filterList);
const filterListKeys = Object.keys(filterList);
const [visibility, setVisibility] = useState([
@@ -72,6 +28,8 @@ export default function ProductFilter() {
new Set(),
new Set(),
]);
+ console.log(checkedItems);
+
const handleDropdown = (idx: number) => {
setVisibility({
...visibility,
@@ -124,6 +82,7 @@ export default function ProductFilter() {
isExcept={idx == 3 ? true : false}
isDrop={visibility[idx]}
checkedItem={checkedItems[idx]}
+ categoryKey={title}
handleCheckedItems={handleCheckedItems}
/>
)}
From b323d76cef464cdc7b095f02faa72cd283814bad Mon Sep 17 00:00:00 2001
From: seohee0112
Date: Thu, 21 Jul 2022 00:05:18 +0900
Subject: [PATCH 65/68] =?UTF-8?q?[=20feat=20]=20common=20=EC=97=90=20?=
=?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=EB=84=A4=EC=9D=B4=EC=85=98=20?=
=?UTF-8?q?=EA=B5=AC=ED=98=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
components/common/index.ts | 1 +
1 file changed, 1 insertion(+)
diff --git a/components/common/index.ts b/components/common/index.ts
index 81c01a2..a1ac9f7 100644
--- a/components/common/index.ts
+++ b/components/common/index.ts
@@ -3,3 +3,4 @@ export { default as Header } from './Header';
export { default as Footer } from './Footer';
export { default as WriteHeader } from './WriteHeader';
export { default as PriceFilter } from './PriceFilter';
+export { default as PageNavigation } from './PageNavigation';
From 7a0293d8c9a8452f22ab5a314b5db4a9182d5b6d Mon Sep 17 00:00:00 2001
From: seohee0112
Date: Thu, 21 Jul 2022 00:06:07 +0900
Subject: [PATCH 66/68] =?UTF-8?q?[=20feat=20]=20=ED=8E=98=EC=9D=B4?=
=?UTF-8?q?=EC=A7=80=EB=84=A4=EC=9D=B4=EC=85=98=20viewProduct=20=EC=97=90?=
=?UTF-8?q?=20=EC=A0=81=EC=9A=A9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../collectionProduct/CollectionList.tsx | 10 +--
components/common/PageNavigation.tsx | 88 +++++++++++++++++++
components/viewProduct/ToyList.tsx | 21 +++--
pages/viewProduct.tsx | 56 ++++++++++--
4 files changed, 151 insertions(+), 24 deletions(-)
create mode 100644 components/common/PageNavigation.tsx
diff --git a/components/collectionProduct/CollectionList.tsx b/components/collectionProduct/CollectionList.tsx
index 8f9da63..b5ef9fb 100644
--- a/components/collectionProduct/CollectionList.tsx
+++ b/components/collectionProduct/CollectionList.tsx
@@ -10,15 +10,15 @@ export default function CollectionList(props: CollectionListProps) {
const { toyList } = props;
return (
- {toyList.map((toy, idx) => (
+ {toyList.map(({ image, title, price, month, siteUrl }, idx) => (
))}
diff --git a/components/common/PageNavigation.tsx b/components/common/PageNavigation.tsx
new file mode 100644
index 0000000..0876069
--- /dev/null
+++ b/components/common/PageNavigation.tsx
@@ -0,0 +1,88 @@
+import styled from '@emotion/styled';
+import { css } from '@emotion/react';
+import {
+ IcLeftArrow,
+ IcLeftArrowFill,
+ IcRightArrow,
+ IcRightArrowFill,
+} from '../../public/assets/icons';
+
+interface PageNavigationProps {
+ currentPage: number;
+ lastPage: number;
+ handleCurrentPage: (nextPage: number) => void;
+}
+
+export default function PageNavigation(props: PageNavigationProps) {
+ const { currentPage, lastPage, handleCurrentPage } = props;
+
+ const pageArray =
+ currentPage % 5 === 0
+ ? new Array(5)
+ .fill(0)
+ .map((_, idx) => (Math.floor(currentPage / 5) - 1) * 5 + idx + 1)
+ : lastPage > Math.ceil(currentPage / 5) * 5
+ ? new Array(5)
+ .fill(0)
+ .map((_, idx) => Math.floor(currentPage / 5) * 5 + idx + 1)
+ : new Array(lastPage - Math.floor(currentPage / 5) * 5)
+ .fill(0)
+ .map((_, idx) => Math.floor(currentPage / 5) * 5 + idx + 1);
+
+ const handlePreviousGroupPage = () => {
+ handleCurrentPage(pageArray[0] - 1);
+ };
+ const handleNextGroupPage = () => {
+ handleCurrentPage(pageArray[pageArray.length - 1] + 1);
+ };
+
+ const handlePageNumber = (e: React.MouseEvent) => {
+ const target = e.target as HTMLAnchorElement;
+ handleCurrentPage(Number(target.innerHTML));
+ };
+ return (
+
+ {Math.floor(currentPage / 5) >= 1 && currentPage !== 5 ? (
+
+ ) : (
+
+ )}
+ {pageArray.map((page) => (
+ handleCurrentPage(page)}
+ >
+ {page}
+
+ ))}
+ {lastPage > Math.ceil(currentPage / 5) * 5 ? (
+
+ ) : (
+
+ )}
+
+ );
+}
+
+const StNavigationWrapper = styled.nav`
+ display: flex;
+ justify-content: space-around;
+ align-items: center;
+
+ width: 22.2rem;
+ margin-bottom: 12rem;
+
+ cursor: pointer;
+`;
+const StPageNumberA = styled.a<{ isCurrent: boolean }>`
+ ${({ isCurrent }) =>
+ isCurrent
+ ? css`
+ color: #1db981;
+ `
+ : css`
+ color: #787878;
+ `};
+ ${({ theme }) => theme.fonts.b3_16_medium_140}
+`;
diff --git a/components/viewProduct/ToyList.tsx b/components/viewProduct/ToyList.tsx
index 874c881..017bdf5 100644
--- a/components/viewProduct/ToyList.tsx
+++ b/components/viewProduct/ToyList.tsx
@@ -1,26 +1,25 @@
import styled from '@emotion/styled';
-import keyframes from '@emotion/react';
+import { ToyData } from '../../types/toy';
import ToyPreview from './ToyPreview';
interface ToyListProps {
- length: number;
- landingCategory: string;
+ toyList: ToyData[];
}
export default function ToyList(props: ToyListProps) {
- const { length, landingCategory } = props;
- const toyList = new Array(length).fill(0);
+ const { toyList } = props;
+
return (
- {toyList.map((_, idx) => (
+ {toyList.map(({ image, title, price, month, siteUrl }, idx) => (
))}
diff --git a/pages/viewProduct.tsx b/pages/viewProduct.tsx
index 535d41f..bd6e295 100644
--- a/pages/viewProduct.tsx
+++ b/pages/viewProduct.tsx
@@ -4,7 +4,7 @@ import {
ViewProductBanner,
} from '../components/viewProduct';
import styled from '@emotion/styled';
-import { useState } from 'react';
+import { useState, useEffect } from 'react';
import { ToyList } from '../components/viewProduct';
import {
LandingViewProductBanner,
@@ -12,22 +12,43 @@ import {
LandingPriceSort,
LandingProductFilter,
} from '../components/landing/viewProduct';
-import { PriceFilter } from '../components/common';
+import { PriceFilter, PageNavigation } from '../components/common';
import { ToyData } from '../types/toy';
+import { toyMockData } from '../mocks/data/toyMockData';
+import { GetServerSideProps, InferGetServerSidePropsType } from 'next';
-export default function viewProduct() {
+const limit = 40;
+
+export default function viewProduct({
+ data,
+}: InferGetServerSidePropsType) {
//default는 낮은 가격순
const [priceDesc, setPriceDesc] = useState(true);
const [toyList, setToyList] = useState([]);
-
+ const [currentPage, setCurrentPage] = useState(1);
+ console.log(data);
const handleClickPrice = (clickPrice: string) => {
clickPrice === 'price-desc' ? setPriceDesc(true) : setPriceDesc(false);
};
+ const handleCurrentPage = (nextPage: number) => {
+ setCurrentPage(nextPage);
+ };
+
// let { productList, isLoading, isError } = priceDesc
// ? (useGetCollectionProduct('price-desc') as GetCollectionProduct)
// : (useGetCollectionProduct('price-asc') as GetCollectionProduct);
+ useEffect(() => {
+ if (data) {
+ const filterData = data.filter(
+ (_, idx) => (currentPage - 1) * 40 <= idx && idx < currentPage * 40,
+ );
+ setToyList(filterData);
+ window.scrollTo(0, 0);
+ }
+ }, [data, currentPage]);
+
return (
{false ? (
@@ -60,13 +81,23 @@ export default function viewProduct() {
/>
-
-
-
-
+ {toyList.map(
+ (_, idx) =>
+ (idx + 1) % 4 === 0 && (
+
+ ),
+ )}
+
>
)}
@@ -100,3 +131,12 @@ const StToyListWrapper = styled.section`
margin-top: 2rem;
`;
+
+export const getServerSideProps: GetServerSideProps = async (context) => {
+ const data: ToyData[] = toyMockData;
+ return {
+ props: {
+ data,
+ },
+ };
+};
From 3282f113e6583de6f44b8dfcb72b0f9707512e19 Mon Sep 17 00:00:00 2001
From: seohee0112
Date: Thu, 21 Jul 2022 00:08:12 +0900
Subject: [PATCH 67/68] =?UTF-8?q?[=20docs=20]=20=EC=A3=BC=EC=84=9D?=
=?UTF-8?q?=EC=9C=BC=EB=A1=9C=20ssr=20=EB=84=A3=EA=B8=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
pages/collectionProduct.tsx | 11 +++++++++++
1 file changed, 11 insertions(+)
diff --git a/pages/collectionProduct.tsx b/pages/collectionProduct.tsx
index 42db721..ba36f60 100644
--- a/pages/collectionProduct.tsx
+++ b/pages/collectionProduct.tsx
@@ -104,3 +104,14 @@ const StCollectionTitle = styled.h4`
const StToyListWrapper = styled.section`
margin: 0rem 37.2rem;
`;
+// export async function getStaticProps(context: NextPageContext) {
+// const res = await getCollectionProduct(`1`);
+// const initialData = res.data;
+// console.log(initialData);
+
+// return {
+// props: {
+// initialData,
+// },
+// };
+// }
From 494b0300a0d12d8ce31b74d690c059a6b6a56b48 Mon Sep 17 00:00:00 2001
From: seohee0112
Date: Thu, 21 Jul 2022 00:09:43 +0900
Subject: [PATCH 68/68] =?UTF-8?q?[=20fix=20]=20=ED=83=80=EC=9E=85=EC=A7=80?=
=?UTF-8?q?=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
pages/viewProduct.tsx | 3 ++-
1 file changed, 2 insertions(+), 1 deletion(-)
diff --git a/pages/viewProduct.tsx b/pages/viewProduct.tsx
index bd6e295..a752677 100644
--- a/pages/viewProduct.tsx
+++ b/pages/viewProduct.tsx
@@ -42,7 +42,8 @@ export default function viewProduct({
useEffect(() => {
if (data) {
const filterData = data.filter(
- (_, idx) => (currentPage - 1) * 40 <= idx && idx < currentPage * 40,
+ (_: any, idx: number) =>
+ (currentPage - 1) * 40 <= idx && idx < currentPage * 40,
);
setToyList(filterData);
window.scrollTo(0, 0);