diff --git a/src/app/(user-page)/my-meeting/_features/CardRightSection.tsx b/src/app/(user-page)/my-meeting/_features/CardRightSection.tsx index b18cca1..4fbb1cf 100644 --- a/src/app/(user-page)/my-meeting/_features/CardRightSection.tsx +++ b/src/app/(user-page)/my-meeting/_features/CardRightSection.tsx @@ -24,11 +24,13 @@ const CardRightSection = ({ isPublic, className, meetingId, + showPublicSelect = false, }: { memberList: Member[]; isPublic: boolean; className?: string; meetingId: number; + showPublicSelect?: boolean; }) => { const [isUserListModalOpen, setIsUserListModalOpen] = useState(false); const handleConfirm = () => { @@ -123,7 +125,7 @@ const CardRightSection = ({ }} >
-

참가 중인 멤버

+

참가 중인 멤버

{memberList.map((member: Member) => (
@@ -132,14 +134,16 @@ const CardRightSection = ({ alt="맴버 프로필" width={40} height={40} - className="rounded-[9.92px] " + className="rounded-[9.92px]" />

{member.name}

{member.userId !== currentUser?.userId && (
- + {showPublicSelect && ( + + )}
- - +
+ + {showPublicSelect && ( + + )} +
+
diff --git a/src/app/(user-page)/my-meeting/_features/ModalUserList.tsx b/src/app/(user-page)/my-meeting/_features/ModalUserList.tsx index f769542..64a6bf2 100644 --- a/src/app/(user-page)/my-meeting/_features/ModalUserList.tsx +++ b/src/app/(user-page)/my-meeting/_features/ModalUserList.tsx @@ -1,8 +1,7 @@ import { Tag } from '@/components/ui/Tag'; -import { useBannerQueries } from '@/hooks/queries/useMyPageQueries'; import Image from 'next/image'; import React from 'react'; -import { Dispatch, SetStateAction, useState } from 'react'; +import { Dispatch, SetStateAction } from 'react'; import type { IBanner, Member } from 'types/myMeeting'; import { Button } from '../../../../components/ui/Button'; @@ -15,6 +14,7 @@ const ModalUserList = ({ currentUser, className, handlePrefetchProfile, + showPublicSelect = false, }: { memberList: Member[]; setSelectedUser: Dispatch>; @@ -23,6 +23,7 @@ const ModalUserList = ({ currentUser: IBanner; className?: string; handlePrefetchProfile: (member: Member) => Promise; + showPublicSelect?: boolean; }) => { const handleProfileClick = (user: Member) => { setSelectedUser(user); @@ -51,7 +52,9 @@ const ModalUserList = ({
{user.userId !== currentUser?.userId && (
- + {showPublicSelect && ( + + )}
); diff --git a/src/hooks/queries/useMyMeetingQueries.ts b/src/hooks/queries/useMyMeetingQueries.ts index 00f5ecf..4fed671 100644 --- a/src/hooks/queries/useMyMeetingQueries.ts +++ b/src/hooks/queries/useMyMeetingQueries.ts @@ -3,12 +3,14 @@ import { getMyMeetingManage, getMyMeetingMemberProfile, } from 'service/api/mymeeting'; +import { getMyMeetingParticipated } from 'service/api/mymeeting'; import { Paginated } from 'types/meeting'; import { IMyMeetingManage } from 'types/myMeeting'; export const myMeetingKeys = { all: ['mymeeting'] as const, manage: () => [...myMeetingKeys.all, 'manage'] as const, + participated: () => [...myMeetingKeys.all, 'participated'] as const, memberProfile: (meetingId: number, userId: number) => [ ...myMeetingKeys.all, 'profile', @@ -21,8 +23,18 @@ export const useInfiniteMyMeetingManageQueries = () => { queryKey: myMeetingKeys.manage(), queryFn: ({ pageParam }) => getMyMeetingManage(pageParam), initialPageParam: 0, - getNextPageParam: (lastPage: Paginated, pages) => { - console.log('[mutation] lastPage: ', lastPage); + getNextPageParam: (lastPage: Paginated) => { + return lastPage.nextCursor ?? null; + }, + }); +}; + +export const useInfiniteMyMeetingParticipatedQueries = () => { + return useInfiniteQuery({ + queryKey: myMeetingKeys.participated(), + queryFn: ({ pageParam }) => getMyMeetingParticipated(pageParam), + initialPageParam: 0, + getNextPageParam: (lastPage: Paginated) => { return lastPage.nextCursor ?? null; }, }); diff --git a/src/service/api/endpoints.ts b/src/service/api/endpoints.ts index b6a75f5..cf38d52 100644 --- a/src/service/api/endpoints.ts +++ b/src/service/api/endpoints.ts @@ -20,34 +20,34 @@ export const mypageURL = { // 미팅 관련 API 엔드포인트 export const myMeetingURL = { memberStatus: `${CURRENT_API_VERSION}/mymeetings/member-status`, - isPublic: (meetingId: string) => + isPublic: (meetingId: number) => `${CURRENT_API_VERSION}/mymeetings/isPublic/${meetingId}`, expel: `${CURRENT_API_VERSION}/mymeetings/expel`, memberProfile: `${CURRENT_API_VERSION}/mymeetings/member-profile`, manage: `${CURRENT_API_VERSION}/mymeetings/manage`, likes: `${CURRENT_API_VERSION}/mymeetings/likes`, all: `${CURRENT_API_VERSION}/mymeetings/all`, - quit: (meetingId: string) => + quit: (meetingId: number) => `${CURRENT_API_VERSION}/mymeetings/quit/${meetingId}`, - cancel: (meetingId: string) => + cancel: (meetingId: number) => `${CURRENT_API_VERSION}/mymeetings/cancel/${meetingId}`, }; // 댓글 관련 API 엔드포인트 export const commentURL = { - get: (meetingId: string) => `${CURRENT_API_VERSION}/comments/${meetingId}`, - update: (meetingId: string) => `${CURRENT_API_VERSION}/comments/${meetingId}`, - create: (meetingId: string) => `${CURRENT_API_VERSION}/comments/${meetingId}`, - delete: (meetingId: string) => `${CURRENT_API_VERSION}/comments/${meetingId}`, - count: (meetingId: string) => + get: (meetingId: number) => `${CURRENT_API_VERSION}/comments/${meetingId}`, + update: (meetingId: number) => `${CURRENT_API_VERSION}/comments/${meetingId}`, + create: (meetingId: number) => `${CURRENT_API_VERSION}/comments/${meetingId}`, + delete: (meetingId: number) => `${CURRENT_API_VERSION}/comments/${meetingId}`, + count: (meetingId: number) => `${CURRENT_API_VERSION}/comments/count/${meetingId}`, - average: (meetingId: string) => + average: (meetingId: number) => `${CURRENT_API_VERSION}/comments/avg/${meetingId}`, }; // 미팅 가입신청 메시지 엔드포인트 export const memberURL = { - create: (meetingId: string) => `${CURRENT_API_VERSION}/members/${meetingId}`, + create: (meetingId: number) => `${CURRENT_API_VERSION}/members/${meetingId}`, }; // 미팅 관련 API 엔드포인트 @@ -55,17 +55,17 @@ export const meetingURL = { create: `${CURRENT_API_VERSION}/meetings`, search: `${CURRENT_API_VERSION}/meetings/search`, top: `${CURRENT_API_VERSION}/meetings/top`, - detail: (meetingId: string) => + detail: (meetingId: number) => `${CURRENT_API_VERSION}/meetings/detail/${meetingId}`, - managerDetail: (meetingId: string) => + managerDetail: (meetingId: number) => `${CURRENT_API_VERSION}/meetings/detail/manager/${meetingId}`, }; // 좋아요 관련 API 엔드포인트 export const likesURL = { - create: (meetingId: string) => + create: (meetingId: number) => `${CURRENT_API_VERSION}/meetings/${meetingId}/likes`, - delete: (meetingId: string) => + delete: (meetingId: number) => `${CURRENT_API_VERSION}/meetings/${meetingId}/likes`, }; diff --git a/src/service/api/mymeeting.ts b/src/service/api/mymeeting.ts index 1a07313..3b9e6b9 100644 --- a/src/service/api/mymeeting.ts +++ b/src/service/api/mymeeting.ts @@ -2,12 +2,25 @@ import { authAPI } from '@/lib/axios/authApi'; import { Paginated } from 'types/meeting'; import type { IMemberProfile, IMyMeetingManage } from 'types/myMeeting'; +import { myMeetingURL } from './endpoints'; + // 내가 만든 모임 불러오기 const getMyMeetingManage = async ( lastMeetingId: number, ): Promise> => { const res = await authAPI.get( - `/api/v1/mymeetings/manage?lastMeetingId=${lastMeetingId}&size=${6}`, + `${myMeetingURL.manage}?lastMeetingId=${lastMeetingId}&size=${6}`, + ); + + return res.data.data; +}; + +// 내가 참여하고있는 모임 불러오기기 +const getMyMeetingParticipated = async ( + lastMeetingId: number, +): Promise> => { + const res = await authAPI.get( + `${myMeetingURL.all}?lastMeetingId=${lastMeetingId}&size=${6}`, ); return res.data.data; @@ -22,7 +35,7 @@ const getMyMeetingMemberProfile = async ({ meetingId: number; }): Promise => { const res = await authAPI.get( - `/api/v1/mymeetings/member-profile?userId=${userId}&meetingId=${meetingId}`, + `${myMeetingURL.memberProfile}?userId=${userId}&meetingId=${meetingId}`, ); return res.data.data; @@ -38,7 +51,7 @@ const putMemberStatus = async ({ meetingId: number; setMemberStatus: 'APPROVED' | 'REJECTED'; }) => { - const res = await authAPI.put(`/api/v1/mymeetings/member-status`, { + const res = await authAPI.put(`${myMeetingURL.memberStatus}`, { userId, meetingId, setMemberStatus, @@ -57,7 +70,7 @@ const putExpel = async ({ meetingId: number; setMemberStatus: 'EXPEL'; }) => { - const res = await authAPI.put(`/api/v1/mymeetings/expel`, { + const res = await authAPI.put(`${myMeetingURL.expel}`, { userId, meetingId, setMemberStatus, @@ -68,13 +81,14 @@ const putExpel = async ({ // 공개 / 비공개 설정 const putIsPublic = async (meetingId: number) => { - const res = await authAPI.put(`/api/v1/mymeetings/isPublic/${meetingId}`); + const res = await authAPI.put(`${myMeetingURL.isPublic(meetingId)}`); return res.data.data; }; export { getMyMeetingManage, getMyMeetingMemberProfile, + getMyMeetingParticipated, putMemberStatus, putExpel, putIsPublic,