release 1.0.2 -> main

ASAP-as-soon-as-possible · Nov 3, 2023 · 3f555c6 · 3f555c6
2 parents f7966be + 8196c16
commit 3f555c6
Show file tree

Hide file tree

Showing 17 changed files with 197 additions and 84 deletions.
diff --git a/src/Router.tsx b/src/Router.tsx
@@ -34,6 +34,7 @@ const Router = () => {
         <Route path="/q-card/:meetingId" element={<CueCard />} />
         <Route path="/loadingpage" element={<LoadingPage />} />
         <Route path="*" element={<ErrorPage404 />} />
+        <Route path="/error" element={<ErrorPage404 />} />
         <Route path="/select" element={<SelectPage />} />
       </Routes>
     </BrowserRouter>

diff --git a/src/components/atomComponents/Button.tsx b/src/components/atomComponents/Button.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 
-import { styled, css } from 'styled-components';
+import { css, styled } from 'styled-components';
 
 interface ButtonProps {
   children: React.ReactNode;
@@ -21,8 +21,11 @@ export default Button;
 const buttonDefaultCSS = {
   basicCss: css`
     display: flex;
+    position: fixed;
+    bottom: 2.9rem;
     align-items: center;
     justify-content: center;
+    z-index: 1;
     border-radius: 0.8rem;
     padding: 1.6rem;
     width: 33.5rem;

diff --git a/src/components/atomComponents/PasswordInput.tsx b/src/components/atomComponents/PasswordInput.tsx
@@ -26,7 +26,8 @@ function PasswordInput({ value, placeholder, passWordOnChange, page }: ValueProp
           value={value}
           onChange={passWordOnChange}
           $iserror={value.length < 4}
-          type={inputType ? `password` : undefined}
+          type={inputType ? `number` : undefined}
+          inputMode="numeric"
         />
         <IconContainer onClick={changePasswordType}>
           {inputType ? <PasswordOpenEyeIc /> : <PasswordEyeIc />}
@@ -61,16 +62,16 @@ const InputSection = styled.div`
   input:focus + div {
     display: flex;
     svg {
-      cursor: pointer;
       width: fit-content;
       height: fit-content;
+      cursor: pointer;
     }
   }
 `;
 
 const StyledPasswordInput = styled.input<{ $iserror: boolean }>`
   position: relative;
-  border:none;
+  border: none;
 
   border-radius: 0.8rem;
   box-shadow: 0 0.4rem 0.4rem 0 rgba(0, 0, 0, 0.25);

diff --git a/src/components/scheduleComponents/utils/IsContainingAfternoon.ts b/src/components/scheduleComponents/utils/IsContainingAfternoon.ts
diff --git a/src/components/scheduleComponents/utils/isMorningDinner.ts b/src/components/scheduleComponents/utils/isMorningDinner.ts
@@ -0,0 +1 @@
+//아침 저녁인지를 확인하는 util
diff --git a/src/pages/BestMeetTime/components/bestMeetTime/confirmModal.tsx b/src/pages/BestMeetTime/components/bestMeetTime/confirmModal.tsx
@@ -17,15 +17,16 @@ interface ModalProps {
 
 function ConfirmModal({ setIsModalOpen, memberCount, bestTime }: ModalProps) {
   const { meetingId } = useParams();
-  const navigate = useNavigate()
+  const navigate = useNavigate();
   const [isloading, setIsloading] = useState(false);
 
   const confirmMeetime = async () => {
     try {
       const result = await authClient.post(`/meeting/${meetingId}/confirm`, bestTime);
-      const {code} = result.data
-      if(code === 200){
-        navigate(`/q-card/${meetingId}`)
+      const { code } = result.data;
+      if (code === 200) {
+        navigate(`/q-card/${meetingId}`);
+        localStorage.removeItem('hostToken');
       }
     } catch (error) {
       console.log(error);

diff --git a/src/pages/LoginEntrance/components/HostComponent.tsx b/src/pages/LoginEntrance/components/HostComponent.tsx
@@ -1,18 +1,19 @@
 import React, { Dispatch, SetStateAction, useState } from 'react';
-import { useNavigate, useParams } from 'react-router-dom';
 
-import { AxiosError } from 'axios';
+import axios from 'axios';
 import Button from 'components/atomComponents/Button';
-import Header from 'components/moleculesComponents/Header';
-import IncorrectInfoModal from './IncorrectInfoModal';
-import NoAvailableTimeModal from './NoAvailableTimeModal';
 import PasswordInput from 'components/atomComponents/PasswordInput';
 import Text from 'components/atomComponents/Text';
 import TextInput from 'components/atomComponents/TextInput';
+import Header from 'components/moleculesComponents/Header';
 import TitleComponent from 'components/moleculesComponents/TitleComponents';
-import { client } from 'utils/apis/axios';
+import { useNavigate, useParams } from 'react-router-dom';
 import styled from 'styled-components/macro';
 import { theme } from 'styles/theme';
+import { client } from 'utils/apis/axios';
+
+import IncorrectInfoModal from './IncorrectInfoModal';
+import NoAvailableTimeModal from './NoAvailableTimeModal';
 
 interface HostInfoProps {
   name: string;
@@ -44,34 +45,46 @@ function HostComponent({ hostInfo, setHostInfo }: HostProps) {
   };
 
   const [ismodalOpen, setIsModalOpen] = useState(false);
-  const [isLoginModalOpen, setIsLoginModalOpen]= useState(false);
+  const [isLoginModalOpen, setIsLoginModalOpen] = useState(false);
 
   const loginHost = async () => {
+    console.log('first');
     try {
-      const result = await client.post(`/user/${meetingId}/host`, hostInfo);
-      const {
-        data: { code, data, message },
-      } = result;
+      const { data } = await client.post(`/user/${meetingId}/host`, hostInfo);
+      console.log(data);
 
-
-      if (code === 200) {
-        localStorage.setItem('hostToken', data.accessToken);
+      if (data.code === 200) {
+        localStorage.setItem('hostToken', data.data.accessToken);
         navigate(`/host/${meetingId}`);
-      } else if (code === 403) {
-        setIsModalOpen(true);
-      } else if(code===401){
+      } else if (data.code === 401) {
         setIsLoginModalOpen(true);
+      } else {
+        console.log(data.message);
       }
-        else{
-          console.log(message);
+    } catch (err) {
+      //현재 err는 객체를 보내주지 않아서 다른 에러도 이 로직이 실행될 문제가 있음
+
+      if (axios.isAxiosError(err)) {
+        //   // axios에서 발생한 error
+        //   console.log(err.response);
+        // }
+        // const err = e as AxiosError;
+        if (err.response) {
+          //타입 가드 사용
+          if (err.response.status === 403) {
+            console.log(err.response.data.message);
+            setIsModalOpen(true);
+          } else if (err.response.status === 400) {
+            setIsLoginModalOpen(true);
+          } else {
+            console.log(err.response.status);
+            console.log(err.response.data.message);
+            navigate('/error');
+          }
         }
-    } catch {
-      (error: AxiosError) => {
-        console.log("login_error: "+error);
-      };
+      }
     }
   };
-
   return (
     <>
       <Header position={'login'} />
@@ -111,7 +124,11 @@ function HostComponent({ hostInfo, setHostInfo }: HostProps) {
         </Button>
       </StyledBtnSection>
       {ismodalOpen ? <NoAvailableTimeModal setIsModalOpen={setIsModalOpen} /> : undefined}
-      {isLoginModalOpen? <IncorrectInfoModal setIsLoginModalOpen={setIsLoginModalOpen}></IncorrectInfoModal> : undefined}
+      {isLoginModalOpen ? (
+        <IncorrectInfoModal setIsLoginModalOpen={setIsLoginModalOpen} />
+      ) : (
+        undefined
+      )}
     </>
   );
 }

diff --git a/src/pages/SteppingStone/SteppingLayout.tsx b/src/pages/SteppingStone/SteppingLayout.tsx
@@ -1,11 +1,12 @@
-import { authClient, client } from 'utils/apis/axios';
 import { useEffect, useState } from 'react';
-import { useNavigate, useParams } from 'react-router-dom';
 
 import Header from 'components/moleculesComponents/Header';
+import { useNavigate, useParams } from 'react-router-dom';
+import styled from 'styled-components/macro';
+import { authClient, client } from 'utils/apis/axios';
+
 import SteppingBody from './components/SteppingBody';
 import SteppingBtnSection from './components/SteppingBtnSection';
-import styled from 'styled-components/macro';
 
 interface SteppingProps {
   steppingType: string;
@@ -20,10 +21,10 @@ function SteppingLayout({ steppingType }: SteppingProps) {
   const isConfirmedMeet = async () => {
     // 회의명 붙이기
     const result = await client.get(`/meeting/${meetingId}`);
-
-    setMeetingTitle(result.data.data.title);
     if (result.data.code === 409) {
       navigate(`/q-card/${meetingId}`);
+    } else {
+      setMeetingTitle(result.data.data.title);
     }
   };
 

diff --git a/src/pages/createMeeting/components/useFunnel/SetHostInfo.tsx b/src/pages/createMeeting/components/useFunnel/SetHostInfo.tsx
@@ -25,8 +25,8 @@ function SetHostInfo({ meetingInfo, setMeetingInfo, setStep }: FunnelProps) {
       if (e.target.value.length < 9) {
         return { ...prev, password: e.target.value };
       }
-      alert("비밀번호는 8자리 이하로 말해주세요")
-      return { ...prev};
+      alert('비밀번호는 8자리 이하로 말해주세요');
+      return { ...prev };
     });
   };
 
@@ -64,7 +64,7 @@ function SetHostInfo({ meetingInfo, setMeetingInfo, setStep }: FunnelProps) {
           </Text>
           <PasswordInput
             value={meetingInfo.password}
-            placeholder={`방 비밀번호`}
+            placeholder={`숫자 4자리 이상`}
             passWordOnChange={passWordOnChange}
             page={'createMeeting'}
           />

diff --git a/src/pages/selectSchedule/SelectModal.tsx b/src/pages/selectSchedule/SelectModal.tsx
@@ -1,6 +1,7 @@
 import React, { Dispatch, useEffect, SetStateAction } from 'react';
 
 import { scheduleAtom, userNameAtom } from 'atoms/atom';
+import { isAxiosError } from 'axios';
 import Text from 'components/atomComponents/Text';
 import { ExitIc } from 'components/Icon/icon';
 import { useNavigate, useParams } from 'react-router';
@@ -30,22 +31,51 @@ function SelectModal({ setShowModal }: ModalProps) {
   const postHostAvailableApi = async () => {
     try {
       if (meetingId && updateScheduleType) {
-        const data = await hostAvailableApi(meetingId, updateScheduleType);
-        return data;
+        const { data } = await hostAvailableApi(meetingId, updateScheduleType);
+        console.log(data);
+        if (data.code === 201) {
+          setShowModal(false);
+          navigate(`/${auth}/schedule-complete/${meetingId}`);
+        } else {
+          navigate('/error');
+        }
+        return data.code;
       }
     } catch (e) {
-      console.error(e);
+      if (isAxiosError(e) && e.response) {
+        if (e.response.status === 400) {
+          alert(`${e.response.data.message}`);
+        } else {
+          console.error(e);
+          navigate(`/error`);
+        }
+      }
     }
   };
 
   const postMemberAvailableApi = async () => {
     try {
       if (meetingId && updateMemberScheduleType) {
-        const data = await userAvailableApi(meetingId, updateMemberScheduleType);
+        const { data } = await userAvailableApi(meetingId, updateMemberScheduleType);
+        console.log(data);
+        if (data.code === 201) {
+          setShowModal(false);
+          navigate(`/${auth}/schedule-complete/${meetingId}`);
+        } else {
+          navigate('/error');
+        }
         return data;
       }
     } catch (e) {
-      console.error(e);
+      if (isAxiosError(e) && e.response) {
+        console.log(e.response.data);
+        if (e.response.status === 400) {
+          alert(`${e.response.data.message}`);
+        } else {
+          console.error(e);
+          navigate(`/error`);
+        }
+      }
     }
   };
 
@@ -66,8 +96,8 @@ function SelectModal({ setShowModal }: ModalProps) {
       postMemberAvailableApi();
     }
 
-    setShowModal(false);
-    navigate(`/${auth}/schedule-complete/${meetingId}`);
+    // setShowModal(false);
+    // navigate(`/${auth}/schedule-complete/${meetingId}`);
   };
   return (
     <ReturnModalWrpper>

diff --git a/src/pages/selectSchedule/SelectPriorityPage.tsx b/src/pages/selectSchedule/SelectPriorityPage.tsx
@@ -1,12 +1,13 @@
 import React, { useEffect, useState } from 'react';
 
 import { availableDatesAtom, preferTimesAtom, scheduleAtom } from 'atoms/atom';
+import axios from 'axios';
 import Button from 'components/atomComponents/Button';
 import Text from 'components/atomComponents/Text';
 import Header from 'components/moleculesComponents/Header';
 import PriorityDropdown from 'components/scheduleComponents/components/PriorityDropdown';
 import TimeTable from 'components/scheduleComponents/components/TimeTable';
-import { useParams } from 'react-router-dom';
+import { useNavigate, useParams } from 'react-router-dom';
 import { useRecoilState } from 'recoil';
 import styled from 'styled-components';
 import { theme } from 'styles/theme';
@@ -20,6 +21,8 @@ const SelectSchedulePriority = () => {
   const [scheduleList, setScheduleList] = useRecoilState(scheduleAtom);
   const { meetingId } = useParams();
 
+  const navigate = useNavigate();
+
   const [showModal, setShowModal] = useState(false);
   const getAvailableScheduleOption = async () => {
     try {
@@ -28,9 +31,16 @@ const SelectSchedulePriority = () => {
       setPreferTimes(data.data.preferTimes);
     } catch (err) {
       console.log(err);
+
+      if (axios.isAxiosError(err) && err.response) {
+        if (err.response.status === 409) {
+          //이미 확정된 회의
+          alert(err.response.data.message);
+          navigate(`/q-card/${meetingId}`);
+        }
+      }
     }
   };
-
   useEffect(() => {
     getAvailableScheduleOption();
   }, []);