SegmentControl in Branch Explorer does not receive selected styles

[rwaskiewicz]

Version

0.17.6

Operating System

macOS

Distribution Method

dmg (Mac OS - Apple Silicon)

Describe the issue

When GitButler is not connected to a forge, the "PRs" segment in the SegmentControl component does not appear (which is expected). However, selecting "local" after "all" is selected causes the UI to not completely update. The "local" segment does not receive any styling to indicate that it is selected.

How to reproduce (Optional)

1. Open GitButler with a repository whose forge has not been configured
2. Navigate to the Branches page
3. Note: Only "All" and "Local" should appear in the SegmentControl component
4. Click "All"
5. Observe: All branches are shown, the count pill updates, and the "All" Segment is receives styling that indicates it is selected
6. Click "Local"
7. Observe: Only local branches are shown, the count pill updates, but the "Local" Segment does not receive styling that indicates it is selected
8. Click "Local" (again)
9. Observe: Only local branches are shown, the count pill updates, but the "Local" Segment does receive styling that indicates it is selected

https://github.com/user-attachments/assets/d2d76cba-67fe-4b63-91ad-260200cf1f6c

Expected behavior (Optional)

When clicking "Local" the first time, the Segment should receive styling to indicate it is indeed the currently selected segment (on the first click)

Relevant log output (Optional)

None found (AFAICT)

[rwaskiewicz]

I believe this is the result of BranchExplorer not accounting for the repository's forge not being set. When filterOptions is set to a subset of BranchFilterOption (definition), it is not accounted for when the selected filter index is set.

Changing this behavior requires swapping out the values being iterated on, e.g.:

diff --git a/apps/desktop/src/components/BranchExplorer.svelte b/apps/desktop/src/components/BranchExplorer.svelte
index 5df314c00..c603ed805 100644
--- a/apps/desktop/src/components/BranchExplorer.svelte
+++ b/apps/desktop/src/components/BranchExplorer.svelte
@@ -129,7 +129,7 @@
 	});
 
 	const selectedFilterIndex = $derived.by(() => {
-		const index = BRANCH_FILTER_OPTIONS.findIndex((item) => selectedOption === item);
+		const index = Object.keys(filterOptions).findIndex((item) => selectedOption === item);
 		if (index === -1) return 0;
 		return index;
 	});

[Byron]

Thanks so much for reporting and the deep analysis of the issue - it's much appreciated!

Let me CC @PavelLaptev and @estib-vega for a fix :).