diff --git a/src/@types/user.ts b/src/@types/user.ts index 236d9d96..c57364d8 100644 --- a/src/@types/user.ts +++ b/src/@types/user.ts @@ -5,10 +5,3 @@ export interface User { profileImage: string; description: string; } - -export interface PopularUser - extends Pick { - openTravelCount: number; - reviewCount: number; - hashTags: string; -} diff --git a/src/api/review/review.ts b/src/api/review/review.ts index 3d95f767..5315fadc 100644 --- a/src/api/review/review.ts +++ b/src/api/review/review.ts @@ -1,5 +1,5 @@ import { Review, ReviewDetailResponse, ReviewResponse } from '@/@types/review'; -import { ApiResponse } from '@/@types/api'; +import { BaseResponse } from '@/@types/api'; import { TravelReviewRateScore } from '@/@types/travel'; import { http } from '../fetcher'; @@ -37,26 +37,26 @@ interface TravelReviewRate { } export const getPopularReview = () => { - return http.get>('/reviews/popular'); + return http.get>('/reviews/popular'); }; export const getTravelReview = ({ travelId, pageParam, }: TravelReviewParams) => { - return http.get>( + return http.get>( `/reviews?id=${travelId}&page=${pageParam}`, ); }; export const getTravelReviewRate = ({ travelId }: { travelId: number }) => { - return http.get>( + return http.get>( `/reviews/${travelId}/ratings`, ); }; export const getReview = ({ pageParam, sortOrder }: ReviewParams) => { - return http.get>( + return http.get>( `/reviews?page=${pageParam}&sortBy=${sortOrder}&size=12`, ); }; diff --git a/src/components/card/user/UserCard.tsx b/src/components/card/user/UserCard.tsx index f0e516d6..04348d63 100644 --- a/src/components/card/user/UserCard.tsx +++ b/src/components/card/user/UserCard.tsx @@ -1,25 +1,31 @@ -import { UserList } from '@/@types/user'; +import { User } from '@/@types/user'; import Link from 'next/link'; import UserIcon from '../../common/user/UserIcon'; import UserTag from '../../common/tag/UserTag'; +interface Props extends Pick { + openTravelCount: number; + reviewCount: number; + hashTags: string; +} + const UserCard = ({ - nickName, + nickname, profileImage, openTravelCount, reviewCount, hashTags, userId, -}: UserList) => { +}: Props) => { return ( - +
-

{nickName}

+

{nickname}

모임장 {openTravelCount}회 • 리뷰 {reviewCount}개

diff --git a/src/components/common/tag/DomesticTag.stories.tsx b/src/components/common/tag/DomesticTag.stories.tsx new file mode 100644 index 00000000..3a01a287 --- /dev/null +++ b/src/components/common/tag/DomesticTag.stories.tsx @@ -0,0 +1,32 @@ +import { Meta, StoryObj } from '@storybook/react'; +import DomesticTag from './DomesticTag'; + +const meta = { + title: 'Components/Common/tag', + component: DomesticTag, + tags: ['autodocs'], + argTypes: { + isDomestic: { + control: 'boolean', + description: '여행 타입을 설정합니다. true는 국내, false는 해외입니다.', + }, + }, +} satisfies Meta; + +export default meta; + +type Story = StoryObj; + +const Template = (args: { isDomestic: boolean }) => ( +
+ + +
+); + +export const AllVariants: Story = { + render: Template, + args: { + isDomestic: true, + }, +}; diff --git a/src/components/main/weeklyUser/WeeklyUser.tsx b/src/components/main/weeklyUser/WeeklyUser.tsx index 9e4624cf..5ee60cc8 100644 --- a/src/components/main/weeklyUser/WeeklyUser.tsx +++ b/src/components/main/weeklyUser/WeeklyUser.tsx @@ -3,13 +3,19 @@ import { Swiper, SwiperSlide } from 'swiper/react'; import 'swiper/css'; import 'swiper/css/pagination'; -import { UserList } from '@/@types/user'; +import { User } from '@/@types/user'; import Link from 'next/link'; import ButtonRounded from '@/components/common/button/ButtonRounded'; import UserCard from '../../card/user/UserCard'; import WeeklyUserHeader from './WeeklyUserHeader'; -const WeeklyUser = ({ userList }: { userList: UserList[] }) => { +interface Props extends Pick { + openTravelCount: number; + reviewCount: number; + hashTags: string; +} + +const WeeklyUser = ({ userList }: { userList: Props[] }) => { if (userList.length === 0) { return (
@@ -51,7 +57,7 @@ const WeeklyUser = ({ userList }: { userList: UserList[] }) => { > { maxTravelMateCount: 5, currentTravelMateCount: 2, isDomestic: true, - location: '서울', - image: 'https://example.com/image.jpg', + travelLocation: '서울', + travelImage: 'https://example.com/image.jpg', startAt: '2023-10-01', endAt: '2023-10-10', }, @@ -70,8 +70,8 @@ describe('MySelfTravel', () => { maxTravelMateCount: 5, currentTravelMateCount: 2, isDomestic: true, - location: '서울', - image: 'https://example.com/image.jpg', + travelLocation: '서울', + travelImage: 'https://example.com/image.jpg', startAt: '2023-10-01', endAt: '2023-10-10', }, @@ -81,8 +81,8 @@ describe('MySelfTravel', () => { maxTravelMateCount: 5, currentTravelMateCount: 2, isDomestic: true, - location: '부산', - image: 'https://example.com/image.jpg', + travelLocation: '부산', + travelImage: 'https://example.com/image.jpg', startAt: '2023-10-01', endAt: '2023-10-10', }, diff --git a/src/components/mypage/contents/content/mySelfTravel/MySelfTravel.tsx b/src/components/mypage/contents/content/mySelfTravel/MySelfTravel.tsx index c9c7c94e..b45e297f 100644 --- a/src/components/mypage/contents/content/mySelfTravel/MySelfTravel.tsx +++ b/src/components/mypage/contents/content/mySelfTravel/MySelfTravel.tsx @@ -28,7 +28,7 @@ const MySelfTravel = () => { > {travels && travels.data.total > 0 ? (
- {travels.data.content.map((travel: TravelCardProps) => ( + {travels.data?.content.map((travel: TravelCardProps) => (
{ travelImage={travel.travelImage} startAt={travel.startAt} endAt={travel.endAt} - bookmarkFlag + bookmarkFlag={travel.bookmarkFlag} formattedStartDate={checkTomorrow(travel.startAt)} /> diff --git a/src/components/mypage/contents/content/myTravel/CheckedTravel.test.tsx b/src/components/mypage/contents/content/myTravel/CheckedTravel.test.tsx index aa15406d..f6423ab5 100644 --- a/src/components/mypage/contents/content/myTravel/CheckedTravel.test.tsx +++ b/src/components/mypage/contents/content/myTravel/CheckedTravel.test.tsx @@ -30,8 +30,8 @@ describe('CheckedTravel', () => { maxTravelMateCount: 5, currentTravelMateCount: 2, isDomestic: true, - location: '서울', - image: 'https://example.com/image.jpg', + travelLocation: '서울', + travelImage: 'https://example.com/image.jpg', startAt: '2023-10-01', endAt: '2023-10-10', }, @@ -70,8 +70,8 @@ describe('CheckedTravel', () => { maxTravelMateCount: 5, currentTravelMateCount: 2, isDomestic: true, - location: '서울', - image: 'https://example.com/image.jpg', + travelLocation: '서울', + travelImage: 'https://example.com/image.jpg', startAt: '2023-10-01', endAt: '2023-10-10', }, @@ -81,8 +81,8 @@ describe('CheckedTravel', () => { maxTravelMateCount: 5, currentTravelMateCount: 2, isDomestic: true, - location: '부산', - image: 'https://example.com/image.jpg', + travelLocation: '부산', + travelImage: 'https://example.com/image.jpg', startAt: '2023-10-01', endAt: '2023-10-10', }, diff --git a/src/components/mypage/contents/content/myTravel/CheckedTravel.tsx b/src/components/mypage/contents/content/myTravel/CheckedTravel.tsx index 1e955064..8f132286 100644 --- a/src/components/mypage/contents/content/myTravel/CheckedTravel.tsx +++ b/src/components/mypage/contents/content/myTravel/CheckedTravel.tsx @@ -28,7 +28,7 @@ const CheckedTravel = () => { > {travels && travels.data.total > 0 ? (
- {travels.data.content.map((travel: TravelCardProps) => ( + {travels.data?.content.map((travel: TravelCardProps) => (
{ startAt={travel.startAt} endAt={travel.endAt} formattedStartDate={checkTomorrow(travel.startAt)} - bookmarkFlag + bookmarkFlag={travel.bookmarkFlag} />
diff --git a/src/components/mypage/contents/content/myTravel/PastTravel.tsx b/src/components/mypage/contents/content/myTravel/PastTravel.tsx index 3e07cc59..dc6e41b3 100644 --- a/src/components/mypage/contents/content/myTravel/PastTravel.tsx +++ b/src/components/mypage/contents/content/myTravel/PastTravel.tsx @@ -28,7 +28,7 @@ const PastTravel = () => { > {travels && travels.data.total > 0 ? (
- {travels.data.content.map((travel: TravelCardProps) => ( + {travels.data?.content.map((travel: TravelCardProps) => (
{ startAt={travel.startAt} endAt={travel.endAt} formattedStartDate={checkTomorrow(travel.startAt)} - bookmarkFlag + bookmarkFlag={travel.bookmarkFlag} closed /> diff --git a/src/components/mypage/contents/content/myTravel/Upcomming.test.tsx b/src/components/mypage/contents/content/myTravel/Upcomming.test.tsx index dd24e73d..fb5f1314 100644 --- a/src/components/mypage/contents/content/myTravel/Upcomming.test.tsx +++ b/src/components/mypage/contents/content/myTravel/Upcomming.test.tsx @@ -30,8 +30,8 @@ describe('Upcomming', () => { maxTravelMateCount: 5, currentTravelMateCount: 2, isDomestic: true, - location: '서울', - image: 'https://example.com/image.jpg', + travelLocation: '서울', + travelImage: 'https://example.com/image.jpg', startAt: '2023-10-01', endAt: '2023-10-10', }, @@ -70,8 +70,8 @@ describe('Upcomming', () => { maxTravelMateCount: 5, currentTravelMateCount: 2, isDomestic: true, - location: '서울', - image: 'https://example.com/image.jpg', + travelLocation: '서울', + travelImage: 'https://example.com/image.jpg', startAt: '2023-10-01', endAt: '2023-10-10', }, @@ -81,8 +81,8 @@ describe('Upcomming', () => { maxTravelMateCount: 5, currentTravelMateCount: 2, isDomestic: true, - location: '부산', - image: 'https://example.com/image.jpg', + travelLocation: '부산', + travelImage: 'https://example.com/image.jpg', startAt: '2023-10-01', endAt: '2023-10-10', }, diff --git a/src/components/mypage/contents/content/myTravel/Upcomming.tsx b/src/components/mypage/contents/content/myTravel/Upcomming.tsx index 693cec60..a4265524 100644 --- a/src/components/mypage/contents/content/myTravel/Upcomming.tsx +++ b/src/components/mypage/contents/content/myTravel/Upcomming.tsx @@ -3,7 +3,7 @@ import Pagination from '@/components/common/pagination/Pagination'; import { checkTomorrow } from '@/utils/dateChangeKr'; import { useState } from 'react'; import { useUpcommingTravel } from '@/queries/travel/useGetMyTravel'; -import { TravelList } from '@/@types/travel'; +import { TravelCard as TravelCardProps } from '@/@types/travel'; import HorizontalDivider from '@/components/common/divider/HorizontalDivider'; import MyTravelCardSkeleton from '@/components/mypage/skeleton/MyTravelCardSkeleton'; import NoTravel from './NoTravel'; @@ -28,19 +28,20 @@ const Upcomming = () => { > {travels && travels.data.total > 0 ? (
- {travels.data.content.map((travel: TravelList) => ( + {travels.data?.content.map((travel: TravelCardProps) => (
diff --git a/src/components/travel/detail/TravelDetail.test.tsx b/src/components/travel/detail/TravelDetail.test.tsx index 73d392db..4d65cd62 100644 --- a/src/components/travel/detail/TravelDetail.test.tsx +++ b/src/components/travel/detail/TravelDetail.test.tsx @@ -10,7 +10,7 @@ const userInfoMock = { userId: 1, email: 'user@test.com', nickname: 'TestUser', - image: null, + profileImage: null, description: null, }; diff --git a/src/components/travel/detail/TravelDetail.tsx b/src/components/travel/detail/TravelDetail.tsx index fdce9102..69d1f31c 100644 --- a/src/components/travel/detail/TravelDetail.tsx +++ b/src/components/travel/detail/TravelDetail.tsx @@ -38,7 +38,7 @@ const TravelDetail = ({ travelDetail }: { travelDetail: Travel }) => { )} @@ -59,7 +59,7 @@ const TravelDetail = ({ travelDetail }: { travelDetail: Travel }) => { )} diff --git a/src/components/travel/detail/TravelDetailCategory.test.tsx b/src/components/travel/detail/TravelDetailCategory.test.tsx index 9ed59f8c..3f48f8e7 100644 --- a/src/components/travel/detail/TravelDetailCategory.test.tsx +++ b/src/components/travel/detail/TravelDetailCategory.test.tsx @@ -19,14 +19,14 @@ const mockTravelPlan = [ tripOrderNumber: 1, destination: '서울', description: '서울 탐방', - image: '/test1.png', + travelPlanImage: '/test1.png', }, { tripDay: 2, tripOrderNumber: 1, destination: '부산', description: '부산 여행', - image: '/test1.png', + travelPlanImage: '/test1.png', }, ]; const mockStartAt = '2024-12-10'; diff --git a/src/components/travel/detail/category/TabTravelDetail.test.tsx b/src/components/travel/detail/category/TabTravelDetail.test.tsx index 99a57a4a..31c2b551 100644 --- a/src/components/travel/detail/category/TabTravelDetail.test.tsx +++ b/src/components/travel/detail/category/TabTravelDetail.test.tsx @@ -22,7 +22,7 @@ const mock = { travelId: 1, participationFlag: true, organizer: { - id: 1, + userId: 1, nickname: '녹차라떼', role: 'string', profileImage: '/image.jpg', @@ -106,7 +106,7 @@ describe('여행 모임장이 아닐 때', () => { travelId: 1, participationFlag: true, organizer: { - id: 2, + userId: 2, nickname: '녹차라떼', role: 'string', profileImage: '/string.png', diff --git a/src/components/travel/detail/category/TabTravelDetail.tsx b/src/components/travel/detail/category/TabTravelDetail.tsx index d47e1e47..b83159b4 100644 --- a/src/components/travel/detail/category/TabTravelDetail.tsx +++ b/src/components/travel/detail/category/TabTravelDetail.tsx @@ -39,7 +39,7 @@ const TabTravelDetail = ({ travelId={travelId} bookmarkFlag={bookmarkFlag} userId={user.userId} - organizerId={organizer.id} + organizerId={organizer.userId} /> )}
diff --git a/src/components/travel/detail/category/TabTravelItinerary.test.tsx b/src/components/travel/detail/category/TabTravelItinerary.test.tsx index 4a10b7dd..07585d28 100644 --- a/src/components/travel/detail/category/TabTravelItinerary.test.tsx +++ b/src/components/travel/detail/category/TabTravelItinerary.test.tsx @@ -10,21 +10,21 @@ const mockTravelPlan = [ tripOrderNumber: 1, destination: '서울', description: '서울 탐방', - image: '/test1.png', + travelPlanImage: '/test1.png', }, { tripDay: 2, tripOrderNumber: 1, destination: '부산', description: '부산 여행', - image: '/test1.png', + travelPlanImage: '/test1.png', }, { tripDay: 3, tripOrderNumber: 1, destination: '제주도', description: '제주도 여행', - image: '/test1.png', + travelPlanImage: '/test1.png', }, ]; diff --git a/src/components/travel/detail/information/RecruitmentBox.test.tsx b/src/components/travel/detail/information/RecruitmentBox.test.tsx index f7681d96..3dd534c5 100644 --- a/src/components/travel/detail/information/RecruitmentBox.test.tsx +++ b/src/components/travel/detail/information/RecruitmentBox.test.tsx @@ -42,8 +42,8 @@ describe('RecruitmentBox', () => { describe('RecruitmentBox, 모집 중인 여행일 때', () => { const mockParticipants = [ - { id: 1, nickname: 'string', role: 'string', profileImage: 'string' }, - { id: 2, nickname: 'string', role: 'string', profileImage: 'string' }, + { userId: 1, nickname: 'string', role: 'string', profileImage: 'string' }, + { userId: 2, nickname: 'string', role: 'string', profileImage: 'string' }, ]; beforeEach(() => diff --git a/src/components/travel/detail/information/TravelInformation.test.tsx b/src/components/travel/detail/information/TravelInformation.test.tsx index 4c0c3f61..0c2c43f7 100644 --- a/src/components/travel/detail/information/TravelInformation.test.tsx +++ b/src/components/travel/detail/information/TravelInformation.test.tsx @@ -13,9 +13,9 @@ describe('TravelInformation', () => { startAt: '2024.12.01', endAt: '2024.12.10', participant: [ - { id: 1, nickname: '1', role: 'string', profileImage: 'string' }, - { id: 2, nickname: '2', role: 'string', profileImage: 'string' }, - { id: 3, nickname: '3', role: 'string', profileImage: 'string' }, + { userId: 1, nickname: '1', role: 'string', profileImage: 'string' }, + { userId: 2, nickname: '2', role: 'string', profileImage: 'string' }, + { userId: 3, nickname: '3', role: 'string', profileImage: 'string' }, ], registrationEnd: '2024.11.30', }; diff --git a/src/mocks/data/travel/travelDetail.json b/src/mocks/data/travel/travelDetail.json index 91d571f1..ee2854a3 100644 --- a/src/mocks/data/travel/travelDetail.json +++ b/src/mocks/data/travel/travelDetail.json @@ -2,7 +2,7 @@ "travelId": 1, "travelName": "12월에 떠나는 겨울여행", "description": "12월의 겨울 낭만을 즐기고 싶은 분들 계신가요?함께 국내 겨울 여행지를 돌아다니고 싶습니다!춥지만, 마음만은 따듯한 겨울 여행 함께해요 :)다양한 사람들이 모여서 함께 하고 싶어요!", - "image": "/test3.png", + "travelImage": "/test3.png", "expectedTripCost": 250000, "currentTravelMateCount": 6, "minTravelMateCount": 2, @@ -23,64 +23,64 @@ "tripOrderNumber": 1, "destination": "대관령 양떼목장", "description": "강원도의 상징 눈의...강원도의 상징 눈의 계절이면 생각나는대관령 양떼목장 풍경만 봐도 힐링 ", - "image": "/test4.jpg" + "travelPlanImage": "/test4.jpg" }, { "tripDay": 1, "tripOrderNumber": 2, "destination": "강원도 감자빵", "description": "강원도의 상징 눈의...", - "image": "/test3.png" + "travelPlanImage": "/test3.png" }, { "tripDay": 2, "tripOrderNumber": 1, "destination": "안목해변", "description": "낭만있는 겨울바다를 즐겨요!", - "image": "/test.png" + "travelPlanImage": "/test.png" }, { "tripDay": 2, "tripOrderNumber": 2, "destination": "어부횟집", "description": "바다를 보면 회를 먹는건...", - "image": "/test2.png" + "travelPlanImage": "/test2.png" }, { "tripDay": 3, "tripOrderNumber": 1, "destination": "어부횟집", "description": "바다를 보면 회를 먹는건...", - "image": "/test2.png" + "travelPlanImage": "/test2.png" } ], "participant": [ { - "id": 3, + "userId": 3, "nickname": "녹차라떼 아이스", "role": "ORGANIZER", "profileImage": "/user.jpg" }, { - "id": 4, + "userId": 4, "nickname": "참가중인 다른 유저 1", "role": "ATTENDEE", "profileImage": "" }, { - "id": 5, + "userId": 5, "nickname": "아이스", "role": "ATTENDEE", "profileImage": "/user.jpg" }, { - "id": 6, + "userId": 6, "nickname": "아이스", "role": "ATTENDEE", "profileImage": "/test4.jpg" }, { - "id": 7, + "userId": 7, "nickname": "아이스", "role": "ATTENDEE", "profileImage": "/test4.jpg"