diff --git a/src/layout/Header.js b/src/layout/Header.js index fa06854f..691a401c 100644 --- a/src/layout/Header.js +++ b/src/layout/Header.js @@ -20,6 +20,7 @@ import axios from "axios"; import { useRecoilState, useSetRecoilState } from "recoil"; import { avatar, id, name, isLogin } from "../recoil/authorize"; import styled from "styled-components"; + const ElevationScroll = (props) => { const { children, window } = props; // Note that you normally won't need to set the window ref as useScrollTrigger @@ -42,6 +43,20 @@ ElevationScroll.propTypes = { */ window: PropTypes.func, }; + +async function checkTokenValid() { + const isTokenValid = await axios.get( + `${process.env.REACT_APP_SERVER_URL}/auth/checkToken`, + { + validateStatus: (status) => { + return status < 500; + }, + withCredentials: true, + }, + ); + return isTokenValid.status < 400; +} + export const Header = (props) => { const [anchorElNav, setAnchorElNav] = useState(null); const [anchorElUser, setAnchorElUser] = useState(null); @@ -49,10 +64,23 @@ export const Header = (props) => { const [userId, setUserId] = useRecoilState(id); const [userName, setUserName] = useRecoilState(name); const setIsLogin = useSetRecoilState(isLogin); + + const checkIsLogin = async () => { + const loggedIn = await checkTokenValid(); + if (loggedIn) { + setSrc(localStorage.avatar); + setUserId(localStorage.id); + setUserName(localStorage.name); + } else { + localStorage.removeItem("id"); + localStorage.removeItem("name"); + localStorage.removeItem("avatar"); + } + setIsLogin(loggedIn); + }; + React.useEffect(() => { - setSrc(localStorage.avatar); - setUserId(localStorage.id); - setUserName(localStorage.name); + checkIsLogin(); }, []); const handleOpenNavMenu = (event) => { setAnchorElNav(event.currentTarget); @@ -160,7 +188,7 @@ export const Header = (props) => { - handleOpenNewTab("https://docs.open-set-go.com") + handleOpenNewTab("https://open-set-go.netlify.app/") } > Docs @@ -209,7 +237,9 @@ export const Header = (props) => { ))} handleOpenNewTab("https://docs.open-set-go.com")} + onClick={() => + handleOpenNewTab("https://open-set-go.netlify.app/") + } > Docs diff --git a/src/pages/MainPage.js b/src/pages/MainPage.js index f994f518..a084665d 100644 --- a/src/pages/MainPage.js +++ b/src/pages/MainPage.js @@ -3,34 +3,8 @@ import Footer from "../components/main/Footer"; import Steps from "../components/main/Steps"; import propTypes from "prop-types"; import { Header } from "../layout/Header"; -import { useEffect } from "react"; -import { useSetRecoilState } from "recoil"; -import { isLogin } from "../recoil/authorize"; -import axios from "axios"; - -async function checkTokenValid() { - const isTokenValid = await axios.get( - `${process.env.REACT_APP_SERVER_URL}/auth/checkToken`, - { - validateStatus: (status) => { - return status < 500; - }, - withCredentials: true, - }, - ); - return isTokenValid.status < 400; -} function MainPage() { - const setIsLogin = useSetRecoilState(isLogin); - - const checkIsLogin = async () => { - setIsLogin(await checkTokenValid()); - }; - - useEffect(() => { - checkIsLogin(); - }, []); return ( <>