From ba1ae36f462db064cbe50854869e5329f07ba67a Mon Sep 17 00:00:00 2001 From: d0422 Date: Thu, 26 Sep 2024 00:02:26 +0900 Subject: [PATCH 1/7] =?UTF-8?q?feat:=20mypage=20detail=20=ED=8E=98?= =?UTF-8?q?=EC=9D=B4=EC=A7=80=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/react-native/src/routes/MyPageStackNavigator.tsx | 2 ++ packages/react-native/src/types/navigation.ts | 1 + 2 files changed, 3 insertions(+) diff --git a/packages/react-native/src/routes/MyPageStackNavigator.tsx b/packages/react-native/src/routes/MyPageStackNavigator.tsx index d40f8a0d..104bc3d2 100644 --- a/packages/react-native/src/routes/MyPageStackNavigator.tsx +++ b/packages/react-native/src/routes/MyPageStackNavigator.tsx @@ -2,6 +2,7 @@ import { createStackNavigator } from '@react-navigation/stack'; import MyPage from '@/pages/MyPage'; import EditProfile from '@/pages/MyPage/EditProfile'; import EditProfileWithNickname from '@/pages/MyPage/EditProfileWithNickname'; +import Detail from '@/pages/Detail'; const Stack = createStackNavigator(); @@ -17,6 +18,7 @@ export default function MyPageStackNavigator() { name="MyPage/EditProfileWithNickname" component={EditProfileWithNickname} /> + ); } diff --git a/packages/react-native/src/types/navigation.ts b/packages/react-native/src/types/navigation.ts index 19e4facd..b4a03cad 100644 --- a/packages/react-native/src/types/navigation.ts +++ b/packages/react-native/src/types/navigation.ts @@ -39,6 +39,7 @@ export type StackParamList = { 'MyPage/Profile': undefined; 'MyPage/EditProfile': { nickname: string }; 'MyPage/EditProfileWithNickname': { nickname: string }; + 'MyPage/Detail': { contentId: number; id: number; workId: number }; 'Home/Main': undefined; 'Home/Search': { title: string }; From 62c722a1941b6bda697705f4ae107abebb55e41c Mon Sep 17 00:00:00 2001 From: d0422 Date: Thu, 26 Sep 2024 00:02:51 +0900 Subject: [PATCH 2/7] =?UTF-8?q?chore:=20=EC=A3=BC=EC=84=9D=20=EC=A0=9C?= =?UTF-8?q?=EA=B1=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/react-native/src/pages/MyPage.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/react-native/src/pages/MyPage.tsx b/packages/react-native/src/pages/MyPage.tsx index 77ce602d..2810508b 100644 --- a/packages/react-native/src/pages/MyPage.tsx +++ b/packages/react-native/src/pages/MyPage.tsx @@ -52,9 +52,9 @@ export default withSuspense(function MyPage({ navigation }: MyPageProps) { > - {/* + - */} + ); From 6e912bf9357baf845879c63043a5cb59cbf6d98a Mon Sep 17 00:00:00 2001 From: d0422 Date: Thu, 26 Sep 2024 00:03:12 +0900 Subject: [PATCH 3/7] =?UTF-8?q?feat:=20myspots=20api=20query=20=EC=9E=91?= =?UTF-8?q?=EC=84=B1?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../apis/queries/mypage/useMySpotsQuery.ts | 29 +++++++++++++++++++ 1 file changed, 29 insertions(+) create mode 100644 packages/react-native/src/apis/queries/mypage/useMySpotsQuery.ts diff --git a/packages/react-native/src/apis/queries/mypage/useMySpotsQuery.ts b/packages/react-native/src/apis/queries/mypage/useMySpotsQuery.ts new file mode 100644 index 00000000..c6602353 --- /dev/null +++ b/packages/react-native/src/apis/queries/mypage/useMySpotsQuery.ts @@ -0,0 +1,29 @@ +import { useSuspenseQuery } from '@tanstack/react-query'; +import useAuthAxios from '@/apis/useAuthAxios'; +import { City, Region } from '@/constants/CITY'; +import QUERY_KEYS from '@/constants/QUERY_KEYS'; +import { ServerResponse } from '@/types/response'; + +interface MySpotResponse { + id: number; + contentId: number; + name: string; + region: Region; + city: City; + workId: number; + posterUrl: string; +} + +export default function useMySpotsQuery() { + const authAxios = useAuthAxios(); + const getMySpots = async () => { + const result = + await authAxios.get>('/api/user/likes'); + return result.data.result; + }; + + return useSuspenseQuery({ + queryFn: getMySpots, + queryKey: [QUERY_KEYS.MY_SPOTS], + }); +} From eebcb7974fdfd48a327708349619f8fecc2cf580 Mon Sep 17 00:00:00 2001 From: d0422 Date: Thu, 26 Sep 2024 00:03:21 +0900 Subject: [PATCH 4/7] =?UTF-8?q?feat:=20query=20=ED=82=A4=20=EC=B6=94?= =?UTF-8?q?=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/react-native/src/constants/QUERY_KEYS.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/react-native/src/constants/QUERY_KEYS.ts b/packages/react-native/src/constants/QUERY_KEYS.ts index b2c165e2..0113fac3 100644 --- a/packages/react-native/src/constants/QUERY_KEYS.ts +++ b/packages/react-native/src/constants/QUERY_KEYS.ts @@ -13,6 +13,7 @@ const QUERY_KEYS = { EDIT_PLAN: 'editPlan', SPOT_DETAIL: 'spotDetail', SEARCH: 'search', + MY_SPOTS: 'mySpots', }; export default QUERY_KEYS; From 40c2083fba5fb6abb401621f0d00ba278ae26ab9 Mon Sep 17 00:00:00 2001 From: d0422 Date: Thu, 26 Sep 2024 00:04:58 +0900 Subject: [PATCH 5/7] =?UTF-8?q?feat:=20myspot=20=EB=8D=B0=EC=9D=B4?= =?UTF-8?q?=ED=84=B0=20=EC=BB=B4=ED=8F=AC=EB=84=8C=ED=8A=B8=20=EC=A0=81?= =?UTF-8?q?=EC=9A=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/components/mypage/MySpotBlock.tsx | 24 +--- .../react-native/src/pages/MyPage/MySpot.tsx | 108 ++++++------------ 2 files changed, 39 insertions(+), 93 deletions(-) diff --git a/packages/react-native/src/components/mypage/MySpotBlock.tsx b/packages/react-native/src/components/mypage/MySpotBlock.tsx index f87cf1ce..cd7998da 100644 --- a/packages/react-native/src/components/mypage/MySpotBlock.tsx +++ b/packages/react-native/src/components/mypage/MySpotBlock.tsx @@ -1,24 +1,19 @@ import { Font } from 'design-system'; -import { Alert, ImageBackground, TouchableOpacity, View } from 'react-native'; -import DotMenuIcon from '@/assets/DotMenuIcon'; +import { ImageBackground, TouchableOpacity, View } from 'react-native'; interface MySpotBlockProps { - id: number; title: string; - location: string; + location?: string; backgroundImage: string; - date: string; width: number; gap: number; handleClickBlock: () => void; } export default function MySpotBlock({ - id, title, location, backgroundImage, - date, width, gap, handleClickBlock, @@ -33,23 +28,14 @@ export default function MySpotBlock({ className="flex-1 justify-end bg-black/40" onPress={handleClickBlock} > - - + + {title} - + {location} - - {date} - - Alert.alert('메뉴 클릭')} - > - - ); diff --git a/packages/react-native/src/pages/MyPage/MySpot.tsx b/packages/react-native/src/pages/MyPage/MySpot.tsx index ec7dc810..e6ee2e6a 100644 --- a/packages/react-native/src/pages/MyPage/MySpot.tsx +++ b/packages/react-native/src/pages/MyPage/MySpot.tsx @@ -1,85 +1,45 @@ import { Dimensions, FlatList } from 'react-native'; -import { useState } from 'react'; +import { useNavigation } from '@react-navigation/native'; import MySpotBlock from '@/components/mypage/MySpotBlock'; -import SpotDetailBottomSheet from '@/components/common/SpotDetailBottomSheet'; - -const mockData = [ - { - id: 1, - title: '여행', - backgroundImage: 'https://cdn.hankyung.com/photo/202208/03.30909476.1.jpg', - location: '주문진 방파제', - date: '2024.01.01', - }, - { - id: 2, - title: '여행', - backgroundImage: 'https://cdn.hankyung.com/photo/202208/03.30909476.1.jpg', - location: '주문진 방파제', - date: '2024.01.02', - }, - { - id: 3, - title: '여행', - backgroundImage: 'https://cdn.hankyung.com/photo/202208/03.30909476.1.jpg', - location: '주문진 방파제', - date: '2024.01.03', - }, - { - id: 4, - title: '여행', - backgroundImage: 'https://cdn.hankyung.com/photo/202208/03.30909476.1.jpg', - location: '주문진 방파제', - date: '2024.01.04', - }, - { - id: 5, - title: '여행', - backgroundImage: 'https://cdn.hankyung.com/photo/202208/03.30909476.1.jpg', - location: '주문진 방파제', - date: '2024.01.05', - }, - { - id: 6, - title: '여행', - backgroundImage: 'https://cdn.hankyung.com/photo/202208/03.30909476.1.jpg', - location: '주문진 방파제', - date: '2024.01.06', - }, -]; +import withSuspense from '@/components/HOC/withSuspense'; +import useMySpotsQuery from '@/apis/queries/mypage/useMySpotsQuery'; +import { getDisplayRegion } from '@/utils/getDisplayRegionName'; +import { StackNavigation } from '@/types/navigation'; const { width } = Dimensions.get('window'); -export default function MySpot() { - const [selectedDetailSpotId, setSelectedDetailSpotId] = useState(); +export default withSuspense(function MySpot() { + const { data: mySpots } = useMySpotsQuery(); + const navigation = useNavigation>(); const numColumns = 2; const paddingHorizontal = 8; const gap = 16; return ( - <> - ( - setSelectedDetailSpotId(item.id)} - /> - )} - keyExtractor={(item) => item.title + item.location + item.date} - numColumns={numColumns} - /> - setSelectedDetailSpotId(undefined)} - /> - + ( + + navigation.navigate('MyPage/Detail', { + contentId: item.contentId, + id: item.id, + workId: item.workId, + }) + } + /> + )} + keyExtractor={(item) => item.name + item.id + item.contentId} + numColumns={numColumns} + /> ); -} +}); From 7a98917b52b9691a5e3e1d8d2a059c77b93583fb Mon Sep 17 00:00:00 2001 From: d0422 Date: Thu, 26 Sep 2024 00:14:45 +0900 Subject: [PATCH 6/7] =?UTF-8?q?feat:=20=EC=A2=8B=EC=95=84=EC=9A=94?= =?UTF-8?q?=EC=8B=9C=20my=20spot=20=EC=BA=90=EC=8B=9C=20=EB=AC=B4=ED=9A=A8?= =?UTF-8?q?=ED=99=94?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../react-native/src/apis/mutations/useSpotLikeMutation.ts | 3 +++ 1 file changed, 3 insertions(+) diff --git a/packages/react-native/src/apis/mutations/useSpotLikeMutation.ts b/packages/react-native/src/apis/mutations/useSpotLikeMutation.ts index 0ad7194b..58bffdfa 100644 --- a/packages/react-native/src/apis/mutations/useSpotLikeMutation.ts +++ b/packages/react-native/src/apis/mutations/useSpotLikeMutation.ts @@ -37,6 +37,9 @@ export default function useSpotLikeMutation({ queryClient.invalidateQueries({ queryKey: [QUERY_KEYS.DETAIL, contentId], }); + queryClient.invalidateQueries({ + queryKey: [QUERY_KEYS.MY_SPOTS], + }); }; const { mutateAsync: like, isPending: isLikePending } = useMutation({ From cfe512abebb80f6b72e235ad77e2f3b2ffb74cc0 Mon Sep 17 00:00:00 2001 From: d0422 Date: Thu, 26 Sep 2024 00:23:19 +0900 Subject: [PATCH 7/7] =?UTF-8?q?feat:=20myspot=EC=9D=B4=20=EC=97=86?= =?UTF-8?q?=EB=8A=94=20=EA=B2=BD=EC=9A=B0=20=EC=B2=98=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/react-native/src/pages/MyPage/MySpot.tsx | 13 ++++++++++++- 1 file changed, 12 insertions(+), 1 deletion(-) diff --git a/packages/react-native/src/pages/MyPage/MySpot.tsx b/packages/react-native/src/pages/MyPage/MySpot.tsx index e6ee2e6a..c199e50f 100644 --- a/packages/react-native/src/pages/MyPage/MySpot.tsx +++ b/packages/react-native/src/pages/MyPage/MySpot.tsx @@ -1,5 +1,6 @@ -import { Dimensions, FlatList } from 'react-native'; +import { Dimensions, FlatList, View } from 'react-native'; import { useNavigation } from '@react-navigation/native'; +import { Font } from 'design-system'; import MySpotBlock from '@/components/mypage/MySpotBlock'; import withSuspense from '@/components/HOC/withSuspense'; import useMySpotsQuery from '@/apis/queries/mypage/useMySpotsQuery'; @@ -15,6 +16,16 @@ export default withSuspense(function MySpot() { const paddingHorizontal = 8; const gap = 16; + if (mySpots.length === 0) { + return ( + + + 좋아요한 SPOT이 없어요 + + + ); + } + return (