fix timers

frontend/src/components/tasks/AddTaskDialog.tsx

@@ -0,0 +1,75 @@
+/**
+ * The "and this too" you type at 9am.
+ *
+ * The draft lives here rather than in the page: it is this dialog's business and
+ * nothing else ever reads it.
+ */
+import { useState } from "react";
+import {
+  Button,
+  Dialog,
+  DialogActions,
+  DialogContent,
+  DialogTitle,
+  Stack,
+  TextField,
+  Typography,
+} from "@mui/material";
+
+import { api } from "../../lib/api";
+
+export default function AddTaskDialog({
+  open,
+  onClose,
+  onCreated,
+}: {
+  open: boolean;
+  onClose: () => void;
+  onCreated: () => Promise<void>;
+}) {
+  const [draft, setDraft] = useState({ title: "", due_date: "" });
+
+  return (
+    <Dialog open={open} onClose={onClose} fullWidth maxWidth="xs">
+      <DialogTitle>New task</DialogTitle>
+      <DialogContent>
+        <Stack spacing={2} sx={{ mt: 1 }}>
+          <TextField
+            autoFocus
+            label="What needs doing?"
+            value={draft.title}
+            onChange={(event) => setDraft({ ...draft, title: event.target.value })}
+          />
+          <TextField
+            label="Due date"
+            type="date"
+            InputLabelProps={{ shrink: true }}
+            value={draft.due_date}
+            onChange={(event) => setDraft({ ...draft, due_date: event.target.value })}
+          />
+          <Typography variant="caption" color="text.secondary">
+            Local tasks live only here, so they are the one kind you can delete.
+          </Typography>
+        </Stack>
+      </DialogContent>
+      <DialogActions>
+        <Button onClick={onClose}>Cancel</Button>
+        <Button
+          variant="contained"
+          disabled={!draft.title.trim()}
+          onClick={async () => {
+            await api.post("/api/tasks", {
+              title: draft.title.trim(),
+              due_date: draft.due_date || null,
+            });
+            setDraft({ title: "", due_date: "" });
+            onClose();
+            await onCreated();
+          }}
+        >
+          Add
+        </Button>
+      </DialogActions>
+    </Dialog>
+  );
+}