Spaces:
Paused
Paused
| import { useState } from 'react'; | |
| export default function Login({ onLogin }) { | |
| const [username, setUsername] = useState('admin'); | |
| const [password, setPassword] = useState(''); | |
| const [error, setError] = useState(''); | |
| const [busy, setBusy] = useState(false); | |
| const submit = async (e) => { | |
| e.preventDefault(); | |
| setBusy(true); | |
| setError(''); | |
| try { | |
| await onLogin(username, password); | |
| } catch (err) { | |
| setError(err.message); | |
| } finally { | |
| setBusy(false); | |
| } | |
| }; | |
| return ( | |
| <div className="login-wrap"> | |
| <form className="login-card" onSubmit={submit}> | |
| <h1>Dispatch Console</h1> | |
| <label> | |
| Username | |
| <input value={username} onChange={(e) => setUsername(e.target.value)} autoFocus /> | |
| </label> | |
| <label> | |
| Password | |
| <input type="password" value={password} onChange={(e) => setPassword(e.target.value)} /> | |
| </label> | |
| {error && <p className="error">{error}</p>} | |
| <button disabled={busy}>{busy ? 'Signing in…' : 'Log in'}</button> | |
| </form> | |
| </div> | |
| ); | |
| } |