diff --git a/src/app/login/page.tsx b/src/app/login/page.tsx index 78c3b100..fe220a9f 100644 --- a/src/app/login/page.tsx +++ b/src/app/login/page.tsx @@ -20,7 +20,7 @@ export default function Login() { return (
- {/* */} +
); } diff --git a/src/app/meeting/[category]/(modal)/[id]/[status]/page.tsx b/src/app/meeting/[category]/(modal)/[id]/[status]/page.tsx new file mode 100644 index 00000000..fc4d9cd4 --- /dev/null +++ b/src/app/meeting/[category]/(modal)/[id]/[status]/page.tsx @@ -0,0 +1,14 @@ +'use client'; + +import { redirect } from 'next/navigation'; + +export default function NeedLoginModal({ + params, +}: { + params: { category: string; id: string; status: string }; +}) { + const category = params.category; + const meetingId = Number(params.id); + + redirect(`/meeting/${category}/${meetingId}`); +} diff --git a/src/app/meeting/[category]/@modal/[id]/(.)APPROVED/page.tsx b/src/app/meeting/[category]/@modal/[id]/(.)APPROVED/page.tsx new file mode 100644 index 00000000..8b10c684 --- /dev/null +++ b/src/app/meeting/[category]/@modal/[id]/(.)APPROVED/page.tsx @@ -0,0 +1,29 @@ +'use client'; + +import ModalRegisterComplete from '@/app/meeting/_features/modal-content/ModalRegisterComplete'; +import ModalPortal from '@/components/ui/modal/ModalPortal'; +import { useRouter } from 'next/navigation'; + +export default function UserListModal({ + params, +}: { + params: { category: string; id: number }; +}) { + const router = useRouter(); + const category = params.category; + const meetingId = Number(params.id); + + return ( + + router.push(`/meeting/${category}/${meetingId}`, { scroll: false }) + } + confirmText="내 모임 보러가기" + cancelText="확인" + modalClassName="w-96" + > + + + ); +} diff --git a/src/app/meeting/[category]/@modal/[id]/(.)CANCEL/page.tsx b/src/app/meeting/[category]/@modal/[id]/(.)CANCEL/page.tsx new file mode 100644 index 00000000..43428a0c --- /dev/null +++ b/src/app/meeting/[category]/@modal/[id]/(.)CANCEL/page.tsx @@ -0,0 +1,40 @@ +'use client'; + +import ModalCancel from '@/app/meeting/_features/modal-content/ModalCancel'; +import ModalPortal from '@/components/ui/modal/ModalPortal'; +import { useMeetingQuitMutation } from '@/hooks/mutations/useMeetingMutation'; +import { useRouter } from 'next/navigation'; + +export default function UserListModal({ + params, +}: { + params: { category: string; id: number }; +}) { + const router = useRouter(); + const category = params.category; + const meetingId = Number(params.id); + + const { mutate: cancelMutate } = useMeetingQuitMutation({ + meetingId: meetingId, + }); + + const handleConfirm = () => { + cancelMutate(); + router.back(); + }; + + return ( + + router.push(`/meeting/${category}/${meetingId}`, { scroll: false }) + } + onConfirm={handleConfirm} + confirmText="신청 취소" + cancelText="돌아가기" + modalClassName="w-96" + > + + + ); +} diff --git a/src/app/meeting/[category]/@modal/[id]/(.)PENDING/page.tsx b/src/app/meeting/[category]/@modal/[id]/(.)PENDING/page.tsx new file mode 100644 index 00000000..f760b940 --- /dev/null +++ b/src/app/meeting/[category]/@modal/[id]/(.)PENDING/page.tsx @@ -0,0 +1,30 @@ +'use client'; + +import ModalRegisterWait from '@/app/meeting/_features/modal-content/ModalRegisterWait'; +import ModalPortal from '@/components/ui/modal/ModalPortal'; +import { useRouter } from 'next/navigation'; + +export default function UserListModal({ + params, +}: { + params: { category: string; id: number }; +}) { + const router = useRouter(); + const category = params.category; + const meetingId = Number(params.id); + + return ( + + router.push(`/meeting/${category}/${meetingId}`, { scroll: false }) + } + onConfirm={() => router.push('/my-meeting/my?type=joined')} + confirmText="내 모임 보러가기" + cancelText="확인" + modalClassName="w-96" + > + + + ); +} diff --git a/src/app/meeting/[category]/@modal/[id]/(.)intro-input/page.tsx b/src/app/meeting/[category]/@modal/[id]/(.)intro-input/page.tsx new file mode 100644 index 00000000..d02f1bde --- /dev/null +++ b/src/app/meeting/[category]/@modal/[id]/(.)intro-input/page.tsx @@ -0,0 +1,55 @@ +'use client'; + +import ModalRegisterInput from '@/app/meeting/_features/modal-content/ModalRegisterInput'; +import ModalPortal from '@/components/ui/modal/ModalPortal'; +import { useMeetingMutation } from '@/hooks/mutations/useMeetingMutation'; +import { translateCategoryNameToEng } from '@/util/searchFilter'; +import { useRouter } from 'next/navigation'; +import { useState } from 'react'; + +export default function UserListModal({ + params, +}: { + params: { category: string; id: number }; +}) { + const router = useRouter(); + const [value, setValue] = useState(''); + + const meetingId = Number(params.id); + const category = params.category; + + const { mutate } = useMeetingMutation({ + onSuccessCallback: (status: string) => + router.push( + `/meeting/${translateCategoryNameToEng(category)}/${meetingId}/${status}`, + { scroll: false }, + ), + onErrorCallback: () => + router.push( + `/meeting/${translateCategoryNameToEng(category)}/${meetingId}`, + { scroll: false }, + ), + meetingId: meetingId, + }); + + const handleConfirm = () => { + mutate({ message: value }); + setValue(''); + router.push( + `/meeting/${translateCategoryNameToEng(category)}/${meetingId}/intro-input`, + { scroll: false }, + ); + }; + + return ( + + + + ); +} diff --git a/src/app/meeting/[category]/@modal/[id]/(.)need-login/page.tsx b/src/app/meeting/[category]/@modal/[id]/(.)need-login/page.tsx new file mode 100644 index 00000000..cbf51d95 --- /dev/null +++ b/src/app/meeting/[category]/@modal/[id]/(.)need-login/page.tsx @@ -0,0 +1,22 @@ +'use client'; + +import ModalPortal from '@/components/ui/modal/ModalPortal'; +import { useRouter } from 'next/navigation'; + +export default function UserListModal() { + const router = useRouter(); + + return ( + router.push('/login')} + confirmText="로그인" + cancelText="취소" + modalClassName="w-96" + > +
+

로그인이 필요한 서비스입니다.

+
+ + ); +} diff --git a/src/app/meeting/[category]/@modal/[id]/(.)register/page.tsx b/src/app/meeting/[category]/@modal/[id]/(.)register/page.tsx new file mode 100644 index 00000000..311037be --- /dev/null +++ b/src/app/meeting/[category]/@modal/[id]/(.)register/page.tsx @@ -0,0 +1,42 @@ +'use client'; + +import ModalBeforeLogin from '@/app/meeting/_features/modal-content/ModalBeforeLogin'; +import ModalPortal from '@/components/ui/modal/ModalPortal'; +import { meetingKeys } from '@/hooks/queries/useMeetingQueries'; +import { translateCategoryNameToEng } from '@/util/searchFilter'; +import { useQueryClient } from '@tanstack/react-query'; +import { useRouter } from 'next/navigation'; +import { MeetingDetail } from 'service/api/meeting'; + +export default function UserListModal({ + params, +}: { + params: { category: string; id: number }; +}) { + const router = useRouter(); + const meetingId = Number(params.id); + const queryClient = useQueryClient(); + + const meeting = queryClient.getQueryData( + meetingKeys.detailInfo(meetingId), + ); + + if (!meeting) return null; + + return ( + + router.push( + `/meeting/${translateCategoryNameToEng(meeting.categoryTitle)}/${meeting.meetingId}/intro-input`, + { scroll: false }, + ) + } + confirmText="신청" + cancelText="취소" + modalClassName="w-96" + > + + + ); +} diff --git a/src/app/meeting/[category]/@modal/[id]/page.tsx b/src/app/meeting/[category]/@modal/[id]/page.tsx new file mode 100644 index 00000000..22b9b6f3 --- /dev/null +++ b/src/app/meeting/[category]/@modal/[id]/page.tsx @@ -0,0 +1,3 @@ +export default function DefaultModal() { + return null; // 기본적으로 모달 없음 +} diff --git a/src/app/meeting/_features/CardRightSection.tsx b/src/app/meeting/_features/CardRightSection.tsx index 9f3a0e67..942b51c3 100644 --- a/src/app/meeting/_features/CardRightSection.tsx +++ b/src/app/meeting/_features/CardRightSection.tsx @@ -1,20 +1,31 @@ 'use client'; import { Button } from '@/components/ui/Button'; -import Modal from '@/components/ui/modal/Modal'; -import useCard from '@/hooks/useCard'; +import { getAccessToken } from '@/lib/serverActions'; import { getDDay } from '@/util/date'; +import { translateCategoryNameToEng } from '@/util/searchFilter'; +import { useRouter } from 'next/navigation'; import { MeetingDetail } from 'service/api/meeting'; const CardRightSection = ({ meeting }: { meeting: MeetingDetail }) => { - const { - handleModalOpen, - isModalOpen, - setIsModalOpen, - handleModalConfirm, - modalValue, - renderModalContent, - } = useCard(meeting); + const router = useRouter(); + + const handleRegister = async () => { + const token = await getAccessToken(); + + // 로그인 전인지 확인 + if (!token) { + router.push( + `/meeting/${translateCategoryNameToEng(meeting.categoryTitle)}/${meeting.meetingId}/need-login`, + { scroll: false }, + ); + } else { + router.push( + `/meeting/${translateCategoryNameToEng(meeting.categoryTitle)}/${meeting.meetingId}/register`, + { scroll: false }, + ); + } + }; return (
@@ -33,10 +44,7 @@ const CardRightSection = ({ meeting }: { meeting: MeetingDetail }) => { 인원이 꽉찼어요 ) : ( - ) @@ -44,22 +52,16 @@ const CardRightSection = ({ meeting }: { meeting: MeetingDetail }) => { )} - - setIsModalOpen(false)} - onConfirm={handleModalConfirm} - confirmText={modalValue.confirmText} - cancelText={modalValue.cancelText} - modalClassName={`w-96 ${modalValue.modalClassName}`} - > - {renderModalContent()} -
); }; diff --git a/src/app/meeting/_features/modal-content/ModalRegisterInput.tsx b/src/app/meeting/_features/modal-content/ModalRegisterInput.tsx index 63bfaad5..6735a839 100644 --- a/src/app/meeting/_features/modal-content/ModalRegisterInput.tsx +++ b/src/app/meeting/_features/modal-content/ModalRegisterInput.tsx @@ -3,11 +3,11 @@ import { Dispatch, SetStateAction } from 'react'; const ModalRegisterInput = ({ - ment, - setMent, + value, + setValue, }: { - ment: string; - setMent: Dispatch>; + value: string; + setValue: Dispatch>; }) => { return (
@@ -15,8 +15,9 @@ const ModalRegisterInput = ({ 마이 페이지에 등록된 정보가 주최자에게 전달됩니다!