From e3873d748349c072cfe7d843ba0f76a1f6900b0c Mon Sep 17 00:00:00 2001
From: Bryan Van Deusen <bryan.vandeusen@fabledsword.com>
Date: Tue, 3 Mar 2026 19:51:58 -0500
Subject: [PATCH] Route task card clicks to edit view; repurpose button as View

Clicking a task card now goes directly to the edit view since that's
the primary use case. The hover button (compact) and button (full card)
are now labeled "View" and link to the detail/viewer view instead.
Sub-task links in TaskViewerView also route to edit.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 frontend/src/components/TaskCard.vue  | 9 +++------
 frontend/src/views/TaskViewerView.vue | 2 +-
 2 files changed, 4 insertions(+), 7 deletions(-)

diff --git a/frontend/src/components/TaskCard.vue b/frontend/src/components/TaskCard.vue
index 4838a50..a6365ba 100644
--- a/frontend/src/components/TaskCard.vue
+++ b/frontend/src/components/TaskCard.vue
@@ -40,9 +40,6 @@ function cycleStatus() {
   emit("status-toggle", props.task.id, statusCycle[props.task.status!]);
 }
 
-function goEdit() {
-  router.push(`/tasks/${props.task.id}/edit`);
-}
 
 function isOverdue(): boolean {
   if (!props.task.due_date || props.task.status === "done") return false;
@@ -52,7 +49,7 @@ function isOverdue(): boolean {
 </script>
 
 <template>
-  <router-link :to="`/tasks/${task.id}`" :class="['task-card', { compact }]">
+  <router-link :to="`/tasks/${task.id}/edit`" :class="['task-card', { compact }]">
 
     <!-- Compact: single row -->
     <template v-if="compact">
@@ -67,7 +64,7 @@ function isOverdue(): boolean {
       <span v-if="task.due_date" :class="['due-compact', { overdue: isOverdue() }]">
         {{ task.due_date }}
       </span>
-      <button class="btn-edit-compact" title="Edit" @click.prevent.stop="goEdit">Edit</button>
+      <button class="btn-edit-compact" title="View detail" @click.prevent.stop="router.push(`/tasks/${props.task.id}`)">View</button>
     </template>
 
     <!-- Full: original layout -->
@@ -80,7 +77,7 @@ function isOverdue(): boolean {
         />
         <PriorityBadge :priority="task.priority!" />
         <h3 class="task-title">{{ task.title || "Untitled" }}</h3>
-        <button class="btn-edit" title="Edit" @click.prevent.stop="goEdit">Edit</button>
+        <button class="btn-edit" title="View detail" @click.prevent.stop="router.push(`/tasks/${props.task.id}`)">View</button>
       </div>
       <div v-if="task.body" class="task-preview prose" v-html="renderPreview(task.body)"></div>
       <div class="task-meta">
diff --git a/frontend/src/views/TaskViewerView.vue b/frontend/src/views/TaskViewerView.vue
index d05d08e..4494218 100644
--- a/frontend/src/views/TaskViewerView.vue
+++ b/frontend/src/views/TaskViewerView.vue
@@ -282,7 +282,7 @@ const subTaskProgress = computed(() => {
                 :title="`${sub.status} — click to advance`"
                 @click="cycleSubTaskStatus(sub)"
               ></button>
-              <router-link :to="`/tasks/${sub.id}`" class="sub-title" :class="{ 'sub-done': sub.status === 'done' }">
+              <router-link :to="`/tasks/${sub.id}/edit`" class="sub-title" :class="{ 'sub-done': sub.status === 'done' }">
                 {{ sub.title || "Untitled" }}
               </router-link>
               <span v-if="sub.due_date" class="sub-due">{{ sub.due_date }}</span>