Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

FE-29 ♻️ 로그인페이지 리팩토링 #199

Merged
merged 39 commits into from
Aug 5, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
39 commits
Select commit Hold shift + click to select a range
f88eff6
Merge pull request #108 from epigram5-9/merge/FE-29
jangmoonwon Jul 30, 2024
0db55eb
Merge branch 'main' of https://github.com/epigram5-9/epigram into mer…
jangmoonwon Jul 31, 2024
e36546a
Merge pull request #133 from epigram5-9/merge/FE-29
jangmoonwon Jul 31, 2024
22e739a
:sparkles: 네이버 post api 추가
jangmoonwon Jul 31, 2024
8ee30d3
:sparkles: 구글 post api 추가
jangmoonwon Jul 31, 2024
739b965
:wrench: 라우팅 수정
jangmoonwon Jul 31, 2024
7054e43
:sparkles: 네이버 로그인 훅 추가 및 라우팅, 에러 핸들링 구현
jangmoonwon Jul 31, 2024
5dec109
:sparkles: 구글 로그인 훅 추가 및 라우팅, 에러 핸들링 구현
jangmoonwon Jul 31, 2024
dc81f74
:sparkles: 네이버 간편 로그인 리다이렉트 설정
jangmoonwon Jul 31, 2024
1d26296
:sparkles: 구글 간편 로그인 리다이렉트 설정
jangmoonwon Jul 31, 2024
6fa2b84
:wrench: 환경 변수 적용: 네이버, 구글, 카카오 로그인 URL 업데이트
jangmoonwon Jul 31, 2024
9fde9a2
:wrench: 가입하기 경로 수정
jangmoonwon Jul 31, 2024
b1bc7c8
Merge pull request #138 from epigram5-9/refactor/FE-29
jangmoonwon Jul 31, 2024
a126017
:wrench: 로그인 훅 라우팅 수정
jangmoonwon Jul 31, 2024
d919f46
:wrench: 로그인 훅 에러처리 로직 수정
jangmoonwon Jul 31, 2024
48c3297
Merge pull request #139 from epigram5-9/refactor/FE-29
jangmoonwon Jul 31, 2024
b5a041e
FE-29 :twisted_rightwards_arrows: 브랜치 최신화 (#160)
jangmoonwon Aug 2, 2024
0ade3af
Merge branch 'main' of https://github.com/epigram5-9/epigram into mer…
jangmoonwon Aug 2, 2024
e66c659
Merge pull request #167 from epigram5-9/merge/FE-29
jangmoonwon Aug 2, 2024
936de88
Merge branch 'main' of https://github.com/epigram5-9/epigram into mer…
jangmoonwon Aug 3, 2024
28deda9
Merge pull request #170 from epigram5-9/merge/FE-29
jangmoonwon Aug 3, 2024
6a51446
:lipstick: 소셜 로그인 문구 추가
jangmoonwon Aug 3, 2024
c7cbee1
:zap: 로그인 폼 개선
jangmoonwon Aug 3, 2024
69b24e5
:lipstick: 토스트 에러 메시지 스타일 수정
jangmoonwon Aug 3, 2024
72ab420
:test_tube: 구글 로그인 테스트 코드
jangmoonwon Aug 4, 2024
3397ff5
test: 테스트 코드
jangmoonwon Aug 4, 2024
4d88202
:fire: 불필요 파일 삭제
jangmoonwon Aug 4, 2024
07d2a60
:wrench: 구글 간편 로그인 수정
jangmoonwon Aug 4, 2024
38c0370
Merge branch 'main' of https://github.com/epigram5-9/epigram into mer…
jangmoonwon Aug 4, 2024
9feefae
Merge pull request #187 from epigram5-9/merge/FE-29
jangmoonwon Aug 4, 2024
86efe6f
Merge pull request #185 from epigram5-9/refactor/FE-29
jangmoonwon Aug 4, 2024
41042ef
Merge branch 'main' of https://github.com/epigram5-9/epigram into mer…
jangmoonwon Aug 4, 2024
5a09893
Merge pull request #196 from epigram5-9/merge/FE-29
jangmoonwon Aug 4, 2024
bbfc33a
:fire: 불필요 파일 삭제
jangmoonwon Aug 4, 2024
4d06cbc
:sparkles: 로그아웃 기능 추가
jangmoonwon Aug 4, 2024
6e69d94
:wrench: 환경 변수 이름 변경
jangmoonwon Aug 4, 2024
2dc836c
:sparkles: 리다이렉트 설정
jangmoonwon Aug 4, 2024
7bc96e0
:memo: 주석 삭제
jangmoonwon Aug 4, 2024
45b8120
Merge pull request #197 from epigram5-9/refactor/FE-29
jangmoonwon Aug 5, 2024
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 7 additions & 0 deletions src/apis/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -67,3 +67,10 @@ httpClient.interceptors.response.use(
);

export default httpClient;

export const logout = () => {
localStorage.removeItem('accessToken');
localStorage.removeItem('refreshToken');

window.location.href = '/auth/SignIn';
};
8 changes: 4 additions & 4 deletions src/apis/postGoogleOauth.ts
Original file line number Diff line number Diff line change
Expand Up @@ -5,9 +5,9 @@ import httpClient from '.';
const getGoogleIdToken = async (code: string) => {
const response = await axios.post('https://oauth2.googleapis.com/token', {
code,
client_id: process.env.NEXT_PUBLIC_GOOGLE_CLIENT_ID_TEST,
client_secret: process.env.NEXT_PUBLIC_GOOGLE_CLIENT_SECRET_TEST,
redirect_uri: process.env.NEXT_PUBLIC_GOOGLE_REDIRECT_URI_TEST,
client_id: process.env.NEXT_PUBLIC_GOOGLE_CLIENT_ID,
client_secret: process.env.NEXT_PUBLIC_GOOGLE_CLIENT_SECRET,
redirect_uri: process.env.NEXT_PUBLIC_GOOGLE_REDIRECT_URI,
grant_type: 'authorization_code',
});

Expand All @@ -19,7 +19,7 @@ const postGoogleOauth = async (code: string) => {
const idToken = tokenResponse.id_token;

const response = await httpClient.post('/auth/signIn/GOOGLE', {
redirectUri: process.env.NEXT_PUBLIC_GOOGLE_REDIRECT_URI_TEST,
redirectUri: process.env.NEXT_PUBLIC_GOOGLE_REDIRECT_URI,
token: idToken,
});

Expand Down
27 changes: 11 additions & 16 deletions src/pages/auth/SignIn.tsx
Original file line number Diff line number Diff line change
@@ -1,3 +1,5 @@
import { useEffect } from 'react';
import { useRouter } from 'next/router';
import Image from 'next/image';
import Link from 'next/link';
import { Input } from '@/components/ui/input';
Expand All @@ -7,12 +9,18 @@ import { zodResolver } from '@hookform/resolvers/zod';
import { Form, FormControl, FormField, FormItem, FormMessage } from '@/components/ui/form';
import { PostSigninRequest, PostSigninRequestType } from '@/schema/auth';
import useSigninMutation from '@/hooks/useSignInMutation';
import { useRouter } from 'next/router';

export default function SignIn() {
const mutationSignin = useSigninMutation();
const router = useRouter();

useEffect(() => {
const accessToken = localStorage.getItem('accessToken');
if (accessToken) {
router.push('/epigrams');
}
}, [router]);

// 폼 정의
const form = useForm<PostSigninRequestType>({
resolver: zodResolver(PostSigninRequest),
Expand All @@ -27,19 +35,6 @@ export default function SignIn() {
form.setValue(fieldName, value.trim(), { shouldValidate: true, shouldDirty: true });
};

const handleSubmit = async (values: PostSigninRequestType) => {
try {
const result = await mutationSignin.mutateAsync(values);
localStorage.setItem('accessToken', result.accessToken);
localStorage.setItem('refreshToken', result.refreshToken);
router.push('/epigrams'); // 로그인 성공 후 이동할 페이지
} catch (error) {
// 로그인 실패 처리
/* eslint-disable no-console */
console.error('로그인 실패:', error);
}
};

return (
<div className='flex flex-col justify-center items-center bg-background-100 w-full h-screen'>
<header className='mb-[50px] md:mb-[60px]'>
Expand All @@ -48,7 +43,7 @@ export default function SignIn() {
</Link>
</header>
<Form {...form}>
<form onSubmit={form.handleSubmit(handleSubmit)} className='flex flex-col items-center lg:gap-6 gap-5 w-full px-6'>
<form onSubmit={form.handleSubmit((values: PostSigninRequestType) => mutationSignin.mutate(values))} className='flex flex-col items-center lg:gap-6 gap-5 w-full px-6'>
<div className='flex flex-col items-center lg:gap-4 gap-[10px] w-full lg:max-w-[640px] md:max-w-[384px]'>
<FormField
control={form.control}
Expand Down Expand Up @@ -125,7 +120,7 @@ export default function SignIn() {
<Image src='/logo-naver.svg' alt='logo-naver' width={60} height={60} className='md:size-[60px] size-10' />
</Link>
<Link
href={`https://accounts.google.com/o/oauth2/v2/auth?client_id=${process.env.NEXT_PUBLIC_GOOGLE_CLIENT_ID_TEST}&redirect_uri=${process.env.NEXT_PUBLIC_GOOGLE_REDIRECT_URI_TEST}&response_type=code&scope=openid%20profile%20email`}
href={`https://accounts.google.com/o/oauth2/v2/auth?client_id=${process.env.NEXT_PUBLIC_GOOGLE_CLIENT_ID}&redirect_uri=${process.env.NEXT_PUBLIC_GOOGLE_REDIRECT_URI}&response_type=code&scope=openid%20profile%20email`}
>
<Image src='/logo-google.svg' alt='logo-google' width={60} height={60} className='md:size-[60px] size-10' />
</Link>
Expand Down
11 changes: 10 additions & 1 deletion src/pages/auth/SignUp.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import { useState } from 'react';
import { useState, useEffect } from 'react';
import { useRouter } from 'next/router';
import Image from 'next/image';
import Link from 'next/link';
import { zodResolver } from '@hookform/resolvers/zod';
Expand All @@ -11,6 +12,14 @@ import useRegisterMutation from '@/hooks/useRegisterMutation';

export default function SignUp() {
const [focusedField, setFocusedField] = useState<string | null>(null);
const router = useRouter();

useEffect(() => {
const accessToken = localStorage.getItem('accessToken');
if (accessToken) {
router.push('/epigrams');
}
}, [router]);

const form = useForm<PostSignUpRequestType>({
resolver: zodResolver(PostSignUpRequest),
Expand Down
8 changes: 3 additions & 5 deletions src/pages/auth/callback/google/index.ts
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
import { useEffect } from 'react';
import { useSearchParams } from 'next/navigation';
import useGoogleLogin from '@/hooks/useGoogleLogin'; // useGoogleLogin 훅을 가져옵니다
import useGoogleLogin from '@/hooks/useGoogleLogin';

export default function Google() {
const searchParams = useSearchParams();
const code = searchParams.get('code'); // URL에서 'code' 값을 가져옵니다
const { mutate: login } = useGoogleLogin(); // useGoogleLogin 훅에서 mutate 함수를 가져옵니다
const code = searchParams.get('code');
const { mutate: login } = useGoogleLogin();

useEffect(() => {
if (code) {
Expand All @@ -15,6 +15,4 @@ export default function Google() {
console.log('No code found in URL parameters'); // code가 없을 때 콘솔에 출력
}
}, [code, login]);

return null; // 컴포넌트가 UI를 렌더링하지 않음
}
21 changes: 0 additions & 21 deletions src/pages/auth/redirect/google-callback/index.ts

This file was deleted.

Loading