[Refactor] 모임 참여, 탈퇴, 취소 API V2로 리펙토링

src/api/service/group-service/index.ts

@@ -48,15 +48,15 @@ export const groupServiceRemote = () => ({
   },
 
   attendGroup: (payload: GroupIdPayload) => {
-    return api.post<GetGroupDetailsResponse>(`/groups/${payload.groupId}/attend`);
+    return apiV2.post<GetGroupDetailsResponse>(`/groups/${payload.groupId}/attend`);
   },
 
-  cancelGroup: (payload: GroupIdPayload) => {
-    return api.post<GetGroupDetailsResponse>(`/groups/${payload.groupId}/cancel`);
+  leaveGroup: (payload: GroupIdPayload) => {
+    return apiV2.post<GetGroupDetailsResponse>(`/groups/${payload.groupId}/left`);
   },
 
   deleteGroup: (payload: GroupIdPayload) => {
-    return api.delete(`/groups/${payload.groupId}`);
+    return apiV2.delete(`/groups/${payload.groupId}`);
   },
 
   uploadGroupImages: (payload: FormData) => {

src/components/pages/meetup/meetup-buttons/index.tsx

@@ -37,7 +37,7 @@ export const MeetupButtons = ({
             className='flex-[1.2]'
             variant='tertiary'
             onClick={() =>
-              open(<MeetupModal groupId={groupId} type={isHost ? 'delete' : 'cancel'} />)
+              open(<MeetupModal groupId={groupId} type={isHost ? 'delete' : 'leave'} />)
             }
           >
             {isHost ? '모임 취소' : '모임 탈퇴'}

src/components/pages/meetup/meetup-modal/index.tsx

@@ -5,19 +5,19 @@ import { useRouter } from 'next/navigation';
 import { Button } from '@/components/ui';
 import { ModalContent, ModalDescription, ModalTitle, useModal } from '@/components/ui/modal';
 import { useAttendGroup } from '@/hooks/use-group/use-group-attend';
-import { useCancelGroup } from '@/hooks/use-group/use-group-cancel';
 import { useDeleteGroup } from '@/hooks/use-group/use-group-delete';
+import { useLeaveGroup } from '@/hooks/use-group/use-group-leave';
 
 interface Props {
-  type: 'attend' | 'cancel' | 'delete';
+  type: 'attend' | 'leave' | 'delete';
   groupId: string;
 }
 
 export const MeetupModal = ({ type, groupId }: Props) => {
   const { replace } = useRouter();
   const { close } = useModal();
   const { mutate: attendMutate, isPending: isAttending } = useAttendGroup({ groupId }, close);
-  const { mutate: cancelMutate, isPending: isCanceling } = useCancelGroup({ groupId }, close);
+  const { mutate: leaveMutate, isPending: isCanceling } = useLeaveGroup({ groupId }, close);
   const { mutate: deleteMutate, isPending: isDeleting } = useDeleteGroup({ groupId }, () => {
     close();
     replace('/');
@@ -29,7 +29,7 @@ export const MeetupModal = ({ type, groupId }: Props) => {
 
   const handleConfirmClick = () => {
     if (type === 'attend') attendMutate();
-    else if (type === 'cancel') cancelMutate();
+    else if (type === 'leave') leaveMutate();
     else if (type === 'delete') deleteMutate();
   };
 
@@ -65,7 +65,7 @@ const MODAL_MESSAGE = {
     description: '참여 후 바로 그룹채팅에 참여할 수 있어요!',
     confirm: '참여하기',
   },
-  cancel: {
+  leave: {
     title: '모임을 정말 탈퇴하시겠어요?',
     description: '탈퇴 시 그룹채팅과 모임 활동이 종료돼요.',
     confirm: '탈퇴하기',

src/hooks/use-group/use-group-cancel/index.ts → src/hooks/use-group/use-group-leave/index.ts

@@ -4,11 +4,11 @@ import { API } from '@/api';
 import { groupKeys } from '@/lib/query-key/query-key-group';
 import { GroupIdPayload } from '@/types/service/group';
 
-export const useCancelGroup = (payload: GroupIdPayload, callback: () => void) => {
+export const useLeaveGroup = (payload: GroupIdPayload, callback: () => void) => {
   const queryClient = useQueryClient();
 
   const query = useMutation({
-    mutationFn: () => API.groupService.cancelGroup(payload),
+    mutationFn: () => API.groupService.leaveGroup(payload),
     onSuccess: async () => {
       await queryClient.invalidateQueries({ queryKey: groupKeys.detail(payload.groupId) });
       callback();