authorgravatar for saiansh2525@gmail.comYash Singh <saiansh2525@gmail.com> 2026-09-23 18:24:23-05:00
committergravatar for noreply@github.comGitHub <noreply@github.com> 2026-09-23 18:24:23-05:00
logeffaab94e36992ea9712c2a56d5ff602a3cead04
tree11b71653a4466cb40e71f4ad634d8c924a05a949
parente407f9bb090d0cec231df21ad30e9e13186d9518
signature Signed by PGP key B5690EEEBB952194

fix(web): show previous worktree branch on second line (#13314)

3 files changed, 41 insertions(+), 12 deletions(-)

apps/web/src/components/BranchToolbar.tsx+12-6
......@@ -5,7 +5,6 @@ import {
55 FolderGit2Icon,
66 FolderGitIcon,
77 FolderIcon,
8 HistoryIcon,
98 ScaleIcon,
109} from "lucide-react";
1110import {
......@@ -41,6 +40,7 @@ import {
4140} from "./BranchToolbarBranchSelector";
4241import { BranchToolbarEnvironmentSelector } from "./BranchToolbarEnvironmentSelector";
4342import { BranchToolbarEnvModeSelector } from "./BranchToolbarEnvModeSelector";
43import { PreviousWorktreeItemContent } from "./PreviousWorktreeItemContent";
4444import { ComposerControl } from "./chat/ComposerControl";
4545import {
4646 Menu,
......@@ -105,6 +105,7 @@ interface MobileRunContextSelectorProps {
105105 activeWorktreePath: string | null;
106106 onEnvModeChange: (mode: EnvMode) => void;
107107 previousWorktreeLabel: string | null;
108 previousWorktreeBranch: string | null;
108109 onUsePreviousWorktree: () => void;
109110}
110111
......@@ -123,6 +124,7 @@ const MobileRunContextSelector = memo(function MobileRunContextSelector({
123124 activeWorktreePath,
124125 onEnvModeChange,
125126 previousWorktreeLabel,
127 previousWorktreeBranch,
126128 onUsePreviousWorktree,
127129}: MobileRunContextSelectorProps) {
128130 const composerFloatingLayerProps = useComposerMenuProps();
......@@ -217,7 +219,12 @@ const MobileRunContextSelector = memo(function MobileRunContextSelector({
217219 {triggerContent}
218220 <ChevronDownIcon className="size-3 shrink-0 opacity-50" />
219221 </MenuTrigger>
220 <MenuPopup align="start" side="top" {...composerFloatingLayerProps}>
222 <MenuPopup
223 align="start"
224 side="top"
225 className={previousWorktreeLabel ? "w-[min(21rem,calc(100vw-2rem))]" : undefined}
226 {...composerFloatingLayerProps}
227 >
221228 {showEnvironmentPicker && availableEnvironments && onEnvironmentChange ? (
222229 <>
223230 <MenuGroup>
......@@ -295,10 +302,7 @@ const MobileRunContextSelector = memo(function MobileRunContextSelector({
295302 </MenuRadioItem>
296303 {previousWorktreeLabel ? (
297304 <MenuRadioItem disabled={envModeLocked} value="previous-worktree" closeOnClick>
298 <span className="flex min-w-0 items-center gap-1.5">
299 <HistoryIcon className="size-3" />
300 <MiddleTruncate value={previousWorktreeLabel} />
301 </span>
305 <PreviousWorktreeItemContent branch={previousWorktreeBranch} />
302306 </MenuRadioItem>
303307 ) : null}
304308 </MenuRadioGroup>
......@@ -630,6 +634,7 @@ export const BranchToolbar = memo(function BranchToolbar({
630634 activeWorktreePath={activeWorktreePath}
631635 onEnvModeChange={onEnvModeChange}
632636 previousWorktreeLabel={previousWorktreeLabel}
637 previousWorktreeBranch={previousWorktreeSeed?.branch ?? null}
633638 onUsePreviousWorktree={onUsePreviousWorktree}
634639 />
635640 </div>
......@@ -669,6 +674,7 @@ export const BranchToolbar = memo(function BranchToolbar({
669674 activeWorktreePath={activeWorktreePath}
670675 onEnvModeChange={onEnvModeChange}
671676 previousWorktreeLabel={previousWorktreeLabel}
677 previousWorktreeBranch={previousWorktreeSeed?.branch ?? null}
672678 onUsePreviousWorktree={onUsePreviousWorktree}
673679 />
674680 ) : null}
apps/web/src/components/BranchToolbarEnvModeSelector.tsx+10-6
......@@ -1,4 +1,4 @@
1import { FolderGit2Icon, FolderGitIcon, FolderIcon, HistoryIcon } from "lucide-react";
1import { FolderGit2Icon, FolderGitIcon, FolderIcon } from "lucide-react";
22import { memo, useMemo } from "react";
33
44import {
......@@ -8,6 +8,7 @@ import {
88 type EnvMode,
99} from "./BranchToolbar.logic";
1010import { useComposerMenuProps } from "./chat/composerEventScope";
11import { PreviousWorktreeItemContent } from "./PreviousWorktreeItemContent";
1112import {
1213 Select,
1314 SelectGroup,
......@@ -28,6 +29,7 @@ interface BranchToolbarEnvModeSelectorProps {
2829 activeWorktreePath: string | null;
2930 onEnvModeChange: (mode: EnvMode) => void;
3031 previousWorktreeLabel?: string | null;
32 previousWorktreeBranch?: string | null;
3133 onUsePreviousWorktree?: () => void;
3234}
3335
......@@ -38,6 +40,7 @@ export const BranchToolbarEnvModeSelector = memo(function BranchToolbarEnvModeSe
3840 activeWorktreePath,
3941 onEnvModeChange,
4042 previousWorktreeLabel,
43 previousWorktreeBranch = null,
4144 onUsePreviousWorktree,
4245}: BranchToolbarEnvModeSelectorProps) {
4346 const composerFloatingLayerProps = useComposerMenuProps();
......@@ -142,7 +145,11 @@ export const BranchToolbarEnvModeSelector = memo(function BranchToolbarEnvModeSe
142145 : resolveCurrentWorkspaceLabel(activeWorktreePath)}
143146 </TooltipPopup>
144147 </Tooltip>
145 <SelectPopup alignItemWithTrigger={false} {...composerFloatingLayerProps}>
148 <SelectPopup
149 alignItemWithTrigger={false}
150 className={showPreviousWorktree ? "w-[min(21rem,calc(100vw-2rem))]" : undefined}
151 {...composerFloatingLayerProps}
152 >
146153 <SelectGroup>
147154 <SelectGroupLabel>Workspace</SelectGroupLabel>
148155 <SelectItem value="local">
......@@ -163,10 +170,7 @@ export const BranchToolbarEnvModeSelector = memo(function BranchToolbarEnvModeSe
163170 </SelectItem>
164171 {showPreviousWorktree && previousWorktreeLabel ? (
165172 <SelectItem value={PREVIOUS_WORKTREE_SELECT_VALUE}>
166 <span className="inline-flex items-center gap-1.5">
167 <HistoryIcon className="size-3" />
168 {previousWorktreeLabel}
169 </span>
173 <PreviousWorktreeItemContent branch={previousWorktreeBranch} />
170174 </SelectItem>
171175 ) : null}
172176 </SelectGroup>
apps/web/src/components/PreviousWorktreeItemContent.tsx created+19
......@@ -0,0 +1,19 @@
1import { HistoryIcon } from "lucide-react";
2
3import { MiddleTruncate } from "./ui/middle-truncate";
4
5export function PreviousWorktreeItemContent({ branch }: { branch: string | null }) {
6 return (
7 <span className="flex min-w-0 items-start gap-1.5">
8 <HistoryIcon className="mt-1 size-3" />
9 <span className="flex min-w-0 flex-col">
10 <span>Previous worktree</span>
11 {branch ? (
12 <span className="min-w-0 text-xs text-muted-foreground">
13 <MiddleTruncate value={branch} />
14 </span>
15 ) : null}
16 </span>
17 </span>
18 );
19}