feat: 페이지 접근 권한 추가 (로그인 & 모임 장)

src/app/group/[groupId]/edit/page.tsx

@@ -1,38 +1,48 @@
 'use client';
 
-import { useRouter } from 'next/navigation';
+import { notFound, useRouter } from 'next/navigation';
 import { FormProvider, SubmitHandler, useForm } from 'react-hook-form';
 
-import type { APIGroupDetail, BookGroupEdit } from '@/types/group';
 import {
   useBookGroupEditCurrentInfo,
   useBookGroupInfoMutation,
 } from '@/queries/group/useBookGroupQuery';
+import type { APIGroupDetail, APIEditBookGroup } from '@/types/group';
 
-import BookGroupEditTopNavigation from '@/v1/bookGroup/edit/BookGroupEditTopNavigation';
-import BookGroupEditTitleForm from '@/v1/bookGroup/edit/BookGroupEditTitleForm';
-import BookGroupEditIntroduceForm from '@/v1/bookGroup/edit/BookGroupEditIntroduceForm';
-import BookGroupEditDateForm from '@/v1/bookGroup/edit/BookGroupEditDateForm';
-import { isAxiosErrorWithCustomCode } from '@/utils/helpers';
 import { SERVICE_ERROR_MESSAGE } from '@/constants';
+import {
+  checkAuthentication,
+  isAxiosErrorWithCustomCode,
+} from '@/utils/helpers';
+
 import useToast from '@/v1/base/Toast/useToast';
+import BookGroupEditDateForm from '@/v1/bookGroup/edit/BookGroupEditDateForm';
+import BookGroupEditIntroduceForm from '@/v1/bookGroup/edit/BookGroupEditIntroduceForm';
+import BookGroupEditTitleForm from '@/v1/bookGroup/edit/BookGroupEditTitleForm';
+import BookGroupEditTopNavigation from '@/v1/bookGroup/edit/BookGroupEditTopNavigation';
 
 const BookGroupEditPage = ({
   params: { groupId },
 }: {
   params: { groupId: APIGroupDetail['bookGroupId'] };
 }) => {
-  const { show: showToast } = useToast();
-
   const router = useRouter();
 
+  const isAuthenticated = checkAuthentication();
+
   const { data: bookGroupData } = useBookGroupEditCurrentInfo(groupId);
-  const { title, description, maxMemberCount, startDate, endDate } =
+  const { isOwner, title, description, maxMemberCount, startDate, endDate } =
     bookGroupData;
 
+  if (!isAuthenticated || !isOwner) {
+    notFound();
+  }
+
   const bookGroupEdit = useBookGroupInfoMutation(groupId);
 
-  const methods = useForm<BookGroupEdit>({
+  const { show: showToast } = useToast();
+
+  const methods = useForm<Omit<APIEditBookGroup, 'isOwner'>>({
     mode: 'all',
     defaultValues: {
       title: title,
@@ -43,19 +53,16 @@ const BookGroupEditPage = ({
     },
   });
 
-  const handleFormSubmit: SubmitHandler<BookGroupEdit> = async ({
-    title,
-    introduce,
-    maxMemberCount,
-    endDate,
-  }) => {
+  const handleFormSubmit: SubmitHandler<
+    Omit<APIEditBookGroup, 'isOwner' | 'startDate'>
+  > = async ({ title, introduce, maxMemberCount, endDate }) => {
     bookGroupEdit.mutate(
       { title, introduce, maxMemberCount, endDate },
       {
         onSuccess: () => {
           router.push(`/group/${groupId}`);
 
-          showToast({ type: 'success', message: '모임 정보 수정 완료 🎉' });
+          showToast({ type: 'success', message: '모임 정보를 수정했어요! 🎉' });
           return;
         },
         onError: error => {
@@ -77,20 +84,18 @@ const BookGroupEditPage = ({
   };
 
   return (
-    <>
-      <FormProvider {...methods}>
-        <BookGroupEditTopNavigation onSubmit={handleFormSubmit} />
-
-        <form
-          className="mt-[2.5rem] flex flex-col gap-[3.2rem]"
-          onSubmit={methods.handleSubmit(handleFormSubmit)}
-        >
-          <BookGroupEditTitleForm />
-          <BookGroupEditIntroduceForm />
-          <BookGroupEditDateForm />
-        </form>
-      </FormProvider>
-    </>
+    <FormProvider {...methods}>
+      <BookGroupEditTopNavigation onSubmit={handleFormSubmit} />
+
+      <form
+        className="mt-[2.5rem] flex flex-col gap-[3.2rem]"
+        onSubmit={methods.handleSubmit(handleFormSubmit)}
+      >
+        <BookGroupEditTitleForm />
+        <BookGroupEditIntroduceForm />
+        <BookGroupEditDateForm />
+      </form>
+    </FormProvider>
   );
 };