Revert "[#455] [모임 상세] 모임 가입 문제 페이지 (#462)"

This reverts commit 7bbdbaf.

src/v1/bookGroup/BookGroupNavigation.tsx

@@ -18,6 +18,14 @@ import {
 
 const NavigationContext = createContext({} as { groupId: number });
 
+const getTargetChildren = (children: ReactNode, Target: () => JSX.Element) => {
+  const childrenArray = Children.toArray(children);
+
+  return childrenArray.filter(
+    child => isValidElement(child) && child.type === (<Target />).type
+  );
+};
+
 const BookGroupNavigation = ({
   groupId,
   children,
@@ -47,38 +55,11 @@ const BookGroupNavigation = ({
   );
 };
 
-type BackButtonProps =
-  | {
-      routeOption: 'push';
-      href: string;
-    }
-  | {
-      routeOption: 'replace';
-      href: string;
-    }
-  | {
-      routeOption?: 'back';
-    };
-
-const BackButton = (props: BackButtonProps) => {
-  const { routeOption } = props;
+const BackButton = () => {
   const router = useRouter();
 
-  const handleClick = () => {
-    switch (routeOption) {
-      case 'push':
-        return router.push(props.href);
-      case 'replace':
-        return router.replace(props.href);
-      case 'back':
-        return router.back();
-      default:
-        return router.back();
-    }
-  };
-
   return (
-    <a onClick={handleClick}>
+    <a onClick={router.back}>
       <IconArrowLeft />
     </a>
   );
@@ -116,23 +97,3 @@ export default BookGroupNavigation;
 const TitleSkeleton = () => (
   <div className="h-[1.5rem] w-[40%] animate-pulse bg-black-400"></div>
 );
-
-const BackButtonType = (<BackButton />).type;
-const TitleType = (<Title />).type;
-const MenuButtonType = (<MenuButton />).type;
-const WriteButtonType = (<WriteButton />).type;
-
-const getTargetChildren = (
-  children: ReactNode,
-  targetType:
-    | typeof BackButtonType
-    | typeof TitleType
-    | typeof MenuButtonType
-    | typeof WriteButtonType
-) => {
-  const childrenArray = Children.toArray(children);
-
-  return childrenArray.find(
-    child => isValidElement(child) && child.type === targetType
-  );
-};

src/v1/bookGroup/detail/JoinBookGroupButton.tsx

@@ -1,21 +1,49 @@
 import { usePathname, useRouter } from 'next/navigation';
 
-import useJoinBookGroup from '@/hooks/group/useJoinBookGroup';
+import { SERVICE_ERROR_MESSAGE } from '@/constants';
+import { isAxiosErrorWithCustomCode } from '@/utils/helpers';
+
+import { useBookGroupJoinInfo } from '@/queries/group/useBookGroupQuery';
+import groupAPI from '@/apis/group';
+import useToast from '@/v1/base/Toast/useToast';
 import BottomActionButton from '@/v1/base/BottomActionButton';
 
 const JoinBookGroupButton = ({ groupId }: { groupId: number }) => {
-  const router = useRouter();
-  const pathname = usePathname();
-  const { isExpired, isMember, hasPassword, joinBookGroup, refetch } =
-    useJoinBookGroup(groupId);
+  const _router = useRouter();
+  const _pathname = usePathname();
+  const toast = useToast();
+
+  const {
+    data: { isExpired, isMember, hasPassword },
+    refetch,
+  } = useBookGroupJoinInfo(groupId);
+
+  const joinBookGroup = async () => {
+    try {
+      await groupAPI.joinGroup({ bookGroupId: groupId });
+      toast.show({ message: '모임에 가입했어요!', type: 'success' });
+      refetch();
+    } catch (error) {
+      if (!isAxiosErrorWithCustomCode(error)) {
+        toast.show({ message: '잠시 후 다시 시도해주세요.', type: 'error' });
+        return;
+      }
+
+      const { code } = error.response.data;
+      const message = SERVICE_ERROR_MESSAGE[code];
+
+      toast.show({ message, type: 'error' });
+    }
+  };
 
   const handleButtonClick = async () => {
     if (hasPassword) {
-      router.replace(`${pathname}/join`);
+      // TODO: 모임 가입문제 페이지 생성 후 연결
+      // router.push(`${pathname}/join`);
       return;
     }
 
-    joinBookGroup({ onSuccess: refetch });
+    joinBookGroup();
   };
 
   if (isMember) {