From 650aaaa585c7750b508b0c685562d1173802948f Mon Sep 17 00:00:00 2001 From: sj0724 Date: Wed, 29 May 2024 17:27:56 +0900 Subject: [PATCH 01/40] =?UTF-8?q?fix:=20=EB=A1=9C=EA=B7=B8=EC=9D=B8=20?= =?UTF-8?q?=EC=9C=A0=EB=AC=B4=EC=97=90=20=EC=9D=98=ED=95=9C=20=ED=8E=98?= =?UTF-8?q?=EC=9D=B4=EC=A7=80=20=EB=A6=AC=EB=8B=A4=EC=9D=B4=EB=A0=89?= =?UTF-8?q?=EC=85=98=20=EC=84=A4=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- pages/folder/[[...folderId]].tsx | 2 +- pages/index.tsx | 7 ++++++- pages/signin.tsx | 14 ++++++++++++-- pages/signup.tsx | 14 ++++++++++++-- 4 files changed, 31 insertions(+), 6 deletions(-) diff --git a/pages/folder/[[...folderId]].tsx b/pages/folder/[[...folderId]].tsx index c748094bb..49009fce1 100644 --- a/pages/folder/[[...folderId]].tsx +++ b/pages/folder/[[...folderId]].tsx @@ -52,7 +52,7 @@ function Folder() { useEffect(() => { const access = localStorage.getItem('token'); if (!access) { - router.replace('/'); + router.replace('/signin'); return; } const observer = new IntersectionObserver(handleObserver); diff --git a/pages/index.tsx b/pages/index.tsx index e9e2eb4bb..721039fd3 100644 --- a/pages/index.tsx +++ b/pages/index.tsx @@ -6,14 +6,19 @@ import { Button } from '../components/Button/Button'; import Link from 'next/link'; import { UserContext } from '@/contexts/UserContext'; import Image from 'next/image'; +import { useRouter } from 'next/router'; function Main() { const [sectionList, setSectionList] = useState([]); const id = useContext(UserContext); + const router = useRouter(); useEffect(() => { + if (id) { + router.replace('/folder'); + } setSectionList(sectionDescription); - }, []); + }, [id, router]); return ( diff --git a/pages/signin.tsx b/pages/signin.tsx index c4444ef7d..64af80b88 100644 --- a/pages/signin.tsx +++ b/pages/signin.tsx @@ -1,5 +1,5 @@ import * as S from '@/styles/signin.styled'; -import { useState } from 'react'; +import { useContext, useEffect, useState } from 'react'; import Input from '@/components/Input/Input'; import Link from 'next/link'; import Image from 'next/image'; @@ -7,15 +7,19 @@ import { Button } from '@/components/Button/Button'; import { postSignIn } from '../api/api'; import { Controller, useForm } from 'react-hook-form'; import { emailPattern } from '@/util/util'; +import { UserContext } from '@/contexts/UserContext'; +import { useRouter } from 'next/router'; function SignIn() { const [textHidden, setTextHidden] = useState(true); const { handleSubmit, control } = useForm(); + const router = useRouter(); + const id = useContext(UserContext); const formAction = async (data: any) => { const result = await postSignIn(data.id, data.password); if (result) { - window.location.href = '/'; + window.location.href = '/folder'; } }; @@ -23,6 +27,12 @@ function SignIn() { setTextHidden(!textHidden); }; + useEffect(() => { + if (id) { + router.replace('/folder'); + } + }, [id, router]); + return ( <> diff --git a/pages/signup.tsx b/pages/signup.tsx index e5c5b0afc..fc33d8ce1 100644 --- a/pages/signup.tsx +++ b/pages/signup.tsx @@ -1,5 +1,5 @@ import * as S from '@/styles/signin.styled'; -import { useState } from 'react'; +import { useContext, useEffect, useState } from 'react'; import Input from '@/components/Input/Input'; import Link from 'next/link'; import Image from 'next/image'; @@ -7,17 +7,21 @@ import { Button } from '@/components/Button/Button'; import { postCheckEmail, postSignUp } from '../api/api'; import { Controller, useForm } from 'react-hook-form'; import { emailPattern } from '@/util/util'; +import { UserContext } from '@/contexts/UserContext'; +import { useRouter } from 'next/router'; function SignUp() { const { handleSubmit, control, watch } = useForm(); const [textHidden, setTextHidden] = useState(true); + const id = useContext(UserContext); + const router = useRouter(); const formAction = async (data: any) => { const result = await postCheckEmail(data.id); if (result) { const signUp = await postSignUp(data.id, data.password); if (signUp) { - window.location.href = '/'; + window.location.href = '/folder'; } } }; @@ -26,6 +30,12 @@ function SignUp() { setTextHidden(!textHidden); }; + useEffect(() => { + if (id) { + router.replace('/folder'); + } + }, [id, router]); + return ( From e957f736d86f24f5103d1d88ea2444b41034f655 Mon Sep 17 00:00:00 2001 From: sj0724 Date: Wed, 29 May 2024 17:50:38 +0900 Subject: [PATCH 02/40] =?UTF-8?q?fix:=20userContext=20=EB=B6=84=EB=A6=AC?= =?UTF-8?q?=20provider=20=EC=BB=B4=ED=8F=AC=EB=84=8C=ED=8A=B8=20=EC=83=9D?= =?UTF-8?q?=EC=84=B1,=20=EC=BB=A4=EC=8A=A4=ED=85=80=ED=9B=85=20=EA=B5=AC?= =?UTF-8?q?=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/Nav/Nav.tsx | 4 ++- contexts/UserContext.tsx | 49 ++++++++++++++++++++++++++++++-- pages/_app.tsx | 32 ++++----------------- pages/folder/[[...folderId]].tsx | 8 +++--- pages/index.tsx | 12 ++++---- pages/signin.tsx | 10 +++---- pages/signup.tsx | 8 +++--- 7 files changed, 74 insertions(+), 49 deletions(-) diff --git a/components/Nav/Nav.tsx b/components/Nav/Nav.tsx index 189610b81..b2e5bcf40 100644 --- a/components/Nav/Nav.tsx +++ b/components/Nav/Nav.tsx @@ -4,6 +4,7 @@ import { User } from '../../hooks/useGetUser'; import Link from 'next/link'; import { Dispatch, useState } from 'react'; import Image from 'next/image'; +import { useLoadUser } from '@/contexts/UserContext'; function NavUser({ user, @@ -34,8 +35,9 @@ function NavUser({ ); } -function Nav({ user }: { user: User }) { +function Nav() { const [toggleNav, setToggleNav] = useState(false); + const user = useLoadUser(); return ( diff --git a/contexts/UserContext.tsx b/contexts/UserContext.tsx index 0aafff5cc..2dec55a98 100644 --- a/contexts/UserContext.tsx +++ b/contexts/UserContext.tsx @@ -1,3 +1,48 @@ -import { createContext } from 'react'; +import { getUser } from '@/api/api'; +import { User } from '@/hooks/useGetUser'; +import { + ReactNode, + createContext, + useContext, + useEffect, + useState, +} from 'react'; -export const UserContext = createContext(''); +const UserContext = createContext({ + id: '', + created_at: new Date(), + name: '', + image_source: '', + email: '', + auth_id: '', +}); + +export const UserProvider = ({ children }: { children: ReactNode }) => { + const [user, setUser] = useState({ + id: '', + created_at: new Date(), + name: '', + image_source: '', + email: '', + auth_id: '', + }); + + useEffect(() => { + const userAccess = localStorage.getItem('token'); + if (userAccess) { + const loadUser = async () => { + const response = await getUser(userAccess); + setUser(response[0]); + }; + loadUser(); + } + }, []); + + return {children}; +}; + +export const useLoadUser = () => { + const user = useContext(UserContext); + + return user; +}; diff --git a/pages/_app.tsx b/pages/_app.tsx index 8d55b5780..5781d4082 100644 --- a/pages/_app.tsx +++ b/pages/_app.tsx @@ -1,13 +1,11 @@ import Footer from '@/components/Footer/Footer'; import Nav from '@/components/Nav/Nav'; import { ModalProvider } from '@/contexts/ModalContext'; -import { UserContext } from '@/contexts/UserContext'; +import { UserProvider } from '@/contexts/UserContext'; import '@/styles/globals.css'; import type { AppProps } from 'next/app'; import Head from 'next/head'; -import { useEffect, useState } from 'react'; -import { getUser } from '../api/api'; -import { User } from '@/hooks/useGetUser'; +import { useEffect } from 'react'; declare global { interface Window { @@ -16,26 +14,6 @@ declare global { } export default function App({ Component, pageProps }: AppProps) { - const [user, setUser] = useState({ - id: '', - created_at: new Date(), - name: '', - image_source: '', - email: '', - auth_id: '', - }); - - useEffect(() => { - const userAccess = localStorage.getItem('token'); - if (userAccess) { - const loadUser = async () => { - const response = await getUser(userAccess); - setUser(response[0]); - }; - loadUser(); - } - }, []); - useEffect(() => { window.Kakao.init(process.env.NEXT_PUBLIC_KAKAO_KEY); }, []); @@ -45,12 +23,12 @@ export default function App({ Component, pageProps }: AppProps) { Linkbrary - -