From 75a9ef615c2cc1500e610db3fdc3bf3ca2bd4101 Mon Sep 17 00:00:00 2001 From: CheeseB <2489ckckck@naver.com> Date: Fri, 22 Mar 2024 04:29:17 +0900 Subject: [PATCH 01/11] =?UTF-8?q?feat:=20=EA=B2=8C=EC=8B=9C=EA=B8=80=20?= =?UTF-8?q?=EC=9C=A0=ED=98=95=20=EA=B0=9D=EC=B2=B4=EC=97=90=20=ED=83=80?= =?UTF-8?q?=EC=9E=85=20=EC=A0=95=EC=9D=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/constants/postTypes.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/constants/postTypes.ts b/src/constants/postTypes.ts index 60d9204d..8f0fb9b0 100644 --- a/src/constants/postTypes.ts +++ b/src/constants/postTypes.ts @@ -1,3 +1,5 @@ +import { PostTypes } from '@/types'; + export const POST_TYPES = { offline: '오프라인', online: '온라인', @@ -5,7 +7,7 @@ export const POST_TYPES = { 'game-strategy': '게임 공략', }; -export const PRICE_TO_POST_TYPES = { +export const PRICE_TO_POST_TYPES: Record = { 0: 'offline', 1: 'online', 2: 'clan-recruitment', From 94ee742138dd15077c13575280a070982a514f44 Mon Sep 17 00:00:00 2001 From: CheeseB <2489ckckck@naver.com> Date: Fri, 22 Mar 2024 04:30:20 +0900 Subject: [PATCH 02/11] =?UTF-8?q?fix:=20merge=20=EC=B6=A9=EB=8F=8C=20?= =?UTF-8?q?=EC=B2=98=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/mypage/MypageContent/index.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/mypage/MypageContent/index.tsx b/src/components/mypage/MypageContent/index.tsx index 2f4105d7..bcbb176d 100644 --- a/src/components/mypage/MypageContent/index.tsx +++ b/src/components/mypage/MypageContent/index.tsx @@ -6,6 +6,7 @@ import { MYPAGE_TAB_OPTIONS } from '@/constants'; import ProfileSummary from '@/components/commons/ProfileSummary'; import Tab from '@/components/commons/Tab'; +import MyPosts from '@/components/mypage/MyPosts'; import { USER_DATA } from '@/constants/mockData/headerMockData'; import { MY_ACTIVITIES, MY_RESERVATIONS } from '@/constants/mockData/profileSummaryMockData'; @@ -14,7 +15,7 @@ import styles from './MypageContent.module.scss'; const cx = classNames.bind(styles); const tabContentMap: TabContent = { - myPost:
MyPostTabContent component here
, + myPost: , myReservation:
ReservedTabContent component here
, reservationsStatus:
ReservationsStatusTabContent component here
, }; From c4f75e5a5d397e59b00060ec0b717085ddcc6522 Mon Sep 17 00:00:00 2001 From: CheeseB <2489ckckck@naver.com> Date: Fri, 22 Mar 2024 04:31:52 +0900 Subject: [PATCH 03/11] =?UTF-8?q?feat:=20=EB=A7=88=EC=9D=B4=ED=8E=98?= =?UTF-8?q?=EC=9D=B4=EC=A7=80/=EB=93=B1=EB=A1=9D=ED=95=9C=20=EA=B2=8C?= =?UTF-8?q?=EC=8B=9C=EA=B8=80=20=ED=83=AD=20=EA=B5=AC=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../mypage/MyPosts/MyPosts.module.scss | 33 ++++++ src/components/mypage/MyPosts/index.tsx | 105 ++++++++++++++++++ 2 files changed, 138 insertions(+) create mode 100644 src/components/mypage/MyPosts/MyPosts.module.scss create mode 100644 src/components/mypage/MyPosts/index.tsx diff --git a/src/components/mypage/MyPosts/MyPosts.module.scss b/src/components/mypage/MyPosts/MyPosts.module.scss new file mode 100644 index 00000000..fbdf195b --- /dev/null +++ b/src/components/mypage/MyPosts/MyPosts.module.scss @@ -0,0 +1,33 @@ +.mypost-container { + @include column-flexbox(start, stretch, 2.4rem); +} + +.selected-game { + @include flexbox(start, center, 0.8rem); + + &-title { + @include text-style(18, $white); + } + + &-count { + @include text-style(14, $primary, bold); + } +} + +.card { + &-area { + @include column-flexbox(start, stretch, 1.6rem); + } + + &-list { + @include column-flexbox(start, stretch, 1.2rem); + } +} + +.filter-sort { + @include flexbox(between, center); +} + +.dropdown { + width: 12rem; +} diff --git a/src/components/mypage/MyPosts/index.tsx b/src/components/mypage/MyPosts/index.tsx new file mode 100644 index 00000000..9782dd1b --- /dev/null +++ b/src/components/mypage/MyPosts/index.tsx @@ -0,0 +1,105 @@ +import { useState } from 'react'; + +import classNames from 'classnames/bind'; + +import { GAME_FILTERS, POSTS_PER_PAGE, PRICE_TO_POST_TYPES } from '@/constants'; +import { formatCategoryToGameNameKR } from '@/utils'; + +import { RegisteredCard } from '@/components/commons/cards'; +import Dropdown from '@/components/commons/Dropdown'; +import Filter from '@/components/commons/Filter'; +import Pagination from '@/components/commons/Pagination'; +import MockActivityDatas from '@/constants/mockData/myActivitiesMockData.json'; +import useProcessedDataList from '@/hooks/useProcessedDataList'; + +import { ActivityResponse, MyActivitiesResponse, Order, SortOption } from '@/types'; + +const cx = classNames.bind(styles); + +import styles from './MyPosts.module.scss'; + +const MockApiResponse: MyActivitiesResponse = { + cursorId: 0, + totalCount: 0, + activities: MockActivityDatas, +}; + +const initialFilter = { + category: GAME_FILTERS[0].id, +}; + +const initialSortOption: SortOption = { + key: 'createdAt', + type: 'date', + order: 'desc', +}; + +const dropdownOptions: { + title: string; + orderType: Order; +}[] = [ + { title: '최신순', orderType: 'desc' }, + { title: '오래된순', orderType: 'asc' }, +]; + +const MyPosts = () => { + const [page, setPage] = useState(1); + const [selectFilter, setSelectFilter] = useState(initialFilter); + const [sortOption, setSortOption] = useState(initialSortOption); + + const { pagedDataList, totalCount } = useProcessedDataList({ + initialDataList: MockApiResponse.activities, + selectFilter, + sortOption, + page, + setPage, + postsPerPage: POSTS_PER_PAGE, + }); + + return ( +
+

+ {formatCategoryToGameNameKR(selectFilter.category) ?? '전체'} + {totalCount} +

+
+
+ setSelectFilter({ category: selectedId })} + /> +
+ setSortOption((prev) => ({ ...prev, order: orderType }))} + isSmall + /> +
+
+
    + {pagedDataList.map((data) => ( +
  • + +
    • + ))} +
+
+ setPage(pageNumber)} + /> +
+ ); +}; + +export default MyPosts; From 479976ba892ab724cbed35cf4bd4823ddce0eade Mon Sep 17 00:00:00 2001 From: CheeseB <2489ckckck@naver.com> Date: Fri, 22 Mar 2024 05:17:38 +0900 Subject: [PATCH 04/11] =?UTF-8?q?feat:=20=EB=8D=B0=EC=9D=B4=ED=84=B0=20?= =?UTF-8?q?=EC=97=86=EC=9D=84=EB=95=8C=20=EB=B9=88=20=EC=B9=B4=EB=93=9C=20?= =?UTF-8?q?=EC=BB=B4=ED=8F=AC=EB=84=8C=ED=8A=B8=20=EB=B3=B4=EC=97=AC?= =?UTF-8?q?=EC=A3=BC=EB=8F=84=EB=A1=9D=20=EA=B5=AC=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/mypage/MyPosts/index.tsx | 33 ++++++++++++++----------- 1 file changed, 19 insertions(+), 14 deletions(-) diff --git a/src/components/mypage/MyPosts/index.tsx b/src/components/mypage/MyPosts/index.tsx index 9782dd1b..7322a040 100644 --- a/src/components/mypage/MyPosts/index.tsx +++ b/src/components/mypage/MyPosts/index.tsx @@ -9,6 +9,7 @@ import { RegisteredCard } from '@/components/commons/cards'; import Dropdown from '@/components/commons/Dropdown'; import Filter from '@/components/commons/Filter'; import Pagination from '@/components/commons/Pagination'; +import EmptyCard from '@/components/layout/empty/EmptyCard'; import MockActivityDatas from '@/constants/mockData/myActivitiesMockData.json'; import useProcessedDataList from '@/hooks/useProcessedDataList'; @@ -77,20 +78,24 @@ const MyPosts = () => { /> -
    - {pagedDataList.map((data) => ( -
  • - -
    • - ))} -
+ {totalCount ? ( +
    + {pagedDataList.map((data) => ( +
  • + +
    • + ))} +
+ ) : ( + + )} Date: Fri, 22 Mar 2024 11:58:45 +0900 Subject: [PATCH 05/11] =?UTF-8?q?feat:=20=EB=AA=A8=EB=B0=94=EC=9D=BC?= =?UTF-8?q?=EC=97=90=EC=84=9C=20=ED=8E=98=EC=9D=B4=EC=A7=80=20=EC=82=AC?= =?UTF-8?q?=EC=9D=B4=EC=A6=88=201000=EC=9C=BC=EB=A1=9C=20=EB=B3=80?= =?UTF-8?q?=EA=B2=BD=20=EB=B0=8F=20=ED=98=84=EC=9E=AC=20=ED=8E=98=EC=9D=B4?= =?UTF-8?q?=EC=A7=80=EB=A5=BC=201=EB=B2=88=EC=9C=BC=EB=A1=9C=20=EC=84=B8?= =?UTF-8?q?=ED=8C=85=ED=95=98=EB=8F=84=EB=A1=9D=20=EA=B5=AC=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/commons/Pagination/index.tsx | 2 +- src/components/mypage/MyPosts/index.tsx | 11 ++++++++--- src/hooks/usePaginatedDataList.ts | 2 +- src/utils/getPageSize.ts | 7 +++++++ 4 files changed, 17 insertions(+), 5 deletions(-) create mode 100644 src/utils/getPageSize.ts diff --git a/src/components/commons/Pagination/index.tsx b/src/components/commons/Pagination/index.tsx index 812cb76d..24e24106 100644 --- a/src/components/commons/Pagination/index.tsx +++ b/src/components/commons/Pagination/index.tsx @@ -32,7 +32,7 @@ const Pagination = ({ totalCount, pageState, postPerPage, onClick }: PaginationP } = usePagination(totalCount, pageState, postPerPage, onClick); const isArrowActivated = currentPageGroupIndex !== pagesArray.length - 1; - const showPagination = !!totalCount && totalCount !== PAGE_SIZE; + const showPagination = !!totalCount && postPerPage !== PAGE_SIZE; return ( showPagination && ( diff --git a/src/components/mypage/MyPosts/index.tsx b/src/components/mypage/MyPosts/index.tsx index 7322a040..b4736958 100644 --- a/src/components/mypage/MyPosts/index.tsx +++ b/src/components/mypage/MyPosts/index.tsx @@ -2,8 +2,9 @@ import { useState } from 'react'; import classNames from 'classnames/bind'; -import { GAME_FILTERS, POSTS_PER_PAGE, PRICE_TO_POST_TYPES } from '@/constants'; +import { GAME_FILTERS, PRICE_TO_POST_TYPES } from '@/constants'; import { formatCategoryToGameNameKR } from '@/utils'; +import { getPostPageSize } from '@/utils/getPageSize'; import { RegisteredCard } from '@/components/commons/cards'; import Dropdown from '@/components/commons/Dropdown'; @@ -11,6 +12,7 @@ import Filter from '@/components/commons/Filter'; import Pagination from '@/components/commons/Pagination'; import EmptyCard from '@/components/layout/empty/EmptyCard'; import MockActivityDatas from '@/constants/mockData/myActivitiesMockData.json'; +import { useDeviceType } from '@/hooks/useDeviceType'; import useProcessedDataList from '@/hooks/useProcessedDataList'; import { ActivityResponse, MyActivitiesResponse, Order, SortOption } from '@/types'; @@ -47,6 +49,9 @@ const MyPosts = () => { const [page, setPage] = useState(1); const [selectFilter, setSelectFilter] = useState(initialFilter); const [sortOption, setSortOption] = useState(initialSortOption); + const currentDeviceType = useDeviceType(); + + const pageSize = getPostPageSize(currentDeviceType); const { pagedDataList, totalCount } = useProcessedDataList({ initialDataList: MockApiResponse.activities, @@ -54,7 +59,7 @@ const MyPosts = () => { sortOption, page, setPage, - postsPerPage: POSTS_PER_PAGE, + postsPerPage: pageSize, }); return ( @@ -100,7 +105,7 @@ const MyPosts = () => { setPage(pageNumber)} /> diff --git a/src/hooks/usePaginatedDataList.ts b/src/hooks/usePaginatedDataList.ts index 17bc7770..2a3d2fae 100644 --- a/src/hooks/usePaginatedDataList.ts +++ b/src/hooks/usePaginatedDataList.ts @@ -15,7 +15,7 @@ const usePaginatedDataList = ({ initialDataList, page, setPage, postsPerPage useEffect(() => { setPage(1); - }, [initialDataList, setPage]); + }, [initialDataList, postsPerPage, setPage]); useEffect(() => { setPagedDataList(initialDataList.filter((data, index) => index >= startIndex && index < endIndex)); diff --git a/src/utils/getPageSize.ts b/src/utils/getPageSize.ts new file mode 100644 index 00000000..52dcce68 --- /dev/null +++ b/src/utils/getPageSize.ts @@ -0,0 +1,7 @@ +import { PAGE_SIZE, POSTS_PER_PAGE, REVIEWS_PER_PAGE } from '@/constants'; + +import { DeviceType } from '@/types'; + +export const getPostPageSize = (deviceType: DeviceType) => (deviceType === 'Mobile' ? PAGE_SIZE : POSTS_PER_PAGE); + +export const getReviewPageSize = (deviceType: DeviceType) => (deviceType === 'Mobile' ? PAGE_SIZE : REVIEWS_PER_PAGE); From 6cbe2d5af5194edd50e409ae3b9fe851e9da9918 Mon Sep 17 00:00:00 2001 From: CheeseB <2489ckckck@naver.com> Date: Fri, 22 Mar 2024 12:00:45 +0900 Subject: [PATCH 06/11] =?UTF-8?q?refactor:=20=EC=83=81=EC=88=98=EB=AA=85?= =?UTF-8?q?=20PAGE=5FSIZE=20=EB=A5=BC=20DEFAULT=5FPAGE=5FSIZE=20=EB=A1=9C?= =?UTF-8?q?=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/apis/activities.ts | 6 +++--- src/apis/myActivities.ts | 6 +++--- src/apis/myNotifications.ts | 4 ++-- src/apis/myReservations.ts | 4 ++-- src/components/commons/Pagination/index.tsx | 4 ++-- src/constants/paging.ts | 2 +- src/utils/getPageSize.ts | 8 +++++--- 7 files changed, 18 insertions(+), 16 deletions(-) diff --git a/src/apis/activities.ts b/src/apis/activities.ts index ac477174..ca1bfb2d 100644 --- a/src/apis/activities.ts +++ b/src/apis/activities.ts @@ -4,7 +4,7 @@ import { REVIEWS_API, RESERVATIONS_API, IMAGE_API, - PAGE_SIZE, + DEFAULT_PAGE_SIZE, PAGE_METHOD, } from '@/constants'; @@ -17,7 +17,7 @@ const Activities = { getList: () => instance.get(ACTIVITIES_API, { - params: { size: PAGE_SIZE, method: PAGE_METHOD }, + params: { size: DEFAULT_PAGE_SIZE, method: PAGE_METHOD }, }), getScheduleList: (activityId: number, year: string, month: string) => @@ -27,7 +27,7 @@ const Activities = { getReviewList: (activityId: number) => instance.get(`${ACTIVITIES_API}/${activityId}${REVIEWS_API}`, { - params: { size: PAGE_SIZE }, + params: { size: DEFAULT_PAGE_SIZE }, }), create: (value: ActivityCreateBody) => instance.post(ACTIVITIES_API, value), diff --git a/src/apis/myActivities.ts b/src/apis/myActivities.ts index c11650cb..b7b80099 100644 --- a/src/apis/myActivities.ts +++ b/src/apis/myActivities.ts @@ -3,7 +3,7 @@ import { RESERVATION_DASHBOARD_API, RESERVED_SCHEDULE_API, RESERVATIONS_API, - PAGE_SIZE, + DEFAULT_PAGE_SIZE, } from '@/constants'; import { ReservationStatus, EditReservationStatusBody, MyActivitiesBody } from '@/types'; @@ -14,7 +14,7 @@ export const MyActivities = { getList: () => instance.get(`${MY_ACTIVITIES_API}`, { params: { - size: PAGE_SIZE, + size: DEFAULT_PAGE_SIZE, }, }), @@ -36,7 +36,7 @@ export const MyActivities = { getHourlyReservationList: (activityId: number, scheduleId: number, status: ReservationStatus) => instance.get(`${MY_ACTIVITIES_API}/${activityId}${RESERVATIONS_API}`, { params: { - size: PAGE_SIZE, + size: DEFAULT_PAGE_SIZE, scheduleId, status, }, diff --git a/src/apis/myNotifications.ts b/src/apis/myNotifications.ts index 11bdab76..593fecac 100644 --- a/src/apis/myNotifications.ts +++ b/src/apis/myNotifications.ts @@ -1,4 +1,4 @@ -import { MY_NOTIFICATIONS_API, PAGE_SIZE } from '@/constants'; +import { MY_NOTIFICATIONS_API, DEFAULT_PAGE_SIZE } from '@/constants'; import instance from './axios'; @@ -6,7 +6,7 @@ export const MyNotifications = { get: () => instance.get(MY_NOTIFICATIONS_API, { params: { - size: PAGE_SIZE, + size: DEFAULT_PAGE_SIZE, }, }), diff --git a/src/apis/myReservations.ts b/src/apis/myReservations.ts index 79793303..bdacaaaa 100644 --- a/src/apis/myReservations.ts +++ b/src/apis/myReservations.ts @@ -1,4 +1,4 @@ -import { MY_RESERVATIONS_API, PAGE_SIZE, REVIEWS_API } from '@/constants'; +import { MY_RESERVATIONS_API, DEFAULT_PAGE_SIZE, REVIEWS_API } from '@/constants'; import { CreateReviewParams, MyReservationsStatus } from '@/types'; @@ -8,7 +8,7 @@ export const MyReservations = { get: (status: MyReservationsStatus) => instance.get(MY_RESERVATIONS_API, { params: { - size: PAGE_SIZE, + size: DEFAULT_PAGE_SIZE, status, }, }), diff --git a/src/components/commons/Pagination/index.tsx b/src/components/commons/Pagination/index.tsx index 24e24106..98c7f7cc 100644 --- a/src/components/commons/Pagination/index.tsx +++ b/src/components/commons/Pagination/index.tsx @@ -2,7 +2,7 @@ import Image from 'next/image'; import classNames from 'classnames/bind'; -import { PAGE_SIZE, SVGS } from '@/constants'; +import { DEFAULT_PAGE_SIZE, SVGS } from '@/constants'; import usePagination from '@/hooks/usePagination'; @@ -32,7 +32,7 @@ const Pagination = ({ totalCount, pageState, postPerPage, onClick }: PaginationP } = usePagination(totalCount, pageState, postPerPage, onClick); const isArrowActivated = currentPageGroupIndex !== pagesArray.length - 1; - const showPagination = !!totalCount && postPerPage !== PAGE_SIZE; + const showPagination = !!totalCount && postPerPage !== DEFAULT_PAGE_SIZE; return ( showPagination && ( diff --git a/src/constants/paging.ts b/src/constants/paging.ts index 935ea973..3c961a83 100644 --- a/src/constants/paging.ts +++ b/src/constants/paging.ts @@ -1,4 +1,4 @@ -export const PAGE_SIZE = 1000; +export const DEFAULT_PAGE_SIZE = 1000; export const PAGE_METHOD = 'offset'; diff --git a/src/utils/getPageSize.ts b/src/utils/getPageSize.ts index 52dcce68..d849ab80 100644 --- a/src/utils/getPageSize.ts +++ b/src/utils/getPageSize.ts @@ -1,7 +1,9 @@ -import { PAGE_SIZE, POSTS_PER_PAGE, REVIEWS_PER_PAGE } from '@/constants'; +import { DEFAULT_PAGE_SIZE, POSTS_PER_PAGE, REVIEWS_PER_PAGE } from '@/constants'; import { DeviceType } from '@/types'; -export const getPostPageSize = (deviceType: DeviceType) => (deviceType === 'Mobile' ? PAGE_SIZE : POSTS_PER_PAGE); +export const getPostPageSize = (deviceType: DeviceType) => + deviceType === 'Mobile' ? DEFAULT_PAGE_SIZE : POSTS_PER_PAGE; -export const getReviewPageSize = (deviceType: DeviceType) => (deviceType === 'Mobile' ? PAGE_SIZE : REVIEWS_PER_PAGE); +export const getReviewPageSize = (deviceType: DeviceType) => + deviceType === 'Mobile' ? DEFAULT_PAGE_SIZE : REVIEWS_PER_PAGE; From ef2d746ed186a510b471a7d2ebbaec58a990a009 Mon Sep 17 00:00:00 2001 From: CheeseB <2489ckckck@naver.com> Date: Fri, 22 Mar 2024 12:16:52 +0900 Subject: [PATCH 07/11] =?UTF-8?q?feat:=20=EB=AA=A8=EB=B0=94=EC=9D=BC?= =?UTF-8?q?=EC=97=90=EC=84=9C=20=EB=93=9C=EB=A1=AD=EB=8B=A4=EC=9A=B4=20?= =?UTF-8?q?=EC=9C=84=EC=B9=98=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../mypage/MyPosts/MyPosts.module.scss | 7 +++++++ src/components/mypage/MyPosts/index.tsx | 21 ++++++++++++++----- 2 files changed, 23 insertions(+), 5 deletions(-) diff --git a/src/components/mypage/MyPosts/MyPosts.module.scss b/src/components/mypage/MyPosts/MyPosts.module.scss index fbdf195b..dbbf27fa 100644 --- a/src/components/mypage/MyPosts/MyPosts.module.scss +++ b/src/components/mypage/MyPosts/MyPosts.module.scss @@ -2,6 +2,10 @@ @include column-flexbox(start, stretch, 2.4rem); } +.title-area { + @include flexbox(between, center); +} + .selected-game { @include flexbox(start, center, 0.8rem); @@ -26,8 +30,11 @@ .filter-sort { @include flexbox(between, center); + + position: relative; } .dropdown { + flex-shrink: 0; width: 12rem; } diff --git a/src/components/mypage/MyPosts/index.tsx b/src/components/mypage/MyPosts/index.tsx index b4736958..7a59d378 100644 --- a/src/components/mypage/MyPosts/index.tsx +++ b/src/components/mypage/MyPosts/index.tsx @@ -64,10 +64,21 @@ const MyPosts = () => { return (
-

- {formatCategoryToGameNameKR(selectFilter.category) ?? '전체'} - {totalCount} -

+
+

+ + {formatCategoryToGameNameKR(selectFilter.category) ?? '전체'} + + {totalCount} +

+
+ setSortOption((prev) => ({ ...prev, order: orderType }))} + isSmall + /> +
+
{ selectedFilterId={selectFilter.category} onChange={(selectedId) => setSelectFilter({ category: selectedId })} /> -
+
setSortOption((prev) => ({ ...prev, order: orderType }))} From a6200826513af63fff01e23326638267e27b576d Mon Sep 17 00:00:00 2001 From: CheeseB <2489ckckck@naver.com> Date: Fri, 22 Mar 2024 13:55:22 +0900 Subject: [PATCH 08/11] =?UTF-8?q?feat:=20=EB=B0=94=EB=80=90=20=EB=93=9C?= =?UTF-8?q?=EB=A1=AD=EB=8B=A4=EC=9A=B4=20Prop=EC=97=90=20=EB=A7=9E?= =?UTF-8?q?=EA=B2=8C=20=ED=95=84=ED=84=B0=EB=A7=81=20=EC=86=8D=EC=84=B1=20?= =?UTF-8?q?=EC=88=98=EC=A0=95=20=EB=B0=8F=20=ED=83=80=EC=9E=85=20=EB=8B=A8?= =?UTF-8?q?=EC=96=B8=EB=AC=B8=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/mypage/MyPosts/index.tsx | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/src/components/mypage/MyPosts/index.tsx b/src/components/mypage/MyPosts/index.tsx index 7a59d378..ebb13fdc 100644 --- a/src/components/mypage/MyPosts/index.tsx +++ b/src/components/mypage/MyPosts/index.tsx @@ -39,10 +39,10 @@ const initialSortOption: SortOption = { const dropdownOptions: { title: string; - orderType: Order; + value: Order; }[] = [ - { title: '최신순', orderType: 'desc' }, - { title: '오래된순', orderType: 'asc' }, + { title: '최신순', value: 'desc' }, + { title: '오래된순', value: 'asc' }, ]; const MyPosts = () => { @@ -74,7 +74,7 @@ const MyPosts = () => {
setSortOption((prev) => ({ ...prev, order: orderType }))} + onChange={(value) => setSortOption((prev) => ({ ...prev, order: value as Order }))} isSmall />
@@ -89,7 +89,7 @@ const MyPosts = () => {
setSortOption((prev) => ({ ...prev, order: orderType }))} + onChange={(value) => setSortOption((prev) => ({ ...prev, order: value as Order }))} isSmall />
From a3f150a000786815ecbc6884abb1a9bf8f1dfdb5 Mon Sep 17 00:00:00 2001 From: CheeseB <2489ckckck@naver.com> Date: Fri, 22 Mar 2024 20:36:44 +0900 Subject: [PATCH 09/11] =?UTF-8?q?refactor:=20=EC=9D=B4=EB=B2=A4=ED=8A=B8?= =?UTF-8?q?=ED=95=B8=EB=93=A4=EB=9F=AC=20=ED=95=A8=EC=88=98=20=EB=94=B0?= =?UTF-8?q?=EB=A1=9C=20=EB=B6=84=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/mypage/MyPosts/index.tsx | 29 +++++++------------------ 1 file changed, 8 insertions(+), 21 deletions(-) diff --git a/src/components/mypage/MyPosts/index.tsx b/src/components/mypage/MyPosts/index.tsx index ebb13fdc..6e7a4952 100644 --- a/src/components/mypage/MyPosts/index.tsx +++ b/src/components/mypage/MyPosts/index.tsx @@ -53,6 +53,10 @@ const MyPosts = () => { const pageSize = getPostPageSize(currentDeviceType); + const handleClickPage = (pageNumber: number) => setPage(pageNumber); + const handleSelectFilter = (selectedId: string) => setSelectFilter({ category: selectedId }); + const handleOptionChange = (value: string | number) => setSortOption((prev) => ({ ...prev, order: value as Order })); + const { pagedDataList, totalCount } = useProcessedDataList({ initialDataList: MockApiResponse.activities, selectFilter, @@ -72,26 +76,14 @@ const MyPosts = () => { {totalCount}
- setSortOption((prev) => ({ ...prev, order: value as Order }))} - isSmall - /> +
- setSelectFilter({ category: selectedId })} - /> +
- setSortOption((prev) => ({ ...prev, order: value as Order }))} - isSmall - /> +
{totalCount ? ( @@ -113,12 +105,7 @@ const MyPosts = () => { )}
- setPage(pageNumber)} - /> +
); }; From 22ea8b9f5510f9a2f6dba068a66f3e8a1a014e78 Mon Sep 17 00:00:00 2001 From: CheeseB <2489ckckck@naver.com> Date: Fri, 22 Mar 2024 21:11:43 +0900 Subject: [PATCH 10/11] =?UTF-8?q?refactor:=20=EC=9E=84=ED=8F=AC=ED=8A=B8?= =?UTF-8?q?=EB=AC=B8=20=EC=88=9C=EC=84=9C=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/mypage/MyPosts/index.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/mypage/MyPosts/index.tsx b/src/components/mypage/MyPosts/index.tsx index 6e7a4952..422f7ac7 100644 --- a/src/components/mypage/MyPosts/index.tsx +++ b/src/components/mypage/MyPosts/index.tsx @@ -17,10 +17,10 @@ import useProcessedDataList from '@/hooks/useProcessedDataList'; import { ActivityResponse, MyActivitiesResponse, Order, SortOption } from '@/types'; -const cx = classNames.bind(styles); - import styles from './MyPosts.module.scss'; +const cx = classNames.bind(styles); + const MockApiResponse: MyActivitiesResponse = { cursorId: 0, totalCount: 0, From ab5dfa17631dd3bca2070c9879c7b0215d02ab04 Mon Sep 17 00:00:00 2001 From: CheeseB <2489ckckck@naver.com> Date: Fri, 22 Mar 2024 21:41:35 +0900 Subject: [PATCH 11/11] =?UTF-8?q?refactor:=20=EC=9D=B4=EB=B2=A4=ED=8A=B8?= =?UTF-8?q?=20=ED=95=B8=EB=93=A4=EB=9F=AC=20=ED=95=A8=EC=88=98=EC=99=80=20?= =?UTF-8?q?=ED=9B=85=EC=9D=98=20=EC=82=AC=EC=9A=A9=20=EC=88=9C=EC=84=9C=20?= =?UTF-8?q?=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/mypage/MyPosts/index.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/components/mypage/MyPosts/index.tsx b/src/components/mypage/MyPosts/index.tsx index 422f7ac7..cf0a71ca 100644 --- a/src/components/mypage/MyPosts/index.tsx +++ b/src/components/mypage/MyPosts/index.tsx @@ -53,10 +53,6 @@ const MyPosts = () => { const pageSize = getPostPageSize(currentDeviceType); - const handleClickPage = (pageNumber: number) => setPage(pageNumber); - const handleSelectFilter = (selectedId: string) => setSelectFilter({ category: selectedId }); - const handleOptionChange = (value: string | number) => setSortOption((prev) => ({ ...prev, order: value as Order })); - const { pagedDataList, totalCount } = useProcessedDataList({ initialDataList: MockApiResponse.activities, selectFilter, @@ -66,6 +62,10 @@ const MyPosts = () => { postsPerPage: pageSize, }); + const handleClickPage = (pageNumber: number) => setPage(pageNumber); + const handleSelectFilter = (selectedId: string) => setSelectFilter({ category: selectedId }); + const handleOptionChange = (value: string | number) => setSortOption((prev) => ({ ...prev, order: value as Order })); + return (