BuzzbeeSCD/openchamber
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(session): enhance BranchPickerDialog with improved layout and new worktree session description

Browse Source
This commit is contained in:
Bohdan Triapitsyn
2026-01-17 22:15:28 +02:00
parent 7aa4d79b1d
commit 1ce24d474c
2 changed files with 121 additions and 118 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/ui/src/components/session/SessionSidebar.tsx
+40 -41
View File
@@ -176,6 +176,8 @@ const SortableProjectItem: React.FC<SortableProjectItemProps> = ({
isDragging,
} = useSortable({ id });
const [isMenuOpen, setIsMenuOpen] = React.useState(false);
return (
<div ref={setNodeRef} className={cn('relative', isDragging && 'opacity-40')}>
{/* Sentinel for sticky detection */}
@@ -191,7 +193,7 @@ const SortableProjectItem: React.FC<SortableProjectItemProps> = ({
{/* Project header - sticky like workspace groups */}
<div
className={cn(
'sticky top-0 z-10 pt-2 pb-1.5 w-full text-left cursor-pointer group/project border-b',
'sticky top-0 z-10 pt-2 pb-1.5 w-full text-left cursor-pointer group/project border-b select-none',
!isDesktopRuntime && 'bg-sidebar',
)}
style={{
@@ -206,6 +208,10 @@ const SortableProjectItem: React.FC<SortableProjectItemProps> = ({
}}
onMouseEnter={() => onHoverChange(true)}
onMouseLeave={() => onHoverChange(false)}
onContextMenu={(event) => {
event.preventDefault();
setIsMenuOpen(true);
}}
>
<div className="relative flex items-center gap-1 px-1" {...attributes}>
{/* Project name with tooltip for path - draggable */}
@@ -231,7 +237,10 @@ const SortableProjectItem: React.FC<SortableProjectItemProps> = ({
</Tooltip>
{/* Project menu */}
<DropdownMenu>
<DropdownMenu
open={isMenuOpen}
onOpenChange={setIsMenuOpen}
>
<DropdownMenuTrigger asChild>
<button
type="button"
@@ -246,6 +255,24 @@ const SortableProjectItem: React.FC<SortableProjectItemProps> = ({
</button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end" className="min-w-[180px]">
{isRepo && !hideDirectoryControls && settingsAutoCreateWorktree && onNewSession && (
<DropdownMenuItem onClick={onNewSession}>
<RiAddLine className="mr-1.5 h-4 w-4" />
New Session
</DropdownMenuItem>
)}
{isRepo && !hideDirectoryControls && !settingsAutoCreateWorktree && onNewWorktreeSession && (
<DropdownMenuItem onClick={onNewWorktreeSession}>
<RiGitBranchLine className="mr-1.5 h-4 w-4" />
New Session in Worktree
</DropdownMenuItem>
)}
{isRepo && !hideDirectoryControls && onOpenBranchPicker && (
<DropdownMenuItem onClick={onOpenBranchPicker}>
<RiGitRepositoryLine className="mr-1.5 h-4 w-4" />
Browse Branches
</DropdownMenuItem>
)}
{isRepo && !hideDirectoryControls && (
<DropdownMenuItem onClick={onOpenMultiRunLauncher}>
<ArrowsMerge className="mr-1.5 h-4 w-4" />
@@ -262,7 +289,7 @@ const SortableProjectItem: React.FC<SortableProjectItemProps> = ({
</DropdownMenuContent>
</DropdownMenu>
{isRepo && !hideDirectoryControls && onNewWorktreeSession && !settingsAutoCreateWorktree && (
{isRepo && !hideDirectoryControls && onNewWorktreeSession && settingsAutoCreateWorktree && (
<Tooltip>
<TooltipTrigger asChild>
<button
@@ -272,8 +299,8 @@ const SortableProjectItem: React.FC<SortableProjectItemProps> = ({
onNewWorktreeSession();
}}
className={cn(
'inline-flex h-6 w-6 items-center justify-center rounded-md text-muted-foreground transition-opacity focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/50 hover:text-foreground flex-shrink-0',
mobileVariant ? 'opacity-70' : 'opacity-0 group-hover/project:opacity-100',
'inline-flex h-6 w-6 items-center justify-center rounded-md text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/50 hover:text-foreground flex-shrink-0',
mobileVariant ? 'opacity-70' : 'opacity-100',
)}
aria-label="New session in worktree"
>
@@ -285,47 +312,26 @@ const SortableProjectItem: React.FC<SortableProjectItemProps> = ({
</TooltipContent>
</Tooltip>
)}
{isRepo && !hideDirectoryControls && onOpenBranchPicker && (
<Tooltip delayDuration={700}>
{(!settingsAutoCreateWorktree || !isRepo) && (
<Tooltip>
<TooltipTrigger asChild>
<button
type="button"
onClick={(e) => {
e.stopPropagation();
onOpenBranchPicker();
onNewSession();
}}
className={cn(
'inline-flex h-6 w-6 items-center justify-center text-muted-foreground hover:text-foreground flex-shrink-0 rounded-md focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/50 transition-opacity',
mobileVariant ? 'opacity-70' : 'opacity-0 group-hover/project:opacity-100',
)}
aria-label="Browse branches"
className="inline-flex h-6 w-6 items-center justify-center text-muted-foreground hover:text-foreground flex-shrink-0 rounded-md focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/50"
aria-label="New session"
>
<RiGitRepositoryLine className="h-4 w-4" />
<RiAddLine className="h-4 w-4" />
</button>
</TooltipTrigger>
<TooltipContent side="bottom" sideOffset={4}>
<p>Browse branches</p>
<p>New session</p>
</TooltipContent>
</Tooltip>
)}
<Tooltip>
<TooltipTrigger asChild>
<button
type="button"
onClick={(e) => {
e.stopPropagation();
onNewSession();
}}
className="inline-flex h-6 w-6 items-center justify-center text-muted-foreground hover:text-foreground flex-shrink-0 rounded-md focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/50"
aria-label="New session"
>
<RiAddLine className="h-4 w-4" />
</button>
</TooltipTrigger>
<TooltipContent side="bottom" sideOffset={4}>
<p>New session</p>
</TooltipContent>
</Tooltip>
</div>
</div>
@@ -357,9 +363,6 @@ const ProjectDragOverlay: React.FC<ProjectDragOverlayProps> = ({
)}>
{projectLabel}
</span>
<span className="inline-flex h-6 w-6 items-center justify-center text-muted-foreground ml-auto">
<RiAddLine className="h-4 w-4" />
</span>
</div>
</div>
);
@@ -1605,11 +1608,7 @@ export const SessionSidebar: React.FC<SessionSidebarProps> = ({
if (mobileVariant) {
setSessionSwitcherOpen(false);
}
if (settingsAutoCreateWorktree && isRepo) {
createWorktreeSession();
} else {
openNewSessionDraft({ directoryOverride: project.normalizedPath });
}
openNewSessionDraft({ directoryOverride: project.normalizedPath });
}}
onNewWorktreeSession={() => {
if (projectKey !== activeProjectId) {