+
-
-
-
-
-
-
-
-
- Sort by {selectedSort.label}
-
-
-
- {Object.entries(SORT_OPTIONS).map(([value, option]) => {
- const Icon = option.icon
- const isSelected = value === sortBy
-
- return (
- setSortBy(value as typeof sortBy)}
- className="pr-7"
- >
-
- {option.label}
- {isSelected ? : null}
-
- )
- })}
-
-
)
})
diff --git a/src/renderer/src/components/sidebar/SidebarHeader.tsx b/src/renderer/src/components/sidebar/SidebarHeader.tsx
index c7d6d2261be..960b08cffa1 100644
--- a/src/renderer/src/components/sidebar/SidebarHeader.tsx
+++ b/src/renderer/src/components/sidebar/SidebarHeader.tsx
@@ -1,40 +1,130 @@
import React from 'react'
-import { Plus } from 'lucide-react'
+import { Plus, SlidersHorizontal } from 'lucide-react'
import { useAppStore } from '@/store'
import { Button } from '@/components/ui/button'
import { Tooltip, TooltipTrigger, TooltipContent } from '@/components/ui/tooltip'
+import {
+ DropdownMenu,
+ DropdownMenuContent,
+ DropdownMenuTrigger,
+ DropdownMenuCheckboxItem,
+ DropdownMenuLabel,
+ DropdownMenuSeparator,
+ DropdownMenuRadioGroup,
+ DropdownMenuRadioItem
+} from '@/components/ui/dropdown-menu'
+import type { WorktreeCardProperty } from '../../../../shared/types'
+
+const PROPERTY_OPTIONS: { id: WorktreeCardProperty; label: string }[] = [
+ { id: 'status', label: 'Terminal status' },
+ { id: 'unread', label: 'Unread indicator' },
+ { id: 'ci', label: 'CI checks' },
+ { id: 'issue', label: 'Linked issue' },
+ { id: 'pr', label: 'Linked PR' },
+ { id: 'comment', label: 'Comment' }
+]
+
+const SORT_OPTIONS = [
+ { id: 'name', label: 'Name' },
+ { id: 'recent', label: 'Recent' },
+ { id: 'repo', label: 'Repo' }
+] as const
+
+const isMac = navigator.userAgent.includes('Mac')
+const newWorktreeShortcutLabel = isMac ? '⌘N' : 'Ctrl+N'
const SidebarHeader = React.memo(function SidebarHeader() {
const openModal = useAppStore((s) => s.openModal)
const repos = useAppStore((s) => s.repos)
const canCreateWorktree = repos.length > 0
+ const worktreeCardProperties = useAppStore((s) => s.worktreeCardProperties)
+ const toggleWorktreeCardProperty = useAppStore((s) => s.toggleWorktreeCardProperty)
+ const sortBy = useAppStore((s) => s.sortBy)
+ const setSortBy = useAppStore((s) => s.setSortBy)
+
return (
Worktrees
-
-
-
-
-
- {canCreateWorktree ? 'New worktree (⌘N)' : 'Add a repo to create worktrees'}
-
-
+
+
+
+
+
+
+
+
+
+ View options
+
+
+
+ Sort by
+ setSortBy(v as typeof sortBy)}
+ >
+ {SORT_OPTIONS.map((opt) => (
+ e.preventDefault()}
+ >
+ {opt.label}
+
+ ))}
+
+
+
+ Show properties
+ {PROPERTY_OPTIONS.map((opt) => (
+ toggleWorktreeCardProperty(opt.id)}
+ onSelect={(e) => e.preventDefault()}
+ >
+ {opt.label}
+
+ ))}
+
+
+
+
+
+
+
+
+ {canCreateWorktree
+ ? `New worktree (${newWorktreeShortcutLabel})`
+ : 'Add a repo to create worktrees'}
+
+
+
)
})
diff --git a/src/renderer/src/components/sidebar/WorktreeCard.tsx b/src/renderer/src/components/sidebar/WorktreeCard.tsx
index 62c3d2e1dc5..9577d5d9a42 100644
--- a/src/renderer/src/components/sidebar/WorktreeCard.tsx
+++ b/src/renderer/src/components/sidebar/WorktreeCard.tsx
@@ -99,6 +99,7 @@ const WorktreeCard = React.memo(function WorktreeCard({
const updateWorktreeMeta = useAppStore((s) => s.updateWorktreeMeta)
const fetchPRForBranch = useAppStore((s) => s.fetchPRForBranch)
const fetchIssue = useAppStore((s) => s.fetchIssue)
+ const cardProps = useAppStore((s) => s.worktreeCardProperties)
const handleEditIssue = useCallback(
(e: React.MouseEvent) => {
e.stopPropagation()
@@ -166,18 +167,23 @@ const WorktreeCard = React.memo(function WorktreeCard({
return liveTabs.length > 0 ? 'active' : 'inactive'
}, [hasTerminals, tabs])
- // Fetch PR data on mount. The store handles freshness checks, and
- // activity-based refresh is triggered by setActiveWorktree + visibilitychange.
+ const showPR = cardProps.includes('pr')
+ const showCI = cardProps.includes('ci')
+ const showIssue = cardProps.includes('issue')
+
+ // Skip GitHub fetches when the corresponding card sections are hidden.
+ // This preference is purely presentational, so background refreshes would
+ // spend rate limit budget on data the user cannot see.
useEffect(() => {
- if (repo && !worktree.isBare && prCacheKey) {
+ if (repo && !worktree.isBare && prCacheKey && (showPR || showCI)) {
fetchPRForBranch(repo.path, branch)
}
- }, [repo, worktree.isBare, fetchPRForBranch, branch, prCacheKey])
+ }, [repo, worktree.isBare, fetchPRForBranch, branch, prCacheKey, showPR, showCI])
- // Fetch issue data on mount + background poll as safety net.
- // Primary refresh comes from setActiveWorktree + visibilitychange.
+ // Same rationale for issues: once that section is hidden, polling only burns
+ // GitHub calls and keeps stale-but-invisible data warm for no user benefit.
useEffect(() => {
- if (!repo || !worktree.linkedIssue || !issueCacheKey) {
+ if (!repo || !worktree.linkedIssue || !issueCacheKey || !showIssue) {
return
}
@@ -189,7 +195,7 @@ const WorktreeCard = React.memo(function WorktreeCard({
}, 5 * 60_000) // 5 minutes
return () => clearInterval(interval)
- }, [repo, worktree.linkedIssue, fetchIssue, issueCacheKey])
+ }, [repo, worktree.linkedIssue, fetchIssue, issueCacheKey, showIssue])
// Stable click handler – ignore clicks that are really text selections
const handleClick = useCallback(() => {
@@ -244,33 +250,37 @@ const WorktreeCard = React.memo(function WorktreeCard({
)}
{/* Status indicator on the left */}
-
-
+ {(cardProps.includes('status') || cardProps.includes('unread')) && (
+
+ {cardProps.includes('status') && }
-
-
-
-
-
- {unreadTooltip}
-
-
-
+ {cardProps.includes('unread') && (
+
+
+
+
+
+ {unreadTooltip}
+
+
+ )}
+
+ )}
{/* Content area */}
@@ -281,8 +291,8 @@ const WorktreeCard = React.memo(function WorktreeCard({
{/* CI Checks & PR state on the right */}
-
- {pr && pr.checksStatus !== 'neutral' && (
+ {cardProps.includes('ci') && pr && pr.checksStatus !== 'neutral' && (
+
@@ -301,8 +311,8 @@ const WorktreeCard = React.memo(function WorktreeCard({
CI checks {checksLabel(pr.checksStatus).toLowerCase()}
- )}
-
+
+ )}