Rework Tasks tab: Chains section, checklist modal, project visibility

The flat Tasks-tab atom list was silently dumping every chain step
(locked and unlocked) and dormant bucket-pool items in as ordinary
undated cards, with no chain/project context and no protection against
completing a locked step out of order.

- CompleteNativeTask now rejects completing a locked chain task
  (ErrChainTaskLocked), mapped to 400 in both the widget and web
  complete-atom handlers.
- Chain tasks and dormant bucket items are excluded from the flat atom
  list; a new "Chains" section shows one card per active/paused chain
  with the current step and N/M progress.
- New chain checklist modal (GET /chains/{id}) lists every position in
  order with pause/resume/abandon -- the web view originally deferred
  as Android-only.
- Fixed a real bug this surfaced: resuming a paused chain only flipped
  the status flag, never unlocking the deferred successor, so a chain
  paused right after a completion stayed stuck forever. SetChainStatus
  now catches up the deferred advancement on resume, idempotently.
- Atom cards gained a project-name chip for general visibility.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01EZ7ikw2ukGJFTHE3bJS7zL

1 files changed, 40 insertions, 0 deletions

diff --git a/web/templates/partials/tasks-tab.html b/web/templates/partials/tasks-tab.html
index 04c20da..b506716 100644
--- a/web/templates/partials/tasks-tab.html
+++ b/web/templates/partials/tasks-tab.html
@@ -5,6 +5,40 @@
      hx-target="#tab-content"
      hx-swap="innerHTML">
 
+    <!-- Chains -->
+    {{if .Chains}}
+    <div class="grid gap-3 sm:grid-cols-2 lg:grid-cols-3">
+        {{range .Chains}}
+        <div class="bg-card bg-card-hover transition-colors rounded-lg border border-purple-400/20">
+            <div class="flex items-start gap-2 sm:gap-3 p-3 sm:p-4">
+                {{if .CurrentTask}}
+                <input type="checkbox"
+                       hx-post="/complete-atom"
+                       hx-vals='{"id": "{{.CurrentTask.ID}}", "source": "doot"}'
+                       hx-target="closest div.rounded-lg"
+                       hx-swap="outerHTML"
+                       class="mt-1 h-5 w-5 rounded bg-black/40 border-white/30 text-white/80 focus:ring-white/30 cursor-pointer flex-shrink-0">
+                {{end}}
+                <span class="text-lg flex-shrink-0">🔗</span>
+                <div class="flex-1 min-w-0">
+                    <div class="flex items-start justify-between gap-2">
+                        <h3 class="text-sm text-white font-medium break-words cursor-pointer hover:underline"
+                            hx-get="/chains/{{.Chain.ID}}"
+                            hx-target="#chain-view-content"
+                            hx-swap="innerHTML"
+                            onclick="document.getElementById('chain-view-modal').classList.remove('hidden')">{{if .CurrentTask}}{{.CurrentTask.Content}}{{else}}{{.ProjectName}}{{end}}</h3>
+                    </div>
+                    <div class="flex flex-wrap items-center gap-2 mt-1 text-xs text-white/50">
+                        <span class="text-purple-300/80">{{.ProjectName}} &middot; {{.Position}}/{{.Total}}</span>
+                        {{if eq .Chain.Status "paused"}}<span class="text-amber-300/80">paused</span>{{end}}
+                    </div>
+                </div>
+            </div>
+        </div>
+        {{end}}
+    </div>
+    {{end}}
+
     <!-- Tasks List -->
     {{if .Atoms}}
     <div class="grid gap-3 sm:grid-cols-2 lg:grid-cols-3">
@@ -35,6 +69,9 @@
                         {{end}}
                     </div>
                     <div class="flex flex-wrap items-center gap-2 mt-1 text-xs text-white/50">
+                        {{if .ProjectName}}
+                        <span class="text-teal-300/70">{{.ProjectName}}</span>
+                        {{end}}
                         {{if .DueDate}}
                         <span class="{{if .IsOverdue}}text-amber-300/80{{end}}">{{.DueDate.Format "Jan 2"}}{{if .HasSetTime}}, {{.DueDate.Format "3:04pm"}}{{end}}</span>
                         {{end}}
@@ -92,6 +129,9 @@
                             {{end}}
                         </div>
                         <div class="flex flex-wrap items-center gap-2 mt-1 text-xs text-white/40">
+                            {{if .ProjectName}}
+                            <span class="text-teal-300/60">{{.ProjectName}}</span>
+                            {{end}}
                             {{if .DueDate}}
                             <span>{{.DueDate.Format "Jan 2"}}{{if .HasSetTime}}, {{.DueDate.Format "3:04pm"}}{{end}}</span>
                             {{end}}