From 73bc51e0ab9fac0153c99010249125836b805655 Mon Sep 17 00:00:00 2001
From: Oier Bravo Urtasun <oierbravo@gmail.com>
Date: Tue, 14 Apr 2026 03:21:27 +0200
Subject: [PATCH] feat(detail): drop "ACTIVE LIST" / "TASK MANAGER" eyebrow;
 show status via pill + strikethrough
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Detail views (/lists/[id], /tasks/[id]) no longer show the editorial
uppercase label above the editable title. The title moves up into that
space for a cleaner top.

Status signaling on /lists/[id] (replaces the hardcoded "ACTIVE LIST"):
  - list.status === 'completed'  → title renders text-text-secondary + line-through
  - list.status === 'archived'   → muted pill next to the title
    (data-testid="list-status-pill", slate-200 bg)
  - list.status === 'active'     → no extra chrome, just the title

/tasks/[id] has no status on task_lists — just the label drop.

Verified: just test-all → exit 0, 233 green, 2 skipped.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 .../src/routes/(app)/lists/[id]/+page.svelte   | 18 ++++++++++++------
 .../src/routes/(app)/tasks/[id]/+page.svelte   |  5 +----
 2 files changed, 13 insertions(+), 10 deletions(-)

diff --git a/apps/web/src/routes/(app)/lists/[id]/+page.svelte b/apps/web/src/routes/(app)/lists/[id]/+page.svelte
index 1b63d85..e3088c9 100644
--- a/apps/web/src/routes/(app)/lists/[id]/+page.svelte
+++ b/apps/web/src/routes/(app)/lists/[id]/+page.svelte
@@ -672,19 +672,25 @@
 		<!-- Items -->
 		<div class="flex-1 overflow-y-auto pb-16 md:pb-6">
 			<!-- Inline rename title — matches /notes editor pattern. Autosaves after
-			     NAME_SAVE_DEBOUNCE_MS of inactivity. -->
-			<div class="px-4 pt-4 pb-2 md:px-8 md:pt-6 md:pb-4">
-				<p class="mb-1 text-[13px] font-semibold uppercase tracking-[0.05em] text-text-secondary">
-					{m.list_status_active()}
-				</p>
+			     NAME_SAVE_DEBOUNCE_MS of inactivity. Status signals: strikethrough
+			     on completed lists, muted pill next to the title for archived. -->
+			<div class="flex items-center gap-2 px-4 pt-2 pb-2 md:px-8 md:pt-3 md:pb-4">
 				<input
 					bind:value={listName}
 					oninput={scheduleNameSave}
 					onblur={flushNameSave}
 					placeholder={m.list_name_placeholder()}
-					class="w-full bg-transparent text-[26px] md:text-[32px] font-semibold tracking-[-0.02em] text-text-primary placeholder:text-text-secondary focus:outline-none"
+					class="min-w-0 flex-1 bg-transparent text-[26px] md:text-[32px] font-semibold tracking-[-0.02em] placeholder:text-text-secondary focus:outline-none {list?.status === 'completed' ? 'text-text-secondary line-through' : 'text-text-primary'}"
 					aria-label={m.list_name_placeholder()}
 				/>
+				{#if list?.status === 'archived'}
+					<span
+						data-testid="list-status-pill"
+						class="shrink-0 rounded-full bg-slate-200 px-2.5 py-0.5 text-[11px] font-semibold uppercase tracking-wide text-text-secondary dark:bg-slate-800"
+					>
+						{m.list_status_archived()}
+					</span>
+				{/if}
 			</div>
 
 			{#if uncheckedItems.length === 0 && checkedItems.length === 0}
diff --git a/apps/web/src/routes/(app)/tasks/[id]/+page.svelte b/apps/web/src/routes/(app)/tasks/[id]/+page.svelte
index abb3b02..7c4b05f 100644
--- a/apps/web/src/routes/(app)/tasks/[id]/+page.svelte
+++ b/apps/web/src/routes/(app)/tasks/[id]/+page.svelte
@@ -233,10 +233,7 @@
 
 	<div class="flex-1 overflow-y-auto px-4 py-4 md:px-6">
 		<!-- Inline rename title input (autosave on idle) -->
-		<div class="pt-2 pb-4 md:pt-4 md:pb-6">
-			<p class="mb-1 text-[13px] font-semibold uppercase tracking-[0.05em] text-text-secondary">
-				{m.masthead_tasks_label()}
-			</p>
+		<div class="pt-1 pb-4 md:pt-2 md:pb-6">
 			<input
 				bind:value={listName}
 				oninput={scheduleNameSave}