From f2ee8a0ec389ea38b2937984afd719d77b09d430 Mon Sep 17 00:00:00 2001
From: Matt Toohey <contact@matttoohey.com>
Date: Thu, 19 Feb 2026 15:39:28 -0800
Subject: [PATCH 1/3] fix: include subpath in repo labels for branch and remote
 branch cards

The repo labels displayed on BranchCard and RemoteBranchCard were missing
the subpath suffix (e.g. 'org/repo/sub-dir'). This was a regression where
the repoLabelsByProject map in ProjectHome.svelte only used repo.githubRepo
without appending repo.subpath, and the fallback in ProjectSection.svelte's
repoLabelForBranch() similarly used project.githubRepo without project.subpath.

Fixed all 4 occurrences in ProjectHome.svelte where the repo label map is
built (hydration, project creation, repo addition, branch deletion) and the
fallback in ProjectSection.svelte to conditionally append the subpath,
matching the format already used in the action settings UI side panel.
---
 .../lib/features/projects/ProjectHome.svelte  | 40 +++++++++++++++++--
 .../features/projects/ProjectSection.svelte   |  7 +++-
 2 files changed, 41 insertions(+), 6 deletions(-)

diff --git a/staged/src/lib/features/projects/ProjectHome.svelte b/staged/src/lib/features/projects/ProjectHome.svelte
index 18ecbc9..0d3a4e2 100644
--- a/staged/src/lib/features/projects/ProjectHome.svelte
+++ b/staged/src/lib/features/projects/ProjectHome.svelte
@@ -197,7 +197,15 @@
             branchesByProject = new Map(branchesByProject).set(project.id, branches);
             repoLabelsByProject = new Map(repoLabelsByProject).set(
               project.id,
-              new Map(repos.map((repo) => [repo.id, repo.githubRepo] as const))
+              new Map(
+                repos.map(
+                  (repo) =>
+                    [
+                      repo.id,
+                      repo.subpath ? `${repo.githubRepo}/${repo.subpath}` : repo.githubRepo,
+                    ] as const
+                )
+              )
             );
           } catch (e) {
             console.error(`[ProjectHome] Failed to hydrate project '${project.id}':`, e);
@@ -319,7 +327,15 @@
     branchesByProject = new Map(branchesByProject).set(project.id, branches);
     repoLabelsByProject = new Map(repoLabelsByProject).set(
       project.id,
-      new Map(repos.map((repo) => [repo.id, repo.githubRepo] as const))
+      new Map(
+        repos.map(
+          (repo) =>
+            [
+              repo.id,
+              repo.subpath ? `${repo.githubRepo}/${repo.subpath}` : repo.githubRepo,
+            ] as const
+        )
+      )
     );
     startInitialBranchSetup(project.id, branches);
     showNewProjectModal = false;
@@ -423,7 +439,15 @@
       branchesByProject = new Map(branchesByProject).set(projectId, branches);
       repoLabelsByProject = new Map(repoLabelsByProject).set(
         projectId,
-        new Map(repos.map((repo) => [repo.id, repo.githubRepo] as const))
+        new Map(
+          repos.map(
+            (repo) =>
+              [
+                repo.id,
+                repo.subpath ? `${repo.githubRepo}/${repo.subpath}` : repo.githubRepo,
+              ] as const
+          )
+        )
       );
       startInitialBranchSetup(projectId, branches);
     } catch (e) {
@@ -626,7 +650,15 @@
         branchesByProject = new Map(branchesByProject).set(branch.projectId, branches);
         repoLabelsByProject = new Map(repoLabelsByProject).set(
           branch.projectId,
-          new Map(repos.map((repo) => [repo.id, repo.githubRepo] as const))
+          new Map(
+            repos.map(
+              (repo) =>
+                [
+                  repo.id,
+                  repo.subpath ? `${repo.githubRepo}/${repo.subpath}` : repo.githubRepo,
+                ] as const
+            )
+          )
         );
       } else {
         await commands.deleteBranch(branch.id);
diff --git a/staged/src/lib/features/projects/ProjectSection.svelte b/staged/src/lib/features/projects/ProjectSection.svelte
index c8bdff5..f799c69 100644
--- a/staged/src/lib/features/projects/ProjectSection.svelte
+++ b/staged/src/lib/features/projects/ProjectSection.svelte
@@ -93,8 +93,11 @@
   });
 
   function repoLabelForBranch(branch: Branch): string | null {
-    if (!branch.projectRepoId) return project.githubRepo;
-    return repoLabelsById.get(branch.projectRepoId) ?? project.githubRepo;
+    const fallback = project.subpath
+      ? `${project.githubRepo}/${project.subpath}`
+      : project.githubRepo;
+    if (!branch.projectRepoId) return fallback;
+    return repoLabelsById.get(branch.projectRepoId) ?? fallback;
   }
 </script>
 

