Implement dashboard UI improvements

dashboard/src/workstreams/[id].md

@@ -5,6 +5,7 @@ title: Workstream
 ```js
 import {API} from "../components/config.js";
 import {fieldRow} from "../components/field-help.js";
+import {statusControl, TASK_STATUSES, WORKSTREAM_STATUSES} from "../components/status-control.js";
 ```
 
 ```js
@@ -33,7 +34,12 @@ if (raw.error) {
   display(html`<p style="margin-top:0"><a href="/">← Overview</a> &nbsp;|&nbsp; <a href="/workstreams">← Workstreams</a> &nbsp;|&nbsp; <a href="/token-cost">← Token Cost</a></p>`);
 
   display(html`<div class="ws-summary">
-    <div><span>Status</span><strong>${raw.status ?? "—"}</strong></div>
+    <div><span>Status</span>${statusControl({
+      entity: raw,
+      type: "workstream",
+      statuses: WORKSTREAM_STATUSES,
+      onSaved: () => setTimeout(() => location.reload(), 450),
+    })}</div>
     <div><span>Workplan</span><strong>${workplan.filename ?? "not file-backed"}</strong></div>
     <div><span>Tasks</span><strong>${taskRows.length}</strong></div>
   </div>`);
@@ -52,7 +58,12 @@ if (raw.error) {
     display(html`<table class="task-table">
       <thead><tr><th>Status</th><th>Priority</th><th>Task</th><th>Human</th></tr></thead>
       <tbody>${sortedTasks.map(t => html`<tr>
-        <td><span class="task-status task-status-${t.status}">${t.status}</span></td>
+        <td>${statusControl({
+          entity: t,
+          type: "task",
+          statuses: TASK_STATUSES,
+          onSaved: () => setTimeout(() => location.reload(), 450),
+        })}</td>
         <td>${t.priority ?? "—"}</td>
         <td><a href="/tasks/${t.id}">${t.title ?? t.id}</a></td>
         <td>${t.needs_human ? "yes" : ""}</td>