Merge pull request #17 from kkkkkSE/refactor/check-access-token

[refactor] 페이지 이동 시 Access Token 확인 후 렌더링하는 로직으로 변경

src/components/PostLoginLayout.tsx

@@ -1,8 +1,18 @@
 import { Outlet } from 'react-router-dom';
+
 import styled from 'styled-components';
+
+import useCheckAccessToken from '../hooks/useCheckAccessToken';
+
 import Header from './Header';
 
 export default function PostLoginLayout() {
+  const ready = useCheckAccessToken();
+
+  if (!ready) {
+    return null;
+  }
+
   return (
     <Container>
       <Header />

src/hooks/useCheckAccessToken.ts

@@ -0,0 +1,27 @@
+import { useEffect, useState } from 'react';
+
+import { useNavigate } from 'react-router-dom';
+
+import useAccessToken from './useAccessToken';
+
+export default function useCheckAccessToken(): boolean {
+  const [ready, setReady] = useState(false);
+
+  const { accessToken, setAccessToken } = useAccessToken();
+
+  const navigate = useNavigate();
+
+  useEffect(() => {
+    if (accessToken) {
+      setReady(true);
+    }
+  }, [accessToken, setAccessToken]);
+
+  useEffect(() => {
+    if (!accessToken) {
+      navigate('/');
+    }
+  }, [accessToken, navigate]);
+
+  return ready;
+}