From 05cbac79503ce4e4c1fb9b5fe33b385f43e3255c Mon Sep 17 00:00:00 2001
From: Matt Toohey <contact@matttoohey.com>
Date: Thu, 19 Feb 2026 15:44:14 -0800
Subject: [PATCH 2/3] fix: include subpath in repo labels on project list cards

The repo labels displayed on project cards in ProjectsList.svelte were
missing the subpath suffix (e.g. 'org/repo/sub-dir'). This is the same
issue fixed in commit f2ee8a0 for BranchCard and RemoteBranchCard.

Fixed both the repos.map() path and the project.githubRepo fallback to
conditionally append the subpath when present.
---
 staged/src/lib/features/projects/ProjectsList.svelte | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/staged/src/lib/features/projects/ProjectsList.svelte b/staged/src/lib/features/projects/ProjectsList.svelte
index b9c29fc..d1bd5c0 100644
--- a/staged/src/lib/features/projects/ProjectsList.svelte
+++ b/staged/src/lib/features/projects/ProjectsList.svelte
@@ -338,8 +338,14 @@
                 {/if}
                 <div class="repo">
                   {repos.length > 0
-                    ? repos.map((r) => r.githubRepo).join(', ')
-                    : (project.githubRepo ?? 'No repo attached')}
+                    ? repos
+                        .map((r) => (r.subpath ? `${r.githubRepo}/${r.subpath}` : r.githubRepo))
+                        .join(', ')
+                    : project.githubRepo
+                      ? project.subpath
+                        ? `${project.githubRepo}/${project.subpath}`
+                        : project.githubRepo
+                      : 'No repo attached'}
                 </div>
               </button>
               <div class="card-location">

From abe055cf3eb227a6927ba75ab9ccb6bc2564d227 Mon Sep 17 00:00:00 2001
From: Matt Toohey <contact@matttoohey.com>
Date: Thu, 19 Feb 2026 16:02:52 -0800
Subject: [PATCH 3/3] refactor: extract reusable RepoLabel component with
 contrast styling
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Create a shared RepoLabel.svelte component that displays repo paths with
the last segment (repo name or subpath) in full contrast (--text-primary)
and preceding segments muted (--text-muted). This makes the most
distinguishing part of the path pop out visually.

The component accepts githubRepo and optional subpath props, splitting
the path to emphasize the final segment:
  block/staged       → 'block/' muted + 'staged' primary
  block/staged + ui  → 'block/staged/' muted + 'ui' primary

Refactored the data flow to pass structured {githubRepo, subpath} objects
instead of pre-formatted strings through repoLabelsByProject, enabling
the component to apply contrast styling at render time.

Updated all 5 locations where repo labels are displayed:
- BranchCardHeaderInfo (branch cards via ProjectSection)
- ProjectsList (project cards)
- ActionsPreferencesModal (action settings sidebar)
- RepoSearchInput (recent repos and search results)

