로그인버튼 수정

2c267d4b · Kim, MinGyu · 5e259cfd · 2c267d4b · 2c267d4b · 5e259cfd
Commit 2c267d4b authored Jul 11, 2022 by Kim, MinGyu
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -5,30 +5,17 @@ import { Login, Signup } from "./auth";
 import { Board } from "./board";
 import { Header, Body } from "./home";
 import Posting from "./post/posting";
-import { AuthProvider } from "./auth/auth.context";
-import Layout from "./commons/layout";
-
 export const App = () => {
  return (
    <BrowserRouter>
      <Routes>
-        {/* <Route element={<Layout children={} />}> */}
-        <Route
-          path="login"
-          element={
-            <AuthProvider>
-              <Login />
-            </AuthProvider>
-          }
-        />
+        <Route path="login" element={<Login />} />
        <Route path="signup" element={<Signup />} />
-
        <Route path="/" element={<Header />}>
          <Route index element={<Body />} />
          <Route path="board" element={<Board />} />
          <Route path="posting" element={<Posting />} />
        </Route>
-        {/* </Route> */}
      </Routes>
    </BrowserRouter>
  );

--- a/frontend/src/auth/login.tsx
+++ b/frontend/src/auth/login.tsx
@@ -54,14 +54,14 @@ export default function Login() {
      <div className="bg-white w-1/2 md:w-1/3 my-8 text-center text-2xl">
        <Link to="/">Travel Report</Link>
      </div>
-      <div className="flex flex-col w-full md:w-1/2 p-8 md:p-4 md:p-0">
+      <div className="flex flex-col w-full md:w-1/3 p-8 md:p-4 md:p-0">
        <form onSubmit={handleSubmit}>
          <div className="flex flex-col md:flex-row border-2 border-black rounded-xl p-8 md:p-12 gap-y-4 md:gap-x-6">
            <div className="flex flex-col md:w-2/3 md:gap-2 ">
              <input
                className="placeholder:text-slate-300
                bg-white border border-slate-500 md:rounded-2xl
-                py-3 md:py-2 pl-9 pr-3 
+                my-2 py-3 md:py-2 pl-9 pr-3 
                focus:border-black
                "
                placeholder="이메일"

--- a/frontend/src/commons/layout.tsx
+++ b/frontend/src/commons/layout.tsx
-import React, { ReactNode } from "react";
-import { AuthProvider } from "../auth/auth.context";
-
-export default function Layout({ children }: { children: ReactNode }) {
-  return <AuthProvider>{children}</AuthProvider>;
-}
--- a/frontend/src/home/header.tsx
+++ b/frontend/src/home/header.tsx
@@ -15,21 +15,22 @@ export default function Header() {
          </Link>
        </button>
        <div className="flex flex-row-reverse">
-          <button className="px-5 py-2 bg-teal-400 rounded">
-            <Link
-              to="/login"
-              className="hover:bg-teal-100 focus:text-purple-500 "
-            >
-              Login
-            </Link>
-            <button
-              onClick={() => {
-                logout();
-              }}
-            >
-              Logout
-            </button>
-          </button>
+          <div className="px-5 py-2 bg-teal-400 rounded">
+            {localStorage.getItem("survey-user-info") ? (
+              <button
+                onClick={() => {
+                  logout();
+                }}
+              >
+                Logout
+              </button>
+            ) : (
+              <button>
+                <Link to="/login">Login</Link>
+              </button>
+            )}
+          </div>
+
          <button className="px-5 py-2 bg-purple-400 rounded">
            <Link
              to="/board"

--- a/frontend/src/index.tsx
+++ b/frontend/src/index.tsx
 import React from "react";
 import { createRoot } from "react-dom/client";
 import { App } from "./App";
+import { AuthProvider } from "./auth/auth.context";

 const container = document.getElementById("root");
 const root = createRoot(container!);

 root.render(
  <React.StrictMode>
-    <App />
+    <AuthProvider>
+      <App />
+    </AuthProvider>
  </React.StrictMode>
 );