more pages

src/pages/Login.tsx

@@ -1,6 +1,6 @@
 import { useMemo, useState } from "react"
 import { Navigate } from "react-router-dom"
-import { authorizeLogin, isLoggedIn, LoggedIn } from "../authorization"
+import { authorizeLogin, isLoggedIn, LoginState, useClearToken } from "../authorization"
 
 export function Login() {
     var [username, setUsername] = useState("")
@@ -9,23 +9,23 @@ export function Login() {
 
     var login = () => {
         if (username.length === 0 || password.length === 0) {
-            setLoggedIn(LoggedIn.Invalid)
+            setLoggedIn(LoginState.Invalid)
             return
         }
         authorizeLogin(username, password, setLoggedIn)
     }
 
     useMemo(() => {
-        if (loggedIn === LoggedIn.Invalid) {
-            setLoggedIn(LoggedIn.No)
+        if (loggedIn === LoginState.Invalid) {
+            setLoggedIn(LoginState.No)
         }
     }, [username, password])
 
     return (
         <div id="login">
             <div className="form">
-                <input type="text" className={loggedIn === LoggedIn.Invalid ? "error" : ""} onChange={e => setUsername(e.target.value)} />
-                <input type="password" className={loggedIn === LoggedIn.Invalid ? "error" : ""} onChange={e => setPassword(e.target.value)} />
+                <input type="text" className={loggedIn === LoginState.Invalid ? "error" : ""} onChange={e => setUsername(e.target.value)} />
+                <input type="password" className={loggedIn === LoginState.Invalid ? "error" : ""} onChange={e => setPassword(e.target.value)} />
             </div>
             <div>
                 <button className="pad svg" onClick={login}>
@@ -35,8 +35,19 @@ export function Login() {
                 </button>
             </div>
             {
-                loggedIn === LoggedIn.Yes && <Navigate to="/" replace={true} />
+                loggedIn === LoginState.Yes && <Navigate to="/" replace={true} />
             }
         </div>
     )
+}
+
+export function Logout() {
+    const loggedOut = useClearToken()
+    return (
+        <>
+            {
+                loggedOut && <Navigate to="/login" replace={true} />
+            }
+        </>
+    )
 }