Also fixes excludeRepos to correctly extract githubRepo for comparison
against nameWithOwner, and removes the now-unused contextLabel function
and context-repo/context-subpath CSS classes from ActionsPreferencesModal.
---
 .../lib/features/branches/BranchCard.svelte   |  2 +-
 .../branches/BranchCardHeaderInfo.svelte      |  7 ++-
 .../features/branches/RemoteBranchCard.svelte |  2 +-
 .../lib/features/projects/ProjectHome.svelte  | 30 +++++-----
 .../features/projects/ProjectSection.svelte   | 12 ++--
 .../lib/features/projects/ProjectsList.svelte | 25 ++++----
 .../features/projects/RepoSearchInput.svelte  | 12 +---
 .../settings/ActionsPreferencesModal.svelte   | 18 +-----
 staged/src/lib/shared/RepoLabel.svelte        | 60 +++++++++++++++++++
 9 files changed, 108 insertions(+), 60 deletions(-)
 create mode 100644 staged/src/lib/shared/RepoLabel.svelte

diff --git a/staged/src/lib/features/branches/BranchCard.svelte b/staged/src/lib/features/branches/BranchCard.svelte
index 468e83d..8d47adf 100644
--- a/staged/src/lib/features/branches/BranchCard.svelte
+++ b/staged/src/lib/features/branches/BranchCard.svelte
@@ -88,7 +88,7 @@
 
   interface Props {
     branch: Branch;
-    repoLabel?: string | null;
+    repoLabel?: { githubRepo: string; subpath: string | null } | null;
     deleting?: boolean;
     worktreeError?: string;
     onDelete?: () => void;
diff --git a/staged/src/lib/features/branches/BranchCardHeaderInfo.svelte b/staged/src/lib/features/branches/BranchCardHeaderInfo.svelte
index 0b87b51..2a766f0 100644
--- a/staged/src/lib/features/branches/BranchCardHeaderInfo.svelte
+++ b/staged/src/lib/features/branches/BranchCardHeaderInfo.svelte
@@ -1,9 +1,10 @@
 <script lang="ts">
   import { GitBranch } from 'lucide-svelte';
+  import RepoLabel from '../../shared/RepoLabel.svelte';
 
   interface Props {
     branchName: string;
-    repoLabel?: string | null;
+    repoLabel?: { githubRepo: string; subpath: string | null } | null;
     secondaryLabel?: string | null;
   }
 
@@ -12,7 +13,9 @@
 
 <div class="header-left">
   {#if repoLabel}
-    <span class="repo-name" title={repoLabel}>{repoLabel}</span>
+    <span class="repo-name"
+      ><RepoLabel githubRepo={repoLabel.githubRepo} subpath={repoLabel.subpath} /></span
+    >
     <div class="header-meta">
       <span class="branch-name">{branchName}</span>
       {#if secondaryLabel}
diff --git a/staged/src/lib/features/branches/RemoteBranchCard.svelte b/staged/src/lib/features/branches/RemoteBranchCard.svelte
index 1ddcdd5..4327f91 100644
--- a/staged/src/lib/features/branches/RemoteBranchCard.svelte
+++ b/staged/src/lib/features/branches/RemoteBranchCard.svelte
@@ -47,7 +47,7 @@
 
   interface Props {
     branch: Branch;
-    repoLabel?: string | null;
+    repoLabel?: { githubRepo: string; subpath: string | null } | null;
     deleting?: boolean;
     onDelete?: () => void;
     onRename?: (branchName: string) => void;
diff --git a/staged/src/lib/features/projects/ProjectHome.svelte b/staged/src/lib/features/projects/ProjectHome.svelte
index 0d3a4e2..b2c9794 100644
--- a/staged/src/lib/features/projects/ProjectHome.svelte
+++ b/staged/src/lib/features/projects/ProjectHome.svelte
@@ -30,7 +30,9 @@
   // Data
   let projects = $state<Project[]>([]);
   let branchesByProject = $state<Map<string, Branch[]>>(new Map());
-  let repoLabelsByProject = $state<Map<string, Map<string, string>>>(new Map());
+  let repoLabelsByProject = $state<
+    Map<string, Map<string, { githubRepo: string; subpath: string | null }>>
+  >(new Map());
   let loading = $state(true);
   let error = $state<string | null>(null);
   let loadGeneration = 0;
@@ -178,7 +180,10 @@
 
       // Seed maps so project sections can render immediately.
       const branchMap = new Map<string, Branch[]>();
-      const repoLabelMap = new Map<string, Map<string, string>>();
+      const repoLabelMap = new Map<
+        string,
+        Map<string, { githubRepo: string; subpath: string | null }>
+      >();
       for (const project of projectList) {
         branchMap.set(project.id, branchesByProject.get(project.id) || []);
         repoLabelMap.set(project.id, repoLabelsByProject.get(project.id) || new Map());
@@ -202,7 +207,7 @@
                   (repo) =>
                     [
                       repo.id,
-                      repo.subpath ? `${repo.githubRepo}/${repo.subpath}` : repo.githubRepo,
+                      { githubRepo: repo.githubRepo, subpath: repo.subpath ?? null },
                     ] as const
                 )
               )
@@ -330,10 +335,7 @@
       new Map(
         repos.map(
           (repo) =>
-            [
-              repo.id,
-              repo.subpath ? `${repo.githubRepo}/${repo.subpath}` : repo.githubRepo,
-            ] as const
+            [repo.id, { githubRepo: repo.githubRepo, subpath: repo.subpath ?? null }] as const
         )
       )
     );
@@ -442,10 +444,7 @@
         new Map(
           repos.map(
             (repo) =>
-              [
-                repo.id,
-                repo.subpath ? `${repo.githubRepo}/${repo.subpath}` : repo.githubRepo,
-              ] as const
+              [repo.id, { githubRepo: repo.githubRepo, subpath: repo.subpath ?? null }] as const
           )
         )
       );
@@ -653,10 +652,7 @@
           new Map(
             repos.map(
               (repo) =>
-                [
-                  repo.id,
-                  repo.subpath ? `${repo.githubRepo}/${repo.subpath}` : repo.githubRepo,
-                ] as const
+                [repo.id, { githubRepo: repo.githubRepo, subpath: repo.subpath ?? null }] as const
             )
           )
         );
