From 7a07958b658a8f59c028817bd3f74dd4f7b28550 Mon Sep 17 00:00:00 2001
From: Hikari <hikari@nhcarrigan.com>
Date: Sat, 7 Mar 2026 00:33:23 -0800
Subject: [PATCH] feat: add back-to-workflow button in PRD Creator and Task
 Loop panels

---
 src/lib/components/NavMenu.svelte       | 12 +++++++-
 src/lib/components/PrdPanel.svelte      | 41 ++++++++++++++++---------
 src/lib/components/TaskLoopPanel.svelte | 41 ++++++++++++++++---------
 3 files changed, 63 insertions(+), 31 deletions(-)

diff --git a/src/lib/components/NavMenu.svelte b/src/lib/components/NavMenu.svelte
index 59e9590..c4fa55f 100644
--- a/src/lib/components/NavMenu.svelte
+++ b/src/lib/components/NavMenu.svelte
@@ -512,6 +512,10 @@
 {#if showPrdPanel}
   <PrdPanel
     onClose={() => (showPrdPanel = false)}
+    onBackToWorkflow={() => {
+      showPrdPanel = false;
+      showWorkflowPanel = true;
+    }}
     workingDirectory={workingDirectory || selectedDirectory}
   />
 {/if}
@@ -521,7 +525,13 @@
 {/if}
 
 {#if showTaskLoop}
-  <TaskLoopPanel onClose={() => (showTaskLoop = false)} />
+  <TaskLoopPanel
+    onClose={() => (showTaskLoop = false)}
+    onBackToWorkflow={() => {
+      showTaskLoop = false;
+      showWorkflowPanel = true;
+    }}
+  />
 {/if}
 
 {#if showWorkflowPanel}
diff --git a/src/lib/components/PrdPanel.svelte b/src/lib/components/PrdPanel.svelte
index 274b5c4..759a7ad 100644
--- a/src/lib/components/PrdPanel.svelte
+++ b/src/lib/components/PrdPanel.svelte
@@ -8,9 +8,10 @@
   interface Props {
     onClose: () => void;
     workingDirectory: string;
+    onBackToWorkflow?: () => void;
   }
 
-  const { onClose, workingDirectory }: Props = $props();
+  const { onClose, workingDirectory, onBackToWorkflow }: Props = $props();
 
   const tasks = $derived(prdStore.tasks);
   const goal = $derived(prdStore.goal);
@@ -119,20 +120,30 @@
           </span>
         {/if}
       </div>
-      <button
-        onclick={onClose}
-        class="p-1 text-[var(--text-secondary)] hover:text-[var(--text-primary)] transition-colors"
-        aria-label="Close"
-      >
-        <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-          <path
-            stroke-linecap="round"
-            stroke-linejoin="round"
-            stroke-width="2"
-            d="M6 18L18 6M6 6l12 12"
-          />
-        </svg>
-      </button>
+      <div class="flex items-center gap-2">
+        {#if onBackToWorkflow}
+          <button
+            onclick={onBackToWorkflow}
+            class="px-2 py-1 text-xs text-[var(--text-secondary)] hover:text-[var(--text-primary)] bg-[var(--bg-secondary)] hover:bg-[var(--bg-tertiary)] border border-[var(--border-color)] rounded-md transition-colors"
+          >
+            ← Workflow
+          </button>
+        {/if}
+        <button
+          onclick={onClose}
+          class="p-1 text-[var(--text-secondary)] hover:text-[var(--text-primary)] transition-colors"
+          aria-label="Close"
+        >
+          <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+            <path
+              stroke-linecap="round"
+              stroke-linejoin="round"
+              stroke-width="2"
+              d="M6 18L18 6M6 6l12 12"
+            />
+          </svg>
+        </button>
+      </div>
     </div>
 
     <!-- Body -->
diff --git a/src/lib/components/TaskLoopPanel.svelte b/src/lib/components/TaskLoopPanel.svelte
index a400006..232ba85 100644
--- a/src/lib/components/TaskLoopPanel.svelte
+++ b/src/lib/components/TaskLoopPanel.svelte
@@ -16,9 +16,10 @@
 
   interface Props {
     onClose: () => void;
+    onBackToWorkflow?: () => void;
   }
 
-  const { onClose }: Props = $props();
+  const { onClose, onBackToWorkflow }: Props = $props();
 
   const tasks = $derived(taskLoopStore.tasks);
   const loopStatus = $derived(taskLoopStore.loopStatus);
@@ -307,20 +308,30 @@
           </span>
         {/if}
       </div>
-      <button
-        onclick={onClose}
-        class="p-1 text-[var(--text-secondary)] hover:text-[var(--text-primary)] transition-colors"
-        aria-label="Close"
-      >
-        <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-          <path
-            stroke-linecap="round"
-            stroke-linejoin="round"
-            stroke-width="2"
-            d="M6 18L18 6M6 6l12 12"
-          />
-        </svg>
-      </button>
+      <div class="flex items-center gap-2">
+        {#if onBackToWorkflow}
+          <button
+            onclick={onBackToWorkflow}
+            class="px-2 py-1 text-xs text-[var(--text-secondary)] hover:text-[var(--text-primary)] bg-[var(--bg-secondary)] hover:bg-[var(--bg-tertiary)] border border-[var(--border-color)] rounded-md transition-colors"
+          >
+            ← Workflow
+          </button>
+        {/if}
+        <button
+          onclick={onClose}
+          class="p-1 text-[var(--text-secondary)] hover:text-[var(--text-primary)] transition-colors"
+          aria-label="Close"
+        >
+          <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+            <path
+              stroke-linecap="round"
+              stroke-linejoin="round"
+              stroke-width="2"
+              d="M6 18L18 6M6 6l12 12"
+            />
+          </svg>
+        </button>
+      </div>
     </div>
 
     <!-- Body -->