From eb99165931bf687b77155d1d8781977ad38c722d Mon Sep 17 00:00:00 2001
From: Christoph Brandau <Christoph.Brandau@janus-engineering.com>
Date: Sun, 26 Jul 2026 22:16:35 +0200
Subject: [PATCH] feat(ui): add worktree management toggle to branch panel

Introduces a dedicated section and interactive button for managing repository worktrees within the branch list view. This improves visibility into the overall state of local repositories by grouping related controls.

- Adds visual styling and structure for the new worktree group toggle in CSS.
- Replaces the old "Manage worktrees" button with a more descriptive, styled component in BranchPanel.svelte.
---
 src/app.css                           | 14 ++++++++++++++
 src/lib/components/BranchPanel.svelte | 27 +++++++++++++++------------
 2 files changed, 29 insertions(+), 12 deletions(-)

diff --git a/src/app.css b/src/app.css
index 594acd9..2b0e8e6 100644
--- a/src/app.css
+++ b/src/app.css
@@ -2064,6 +2064,20 @@
   .tag-group-head { display: flex; align-items: center; gap: 6px; }
   .tag-group-head .branch-group-toggle { flex: 1; min-width: 0; }
   .tag-group-head .branch-create-toggle { flex-shrink: 0; }
+  .worktree-group-toggle {
+    border-color: rgba(77, 182, 214, 0.12);
+    background: linear-gradient(90deg, rgba(77, 182, 214, 0.055), transparent 72%);
+  }
+  .worktree-group-toggle:hover:not(:disabled) {
+    border-color: rgba(77, 182, 214, 0.25);
+    background: linear-gradient(90deg, rgba(77, 182, 214, 0.1), rgba(77, 182, 214, 0.025));
+    color: var(--color-ink);
+  }
+  .worktree-group-toggle svg { color: #76cde7; }
+  .worktree-group-toggle .branch-group-count {
+    color: #9edced;
+    background: rgba(77, 182, 214, 0.11);
+  }
 
   .tag-create-form { grid-template-columns: auto minmax(0, 1fr) minmax(0, 1fr) auto auto; }
 
diff --git a/src/lib/components/BranchPanel.svelte b/src/lib/components/BranchPanel.svelte
index 63655fa..9e133bf 100644
--- a/src/lib/components/BranchPanel.svelte
+++ b/src/lib/components/BranchPanel.svelte
@@ -379,16 +379,6 @@
       <h2 class="mt-0.5 text-ink text-base font-bold leading-tight">Refs</h2>
     </div>
     <div class="branch-head-actions">
-      <button
-        class="branch-create-toggle"
-        type="button"
-        onclick={onManageWorktrees}
-        disabled={!hasRepository || isBusy}
-        title="Manage worktrees"
-        aria-label="Manage worktrees"
-      >
-        <HardDrive size={14} aria-hidden="true" />
-      </button>
       <button
         class="branch-create-toggle"
         type="button"
@@ -421,8 +411,6 @@
     <!-- collapsed -->
   {:else if !hasRepository}
     <p class="blank-state">Open a repository to list branches.</p>
-  {:else if branches.length === 0 && tags.length === 0}
-    <p class="blank-state">No branches returned.</p>
   {:else}
     <div class="branch-list overflow-auto p-2 flex flex-col gap-0">
       {#if createOpen}
@@ -659,6 +647,21 @@
           {/if}
         {/if}
       </div>
+
+      <div class="branch-group">
+        <button
+          class="branch-group-toggle worktree-group-toggle"
+          type="button"
+          onclick={onManageWorktrees}
+          disabled={isBusy}
+          aria-haspopup="dialog"
+          title="Manage repository worktrees"
+        >
+          <HardDrive size={14} aria-hidden="true" />
+          <span>Worktrees</span>
+          <span class="branch-group-count">Manage</span>
+        </button>
+      </div>
     </div>
   {/if}