@@ -793,7 +789,9 @@
               handleRenameBranch(branchId, project.id, branchName)}
             onWorkspaceStatusChange={(branchId, workspaceStatus) =>
               handleWorkspaceStatusChange(project.id, branchId, workspaceStatus)}
-            excludeRepos={new Set(repoLabelsByProject.get(project.id)?.values())}
+            excludeRepos={new Set(
+              [...(repoLabelsByProject.get(project.id)?.values() ?? [])].map((r) => r.githubRepo)
+            )}
             onRepoSelected={(nameWithOwner, subpath) =>
               handleRepoSelected(project.id, nameWithOwner, subpath)}
             onRetryWorktree={(branchId) => setupBranchWorktree(branchId, project.id)}
diff --git a/staged/src/lib/features/projects/ProjectSection.svelte b/staged/src/lib/features/projects/ProjectSection.svelte
index f799c69..b246278 100644
--- a/staged/src/lib/features/projects/ProjectSection.svelte
+++ b/staged/src/lib/features/projects/ProjectSection.svelte
@@ -16,7 +16,7 @@
   interface Props {
     project: Project;
     branches: Branch[];
-    repoLabelsById?: Map<string, string>;
+    repoLabelsById?: Map<string, { githubRepo: string; subpath: string | null }>;
     canAddRepo?: boolean;
     addRepoHint?: string | null;
     deleting?: boolean;
@@ -92,10 +92,12 @@
     return () => window.removeEventListener('pointerdown', onPointerDown);
   });
 
