42 lines
1005 B
TypeScript
42 lines
1005 B
TypeScript
// frontend/src/App.tsx
|
|
import React from 'react'
|
|
import Uploader from './Uploader'
|
|
import Login from './Login'
|
|
import { api } from './api'
|
|
|
|
export default function App() {
|
|
const [authed, setAuthed] = React.useState<boolean | undefined>(undefined)
|
|
|
|
React.useEffect(() => {
|
|
api('/api/whoami')
|
|
.then(() => setAuthed(true))
|
|
.catch(() => setAuthed(false))
|
|
}, [])
|
|
|
|
async function logout() {
|
|
try {
|
|
await api('/api/logout', { method: 'POST' })
|
|
} finally {
|
|
try {
|
|
location.reload()
|
|
} catch {
|
|
// JSDOM can block navigation APIs; browsers still reload normally.
|
|
}
|
|
}
|
|
}
|
|
|
|
return (
|
|
<main>
|
|
<header className="app-header">
|
|
<div className="brand">
|
|
<span className="wing" aria-hidden>🪽</span>
|
|
<strong>Pegasus</strong>
|
|
</div>
|
|
{authed && <button onClick={logout}>Logout</button>}
|
|
</header>
|
|
|
|
{authed ? <Uploader /> : <Login onLogin={() => setAuthed(true)} />}
|
|
</main>
|
|
)
|
|
}
|