Merge pull request #187 from Make-A-Wish-Sopt/hotfix/186-wishes

Hotfix/186 wishes
Make-A-Wish-Sopt · Jan 10, 2024 · cae60cb · cae60cb · vercel · Jan 10, 2024
2 parents 50008c3 + 4aa3d1e
commit cae60cb
Show file tree

Hide file tree

Showing 10 changed files with 40 additions and 58 deletions.
diff --git a/components/Main/MainTopContent.tsx b/components/Main/MainTopContent.tsx
@@ -40,7 +40,9 @@ export default function MainTopContent() {
           progressData.status === 'BEFORE' ? (
             <>
               {`${nickName}님\n`}
-              <Styled.Text>{`${progressData.dayCount}일 뒤 `}</Styled.Text>
+              <Styled.Text>{`${
+                progressData.dayCount < 1 ? 1 : progressData.dayCount
+              }일 뒤 `}</Styled.Text>
               {`부터 소원링크를\n공유할 수 있어요!`}
             </>
           ) : (

diff --git a/components/Mypage/Letters/[id].tsx b/components/Mypage/Letters/[id].tsx
@@ -4,7 +4,7 @@ import CakeListButton from './CakeListButton';
 import Image from 'next/image';
 import { BorderImg } from '@/public/assets/images';
 import { useEffect, useState } from 'react';
-import { ArrowLeftIc, ArrowRightIc, BackBtnIc } from '@/public/assets/icons';
+import { ArrowLeftIc, ArrowRightIc } from '@/public/assets/icons';
 import { useRouter } from 'next/router';
 import { CAKE_LIST } from '@/constant/cakeList';
 import { useGetCakesInfo } from '@/hooks/queries/cakes';
@@ -44,10 +44,6 @@ export default function LettersContainer() {
     setClickedBox(movedBox);
   };
 
-  const handleMoveBack = () => {
-    window.history.back();
-  };
-
   return (
     <>
       <CakeListButton

diff --git a/components/Mypage/Links/index.tsx b/components/Mypage/Links/index.tsx
@@ -9,6 +9,7 @@ import NoWishLists from './NoWishLists';
 import { useDeleteWishes, useGetWishLinks } from '@/hooks/queries/wishes';
 import Image from 'next/image';
 import { DeleteBtnIc } from '@/public/assets/icons';
+import BackBtn from '@/components/Common/Button/BackBtn';
 
 export default function LinksMainContainer() {
   const [selectedLinks, setSelectedLinks] = useState<number[]>([]);
@@ -43,9 +44,12 @@ export default function LinksMainContainer() {
           />
         </Modal>
       )}
-      <Styled.DeleteIconButton onClick={() => selectedLinks.length > 0 && handleToggle()}>
-        <Image src={DeleteBtnIc} alt="삭제 아이콘" />
-      </Styled.DeleteIconButton>
+      <Styled.Hedaer>
+        <BackBtn />
+        <Styled.DeleteIconButton onClick={() => selectedLinks.length > 0 && handleToggle()}>
+          <Image src={DeleteBtnIc} alt="삭제 아이콘" />
+        </Styled.DeleteIconButton>
+      </Styled.Hedaer>
 
       <Styled.Title>지난 소원 링크 모음</Styled.Title>
       <Styled.Container>
@@ -64,7 +68,16 @@ export default function LinksMainContainer() {
 }
 
 const Styled = {
+  Hedaer: styled.header`
+    display: flex;
+    justify-content: space-between;
+
+    width: 100%;
+  `,
+
   Container: styled.div`
+    position: relative;
+
     margin: 0 1rem 0;
     overflow: auto;
     max-height: 80vh;
@@ -76,9 +89,5 @@ const Styled = {
     margin: 2rem 1rem 2rem;
   `,
 
-  DeleteIconButton: styled.button`
-    position: fixed;
-    top: 1.9rem;
-    right: 2.2rem;
-  `,
+  DeleteIconButton: styled.button``,
 };
diff --git a/components/Wishes/WishesForm/BankInfo.tsx b/components/Wishes/WishesForm/BankInfo.tsx
@@ -15,6 +15,7 @@ import { useEffect } from 'react';
 import { validation } from '@/validation/input';
 import AlertTextBox from '@/components/Common/AlertTextBox';
 import { useGetUserAccount, usePutUserAccount } from '@/hooks/queries/user';
+import { usePostWishes } from '@/hooks/queries/wishes';
 
 interface BankInfoProps {
   methods: UseFormReturn<WishesDataInputType, any, undefined>;
@@ -35,7 +36,12 @@ export default function BankInfo(props: BankInfoProps) {
   const { methods, wishesStep } = props;
   const { userAccountData } = useGetUserAccount();
   const { checkBoxState, handleChangeCheckBoxState } = useCheckBox();
-  const { handlePutUserAccount } = usePutUserAccount(methods);
+  const { handlePutUserAccount, isSuccess } = usePutUserAccount(methods);
+  const { handlePostWishes } = usePostWishes(methods);
+
+  useEffect(() => {
+    isSuccess && handlePostWishes();
+  }, [isSuccess]);
 
   useEffect(() => {
     if (

diff --git a/components/Wishes/WishesForm/Preview.tsx b/components/Wishes/WishesForm/Preview.tsx
@@ -11,8 +11,6 @@ import WishesStepTitle from '../Common/WishesStepTitle';
 import WishesStepBtn from '../Common/WishesStepBtn';
 import { ColorSystemType } from '@/types/common/box/boxStyleType';
 import { useEffect } from 'react';
-import { usePostWishes } from '@/hooks/queries/wishes';
-import ImageBox, { StyledImageBox } from '@/components/Common/Box/ImageBox';
 import { StyledBox } from '@/components/Common/Box';
 
 interface PreviewProps {
@@ -33,8 +31,6 @@ interface PreviewProps {
 export default function Preview(props: PreviewProps) {
   const { methods, wishesStep } = props;
 
-  const { postWishesData } = usePostWishes(methods);
-
   useEffect(() => {
     wishesStep.changeNextState(true);
   }, []);
@@ -67,12 +63,7 @@ export default function Preview(props: PreviewProps) {
           </InputContainer>
         </div>
 
-        <WishesStepBtn
-          wishesStep={wishesStep}
-          handleClickFn={() => {
-            postWishesData();
-          }}
-        />
+        <WishesStepBtn wishesStep={wishesStep} />
       </Styled.Container>
     </>
   );

diff --git a/components/Wishes/[id].tsx b/components/Wishes/[id].tsx
@@ -3,8 +3,6 @@ import styled from 'styled-components';
 import { useRouter } from 'next/router';
 import Button from '../Common/Button';
 import MainView from '../Common/mainView';
-import { useGetSingleWishInfo } from '@/hooks/queries/wishes';
-import { getPublicWishes } from '@/api/public';
 import { useGetPublicWishes } from '@/hooks/queries/public';
 
 export default function WishesContainer() {

diff --git a/hooks/queries/user.ts b/hooks/queries/user.ts
@@ -6,13 +6,16 @@ import { UseFormReturn } from 'react-hook-form';
 import { useMutation, useQuery } from 'react-query';
 
 export function usePutUserAccount(methods: UseFormReturn<WishesDataInputType, any, undefined>) {
-  const { mutate: handlePutUserAccount } = useMutation(() => putUserAccount(methods), {
-    onSuccess: () => {
-      router.push('/wishes/share');
+  const { mutate: handlePutUserAccount, ...restProps } = useMutation(
+    () => putUserAccount(methods),
+    {
+      onSuccess: () => {
+        router.push('/wishes/share');
+      },
     },
-  });
+  );
 
-  return { handlePutUserAccount };
+  return { handlePutUserAccount, ...restProps };
 }
 
 export function useGetUserAccount() {

diff --git a/hooks/queries/wishes.ts b/hooks/queries/wishes.ts
@@ -61,7 +61,7 @@ export function usePatchProgressWishes() {
 export function usePostWishes(methods: UseFormReturn<WishesDataInputType, any, undefined>) {
   const setLoginUserInfo = useSetRecoilState(LoginUserInfo);
 
-  const { mutate: postWishesData } = useMutation(() => postWishes(methods), {
+  const { mutate: handlePostWishes } = useMutation(() => postWishes(methods), {
     onSuccess: (data) => {
       setLoginUserInfo((prevData) => ({
         ...prevData,
@@ -70,7 +70,7 @@ export function usePostWishes(methods: UseFormReturn<WishesDataInputType, any, u
     },
   });
 
-  return { postWishesData };
+  return { handlePostWishes };
 }
 
 /**

diff --git a/pages/_app.tsx b/pages/_app.tsx
@@ -8,7 +8,6 @@ import styled, { ThemeProvider } from 'styled-components';
 import theme from '@/styles/theme';
 import { useEffect } from 'react';
 import Script from 'next/script';
-import { useRouter } from 'next/router';
 import Loading from '@/components/Common/Loading/Loading';
 
 declare global {
@@ -23,38 +22,16 @@ export default function App({ Component, pageProps }: AppProps) {
       queries: {
         retry: 0,
         refetchOnWindowFocus: false,
-        // suspense: true,
       },
     },
   });
 
-  const router = useRouter();
-
-  // const setVh = () => {
-  //   document.documentElement.style.setProperty('--vh', `${window.innerHeight}px`);
-  // };
-
   useEffect(() => {
     if (window.Kakao && !window.Kakao.isInitialized()) {
       window.Kakao.init(process.env.NEXT_PUBLIC_KAKAO_JAVASCRIPT_KEY);
     }
-    //높이 resize
-    // window.addEventListener('resize', setVh);
-    // setVh();
   }, []);
 
-  // useEffect(() => {
-  //   const handleRouteChange = (url: string) => {
-  //     gtag.pageview(url);
-  //   };
-  //   router.events.on('routeChangeComplete', handleRouteChange);
-  //   router.events.on('hashChangeComplete', handleRouteChange);
-  //   return () => {
-  //     router.events.off('routeChangeComplete', handleRouteChange);
-  //     router.events.off('hashChangeComplete', handleRouteChange);
-  //   };
-  // }, [router.events]);
-
   return (
     <>
       {/* Global Site Tag (gtag.js) - Google Analytics */}

diff --git a/pages/mypage/links/index.tsx b/pages/mypage/links/index.tsx
@@ -3,7 +3,7 @@ import LinksMainContainer from '@/components/Mypage/Links';
 
 export default function LinksMainPage() {
   return (
-    <Layout layoutKey="header">
+    <Layout layoutKey="empty">
       <LinksMainContainer />
     </Layout>
   );