login screen

web/src/components/Login.jsx

@@ -0,0 +1,35 @@
+import { useState } from 'react';
+import { api } from '../api.js';
+
+export default function Login({ onLogin }) {
+  const [username, setUsername] = useState('');
+  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 || 'Login failed');
+    } finally {
+      setBusy(false);
+    }
+  };
+
+  return (
+    <div className="login-wrap">
+      <form className="login" onSubmit={submit}>
+        <h1>Dispatch Console</h1>
+        <input placeholder="Username" value={username} onChange={(e) => setUsername(e.target.value)} autoFocus />
+        <input type="password" placeholder="Password" value={password} onChange={(e) => setPassword(e.target.value)} />
+        {error && <p className="error">{error}</p>}
+        <button disabled={busy}>{busy ? 'Signing in…' : 'Sign in'}</button>
+        <p className="muted small">First run creates admin / admin — change it.</p>
+      </form>
+    </div>
+  );
+}