From a71e14365676d8930feaad51ff00f6b565d4575d Mon Sep 17 00:00:00 2001 From: moonyah Date: Fri, 27 Oct 2023 00:23:05 +0900 Subject: [PATCH 1/4] =?UTF-8?q?Feat:=20=EB=93=B1=EB=A1=9D=EB=90=9C=20?= =?UTF-8?q?=EC=9D=B4=EB=A9=94=EC=9D=BC=EB=A7=8C=20=ED=9A=8C=EC=9B=90=20?= =?UTF-8?q?=EA=B0=80=EC=9E=85=20=EA=B0=80=EB=8A=A5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/signUp/SignUpForm.tsx | 14 +++++++++++--- 1 file changed, 11 insertions(+), 3 deletions(-) diff --git a/src/components/signUp/SignUpForm.tsx b/src/components/signUp/SignUpForm.tsx index adb8b532..40de7a22 100644 --- a/src/components/signUp/SignUpForm.tsx +++ b/src/components/signUp/SignUpForm.tsx @@ -30,6 +30,7 @@ const SignUpForm = () => { console.log('회원가입이 성공했습니다.'); } else { console.error('회원가입 실패:', response.data); + alert(response.data); } } catch (error) { console.error('서버 요청 중 오류가 발생했습니다.', error); @@ -47,15 +48,22 @@ const SignUpForm = () => { const response = await instance.post('api/v1/emailconfirm', { email: emailValue, }); + if (response.status === 200) { console.log('이메일 전송 성공'); + alert('이메일 전송 성공! 인증 코드를 입력해주세요.'); } else { console.error('이메일 전송 실패:', response.data); + alert(response.data); + } + } catch (error: any) { + if (error.response && error.response.status === 400) { + alert('FastCampus에 등록된 이메일이 아닙니다.'); + } else { + console.error('서버 요청 중 오류가 발생했습니다.', error); + alert('서버 요청 중 오류가 발생했습니다.'); } - } catch (error) { - console.error('서버 요청 중 오류가 발생했습니다.', error); } - console.log(emailValue); }; return ( From e0fc00de25698fe79ba74803e533a98c7b30b0b8 Mon Sep 17 00:00:00 2001 From: moonyah Date: Fri, 27 Oct 2023 02:36:12 +0900 Subject: [PATCH 2/4] =?UTF-8?q?Feat:=20=EB=AA=A8=EB=B0=94=EC=9D=BC?= =?UTF-8?q?=EC=9A=A9=20=ED=96=84=EB=B2=84=EA=B1=B0=20=EB=A9=94=EB=89=B4=20?= =?UTF-8?q?=EB=B0=94=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/layout/header/MobileMenu.tsx | 38 +++++++++++++++++++ src/components/layout/header/index.tsx | 14 ++++++- .../layout/header/mobileMenu.module.scss | 30 +++++++++++++++ 3 files changed, 81 insertions(+), 1 deletion(-) create mode 100644 src/components/layout/header/MobileMenu.tsx create mode 100644 src/components/layout/header/mobileMenu.module.scss diff --git a/src/components/layout/header/MobileMenu.tsx b/src/components/layout/header/MobileMenu.tsx new file mode 100644 index 00000000..95a9f058 --- /dev/null +++ b/src/components/layout/header/MobileMenu.tsx @@ -0,0 +1,38 @@ +import React from 'react'; +import styles from './mobileMenu.module.scss'; +import { Link } from 'react-router-dom'; +import { AiOutlineClose } from 'react-icons/ai'; + +interface MobileMenuProps { + onClose: () => void; +} + +const MobileMenu: React.FC = ({ onClose }) => { + return ( +
+ +
    +
  • + 소근소근 +
    • +
  • + 포트폴리오 +
    • +
  • + 스터디 +
    • +
  • + 프로젝트 +
    • +
  • + 구인구직 +
    • + {/* 필요한 메뉴 항목을 추가하세요 */} +
+
+ ); +}; + +export default MobileMenu; diff --git a/src/components/layout/header/index.tsx b/src/components/layout/header/index.tsx index 64dba895..0eab9fe0 100644 --- a/src/components/layout/header/index.tsx +++ b/src/components/layout/header/index.tsx @@ -1,3 +1,4 @@ +import React, { useState } from 'react'; import { Link, useNavigate } from 'react-router-dom'; import styles from './header.module.scss'; import { AiOutlineMenu } from 'react-icons/ai'; @@ -7,6 +8,7 @@ import { userState } from '@/store/store'; import { instance } from '@/api/client'; import { AiOutlineUser } from 'react-icons/ai'; import logo from '@/assets/logo.svg'; +import MobileMenu from './MobileMenu'; const fetchLogout = async () => { const response = await instance.get(`api/v1/logout`); @@ -14,9 +16,18 @@ const fetchLogout = async () => { }; const Header = () => { + const [isMenuOpen, setIsMenuOpen] = useState(false); const [userData, setUserData] = useRecoilState(userState); + const navigation = useNavigate(); + const toggleMenu = () => { + setIsMenuOpen(!isMenuOpen); + }; + const handleMenuClose = () => { + setIsMenuOpen(false); // "닫기" 버튼 클릭 시 메뉴를 닫음 + }; + const showAlert = () => { window.alert('준비 중입니다'); }; @@ -43,8 +54,9 @@ const Header = () => { return ( <> + {isMenuOpen && }
-
+
diff --git a/src/components/layout/header/mobileMenu.module.scss b/src/components/layout/header/mobileMenu.module.scss new file mode 100644 index 00000000..96b1d661 --- /dev/null +++ b/src/components/layout/header/mobileMenu.module.scss @@ -0,0 +1,30 @@ +.mobileMenu { + position: fixed; + // top: $--notice-bar-height; + top: 0; + left: 0; + width: 300px; + height: 100%; + background-color: #fff8f8; + z-index: 2; +} + +.closeButton { + position: absolute; + top: 10px; + right: 10px; + font-size: 20px; + background-color: transparent; + cursor: pointer; + padding: 20px; +} +.menuList { + margin-top: 80px; +} + +.menuItem { + margin: 10px 0; + padding: 10px 20px; + border-bottom: 1px solid #f7b9b9; + text-align: center; +} From 70b133eba52fe44be9a704105ca2e3c6306998a7 Mon Sep 17 00:00:00 2001 From: moonyah Date: Fri, 27 Oct 2023 02:42:53 +0900 Subject: [PATCH 3/4] edit never read 'React' --- src/axios-interceptor.ts | 18 ++++++++++++++++++ src/components/layout/header/index.tsx | 2 +- src/components/signIn/sessionManager.ts | 10 ++-------- src/main.tsx | 3 +++ 4 files changed, 24 insertions(+), 9 deletions(-) create mode 100644 src/axios-interceptor.ts diff --git a/src/axios-interceptor.ts b/src/axios-interceptor.ts new file mode 100644 index 00000000..8fd22208 --- /dev/null +++ b/src/axios-interceptor.ts @@ -0,0 +1,18 @@ +// import axios from 'axios'; +// import { useNavigate } from 'react-router-dom'; + +// const instance = axios.create(); + +// instance.interceptors.response.use( +// (response) => response, +// async (error) => { +// if (error.response.status === 403) { +// alert('세션이 만료되었거나 권한이 없습니다. 다시 로그인해주세요.'); +// const navigate = useNavigate(); +// navigate('/signIn'); +// } +// return Promise.reject(error); +// } +// ); + +// export default instance; diff --git a/src/components/layout/header/index.tsx b/src/components/layout/header/index.tsx index 0eab9fe0..dd7ace0d 100644 --- a/src/components/layout/header/index.tsx +++ b/src/components/layout/header/index.tsx @@ -1,4 +1,4 @@ -import React, { useState } from 'react'; +import { useState } from 'react'; import { Link, useNavigate } from 'react-router-dom'; import styles from './header.module.scss'; import { AiOutlineMenu } from 'react-icons/ai'; diff --git a/src/components/signIn/sessionManager.ts b/src/components/signIn/sessionManager.ts index e24c3542..2e494b6a 100644 --- a/src/components/signIn/sessionManager.ts +++ b/src/components/signIn/sessionManager.ts @@ -2,7 +2,6 @@ // import { useRecoilState } from 'recoil'; // import { userState } from '@/store/store'; // import { useNavigate } from 'react-router-dom'; -// import { instance } from '@/api/client'; // const SessionExpirationCheck = () => { // const [userData, setUserData] = useRecoilState(userState); @@ -10,13 +9,7 @@ // const checkSessionStatus = useCallback(async () => { // try { -// const response = await instance.post('/api/v1/login'); -// if (response.status === 403) { -// setUserData({ ...userData, login: false }); -// navigation('/signin'); -// } else if (response.status === 200) { -// setUserData(response.data); -// } +// // Axios 인터셉터에서 이미 세션 확인 및 처리를 수행함. // } catch (error) { // console.error('세션 확인 중 오류 발생', error); // } @@ -34,6 +27,7 @@ // return () => clearInterval(interval); // }, [checkSessionStatus]); + // return null; // }; diff --git a/src/main.tsx b/src/main.tsx index 9cef1b5a..a4ac7494 100644 --- a/src/main.tsx +++ b/src/main.tsx @@ -5,6 +5,8 @@ import { RouterProvider } from 'react-router-dom'; import { router } from './routes/router.tsx'; import { RecoilRoot } from 'recoil'; import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; +// import SessionExpirationCheck from './components/signIn/sessionManager.ts'; +// import axiosInstance from './axios-interceptor.ts'; const queryClient = new QueryClient({ defaultOptions: { @@ -20,6 +22,7 @@ ReactDOM.createRoot(document.getElementById('root')!).render( + {/* */} From 149349d45cd501af8d786a323d002bcc312f7d24 Mon Sep 17 00:00:00 2001 From: moonyah Date: Fri, 27 Oct 2023 13:39:20 +0900 Subject: [PATCH 4/4] =?UTF-8?q?axios-intercepto.ts=20=EC=82=AD=EC=A0=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/axios-interceptor.ts | 18 ------------------ src/components/signUp/SignUpForm.tsx | 5 ++++- 2 files changed, 4 insertions(+), 19 deletions(-) delete mode 100644 src/axios-interceptor.ts diff --git a/src/axios-interceptor.ts b/src/axios-interceptor.ts deleted file mode 100644 index 8fd22208..00000000 --- a/src/axios-interceptor.ts +++ /dev/null @@ -1,18 +0,0 @@ -// import axios from 'axios'; -// import { useNavigate } from 'react-router-dom'; - -// const instance = axios.create(); - -// instance.interceptors.response.use( -// (response) => response, -// async (error) => { -// if (error.response.status === 403) { -// alert('세션이 만료되었거나 권한이 없습니다. 다시 로그인해주세요.'); -// const navigate = useNavigate(); -// navigate('/signIn'); -// } -// return Promise.reject(error); -// } -// ); - -// export default instance; diff --git a/src/components/signUp/SignUpForm.tsx b/src/components/signUp/SignUpForm.tsx index 40de7a22..fc6b9baf 100644 --- a/src/components/signUp/SignUpForm.tsx +++ b/src/components/signUp/SignUpForm.tsx @@ -3,7 +3,7 @@ import styles from './signUp.module.scss'; import Input from '../atoms/input'; import { PATTERNS } from '@/constants/constants'; import Button from '../atoms/button'; -import { Link } from 'react-router-dom'; +import { Link, useNavigate } from 'react-router-dom'; import { instance } from '@/api/client'; interface SignUpFormValues { @@ -15,6 +15,8 @@ interface SignUpFormValues { } const SignUpForm = () => { + const navigate = useNavigate(); + const { register, watch, @@ -28,6 +30,7 @@ const SignUpForm = () => { const response = await instance.post('/api/v1/join', data); if (response.status === 200) { console.log('회원가입이 성공했습니다.'); + navigate('/signin'); } else { console.error('회원가입 실패:', response.data); alert(response.data);