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 {...@@ -5,7 +5,6 @@ import {
5 FolderGit2Icon,5 FolderGit2Icon,
6 FolderGitIcon,6 FolderGitIcon,
7 FolderIcon,7 FolderIcon,
8 HistoryIcon,
9 ScaleIcon,8 ScaleIcon,
10} from "lucide-react";9} from "lucide-react";
11import {10import {
...@@ -41,6 +40,7 @@ import {...@@ -41,6 +40,7 @@ import {
41} from "./BranchToolbarBranchSelector";40} from "./BranchToolbarBranchSelector";
42import { BranchToolbarEnvironmentSelector } from "./BranchToolbarEnvironmentSelector";41import { BranchToolbarEnvironmentSelector } from "./BranchToolbarEnvironmentSelector";
43import { BranchToolbarEnvModeSelector } from "./BranchToolbarEnvModeSelector";42import { BranchToolbarEnvModeSelector } from "./BranchToolbarEnvModeSelector";
43import { PreviousWorktreeItemContent } from "./PreviousWorktreeItemContent";
44import { ComposerControl } from "./chat/ComposerControl";44import { ComposerControl } from "./chat/ComposerControl";
45import {45import {
46 Menu,46 Menu,
...@@ -105,6 +105,7 @@ interface MobileRunContextSelectorProps {...@@ -105,6 +105,7 @@ interface MobileRunContextSelectorProps {
105 activeWorktreePath: string | null;105 activeWorktreePath: string | null;
106 onEnvModeChange: (mode: EnvMode) => void;106 onEnvModeChange: (mode: EnvMode) => void;
107 previousWorktreeLabel: string | null;107 previousWorktreeLabel: string | null;
108 previousWorktreeBranch: string | null;
108 onUsePreviousWorktree: () => void;109 onUsePreviousWorktree: () => void;
109}110}
110111
...@@ -123,6 +124,7 @@ const MobileRunContextSelector = memo(function MobileRunContextSelector({...@@ -123,6 +124,7 @@ const MobileRunContextSelector = memo(function MobileRunContextSelector({
123 activeWorktreePath,124 activeWorktreePath,
124 onEnvModeChange,125 onEnvModeChange,
125 previousWorktreeLabel,126 previousWorktreeLabel,
127 previousWorktreeBranch,
126 onUsePreviousWorktree,128 onUsePreviousWorktree,
127}: MobileRunContextSelectorProps) {129}: MobileRunContextSelectorProps) {
128 const composerFloatingLayerProps = useComposerMenuProps();130 const composerFloatingLayerProps = useComposerMenuProps();
...@@ -217,7 +219,12 @@ const MobileRunContextSelector = memo(function MobileRunContextSelector({...@@ -217,7 +219,12 @@ const MobileRunContextSelector = memo(function MobileRunContextSelector({
217 {triggerContent}219 {triggerContent}
218 <ChevronDownIcon className="size-3 shrink-0 opacity-50" />220 <ChevronDownIcon className="size-3 shrink-0 opacity-50" />
219 </MenuTrigger>221 </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 >
221 {showEnvironmentPicker && availableEnvironments && onEnvironmentChange ? (228 {showEnvironmentPicker && availableEnvironments && onEnvironmentChange ? (
222 <>229 <>
223 <MenuGroup>230 <MenuGroup>
...@@ -295,10 +302,7 @@ const MobileRunContextSelector = memo(function MobileRunContextSelector({...@@ -295,10 +302,7 @@ const MobileRunContextSelector = memo(function MobileRunContextSelector({
295 </MenuRadioItem>302 </MenuRadioItem>
296 {previousWorktreeLabel ? (303 {previousWorktreeLabel ? (
297 <MenuRadioItem disabled={envModeLocked} value="previous-worktree" closeOnClick>304 <MenuRadioItem disabled={envModeLocked} value="previous-worktree" closeOnClick>
298 <span className="flex min-w-0 items-center gap-1.5">305 <PreviousWorktreeItemContent branch={previousWorktreeBranch} />
299 <HistoryIcon className="size-3" />
300 <MiddleTruncate value={previousWorktreeLabel} />
301 </span>
302 </MenuRadioItem>306 </MenuRadioItem>
303 ) : null}307 ) : null}
304 </MenuRadioGroup>308 </MenuRadioGroup>
...@@ -630,6 +634,7 @@ export const BranchToolbar = memo(function BranchToolbar({...@@ -630,6 +634,7 @@ export const BranchToolbar = memo(function BranchToolbar({
630 activeWorktreePath={activeWorktreePath}634 activeWorktreePath={activeWorktreePath}
631 onEnvModeChange={onEnvModeChange}635 onEnvModeChange={onEnvModeChange}
632 previousWorktreeLabel={previousWorktreeLabel}636 previousWorktreeLabel={previousWorktreeLabel}
637 previousWorktreeBranch={previousWorktreeSeed?.branch ?? null}
633 onUsePreviousWorktree={onUsePreviousWorktree}638 onUsePreviousWorktree={onUsePreviousWorktree}
634 />639 />
635 </div>640 </div>
...@@ -669,6 +674,7 @@ export const BranchToolbar = memo(function BranchToolbar({...@@ -669,6 +674,7 @@ export const BranchToolbar = memo(function BranchToolbar({
669 activeWorktreePath={activeWorktreePath}674 activeWorktreePath={activeWorktreePath}
670 onEnvModeChange={onEnvModeChange}675 onEnvModeChange={onEnvModeChange}
671 previousWorktreeLabel={previousWorktreeLabel}676 previousWorktreeLabel={previousWorktreeLabel}
677 previousWorktreeBranch={previousWorktreeSeed?.branch ?? null}
672 onUsePreviousWorktree={onUsePreviousWorktree}678 onUsePreviousWorktree={onUsePreviousWorktree}
673 />679 />
674 ) : null}680 ) : null}
apps/web/src/components/BranchToolbarEnvModeSelector.tsx+10-6
...@@ -1,4 +1,4 @@...@@ -1,4 +1,4 @@
1import { FolderGit2Icon, FolderGitIcon, FolderIcon, HistoryIcon } from "lucide-react";1import { FolderGit2Icon, FolderGitIcon, FolderIcon } from "lucide-react";
2import { memo, useMemo } from "react";2import { memo, useMemo } from "react";
33
4import {4import {
...@@ -8,6 +8,7 @@ import {...@@ -8,6 +8,7 @@ import {
8 type EnvMode,8 type EnvMode,
9} from "./BranchToolbar.logic";9} from "./BranchToolbar.logic";
10import { useComposerMenuProps } from "./chat/composerEventScope";10import { useComposerMenuProps } from "./chat/composerEventScope";
11import { PreviousWorktreeItemContent } from "./PreviousWorktreeItemContent";
11import {12import {
12 Select,13 Select,
13 SelectGroup,14 SelectGroup,
...@@ -28,6 +29,7 @@ interface BranchToolbarEnvModeSelectorProps {...@@ -28,6 +29,7 @@ interface BranchToolbarEnvModeSelectorProps {
28 activeWorktreePath: string | null;29 activeWorktreePath: string | null;
29 onEnvModeChange: (mode: EnvMode) => void;30 onEnvModeChange: (mode: EnvMode) => void;
30 previousWorktreeLabel?: string | null;31 previousWorktreeLabel?: string | null;
32 previousWorktreeBranch?: string | null;
31 onUsePreviousWorktree?: () => void;33 onUsePreviousWorktree?: () => void;
32}34}
3335
...@@ -38,6 +40,7 @@ export const BranchToolbarEnvModeSelector = memo(function BranchToolbarEnvModeSe...@@ -38,6 +40,7 @@ export const BranchToolbarEnvModeSelector = memo(function BranchToolbarEnvModeSe
38 activeWorktreePath,40 activeWorktreePath,
39 onEnvModeChange,41 onEnvModeChange,
40 previousWorktreeLabel,42 previousWorktreeLabel,
43 previousWorktreeBranch = null,
41 onUsePreviousWorktree,44 onUsePreviousWorktree,
42}: BranchToolbarEnvModeSelectorProps) {45}: BranchToolbarEnvModeSelectorProps) {
43 const composerFloatingLayerProps = useComposerMenuProps();46 const composerFloatingLayerProps = useComposerMenuProps();
...@@ -142,7 +145,11 @@ export const BranchToolbarEnvModeSelector = memo(function BranchToolbarEnvModeSe...@@ -142,7 +145,11 @@ export const BranchToolbarEnvModeSelector = memo(function BranchToolbarEnvModeSe
142 : resolveCurrentWorkspaceLabel(activeWorktreePath)}145 : resolveCurrentWorkspaceLabel(activeWorktreePath)}
143 </TooltipPopup>146 </TooltipPopup>
144 </Tooltip>147 </Tooltip>
145 <SelectPopup alignItemWithTrigger={false} {...composerFloatingLayerProps}>148 <SelectPopup
149 alignItemWithTrigger={false}
150 className={showPreviousWorktree ? "w-[min(21rem,calc(100vw-2rem))]" : undefined}
151 {...composerFloatingLayerProps}
152 >
146 <SelectGroup>153 <SelectGroup>
147 <SelectGroupLabel>Workspace</SelectGroupLabel>154 <SelectGroupLabel>Workspace</SelectGroupLabel>
148 <SelectItem value="local">155 <SelectItem value="local">
...@@ -163,10 +170,7 @@ export const BranchToolbarEnvModeSelector = memo(function BranchToolbarEnvModeSe...@@ -163,10 +170,7 @@ export const BranchToolbarEnvModeSelector = memo(function BranchToolbarEnvModeSe
163 </SelectItem>170 </SelectItem>
164 {showPreviousWorktree && previousWorktreeLabel ? (171 {showPreviousWorktree && previousWorktreeLabel ? (
165 <SelectItem value={PREVIOUS_WORKTREE_SELECT_VALUE}>172 <SelectItem value={PREVIOUS_WORKTREE_SELECT_VALUE}>
166 <span className="inline-flex items-center gap-1.5">173 <PreviousWorktreeItemContent branch={previousWorktreeBranch} />
167 <HistoryIcon className="size-3" />
168 {previousWorktreeLabel}
169 </span>
170 </SelectItem>174 </SelectItem>
171 ) : null}175 ) : null}
172 </SelectGroup>176 </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}