번쩍 홈/전체/상세

pages/detail/index.tsx

@@ -14,31 +14,28 @@ import FeedPanel from '@components/page/detail/Feed/FeedPanel';
 import { Fragment, useEffect, useState } from 'react';
 import dayjs from 'dayjs';
 import 'dayjs/locale/ko';
-import { ERecruitmentStatus } from '@constants/option';
 import MeetingController from '@components/page/detail/MeetingController';
+import { useLightningByIdQuery } from '@api/lightning/hook';
+import { GetMeetingResponse } from '@api/API_LEGACY/meeting';
+import { GetLightningByIdResponse } from '@api/lightning';
 
 dayjs.locale('ko');
 
 const enum SelectedTab {
-  FEED,
   INFORMATION,
+  FEED,
 }
 
 const DetailPage = () => {
   const router = useRouter();
   const id = router.query.id as string;
-  const { data: detailData } = useQueryGetMeeting({ params: { id } });
+  const { data: meetingData } = useQueryGetMeeting({ params: { id } });
+  const { data: lightningData } = useLightningByIdQuery({ meetingId: +id });
   const { mutate: mutateDeleteMeeting } = useMutationDeleteMeeting({});
   const { mutate: mutatePostApplication } = useMutationPostApplication({});
   const { mutate: mutateDeleteApplication } = useMutationDeleteApplication({});
   const [selectedIndex, setSelectedIndex] = useState(SelectedTab.INFORMATION);
 
-  useEffect(() => {
-    if (detailData) {
-      setSelectedIndex(detailData.status === ERecruitmentStatus.OVER ? SelectedTab.FEED : SelectedTab.INFORMATION);
-    }
-  }, [detailData]);
-
   useEffect(() => {
     const script = document.createElement('script');
     script.async = true;
@@ -51,7 +48,7 @@ const DetailPage = () => {
     document.body.removeChild(script);
   }, []);
 
-  if (!detailData) {
+  if (!meetingData) {
     return (
       <>
         <Loader />
@@ -68,6 +65,7 @@ const DetailPage = () => {
       </>
     );
   }
+  const detailData: GetMeetingResponse | GetLightningByIdResponse = lightningData || meetingData;
 
   return (
     <>
@@ -82,18 +80,18 @@ const DetailPage = () => {
         <Tab.Group selectedIndex={selectedIndex} onChange={index => setSelectedIndex(index)}>
           <STabList>
             <Tab as={Fragment}>
-              <STabButton isSelected={selectedIndex === SelectedTab.FEED}>피드</STabButton>
+              <STabButton isSelected={selectedIndex === SelectedTab.INFORMATION}>모임 안내</STabButton>
             </Tab>
             <Tab as={Fragment}>
-              <STabButton isSelected={selectedIndex === SelectedTab.INFORMATION}>모임 안내</STabButton>
+              <STabButton isSelected={selectedIndex === SelectedTab.FEED}>피드</STabButton>
             </Tab>
           </STabList>
           <Tab.Panels>
             <Tab.Panel>
-              <FeedPanel isMember={detailData?.approved || detailData?.host} />
+              <InformationPanel detailData={detailData} />
             </Tab.Panel>
             <Tab.Panel>
-              <InformationPanel detailData={detailData} />
+              <FeedPanel isMember={detailData?.approved || detailData?.host} />
             </Tab.Panel>
           </Tab.Panels>
         </Tab.Group>

pages/index.tsx

@@ -1,4 +1,3 @@
-import { useQueryGetGroupBrowsingCard } from '@api/API_LEGACY/meeting/hooks';
 import { useInfinitePosts } from '@api/post/hooks';
 import Carousel from '@components/groupBrowsing/Carousel/Carousel';
 import GroupBrowsingSlider from '@components/groupBrowsingSlider/groupBrowsingSlider';
@@ -16,6 +15,7 @@ import { styled } from 'stitches.config';
 import CrewTab from '@components/CrewTab';
 import HomeCardList from '@components/page/home/HomeCardList';
 import { useGetRecommendMeetingListQuery } from '@api/meeting/hook';
+import { useLightningListQuery } from '@api/lightning/hook';
 
 const Home: NextPage = () => {
   const { isLaptop, isTablet } = useDisplay();
@@ -24,7 +24,7 @@ const Home: NextPage = () => {
 
   const { fetchNextPage, hasNextPage, isFetchingNextPage, isLoading } = useInfinitePosts(TAKE_COUNT);
 
-  const { data: groupBrowsingCardData } = useQueryGetGroupBrowsingCard();
+  const lightningList = useLightningListQuery().data?.meetings;
   const { data: inProgressMeetings } = useGetRecommendMeetingListQuery({ meetingIds: [] });
 
   useEffect(() => {
@@ -40,15 +40,15 @@ const Home: NextPage = () => {
       {isTablet ? (
         <>
           <SContentTitle style={{ marginTop: '16px' }}>⚡ ️솝트만의 일회성 모임, 번쩍</SContentTitle>
-          {groupBrowsingCardData && <GroupBrowsingSlider cardList={groupBrowsingCardData}></GroupBrowsingSlider>}
+          {lightningList && <GroupBrowsingSlider cardList={lightningList}></GroupBrowsingSlider>}
         </>
       ) : (
         <>
           <Flex align="center" justify="center">
             <SContentTitle style={{ marginTop: '54px' }}>⚡ ️솝트만의 일회성 모임, 번쩍</SContentTitle>
           </Flex>
           <GroupBrowsingCarouselContainer>
-            {groupBrowsingCardData && <Carousel cardList={groupBrowsingCardData} />}
+            {lightningList && <Carousel cardList={lightningList} />}
           </GroupBrowsingCarouselContainer>
         </>
       )}
@@ -57,12 +57,12 @@ const Home: NextPage = () => {
           <QuickMenuWrapper>
             <QuickMenu />
           </QuickMenuWrapper>
-          {inProgressMeetings && <HomeCardList groupBrowsingCardData={inProgressMeetings} />}
+          {inProgressMeetings && <HomeCardList inProgressMeetingData={inProgressMeetings} />}
         </Flex>
       ) : (
         <>
           <Flex justify="center" style={{ marginTop: '72px' }}>
-            {inProgressMeetings && <HomeCardList groupBrowsingCardData={inProgressMeetings} />}
+            {inProgressMeetings && <HomeCardList inProgressMeetingData={inProgressMeetings} />}
             <div style={{ paddingLeft: '106px' }}>
               <QuickMenu />
             </div>

pages/make/bungae/index.tsx → pages/make/lightning/index.tsx

@@ -1,5 +1,5 @@
 import { FormProvider, SubmitHandler, useForm } from 'react-hook-form';
-import { BungaeFormType, bungaeSchema } from '@type/form';
+import { LightningFormType, lightningSchema } from '@type/form';
 import { styled } from 'stitches.config';
 import { zodResolver } from '@hookform/resolvers/zod';
 import { useRouter } from 'next/router';
@@ -10,21 +10,21 @@ import { ampli } from '@/ampli';
 import { fontsObject } from '@sopt-makers/fonts';
 import { colors } from '@sopt-makers/colors';
 import Presentation from '@components/form/Bungae';
-import { createBungae } from '@api/meeting';
+import { createLightning } from '@api/lightning';
 
 const DevTool = dynamic(() => import('@hookform/devtools').then(module => module.DevTool), {
   ssr: false,
 });
 
-const Bungae = () => {
+const Lightning = () => {
   const router = useRouter();
-  const formMethods = useForm<BungaeFormType>({
+  const formMethods = useForm<LightningFormType>({
     mode: 'onChange',
-    resolver: zodResolver(bungaeSchema),
+    resolver: zodResolver(lightningSchema),
   });
   const { isValid, errors } = formMethods.formState;
-  const { mutateAsync: mutateCreateBungae, isLoading: isSubmitting } = useMutation({
-    mutationFn: (formData: BungaeFormType) => createBungae(formData),
+  const { mutateAsync: mutateCreateLightning, isLoading: isSubmitting } = useMutation({
+    mutationFn: (formData: LightningFormType) => createLightning(formData),
     onError: () => {
       alert('번쩍을 개설하지 못했습니다.');
     },
@@ -42,11 +42,13 @@ const Bungae = () => {
     formMethods.setValue('files', files);
   };
 
-  const onSubmit: SubmitHandler<BungaeFormType> = async formData => {
-    const bungaeId = await mutateCreateBungae(formData);
-    ampli.completedMakeGroup();
-    alert('번쩍을 개설했습니다.');
-    router.push(`/detail?id=${bungaeId}`);
+  const onSubmit: SubmitHandler<LightningFormType> = async formData => {
+    mutateCreateLightning(formData, {
+      onSuccess: data => {
+        ampli.completedMakeGroup();
+        router.push(`/detail?id=${data}`);
+      },
+    });
   };
 
   return (
@@ -78,7 +80,7 @@ const Bungae = () => {
   );
 };
 
-export default Bungae;
+export default Lightning;
 
 const SContainer = styled('div', {
   margin: '80px 0',

pages/mine/management/index.tsx

@@ -1,7 +1,5 @@
 import { useRouter } from 'next/router';
-import Link from 'next/link';
 import { styled } from 'stitches.config';
-import { TabList } from '@components/@common/tabList/TabList';
 import ManagementListSkeleton from '@components/page/mine/management/Skeleton/ManagementListSkeleton';
 import MeetingInformationSkeleton from '@components/page/mine/management/Skeleton/MeetingInformationSkeleton';
 import ManagementListItem from '@components/page/mine/management/ManagementListItem';

pages/post/index.tsx

@@ -58,7 +58,7 @@ export default function PostPage() {
     mutationFn: (comment: string) =>
       POST('/comment/v2', {
         body: {
-          postId: post!.id,
+          postId: post?.id,
           contents: comment,
           isParent: parentComment.parentComment,
           parentCommentId: parentComment.parentComment ? null : parentComment.parentCommentId,