Merge pull request #749 from prgrms-web-devcourse-final-project/feature/

#748-update-buttonPosition Feature/#748-페이지별 버튼 위치 수정
prgrms-web-devcourse-final-project · Dec 12, 2024 · d63175f · d63175f
2 parents ed9ed15 + be6e0ee
commit d63175f
Show file tree

Hide file tree

Showing 10 changed files with 14 additions and 11 deletions.
diff --git a/src/components/group/create/GroupCreateStep1.tsx b/src/components/group/create/GroupCreateStep1.tsx
@@ -41,7 +41,7 @@ const GroupCreateStep1: React.FC<GroupCreateStep1Props> = ({
           <p className='mt-1 text-main font-caption'>{INPUT_VALIDATION.roomName.errorMessage}</p>
         )}
       </div>
-      <div>
+      <div className='sticky bottom-6'>
         <Button
           label='다음'
           size='large'

diff --git a/src/components/group/create/GroupCreateStep2.tsx b/src/components/group/create/GroupCreateStep2.tsx
@@ -16,7 +16,7 @@ const GroupCreateStep2: React.FC<GroupCreateStep2Props> = ({ inviteLink, onSubmi
         <InputBox value={roomName} disabled={true} />
         <InviteLinkWithLabel initialLink={inviteLink} />
       </div>
-      <div>
+      <div className='sticky bottom-6'>
         <Button
           label='입장하기'
           size='large'

diff --git a/src/components/survey/OnBoarding.tsx b/src/components/survey/OnBoarding.tsx
@@ -120,7 +120,7 @@ const OnBoarding: React.FC<OnBoardingProps> = ({}) => {
   };
 
   return (
-    <div className={`flex h-screen flex-col overflow-hidden`}>
+    <div className={`flex h-screen flex-col`}>
       {step <= 4 && (
         <motion.div variants={item} initial='hidden' animate='show'>
           <div className='p-5'>
@@ -135,7 +135,7 @@ const OnBoarding: React.FC<OnBoardingProps> = ({}) => {
           <LoadingScreen username={username} isCompleted={isCompleted} />
         </div>
       ) : (
-        <motion.div className='flex h-screen flex-col gap-8 px-5'>
+        <motion.div className='flex flex-1 flex-col gap-8 px-5'>
           {/* TODO STEP 동일구조라서 hook 으로 사용 고려 */}
           {step === 1 && (
             <Step1
@@ -174,7 +174,7 @@ const OnBoarding: React.FC<OnBoardingProps> = ({}) => {
       )}
 
       {!loading && (
-        <motion.div className='sticky bottom-0 bg-white px-5 pb-6'>
+        <motion.div className='sticky bottom-6 bg-white px-5'>
           <Button
             size={'large'}
             variant={!isStepVaild() ? 'disabled' : 'full'}

diff --git a/src/pages/GroupCreatePage.tsx b/src/pages/GroupCreatePage.tsx
@@ -1,5 +1,4 @@
 import Header from '@/components/common/header/Header';
-import { Toaster } from '@/components/common/ui/toaster';
 import GroupCreateStep1 from '@/components/group/create/GroupCreateStep1';
 import GroupCreateStep2 from '@/components/group/create/GroupCreateStep2';
 import { useState } from 'react';
@@ -50,7 +49,6 @@ const GroupCreatePage = () => {
           <GroupCreateStep2 inviteLink={inviteLink} onSubmit={handleSubmit} roomName={roomName} />
         )}
       </div>
-      <Toaster />
     </div>
   );
 };

diff --git a/src/pages/GroupInviteReceivePage.tsx b/src/pages/GroupInviteReceivePage.tsx
@@ -4,10 +4,12 @@ import InputBox from '@/components/common/input/InputBox';
 import { useState } from 'react';
 import { useNavigate } from 'react-router-dom';
 import { postJoinGroup } from '@/services/group/postJoinGroup';
+import { useToast } from '@/hooks/use-toast';
 
 const GroupInviteReceivePage = () => {
   const [inviteLink, setInviteLink] = useState('');
   const navigate = useNavigate();
+  const { toast } = useToast();
 
   const handleBack = () => {
     navigate('/group-select');
@@ -18,7 +20,7 @@ const GroupInviteReceivePage = () => {
       const joinResult = await postJoinGroup({ inviteLink });
       navigate(`/main/${joinResult.result.channelId}`);
     } catch (error) {
-      console.error(error);
+      toast({ title: '코드를 다시 확인해주세요' });
     }
   };
 
@@ -33,7 +35,7 @@ const GroupInviteReceivePage = () => {
           handleChange={setInviteLink}
         />
       </div>
-      <div className='p-5'>
+      <div className='sticky bottom-6 px-5'>
         <Button
           label='입장하기'
           size='large'

diff --git a/src/pages/GroupSelectPage.tsx b/src/pages/GroupSelectPage.tsx
@@ -65,7 +65,7 @@ const GroupSelectPage = () => {
           </div>
         )}
       </div>
-      <div className='flex gap-x-4 px-5 py-6'>
+      <div className='sticky bottom-6 flex gap-x-4 px-5'>
         <Button
           label='방만들기'
           variant='full'

diff --git a/src/pages/HomePage.tsx b/src/pages/HomePage.tsx
@@ -41,6 +41,7 @@ const HomePage: React.FC = () => {
   const { data: houseworks, refetch } = useQuery({
     queryKey: ['houseworks', channelId, activeDate],
     queryFn: async () => await fetchHouseworks(activeDate),
+    refetchOnWindowFocus: true,
   });
   const { toast } = useToast();
   const navigate = useNavigate();

diff --git a/src/pages/HouseWorkStepOnePage.tsx b/src/pages/HouseWorkStepOnePage.tsx
@@ -123,6 +123,7 @@ const HouseWorkStepOnePage = () => {
         label='다음'
         handleClick={handleNextClick}
         disabled={!task || !startDate}
+        className='sticky bottom-6'
       />
 
       <HouseWorkSheet isOpen={isHouseWorkSheetOpen} setOpen={setHouseWorkSheetOpen} />

diff --git a/src/pages/HouseWorkStepTwoPage.tsx b/src/pages/HouseWorkStepTwoPage.tsx
@@ -163,6 +163,7 @@ const HouseWorkStepTwoPage = () => {
               size='large'
               handleClick={handleNextClick}
               disabled={!userId}
+              className='sticky bottom-6'
             />
           </>
         )}

diff --git a/src/pages/SurveyIntroPage.tsx b/src/pages/SurveyIntroPage.tsx
@@ -49,7 +49,7 @@ const SurveyIntroPage: React.FC = () => {
       <motion.div variants={item} className='h-96'>
         <LottieIcon />
       </motion.div>
-      <motion.div variants={item}>
+      <motion.div variants={item} className='sticky bottom-6'>
         <Button
           size='large'
           variant='full'