From 693e26c593bddae9568d222a495827070be7e2b4 Mon Sep 17 00:00:00 2001 From: aaminha Date: Sun, 19 May 2024 18:47:05 +0900 Subject: [PATCH 01/10] =?UTF-8?q?fix:=20=EB=9D=BC=EC=9A=B0=ED=8C=85=20?= =?UTF-8?q?=EC=88=98=EC=A0=95=20(#29)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../DesignTest/DesignButtonView.tsx | 12 ++++---- .../SelfUnderstandPage/SelfUnderstandCard.tsx | 2 +- src/pages/DesignTestPage.tsx | 30 ++++++++++++------- src/routers/router.tsx | 28 ++++++++--------- 4 files changed, 41 insertions(+), 31 deletions(-) diff --git a/src/components/DesignTest/DesignButtonView.tsx b/src/components/DesignTest/DesignButtonView.tsx index 06364d3..8a16369 100644 --- a/src/components/DesignTest/DesignButtonView.tsx +++ b/src/components/DesignTest/DesignButtonView.tsx @@ -106,11 +106,11 @@ export const DesignButtonView2 = ({ warning, warningMessage }: Props) => { const [showWarn, setShowWarn] = useState(false); const handleButton1Click = () => { - navigate('/test/design/1'); + navigate('/test/design/2'); }; const handleButton2Click = () => { - navigate('/test/design/3'); + navigate('/test/design/4'); }; useEffect(() => { @@ -157,7 +157,7 @@ export const DesignButtonView3 = ({ warning, warningMessage }: Props) => { }; const handleButton2Click = () => { - navigate('/test/design/4'); + navigate('/test/design/5'); }; useEffect(() => { @@ -199,11 +199,11 @@ export const DesignButtonView4 = ({ warning, warningMessage }: Props) => { const [showWarn, setShowWarn] = useState(false); const handleButton1Click = () => { - navigate('/test/design/3'); + navigate('/test/design/4'); }; const handleButton2Click = () => { - navigate('/test/design/5'); + navigate('/test/design/6'); }; useEffect(() => { @@ -248,7 +248,7 @@ export const DesignButtonView5 = ({ warning, warningMessage }: Props) => { const [loadingHandler, setLoadingHandler] = useRecoilState(loadingHandlerState); const handleButton1Click = () => { - navigate('/test/design/4'); + navigate('/test/design/5'); }; const handleButton2Click = () => { diff --git a/src/components/SelfUnderstandPage/SelfUnderstandCard.tsx b/src/components/SelfUnderstandPage/SelfUnderstandCard.tsx index 1df7bb1..28431b9 100644 --- a/src/components/SelfUnderstandPage/SelfUnderstandCard.tsx +++ b/src/components/SelfUnderstandPage/SelfUnderstandCard.tsx @@ -117,7 +117,7 @@ const DesignComponent = () => { const navigate = useNavigate(); const handleClick = () => { - navigate('/test/design/1'); + navigate('/test/design/2'); }; return ( diff --git a/src/pages/DesignTestPage.tsx b/src/pages/DesignTestPage.tsx index 28544c3..4b1f7a1 100644 --- a/src/pages/DesignTestPage.tsx +++ b/src/pages/DesignTestPage.tsx @@ -1,3 +1,5 @@ +import { useRecoilValue } from 'recoil'; + import { DesignTestView1, DesignTestView2, @@ -5,43 +7,51 @@ import { DesignTestView4, DesignTestView5, } from '@/components/DesignTest/DesignTestView'; +import { LoadingPage } from '@/pages/LoadingPage'; +import { loadingState } from '@/recoil/loadingState'; export const DesignTestPage1 = () => { return ( -
+ <> -
+ ); }; export const DesignTestPage2 = () => { return ( -
+ <> -
+ ); }; export const DesignTestPage3 = () => { return ( -
+ <> -
+ ); }; export const DesignTestPage4 = () => { return ( -
+ <> -
+ ); }; export const DesignTestPage5 = () => { + const loading = useRecoilValue(loadingState); + + if (loading) { + return ; + } + return ( -
+ <> -
+ ); }; diff --git a/src/routers/router.tsx b/src/routers/router.tsx index 82ace1d..3fc73ed 100644 --- a/src/routers/router.tsx +++ b/src/routers/router.tsx @@ -1,8 +1,8 @@ import { Navigate, Route, Routes } from 'react-router-dom'; -/* import { MainLayout } from '@/components/common/Layout/MainLayout'; */ import { DefineLayout } from '@/components/common/Layout/DefineLayout'; import { DesignLayout } from '@/components/common/Layout/DesignLayout'; +import { MainLayout } from '@/components/common/Layout/MainLayout'; import { DefineResultPage } from '@/pages/DefineResultPage'; import { DefineStartPage } from '@/pages/DefineStartPage'; import { DefineTestPage1, DefineTestPage2, DefineTestPage3 } from '@/pages/DefineTestPage'; @@ -12,28 +12,28 @@ import { DesignTestPage3, DesignTestPage4, DesignTestPage5, -} from '@/pages/DesignTestPage'; /* +} from '@/pages/DesignTestPage'; import { HomePage } from '@/pages/HomePage'; import { LoginPage } from '@/pages/LoginPage'; -import { OnboardingPage } from '@/pages/OnboardingPage';*/ -import { RedirectPage } from '@/pages/RedirectPage'; /* +import { OnboardingPage } from '@/pages/OnboardingPage'; +import { RedirectPage } from '@/pages/RedirectPage'; import { SelfUnderstandPage } from '@/pages/SelfUnderstandPage'; -import { ExceptPreMemberRoute } from '@/routers/ExceptPreMemberRoute'; */ +import { ExceptPreMemberRoute } from '@/routers/ExceptPreMemberRoute'; export const Router = () => { return ( - {/* }> + }> } /> }> } /> } /> } /> - // }> + {/* // }> //} /> - // + // */} - */} + }> }> @@ -45,11 +45,11 @@ export const Router = () => { }> }> - } /> - } /> - } /> - } /> - } /> + } /> + } /> + } /> + } /> + } /> } /> From cd5186f51b2e18a5f0729cbcc0ab2f4dffa7e3d9 Mon Sep 17 00:00:00 2001 From: aaminha Date: Mon, 20 May 2024 03:27:27 +0900 Subject: [PATCH 02/10] =?UTF-8?q?refactor:=20=ED=86=A0=ED=81=B0=20?= =?UTF-8?q?=EA=B4=80=EB=A6=AC=20=EB=A1=9C=EC=A7=81=20=EB=A6=AC=ED=8C=A9?= =?UTF-8?q?=ED=86=A0=EB=A7=81=20(#29)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/apis/client.ts | 32 ++++++++++++++++++------- src/pages/RedirectPage.tsx | 6 ++--- src/services/AuthService.ts | 48 ++++++++++++++++--------------------- 3 files changed, 47 insertions(+), 39 deletions(-) diff --git a/src/apis/client.ts b/src/apis/client.ts index e3da7b4..e0c1e5a 100644 --- a/src/apis/client.ts +++ b/src/apis/client.ts @@ -14,17 +14,31 @@ export const authClient: AxiosInstance = axios.create({ }); authClient.interceptors.request.use((config) => { - if (!config.headers.common || !config.headers.common['Authorization']) { - if (userService.getUser().nickname === '') { - // register token이 없는 상황 (새로고침) - authService.onSetRegisterToken(); - config.headers['Authorization'] = authClient.defaults.headers.common['Authorization']; - } else if (userService.getUser()) { - // access token이 만료된 상황 - authService.onRefreshToken(); - config.headers['Authorization'] = authClient.defaults.headers.common['Authorization']; + if (userService.getUser().nickname === '') { + const registerToken = authService.getRegisterToken(); + if (registerToken !== null && registerToken !== undefined) { + config.headers['Authorization'] = `Bearer ${registerToken}`; + } else { + window.alert('로그인이 필요합니다.'); + authService.onLogout(); } } return config; }); + +authClient.interceptors.response.use( + (response) => { + return response; + }, + async (error) => { + const originalRequest = error.config; + if (error.response.status === 400 && !originalRequest._retry) { + originalRequest._retry = true; + const access_token = await authService.getRefreshToken(); + authService.setAuthToken(access_token); + return authClient(originalRequest); + } + return Promise.reject(error); + } +); diff --git a/src/pages/RedirectPage.tsx b/src/pages/RedirectPage.tsx index d3d928a..8490902 100644 --- a/src/pages/RedirectPage.tsx +++ b/src/pages/RedirectPage.tsx @@ -17,14 +17,14 @@ export const RedirectPage = () => { const registerToken = params.get('register_token'); if (registerToken) { - authService.onLoginSuccess(registerToken); - authService.onSaveRegisterToken(registerToken); + authService.setAuthToken(registerToken); + authService.setRegisterToken(registerToken); userService.setUser({ nickname: '' }); navigate('/onboarding'); } if (accessToken) { - authService.onLoginSuccess(accessToken); + authService.setAuthToken(accessToken); nickname && userService.setUser({ nickname }); navigate('/'); } diff --git a/src/services/AuthService.ts b/src/services/AuthService.ts index 3b8670d..40efb27 100644 --- a/src/services/AuthService.ts +++ b/src/services/AuthService.ts @@ -1,44 +1,38 @@ +import axios from 'axios'; + import { authClient } from '@/apis/client'; import { tokenAPI } from '@/apis/tokenAPI'; import { userService } from '@/services/UserService'; class AuthService { - onLoginSuccess = (token: string) => { - authClient.defaults.headers.common['Authorization'] = `Bearer ${token}`; + getRefreshToken = async () => { + try { + const response = await tokenAPI.refresh(); + return response.payload.access_token; + } catch (error) { + if (axios.isAxiosError(error) && error.response && error.response.status === 401) { + window.alert('로그인이 필요합니다.'); + this.onLogout(); + } + } }; - onSaveRegisterToken = (registerToken: string) => { + setAuthToken(token: string) { + authClient.defaults.headers.common['Authorization'] = `Bearer ${token}`; + } + + setRegisterToken(registerToken: string) { window.sessionStorage.setItem('registerToken', registerToken); - }; + } - onSetRegisterToken = () => { - const registerToken = window.sessionStorage.getItem('registerToken'); - if (registerToken) { - this.onLoginSuccess(registerToken); - } else { - window.alert('로그인이 필요합니다.'); - this.onLogout(); - } + getRegisterToken = () => { + window.sessionStorage.getItem('registerToken'); }; - onRemoveRegisterToken = () => { + deleteRegisterToken = () => { window.sessionStorage.removeItem('registerToken'); }; - onRefreshToken = () => { - tokenAPI - .refresh() - .then((response) => { - this.onLoginSuccess(response.payload.access_token); - }) - .catch((error) => { - if (error.response.status === 401) { - window.alert('로그인이 필요합니다.'); - this.onLogout(); - } - }); - }; - onLogout = () => { delete authClient.defaults.headers.common['Authorization']; userService.removeUser(); From e83b65751de55a51e80e9d558f4509aa263dcc92 Mon Sep 17 00:00:00 2001 From: aaminha Date: Mon, 20 May 2024 03:32:47 +0900 Subject: [PATCH 03/10] =?UTF-8?q?fix:=20=EC=9D=B4=EB=8F=99=20path=20?= =?UTF-8?q?=EC=88=98=EC=A0=95=20(#29)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/DesignTest/DesignButtonView.tsx | 6 +++--- src/components/SelfUnderstandPage/SelfUnderstandCard.tsx | 1 + .../common/Navigation/DefineHeaderNavigation.tsx | 7 +++---- .../common/Navigation/DesignHeaderNavigation.tsx | 7 +++---- 4 files changed, 10 insertions(+), 11 deletions(-) diff --git a/src/components/DesignTest/DesignButtonView.tsx b/src/components/DesignTest/DesignButtonView.tsx index 8a16369..5e4c1a0 100644 --- a/src/components/DesignTest/DesignButtonView.tsx +++ b/src/components/DesignTest/DesignButtonView.tsx @@ -68,7 +68,7 @@ export const DesignButtonView1 = ({ warning, warningMessage }: Props) => { const [showWarn, setShowWarn] = useState(false); const handleButtonClick = () => { - navigate('/test/design/2'); + navigate('/test/design/3'); }; useEffect(() => { @@ -272,14 +272,14 @@ export const DesignButtonView5 = ({ warning, warningMessage }: Props) => { personaAPI .register(userService.getUserState() === 'MEMBER', requestData) .then((response) => { - const { code, message, payload } = response; + const { code, message } = response; if (code === '201') { console.log('페르소나 생성 성공'); setLoadingHandler({ ...loadingHandler, handleCompleted: () => { - navigate(`/test/design/${payload.Design_persona_id}`); + navigate('/test/design/result'); }, }); } else { diff --git a/src/components/SelfUnderstandPage/SelfUnderstandCard.tsx b/src/components/SelfUnderstandPage/SelfUnderstandCard.tsx index 28431b9..91dd6e3 100644 --- a/src/components/SelfUnderstandPage/SelfUnderstandCard.tsx +++ b/src/components/SelfUnderstandPage/SelfUnderstandCard.tsx @@ -117,6 +117,7 @@ const DesignComponent = () => { const navigate = useNavigate(); const handleClick = () => { + //navigate('/test/design/1');로 수정하기 navigate('/test/design/2'); }; diff --git a/src/components/common/Navigation/DefineHeaderNavigation.tsx b/src/components/common/Navigation/DefineHeaderNavigation.tsx index 93b06bf..79e5269 100644 --- a/src/components/common/Navigation/DefineHeaderNavigation.tsx +++ b/src/components/common/Navigation/DefineHeaderNavigation.tsx @@ -1,4 +1,4 @@ -/* import { useNavigate } from 'react-router-dom'; */ +import { useNavigate } from 'react-router-dom'; import styled from 'styled-components'; const StyledContainer = styled.header` @@ -71,11 +71,10 @@ const StyledButton = styled.button` `; const DefineHeaderNavigation = () => { - //const navigate = useNavigate(); + const navigate = useNavigate(); const handleButtonClick = () => { - // TODO: 홈페이지로 이동하도록 변경하기 - window.location.href = 'https://selpiece.framer.website'; + navigate('/'); }; return ( diff --git a/src/components/common/Navigation/DesignHeaderNavigation.tsx b/src/components/common/Navigation/DesignHeaderNavigation.tsx index 8271e89..e20c3df 100644 --- a/src/components/common/Navigation/DesignHeaderNavigation.tsx +++ b/src/components/common/Navigation/DesignHeaderNavigation.tsx @@ -1,4 +1,4 @@ -/* import { useNavigate } from 'react-router-dom'; */ +import { useNavigate } from 'react-router-dom'; import styled from 'styled-components'; const StyledContainer = styled.header` @@ -71,11 +71,10 @@ const StyledButton = styled.button` `; const DesignHeaderNavigation = () => { - //const navigate = useNavigate(); + const navigate = useNavigate(); const handleButtonClick = () => { - // TODO: 홈페이지로 이동하도록 변경하기 - window.location.href = 'https://selpiece.framer.website'; + navigate('/'); }; return ( From 8867300411aa84c05c4bf9f1b72e7a22988e2c21 Mon Sep 17 00:00:00 2001 From: aaminha Date: Mon, 20 May 2024 03:38:22 +0900 Subject: [PATCH 04/10] =?UTF-8?q?feat:=20Design=20=EA=B2=B0=EA=B3=BC=20?= =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=20API=20=EC=97=B0=EB=8F=99=20?= =?UTF-8?q?=EA=B5=AC=ED=98=84=20(#29)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/apis/personaAPI.ts | 5 +++++ src/pages/DesignResultPage.tsx | 22 +++++++++++++++------- src/routers/router.tsx | 2 ++ src/types/test.type.ts | 9 +++++++++ 4 files changed, 31 insertions(+), 7 deletions(-) diff --git a/src/apis/personaAPI.ts b/src/apis/personaAPI.ts index edeeb7d..7bdf280 100644 --- a/src/apis/personaAPI.ts +++ b/src/apis/personaAPI.ts @@ -24,4 +24,9 @@ export const personaAPI = { const response = await authClient.get('/api/personas/define'); return response.data; }, + // 설계하기 페르소나 조회 + getPersonaDesign: async () => { + const response = await authClient.get('/api/personas/design'); + return response.data; + }, }; diff --git a/src/pages/DesignResultPage.tsx b/src/pages/DesignResultPage.tsx index 03ada72..976f7b5 100644 --- a/src/pages/DesignResultPage.tsx +++ b/src/pages/DesignResultPage.tsx @@ -1,25 +1,33 @@ +import { useEffect, useState } from 'react'; + import { useNavigate } from 'react-router-dom'; import styled from 'styled-components'; +import { personaAPI } from '@/apis/personaAPI'; import BackgroundImg from '@/assets/backgrounds/designResultBackground.png'; import { PlainButton } from '@/components/common/Button/PlainButton'; - -const Dummy = { - name: '민선', - brand: '학교 생활 열심히 하며\n수익도 내는 20대 갓생 유튜버', -}; +import { userService } from '@/services/UserService'; +import { DesignResult } from '@/types/test.type'; export const DesignResultPage = () => { + const [result, setResult] = useState(null); const navigate = useNavigate(); + useEffect(() => { + personaAPI.getPersonaDesign().then((res) => { + setResult(res.payload); + }); + }, []); + return (
- {Dummy.name}님은 이런 브랜드가 되고 싶군요! + {userService.getUser().nickname}님은 이런 브랜드가 + 되고 싶군요!
-
“{Dummy.brand}”
+
“{result?.definition}”
{ } /> } /> } /> + } /> } /> diff --git a/src/types/test.type.ts b/src/types/test.type.ts index 0579f36..502438c 100644 --- a/src/types/test.type.ts +++ b/src/types/test.type.ts @@ -18,3 +18,12 @@ export interface DefineResult { front_img_url: string; back_img_url: string; } + +export interface DesignResult { + definition: string; + fields: string[]; + distinctions: string[]; + abilities: string[]; + platforms: string[]; + career: string; +} From f43205bfcc02536fb87cf38f9a73fed63b55b366 Mon Sep 17 00:00:00 2001 From: aaminha Date: Mon, 20 May 2024 04:43:56 +0900 Subject: [PATCH 05/10] =?UTF-8?q?fix:=20=EB=A1=9C=EA=B7=B8=EC=9D=B8=20?= =?UTF-8?q?=EC=97=AC=EB=B6=80=EC=97=90=20=EB=94=B0=EB=A5=B8=20define=20pos?= =?UTF-8?q?t=20=EC=9A=94=EC=B2=AD=20=EC=97=94=EB=93=9C=ED=8F=AC=EC=9D=B8?= =?UTF-8?q?=ED=8A=B8=20=EC=88=98=EC=A0=95=20(#29)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/apis/personaAPI.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/apis/personaAPI.ts b/src/apis/personaAPI.ts index 7bdf280..7a89238 100644 --- a/src/apis/personaAPI.ts +++ b/src/apis/personaAPI.ts @@ -9,7 +9,7 @@ export const personaAPI = { return response.data; } - const response = await noAuthClient.post('/api/personas/define', userInfo); + const response = await noAuthClient.post('/api/personas/define/sharing', userInfo); return response.data; }, // 비로그인 유저 페르소나 조회 From 4ebc60dc2b6af725c66773829be417615b6fd2db Mon Sep 17 00:00:00 2001 From: aaminha Date: Mon, 20 May 2024 04:59:49 +0900 Subject: [PATCH 06/10] =?UTF-8?q?fix:=20=EB=A1=9C=EB=94=A9=20=EC=86=8D?= =?UTF-8?q?=EB=8F=84=20=EC=A1=B0=EC=A0=88=20=EB=B0=8F=20=EA=BA=BC=EC=A7=80?= =?UTF-8?q?=EB=8A=94=20=EC=BC=80=EC=9D=B4=EC=8A=A4=20=EC=B6=94=EA=B0=80=20?= =?UTF-8?q?(#29)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/DefineTest/DefineButtonView.tsx | 9 +++++---- src/components/DesignTest/DesignButtonView.tsx | 8 +++++--- src/pages/DefineTestPage.tsx | 2 +- src/pages/DesignTestPage.tsx | 2 +- src/pages/LoadingPage.tsx | 14 +++++++------- src/recoil/loadingState.ts | 2 +- 6 files changed, 20 insertions(+), 17 deletions(-) diff --git a/src/components/DefineTest/DefineButtonView.tsx b/src/components/DefineTest/DefineButtonView.tsx index 300ebbb..b924d9b 100644 --- a/src/components/DefineTest/DefineButtonView.tsx +++ b/src/components/DefineTest/DefineButtonView.tsx @@ -1,7 +1,7 @@ import { useEffect, useState } from 'react'; import { useNavigate } from 'react-router-dom'; -import { useRecoilState, useSetRecoilState } from 'recoil'; +import { useRecoilState } from 'recoil'; import styled from 'styled-components'; import { personaAPI } from '@/apis/personaAPI'; @@ -151,7 +151,7 @@ export const DefineButtonView2 = ({ warning, warningMessage }: Props) => { export const DefineButtonView3 = ({ warning, warningMessage }: Props) => { const navigate = useNavigate(); const [showWarn, setShowWarn] = useState(false); - const setLoading = useSetRecoilState(loadingState); + const [loading, setLoading] = useRecoilState(loadingState); const [loadingHandler, setLoadingHandler] = useRecoilState(loadingHandlerState); const handleButton1Click = () => { @@ -169,7 +169,7 @@ export const DefineButtonView3 = ({ warning, warningMessage }: Props) => { stage_three_keywords: selectedChips3, }; - setLoading(true); + setLoading({ show: true, speed: 50 }); personaAPI .register(userService.getUserState() === 'MEMBER', requestData) @@ -186,12 +186,13 @@ export const DefineButtonView3 = ({ warning, warningMessage }: Props) => { }); } else { console.error('페르소나 생성 실패:', message); - setLoading(false); + setLoading({ ...loading, show: false }); } }) .catch((error) => { console.error('페르소나 생성 요청 실패:', error); window.alert('페르소나 생성 요청 실패'); + setLoading({ ...loading, show: false }); }); }; diff --git a/src/components/DesignTest/DesignButtonView.tsx b/src/components/DesignTest/DesignButtonView.tsx index 5e4c1a0..923a6db 100644 --- a/src/components/DesignTest/DesignButtonView.tsx +++ b/src/components/DesignTest/DesignButtonView.tsx @@ -1,7 +1,7 @@ import { useEffect, useState } from 'react'; import { useNavigate } from 'react-router-dom'; -import { useRecoilState, useSetRecoilState } from 'recoil'; +import { useRecoilState } from 'recoil'; import styled from 'styled-components'; import { personaAPI } from '@/apis/personaAPI'; @@ -244,7 +244,7 @@ export const DesignButtonView4 = ({ warning, warningMessage }: Props) => { export const DesignButtonView5 = ({ warning, warningMessage }: Props) => { const navigate = useNavigate(); const [showWarn, setShowWarn] = useState(false); - const setLoading = useSetRecoilState(loadingState); + const [loading, setLoading] = useRecoilState(loadingState); const [loadingHandler, setLoadingHandler] = useRecoilState(loadingHandlerState); const handleButton1Click = () => { @@ -267,7 +267,7 @@ export const DesignButtonView5 = ({ warning, warningMessage }: Props) => { stage_five_keywords: selectedChips5, }; - setLoading(true); + setLoading({ show: true, speed: 100 }); personaAPI .register(userService.getUserState() === 'MEMBER', requestData) @@ -284,11 +284,13 @@ export const DesignButtonView5 = ({ warning, warningMessage }: Props) => { }); } else { console.error('페르소나 생성 실패:', message); + setLoading({ ...loading, show: false }); } }) .catch((error) => { console.error('페르소나 생성 요청 실패:', error); window.alert('페르소나 생성 요청 실패'); + setLoading({ ...loading, show: false }); }); }; diff --git a/src/pages/DefineTestPage.tsx b/src/pages/DefineTestPage.tsx index 792afbc..465925d 100644 --- a/src/pages/DefineTestPage.tsx +++ b/src/pages/DefineTestPage.tsx @@ -27,7 +27,7 @@ export const DefineTestPage2 = () => { export const DefineTestPage3 = () => { const loading = useRecoilValue(loadingState); - if (loading) { + if (loading.show) { return ; } diff --git a/src/pages/DesignTestPage.tsx b/src/pages/DesignTestPage.tsx index 4b1f7a1..0dd41e1 100644 --- a/src/pages/DesignTestPage.tsx +++ b/src/pages/DesignTestPage.tsx @@ -45,7 +45,7 @@ export const DesignTestPage4 = () => { export const DesignTestPage5 = () => { const loading = useRecoilValue(loadingState); - if (loading) { + if (loading.show) { return ; } diff --git a/src/pages/LoadingPage.tsx b/src/pages/LoadingPage.tsx index e3ba333..bdd81cf 100644 --- a/src/pages/LoadingPage.tsx +++ b/src/pages/LoadingPage.tsx @@ -1,6 +1,6 @@ import { useEffect, useState } from 'react'; -import { useRecoilValue, useSetRecoilState } from 'recoil'; +import { useRecoilState, useRecoilValue } from 'recoil'; import styled, { keyframes } from 'styled-components'; import { ReactComponent as Logo } from '@/assets/logos/logo3d.svg'; @@ -9,9 +9,9 @@ import { loadingState } from '@/recoil/loadingState'; export const LoadingPage = () => { const [progress, setProgress] = useState(0); - const setLoading = useSetRecoilState(loadingState); + const [loading, setLoading] = useRecoilState(loadingState); const loadingHandler = useRecoilValue(loadingHandlerState); - const interval = 50; + const interval = loading.speed; useEffect(() => { const timer = setInterval(() => { @@ -33,7 +33,7 @@ export const LoadingPage = () => { useEffect(() => { if (progress >= 100) { loadingHandler.handleCompleted(); - setLoading(false); + setLoading({ ...loading, show: false }); } }, [progress]); @@ -43,7 +43,7 @@ export const LoadingPage = () => { - +

나의 경험을 분석중이에요!

 @@ -167,13 +167,13 @@ const ProgressBarContainer = styled.div` margin-bottom: 31px; `; -const ProgressBar = styled.div<{ $progress: number }>` +const ProgressBar = styled.div<{ $progress: number; $speed: number }>` height: 100%; width: ${(props) => props.$progress}%; background: ${({ theme }) => theme.color.primary500}; border-radius: inherit; text-align: right; - transition: width 50ms ease-in-out; + transition: width ${({ $speed }) => $speed}ms ease-in-out; position: absolute; top: 0; diff --git a/src/recoil/loadingState.ts b/src/recoil/loadingState.ts index 3aff318..8485d1c 100644 --- a/src/recoil/loadingState.ts +++ b/src/recoil/loadingState.ts @@ -2,5 +2,5 @@ import { atom } from 'recoil'; export const loadingState = atom({ key: 'loadingState', - default: false, + default: { show: false, speed: 50 }, }); From 437b7344b59ffb0a4d96849af67189f286e815a1 Mon Sep 17 00:00:00 2001 From: aaminha Date: Tue, 21 May 2024 02:26:45 +0900 Subject: [PATCH 07/10] =?UTF-8?q?fix:=20=EC=9E=91=EC=9D=80=20=EC=98=A4?= =?UTF-8?q?=EB=A5=98=20=EC=88=98=EC=A0=95=20-=20=ED=86=A0=ED=81=B0=20?= =?UTF-8?q?=EA=B4=80=EB=A0=A8=20=EC=97=90=EB=9F=AC=20401=EB=A1=9C=20?= =?UTF-8?q?=EC=88=98=EC=A0=95=20-=20=EC=A4=84=EB=B0=94=EA=BF=88=20?= =?UTF-8?q?=EB=8B=A8=EC=9C=84=20=EB=8B=A8=EC=96=B4=20=EB=8B=A8=EC=9C=84?= =?UTF-8?q?=EB=A1=9C=20=EB=B3=80=EA=B2=BD=20-=20=EB=A1=9C=EB=94=A9=20?= =?UTF-8?q?=EC=86=8D=EB=8F=84=20=EB=B3=80=EA=B2=BD=20-=20=EB=B6=88?= =?UTF-8?q?=ED=95=84=EC=9A=94=ED=95=9C=20=EB=9D=BC=EC=9A=B0=ED=8C=85=20?= =?UTF-8?q?=EC=82=AD=EC=A0=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/apis/client.ts | 2 +- src/components/DesignTest/DesignButtonView.tsx | 2 +- src/pages/DesignResultPage.tsx | 2 +- src/routers/router.tsx | 2 -- 4 files changed, 3 insertions(+), 5 deletions(-) diff --git a/src/apis/client.ts b/src/apis/client.ts index e0c1e5a..c2b9375 100644 --- a/src/apis/client.ts +++ b/src/apis/client.ts @@ -33,7 +33,7 @@ authClient.interceptors.response.use( }, async (error) => { const originalRequest = error.config; - if (error.response.status === 400 && !originalRequest._retry) { + if (error.response.status === 401 && !originalRequest._retry) { originalRequest._retry = true; const access_token = await authService.getRefreshToken(); authService.setAuthToken(access_token); diff --git a/src/components/DesignTest/DesignButtonView.tsx b/src/components/DesignTest/DesignButtonView.tsx index 52c2ddf..39accbd 100644 --- a/src/components/DesignTest/DesignButtonView.tsx +++ b/src/components/DesignTest/DesignButtonView.tsx @@ -265,7 +265,7 @@ export const DesignButtonView5 = ({ warning, warningMessage }: Props) => { career: selectedChips5[0], }; - setLoading({ show: true, speed: 100 }); + setLoading({ show: true, speed: 70 }); personaAPI .registerPersonaDesign(requestData) diff --git a/src/pages/DesignResultPage.tsx b/src/pages/DesignResultPage.tsx index 976f7b5..36fa3d7 100644 --- a/src/pages/DesignResultPage.tsx +++ b/src/pages/DesignResultPage.tsx @@ -80,8 +80,8 @@ const StyledContent = styled.div` .brand { ${({ theme }) => theme.font.desktop.h2}; color: ${({ theme }) => theme.color.primary600}; - white-space: pre-line; text-align: center; margin-bottom: 32px; + word-break: keep-all; } `; diff --git a/src/routers/router.tsx b/src/routers/router.tsx index 386f455..9ce16bb 100644 --- a/src/routers/router.tsx +++ b/src/routers/router.tsx @@ -55,9 +55,7 @@ export const Router = () => { } /> - } /> } /> - } /> ); }; From 3870d45d78a38da392ff6ecc9e189628347954ac Mon Sep 17 00:00:00 2001 From: aaminha Date: Tue, 21 May 2024 02:36:14 +0900 Subject: [PATCH 08/10] =?UTF-8?q?design:=20TopNavigation=20=ED=99=9C?= =?UTF-8?q?=EC=84=B1=ED=99=94=20=EB=94=94=EC=9E=90=EC=9D=B8=20=EC=B6=94?= =?UTF-8?q?=EA=B0=80=20(#29)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../common/Navigation/TopNavigation.tsx | 10 +++++++++- src/constants/navigation.ts | 2 +- src/routers/router.tsx | 19 +++++++++++-------- 3 files changed, 21 insertions(+), 10 deletions(-) diff --git a/src/components/common/Navigation/TopNavigation.tsx b/src/components/common/Navigation/TopNavigation.tsx index 9768ef0..e677d4a 100644 --- a/src/components/common/Navigation/TopNavigation.tsx +++ b/src/components/common/Navigation/TopNavigation.tsx @@ -26,6 +26,7 @@ export const TopNavigation = () => { {NAVIGATION_MENU.map((item) => ( { navigate(item.path); }} @@ -41,6 +42,7 @@ export const TopNavigation = () => { { navigate('auth'); }} @@ -116,7 +118,7 @@ const StyledUserButton = styled.button` } `; -const StyledMenuButton = styled.button<{ $filled?: boolean; $width?: string }>` +const StyledMenuButton = styled.button<{ $filled?: boolean; $width?: string; $active: boolean }>` ${({ theme }) => theme.font.desktop.body2m}; width: ${({ $width }) => $width}; @@ -141,4 +143,10 @@ const StyledMenuButton = styled.button<{ $filled?: boolean; $width?: string }>` color: ${props.theme.color.primary600}; } `} + + ${({ $active, theme }) => + $active && + css` + color: ${theme.color.primary600}; + `} `; diff --git a/src/constants/navigation.ts b/src/constants/navigation.ts index 00a8a9e..6344ae3 100644 --- a/src/constants/navigation.ts +++ b/src/constants/navigation.ts @@ -1,5 +1,5 @@ export const NAVIGATION_MENU = [ //TODO: path 수정하기 { menu: '자기이해', path: '/understand' }, - { menu: '경험추천', path: '/' }, + { menu: '경험추천', path: '/recommend' }, ]; diff --git a/src/routers/router.tsx b/src/routers/router.tsx index 9ce16bb..67e152c 100644 --- a/src/routers/router.tsx +++ b/src/routers/router.tsx @@ -20,6 +20,7 @@ import { OnboardingPage } from '@/pages/OnboardingPage'; import { RedirectPage } from '@/pages/RedirectPage'; import { SelfUnderstandPage } from '@/pages/SelfUnderstandPage'; import { ExceptPreMemberRoute } from '@/routers/ExceptPreMemberRoute'; +import { MemberPrivateRoute } from '@/routers/MemberPrivateRoute'; export const Router = () => { return ( @@ -44,14 +45,16 @@ export const Router = () => { } /> } /> - }> - }> - } /> - } /> - } /> - } /> - } /> - } /> + }> + }> + }> + } /> + } /> + } /> + } /> + } /> + } /> + } /> From 9923faef678a79918025faae68386bc66d149032 Mon Sep 17 00:00:00 2001 From: aaminha Date: Tue, 21 May 2024 02:49:57 +0900 Subject: [PATCH 09/10] =?UTF-8?q?fix:=20=ED=86=A0=ED=81=B0=20=EB=A1=9C?= =?UTF-8?q?=EC=A7=81=20=EB=B3=80=EA=B2=BD=EC=9C=BC=EB=A1=9C=20=EC=9D=B8?= =?UTF-8?q?=ED=95=B4=20=EA=B4=80=EB=A0=A8=20=EB=A1=9C=EC=A7=81=20=EC=B6=94?= =?UTF-8?q?=EA=B0=80=20=EC=88=98=EC=A0=95=20(#29)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/OnboardingPage/SetupBranding.tsx | 4 ++-- src/services/AuthService.ts | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/components/OnboardingPage/SetupBranding.tsx b/src/components/OnboardingPage/SetupBranding.tsx index 56bdf99..d44d59c 100644 --- a/src/components/OnboardingPage/SetupBranding.tsx +++ b/src/components/OnboardingPage/SetupBranding.tsx @@ -24,9 +24,9 @@ export const SetupBranding = () => { userAPI .register(onboarding) .then((res) => { - authService.onLoginSuccess(res.payload.access_token); + authService.setAuthToken(res.payload.access_token); userService.setUser({ nickname: res.payload.nickname }); - authService.onRemoveRegisterToken(); + authService.deleteRegisterToken(); navigate('/'); }) .catch(() => { diff --git a/src/services/AuthService.ts b/src/services/AuthService.ts index 40efb27..19ad254 100644 --- a/src/services/AuthService.ts +++ b/src/services/AuthService.ts @@ -26,7 +26,7 @@ class AuthService { } getRegisterToken = () => { - window.sessionStorage.getItem('registerToken'); + return window.sessionStorage.getItem('registerToken'); }; deleteRegisterToken = () => { From de641bce5ae8ceba9e9c7ea18a7e51af42c02c80 Mon Sep 17 00:00:00 2001 From: aaminha Date: Tue, 21 May 2024 03:01:41 +0900 Subject: [PATCH 10/10] =?UTF-8?q?style:=20=EB=B0=B0=ED=8F=AC=EB=A5=BC=20?= =?UTF-8?q?=EC=9C=84=ED=95=9C=20=EC=9E=84=EC=8B=9C=20=EC=A3=BC=EC=84=9D?= =?UTF-8?q?=EC=B2=98=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/HomePage/NonTesterMemberView.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/HomePage/NonTesterMemberView.tsx b/src/components/HomePage/NonTesterMemberView.tsx index f5545db..e59b809 100644 --- a/src/components/HomePage/NonTesterMemberView.tsx +++ b/src/components/HomePage/NonTesterMemberView.tsx @@ -62,7 +62,7 @@ export const NonTesterMemberView = () => { const [selectedInterest, setSelectedInterest] = useState([]); const [selectedKeywords, setSelectedKeywords] = useState([]); const [selectedFree, setSelectedFree] = useState(false); - const [showAmountModal, setShowAmountModal] = useState(false); + /* const [showAmountModal, setShowAmountModal] = useState(false); */ const [selectedAmount, setSelectedAmount] = useState<{ min: number; max: number }>({ min: 0, max: 0, @@ -139,7 +139,7 @@ export const NonTesterMemberView = () => { { - setShowAmountModal((prev) => !prev); + //setShowAmountModal((prev) => !prev); }} > 금액