Merge pull request #70 from Gosrock/dev

fix : 티켓예매 후 모달, 키보드 자동완성 제거

src/components/auth/InputForm.tsx

@@ -68,6 +68,7 @@ const InputForm = ({ page, bind, onResendButtonClick }: InputFormProps) => {
         placeholder={formContent[page].placeholder}
         ref={inputRef}
         maxLength={formContent[page].limit}
+        autoComplete="off"
       />
       <div className="input-indicator">
         {page === 'validate' && (

src/components/common/ButtonSet.tsx

@@ -44,7 +44,7 @@ export default ButtonSet;
 const Wrapper = styled.div<{ height: number | undefined }>`
   width: 100%;
   height: 84px;
-  position: absolute;
+  position: fixed;
   bottom: 0px;
   display: flex;
   justify-content: center;

src/components/modal/Notice.tsx

@@ -3,6 +3,8 @@ import { ReactComponent as AlreadyEntered } from '../../assets/illusts/undraw_co
 import { ReactComponent as WrongDate } from '../../assets/illusts/undraw_access_denied_re_awnf.svg';
 import { ReactComponent as NewMessage } from '../../assets/illusts/undraw_new_message_re_fp03.svg';
 import { ReactComponent as Notify } from '../../assets/illusts/undraw_notify_re_65on.svg';
+import { ReactComponent as Love } from '../../assets/illusts/undraw_with_love_re_1q3m.svg';
+
 import ModalButton from '../common/ModalButton';
 export type NoticeProps = {
   onClick: () => void;
@@ -27,6 +29,18 @@ const noticeContent = {
     illust: <Notify />,
     text: '',
   },
+  티켓예매: {
+    illust: <Love />,
+    text: (
+      <>
+        <p>
+          티켓 예매에 성공했어요
+          <br />
+          마이페이지에서 확인해주세요
+        </p>
+      </>
+    ),
+  },
 };
 
 const Notice = ({ onClick, type, errorMessage }: NoticeProps) => {
@@ -64,7 +78,9 @@ const Head = styled.div`
   & > p {
     margin-top: 28px;
     ${({ theme }) => theme.typo.text_18_B}
+    line-height: 120%;
     font-size: 16px;
     color: ${({ theme }) => theme.palette.mono.black_00};
+    text-align: center;
   }
 `;

src/pages/ticketing/Check.tsx

@@ -4,24 +4,36 @@ import styled from 'styled-components';
 import ButtonSet from '../../components/common/ButtonSet';
 import CheckedTicket from '../../components/ticketing/CheckedTicket';
 import CheckedAccount from '../../components/ticketing/CheckedAccount';
-import { useRecoilValue } from 'recoil';
+import { useRecoilState, useRecoilValue } from 'recoil';
 import { IOptionType, optionState } from '../../stores/option';
 import { useEffect, useState } from 'react';
 import useModal from '../../hooks/useModal';
 import { useNavigate } from 'react-router-dom';
 import { useMutation, useQueryClient } from 'react-query';
 import OrderApi from '../../apis/OrderApi';
+import { useToast } from '../../hooks/useToast';
 
 const Check = ({}) => {
-  const option = useRecoilValue(optionState);
+  const [option, setOption] = useRecoilState(optionState);
+  const { fireToast } = useToast();
   const queryClient = useQueryClient();
   const navigate = useNavigate();
   const [selected, setSelected] = useState<boolean>(false);
   const { openModal, closeModal } = useModal();
   const { mutate } = useMutation(OrderApi.postOrder, {
     onSuccess: () => {
       queryClient.invalidateQueries('ticket');
-      navigate('/mypage');
+      setOption({ count: 1, date: null });
+      openModal({
+        modalType: 'Notice',
+        modalProps: {
+          onClick: () => {
+            closeModal();
+            navigate('/mypage');
+          },
+          type: '티켓예매',
+        },
+      });
     },
   });
   useEffect(() => {
@@ -31,7 +43,7 @@ const Check = ({}) => {
         modalProps: {
           onClick: () => {
             closeModal();
-            navigate('/ticketing/select');
+            navigate('/mypage');
           },
           type: '에러처리',
           errorMessage: '잘못된 접근입니다',