-  function repoLabelForBranch(branch: Branch): string | null {
-    const fallback = project.subpath
-      ? `${project.githubRepo}/${project.subpath}`
-      : project.githubRepo;
+  function repoLabelForBranch(
+    branch: Branch
+  ): { githubRepo: string; subpath: string | null } | null {
+    const fallback = project.githubRepo
+      ? { githubRepo: project.githubRepo, subpath: project.subpath ?? null }
+      : null;
     if (!branch.projectRepoId) return fallback;
     return repoLabelsById.get(branch.projectRepoId) ?? fallback;
   }
diff --git a/staged/src/lib/features/projects/ProjectsList.svelte b/staged/src/lib/features/projects/ProjectsList.svelte
index d1bd5c0..9f1dbdb 100644
--- a/staged/src/lib/features/projects/ProjectsList.svelte
+++ b/staged/src/lib/features/projects/ProjectsList.svelte
@@ -22,6 +22,7 @@
   import { getProjectStatus } from './projectStatus';
   import SplashScreen from './SplashScreen.svelte';
   import Spinner from '../../shared/Spinner.svelte';
+  import RepoLabel from '../../shared/RepoLabel.svelte';
   import { setHasProjects } from './projectsSidebarState.svelte';
 
   let projects = $state<Project[]>([]);
@@ -337,15 +338,16 @@
                   <div class="deleting-pill" role="status" aria-live="polite">Deleting…</div>
                 {/if}
                 <div class="repo">
-                  {repos.length > 0
-                    ? repos
-                        .map((r) => (r.subpath ? `${r.githubRepo}/${r.subpath}` : r.githubRepo))
-                        .join(', ')
-                    : project.githubRepo
-                      ? project.subpath
-                        ? `${project.githubRepo}/${project.subpath}`
-                        : project.githubRepo
-                      : 'No repo attached'}
+                  {#if repos.length > 0}
+                    {#each repos as r, i}
+                      {#if i > 0}<span class="repo-separator">, </span>{/if}
+                      <RepoLabel githubRepo={r.githubRepo} subpath={r.subpath} />
+                    {/each}
+                  {:else if project.githubRepo}
+                    <RepoLabel githubRepo={project.githubRepo} subpath={project.subpath} />
+                  {:else}
+                    No repo attached
+                  {/if}
                 </div>
               </button>
               <div class="card-location">
@@ -530,7 +532,6 @@
 
   .repo {
     margin-top: auto;
-    color: var(--text-primary);
     font-size: var(--size-sm);
     display: -webkit-box;
     -webkit-box-orient: vertical;
@@ -539,6 +540,10 @@
     overflow: hidden;
   }
 
+  .repo-separator {
+    color: var(--text-faint);
+  }
+
   .deleting-pill {
     width: fit-content;
     padding: 2px 8px;
diff --git a/staged/src/lib/features/projects/RepoSearchInput.svelte b/staged/src/lib/features/projects/RepoSearchInput.svelte
index b822ca0..db2973d 100644
--- a/staged/src/lib/features/projects/RepoSearchInput.svelte
+++ b/staged/src/lib/features/projects/RepoSearchInput.svelte
@@ -9,6 +9,7 @@
   import { onMount, onDestroy } from 'svelte';
   import { Search, Lock, Globe, Clock, Plus, Command } from 'lucide-svelte';
   import Spinner from '../../shared/Spinner.svelte';
+  import RepoLabel from '../../shared/RepoLabel.svelte';
   import * as commands from '../../commands';
   import type { GitHubRepo, RecentRepo } from '../../types';
 
@@ -278,9 +279,7 @@
             </div>
             <div class="repo-info">
               <span class="repo-name">
-                {recent.githubRepo}{#if recent.subpath}<span class="repo-subpath"
-                    >/{recent.subpath}</span
-                  >{/if}
+                <RepoLabel githubRepo={recent.githubRepo} subpath={recent.subpath} />
               </span>
             </div>
             {#if i < 3}
@@ -336,7 +335,7 @@
                 {/if}
               </div>
               <div class="repo-info">
-                <span class="repo-name">{repo.nameWithOwner}</span>
+                <span class="repo-name"><RepoLabel githubRepo={repo.nameWithOwner} /></span>
                 {#if repo.description}
                   <span class="repo-description">{repo.description}</span>
                 {/if}
@@ -484,11 +483,6 @@
     white-space: nowrap;
   }
 
-  .repo-subpath {
-    font-weight: 400;
-    color: var(--text-muted);
-  }
-
   .repo-description {
     font-size: var(--size-xs);
     color: var(--text-muted);
diff --git a/staged/src/lib/features/settings/ActionsPreferencesModal.svelte b/staged/src/lib/features/settings/ActionsPreferencesModal.svelte
index 181fc0c..0799a01 100644
--- a/staged/src/lib/features/settings/ActionsPreferencesModal.svelte
+++ b/staged/src/lib/features/settings/ActionsPreferencesModal.svelte
@@ -15,6 +15,7 @@
     Code2,
   } from 'lucide-svelte';
   import Spinner from '../../shared/Spinner.svelte';
+  import RepoLabel from '../../shared/RepoLabel.svelte';
   import type { ActionContext, ProjectAction } from '../../commands';
   import * as commands from '../../commands';
   import { detectRepoActions, type SuggestedAction, type ActionType } from '../actions/actions';
@@ -88,11 +89,6 @@
     loadActions();
   });
 
-  function contextLabel(context: ActionContext): string {
-    const repoName = context.githubRepo.split('/').pop() || context.githubRepo;
-    return context.subpath ? `${repoName}/${context.subpath}` : repoName;
-  }
-
   async function detectActions() {
     if (!selectedContext) return;
 
@@ -305,9 +301,7 @@
                 class:selected={context.id === selectedContextId}
                 onclick={() => (selectedContextId = context.id)}
               >
-                <span class="context-repo">{context.githubRepo}</span>{#if context.subpath}<span
-                    class="context-subpath">/{context.subpath}</span
-                  >{/if}
+                <RepoLabel githubRepo={context.githubRepo} subpath={context.subpath} />
               </button>
             {/each}
           </div>
@@ -522,14 +516,6 @@
     border-color: var(--border-muted);
   }
 
-  .context-repo {
-    color: var(--text-primary);
-  }
-
-  .context-subpath {
-    color: var(--text-muted);
-  }
-
   .loading-side,
   .empty-side,
   .empty-main,
diff --git a/staged/src/lib/shared/RepoLabel.svelte b/staged/src/lib/shared/RepoLabel.svelte
new file mode 100644
index 0000000..d2ae236
--- /dev/null
+++ b/staged/src/lib/shared/RepoLabel.svelte
@@ -0,0 +1,60 @@
+<!--
+  RepoLabel – reusable repo-path display with contrast styling.
+
+  The *last* path segment gets full contrast (--text-primary) while every
+  preceding segment is muted (--text-muted).  This makes the most
+  distinguishing part of the path pop out visually.
+
+  Examples:
+    githubRepo="block/staged"              → "block/" muted  + "staged" primary
+    githubRepo="block/staged" subpath="ui" → "block/staged/" muted + "ui" primary
+-->
+<script lang="ts">
+  interface Props {
+    githubRepo: string;
+    subpath?: string | null;
+  }
+
+  let { githubRepo, subpath = null }: Props = $props();
+
+  let prefix = $derived.by(() => {
+    if (subpath) {
+      return githubRepo + '/';
+    }
+    const idx = githubRepo.lastIndexOf('/');
+    return idx >= 0 ? githubRepo.slice(0, idx + 1) : '';
+  });
+
+  let emphasis = $derived.by(() => {
+    if (subpath) {
+      return subpath;
+    }
+    const idx = githubRepo.lastIndexOf('/');
+    return idx >= 0 ? githubRepo.slice(idx + 1) : githubRepo;
+  });
+
+  let fullLabel = $derived(subpath ? `${githubRepo}/${subpath}` : githubRepo);
+</script>
+
+<span class="repo-label" title={fullLabel}
+  >{#if prefix}<span class="repo-label-prefix">{prefix}</span>{/if}<span class="repo-label-emphasis"
+    >{emphasis}</span
+  ></span
+>
+
+<style>
+  .repo-label {
+    display: inline;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  .repo-label-prefix {
+    color: var(--text-muted);
+  }
+
+  .repo-label-emphasis {
+    color: var(--text-primary);
+  }
+</style>