From 9e1842e6934e582a2bee18fb9a5b09f1c668daed Mon Sep 17 00:00:00 2001 From: seojin kim <001106ksj@gmail.com> Date: Wed, 19 Jan 2022 18:50:59 +0900 Subject: [PATCH 1/3] =?UTF-8?q?=E2=9C=A8feat:=20=EB=A1=9C=EA=B7=B8?= =?UTF-8?q?=EC=9D=B8,=20=ED=9A=8C=EC=9B=90=EA=B0=80=EC=9E=85=20=EC=9D=B4?= =?UTF-8?q?=ED=9B=84=20=EC=A0=95=EB=B3=B4=20=EC=A0=80=EC=9E=A5=20=EB=B0=8F?= =?UTF-8?q?=20=EC=B4=88=EA=B8=B0=20=EC=9E=85=EC=9E=A5=20=EC=8B=9C=20?= =?UTF-8?q?=EC=A0=95=EB=B3=B4=20=EC=A0=80=EC=9E=A5=20=EB=A1=9C=EC=A7=81=20?= =?UTF-8?q?=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/application/hooks/useLoginUser.ts | 13 +++++- src/infrastructure/api/index.ts | 4 +- src/infrastructure/api/login-user.ts | 2 +- src/infrastructure/api/types/user.ts | 2 +- src/infrastructure/remote/login-user.ts | 17 ++++++++ src/infrastructure/remote/team.ts | 41 +++++++++++-------- .../components/JoinForm/index.tsx | 14 +++++-- src/presentation/pages/Home/Team/index.tsx | 2 +- .../pages/OAuthRedirectHandler/index.tsx | 8 ++-- 9 files changed, 71 insertions(+), 32 deletions(-) create mode 100644 src/infrastructure/remote/login-user.ts diff --git a/src/application/hooks/useLoginUser.ts b/src/application/hooks/useLoginUser.ts index 4d742e09..2c61c9ff 100644 --- a/src/application/hooks/useLoginUser.ts +++ b/src/application/hooks/useLoginUser.ts @@ -1,4 +1,5 @@ import { api } from '@api/index'; +import { LoginUser } from '@api/types/user'; import { errorState } from '@stores/error'; import { authState, loginUserState } from '@stores/login-user'; import { useRecoilState } from 'recoil'; @@ -18,13 +19,20 @@ export function useLoginUser() { setLoginUser({ id: -1, accessToken: '', username: '', userID: '', profileImage: '' }); }; + const saveLoginUser = (loginUser: LoginUser) => { + setLoginUser(loginUser); + setIsAuthenticated(true); + console.log(loginUser); + localStorage.setItem('token', loginUser.accessToken); + }; + const initLoginUser = async () => { try { const token = localStorage.getItem('token'); + console.log(token); if (!token) throw '토큰이 없습니다'; const user = await api.loginUserService.getUserInfo(token); - setLoginUser(user); - setIsAuthenticated(true); + saveLoginUser(user); } catch (error) { setError(error); } @@ -35,6 +43,7 @@ export function useLoginUser() { setAccessToken, removeAccessToken, initLoginUser, + saveLoginUser, isAuthenticated, isLoading: !error && !isAuthenticated, error: error, diff --git a/src/infrastructure/api/index.ts b/src/infrastructure/api/index.ts index c258d7cb..25afef39 100644 --- a/src/infrastructure/api/index.ts +++ b/src/infrastructure/api/index.ts @@ -1,4 +1,3 @@ -import { loginUserMock } from '../mock/login-user'; import { neososeoFormDataMock } from '../mock/neososeo-form'; import { userDataMock } from '../mock/user'; import { teamDataRemote } from '../remote/team'; @@ -8,6 +7,7 @@ import { NeogaService } from './neoga'; import { NeososeoFormService } from './neososeo-form'; import { TeamService } from './team'; import { UserService } from './user'; +import { loginUserRemote } from '@infrastructure/remote/login-user'; export const api: APIService = getAPIMethod(); @@ -18,7 +18,7 @@ function getAPIMethod(): APIService { function provideMockAPIService(): APIService { const teamService = teamDataRemote(); const userService = userDataMock(); - const loginUserService = loginUserMock(); + const loginUserService = loginUserRemote(); const neogaService = NeogaDataRemote(); const neososeoFormService = neososeoFormDataMock(); diff --git a/src/infrastructure/api/login-user.ts b/src/infrastructure/api/login-user.ts index 1d496a64..48e1a3d6 100644 --- a/src/infrastructure/api/login-user.ts +++ b/src/infrastructure/api/login-user.ts @@ -7,7 +7,7 @@ export interface LoginUserService { export const postLogin = async ( kakaoToken: string, -): Promise<{ user?: object; accesstoken: string; refreshtoken: string }> => { +): Promise<{ user?: any; accesstoken: string; refreshtoken?: string }> => { try { const response = await publicAPI.post({ url: `/auth/login`, diff --git a/src/infrastructure/api/types/user.ts b/src/infrastructure/api/types/user.ts index fda7a90e..080176bd 100644 --- a/src/infrastructure/api/types/user.ts +++ b/src/infrastructure/api/types/user.ts @@ -11,7 +11,7 @@ export interface LoginUser { accessToken: string; username: string; userID: string; - profileImage: string; + profileImage: string | null; } export interface User { diff --git a/src/infrastructure/remote/login-user.ts b/src/infrastructure/remote/login-user.ts new file mode 100644 index 00000000..4c35df2c --- /dev/null +++ b/src/infrastructure/remote/login-user.ts @@ -0,0 +1,17 @@ +import { LoginUserService } from '@api/login-user'; +import { publicAPI } from './base'; + +export function loginUserRemote(): LoginUserService { + const getUserInfo = async (token: string) => { + const response = await publicAPI.get({ url: '/user', headers: { accesstoken: token } }); + if (response.status !== 200) throw '유저 조회 실패'; + return { + id: response.data.id, + username: response.data.name, + userID: response.data.profileId, + profileImage: response.data.image, + accessToken: token, + }; + }; + return { getUserInfo }; +} diff --git a/src/infrastructure/remote/team.ts b/src/infrastructure/remote/team.ts index c8bfc532..2dd5d1d2 100644 --- a/src/infrastructure/remote/team.ts +++ b/src/infrastructure/remote/team.ts @@ -25,32 +25,37 @@ export function teamDataRemote(): TeamService { const response = await privateAPI.get({ url: `/team` }); if (response.status === 200) return { - profileListData: response.data.map((team: any) => ({ - id: team.id, - profileImage: team.image ?? imgEmptyProfile, - profileName: team.name, - })), + profileListData: response.data + ? response.data.map((team: any) => ({ + id: team.id, + profileImage: team.image ?? imgEmptyProfile, + profileName: team.name, + })) + : [], }; else throw '서버 통신 실패'; }; const getMyIssue = async () => { const response = await privateAPI.get({ url: `/team/issue` }); + console.log(response); if (response.status === 200) return { - issueListData: response.data.map((team: any) => ({ - issueNumber: team.id, - issueMembers: team.feedback.map((member: any) => ({ - id: member.userId, - profileName: member.name, - profileImage: member.image, - })), - category: team.categoryName, - createdAt: team.dates, - content: team.content, - teamName: team.teamname, - memberName: team.username, - })), + issueListData: response.data + ? response.data.map((team: any) => ({ + issueNumber: team.id, + issueMembers: team.feedback.map((member: any) => ({ + id: member.userId, + profileName: member.name, + profileImage: member.image, + })), + category: team.categoryName, + createdAt: team.dates, + content: team.content, + teamName: team.teamname, + memberName: team.username, + })) + : [], }; else throw '서버 통신 실패'; }; diff --git a/src/presentation/components/JoinForm/index.tsx b/src/presentation/components/JoinForm/index.tsx index d0f60718..4874536c 100644 --- a/src/presentation/components/JoinForm/index.tsx +++ b/src/presentation/components/JoinForm/index.tsx @@ -1,4 +1,3 @@ -/* eslint-disable @typescript-eslint/no-unused-vars */ import React, { useEffect, useState } from 'react'; import { StJoinForm, @@ -28,7 +27,7 @@ function JoinForm() { const [image, setImage] = useState(null); const [inputId, setInputId] = useState(''); const [inputName, setInputName] = useState(''); - const { setAccessToken } = useLoginUser(); + const { saveLoginUser } = useLoginUser(); const navigate = useNavigate(); useEffect(() => { @@ -59,8 +58,15 @@ function JoinForm() { form.append('accesstoken', accessToken); form.append('refreshtoken', refreshToken); - const getData = await postJoin(form); - setAccessToken(getData.accesstoken); + const response = await postJoin(form); + + saveLoginUser({ + id: response.user, + accessToken: response.accesstoken, + username: response.user.name, + userID: response.user.profileId, + profileImage: response.user.image, + }); navigate('/joinComplete'); } catch (error) { console.error(error); //나중에 또 처리합시다. diff --git a/src/presentation/pages/Home/Team/index.tsx b/src/presentation/pages/Home/Team/index.tsx index 45328269..216ae7f2 100644 --- a/src/presentation/pages/Home/Team/index.tsx +++ b/src/presentation/pages/Home/Team/index.tsx @@ -56,7 +56,7 @@ function HomeTeam() { )}

나와 관련된 이슈 확인

- {issueListData ? ( + {issueListData && issueListData.length ? ( { diff --git a/src/presentation/pages/OAuthRedirectHandler/index.tsx b/src/presentation/pages/OAuthRedirectHandler/index.tsx index 26eda67a..08c7825f 100644 --- a/src/presentation/pages/OAuthRedirectHandler/index.tsx +++ b/src/presentation/pages/OAuthRedirectHandler/index.tsx @@ -7,7 +7,7 @@ import { useLoginUser } from '@hooks/useLoginUser'; const OAuthRedirectHandler = () => { const navigate = useNavigate(); - const { setAccessToken } = useLoginUser(); + const { saveLoginUser } = useLoginUser(); const setKakaoAccessToken = useSetRecoilState(kakaoAccessTokenState); const setKakaoRefreshToken = useSetRecoilState(kakaoRefreshTokenState); @@ -15,11 +15,13 @@ const OAuthRedirectHandler = () => { const code = new URL(window.location.href).searchParams.get('code') ?? ''; //인가코드 postLogin(code).then((response) => { if (response.user) { - setAccessToken(response.accesstoken); + const { id, profileId, name, image } = response.user; + const accessToken = response.accesstoken; + saveLoginUser({ id, accessToken, username: name, userID: profileId, profileImage: image }); navigate('/home'); } else { setKakaoAccessToken(response.accesstoken); - setKakaoRefreshToken(response.refreshtoken); + setKakaoRefreshToken(response.refreshtoken ?? ''); navigate('/join'); } }); From d53b641a9e65092216caffa742c73e95a3e9d391 Mon Sep 17 00:00:00 2001 From: seojin kim <001106ksj@gmail.com> Date: Wed, 19 Jan 2022 19:01:39 +0900 Subject: [PATCH 2/3] =?UTF-8?q?=F0=9F=90=9Bfix:=20=EB=A7=88=EC=9D=B4?= =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=EC=97=90=EC=84=9C=20=EB=8D=94?= =?UTF-8?q?=EB=B3=B4=EA=B8=B0=20=EC=95=84=EB=8B=88=EA=B3=A0=20=EC=A0=91?= =?UTF-8?q?=EA=B8=B0=EC=9D=B8=20=EA=B1=B0=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/presentation/components/common/ExpandListButton/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/presentation/components/common/ExpandListButton/index.tsx b/src/presentation/components/common/ExpandListButton/index.tsx index e43ec19d..fecb6159 100644 --- a/src/presentation/components/common/ExpandListButton/index.tsx +++ b/src/presentation/components/common/ExpandListButton/index.tsx @@ -10,7 +10,7 @@ function ExpandListButton(props: ExpandListButtonProps) { const { onClick, isExpanded } = props; return ( - 더보기 + {isExpanded ? '접기' : '더보기'} {isExpanded ? : } ); From 1a94a8896d640a478f5c571461b159fb9e44bfe9 Mon Sep 17 00:00:00 2001 From: seojin kim <001106ksj@gmail.com> Date: Wed, 19 Jan 2022 19:06:09 +0900 Subject: [PATCH 3/3] =?UTF-8?q?=F0=9F=90=9Bfix:=20=ED=97=A4=EB=8D=94?= =?UTF-8?q?=EC=97=90=EC=84=9C=20=20=EB=84=88=EA=B0=80=EC=86=8C=EA=B0=9C?= =?UTF-8?q?=EC=84=9C=20=ED=83=AD=EC=9D=B4=20=EC=83=89=EC=B9=A0=EB=90=98?= =?UTF-8?q?=EC=A7=80=20=EC=95=8A=EB=8A=94=20=EC=98=A4=EB=A5=98=20=EC=88=98?= =?UTF-8?q?=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/presentation/components/common/HomeHeader/index.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/presentation/components/common/HomeHeader/index.tsx b/src/presentation/components/common/HomeHeader/index.tsx index a601a2a5..2071dd9d 100644 --- a/src/presentation/components/common/HomeHeader/index.tsx +++ b/src/presentation/components/common/HomeHeader/index.tsx @@ -18,7 +18,8 @@ function HomeHeader() { useEffect(() => { if (!location) return; - setCurrentTab(location.pathname.split('/')[2]); + const selectedTab = location.pathname.split('/')[2]; + setCurrentTab(selectedTab ?? 'neoga'); }, [location]); /*