fix(desktop): only show ports in sidebar when actively in use

[Kitenite]

Summary

• Static ports from ports.json were always displayed in the sidebar even when not running, adding visual clutter
• Now ports only appear when detected by the port scanner, with static config used solely as a label lookup for active ports
• Workspace groups with no active ports are filtered out entirely

Changes

• merge-ports.ts: Simplified merge logic to iterate only over dynamically detected ports. Static ports serve as a label source rather than always being shown. Removed the two-pass approach (static-first, then dynamic-only) in favor of a single pass over active ports with static label lookup.
• usePortsData.ts: Added .filter() to remove workspace groups with zero active ports, preventing empty workspace sections in the sidebar.

Test Plan

• Configure ports.json with static port entries — verify they do not appear in the sidebar when nothing is running on those ports
• Start a dev server on a port listed in ports.json — verify it appears with the configured label
• Start a dev server on a port not in ports.json — verify it still appears (dynamic-only, no label)
• Stop the dev server — verify the port disappears from the sidebar
• Verify workspaces with no active ports don't show an empty group header

Summary by CodeRabbit

• Bug Fixes
  • Port list now displays only workspaces containing active ports.
  • Improved port merging logic to correctly prioritize active ports.
  • Workspaces in the port list are sorted alphabetically by name.

[coderabbitai]

📝 Walkthrough

Walkthrough

Two utility functions in the PortsList component refactored: filtering and sorting logic to exclude empty port groups by workspace, and reordering the port merging strategy to prioritize dynamic ports while using static configuration as secondary source.

Changes

Cohort / File(s)	Summary
Port Data Processing apps/desktop/.../PortsList/hooks/usePortsData.ts, apps/desktop/.../PortsList/utils/merge-ports.ts	Filtering now excludes workspace port groups with zero ports; sorting updated. Port merge strategy changed from static-first to dynamic-first: iterates active dynamic ports, looks up corresponding static config by port number, and constructs merged objects with dynamic data as primary source; removed separate pass for dynamic-only entries; all merged ports marked isActive as true.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Possibly related PRs

• #683: Directly modifies merge-ports.ts merging logic, core overlap with this PR's dynamic-first refactor.
• #1479: Modifies the same usePortsData hook affecting port data subscription and processing.
• #462: Introduced the ports feature and PortsList UI infrastructure that these utilities now serve.

Poem

🐰 Dynamic ports bounce first, now filtering the way,
Static whispers follow, in perfect array,
Empty workspaces fade, only busy ones stay,
Merged and sorted sweetly—hop hop hooray! 🎉

🚥 Pre-merge checks | ✅ 2 | ❌ 2

❌ Failed checks (2 warnings)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 50.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.
Merge Conflict Detection	⚠️ Warning	❌ Merge conflicts detected (4 files): ⚔️ .superset/setup.sh (content) ⚔️ apps/desktop/src/renderer/screens/main/components/WorkspaceSidebar/PortsList/hooks/usePortsData.ts (content) ⚔️ apps/desktop/src/renderer/screens/main/components/WorkspaceSidebar/PortsList/utils/merge-ports.ts (content) ⚔️ bun.lock (content) These conflicts must be resolved before merging into main.	Resolve conflicts locally and push changes to this branch.

✅ Passed checks (2 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly and specifically describes the main change: ports should only display when actively in use, which is the primary behavioral change across both modified files.
Description check	✅ Passed	The description comprehensively covers the PR intent with clear sections addressing summary, changes, and a detailed test plan that aligns with the template structure.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing touches

• 📝 Generate docstrings

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch kitenite/if-ports-arent-being-used-dont-show-the-override

⚔️ Resolve merge conflicts (beta)

• Auto-commit resolved conflicts to branch kitenite/if-ports-arent-being-used-dont-show-the-override
• Create stacked PR with resolved conflicts
• Post resolved changes as copyable diffs in a comment

---

No actionable comments were generated in the recent review. 🎉

🧹 Recent nitpick comments

apps/desktop/src/renderer/screens/main/components/WorkspaceSidebar/PortsList/hooks/usePortsData.ts (1)

80-92: allWorkspaceIds now collects static-only workspace IDs that will always produce empty groups.

Since mergePorts only returns dynamically detected ports, any workspace ID sourced exclusively from allStaticPortsData.ports (line 83-85) will yield an empty ports array, only to be filtered out at line 119. You could simplify this memo to derive IDs from ports (dynamic) alone, avoiding the unnecessary merge iterations.

♻️ Optional simplification

 const allWorkspaceIds = useMemo(() => {
 	const ids = new Set<string>();
-
-	for (const port of allStaticPortsData?.ports ?? []) {
-		ids.add(port.workspaceId);
-	}
-
 	for (const port of ports) {
 		ids.add(port.workspaceId);
 	}
-
 	return Array.from(ids);
-}, [allStaticPortsData?.ports, ports]);
+}, [ports]);

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[github-actions]

🧹 Preview Cleanup Complete

The following preview resources have been cleaned up:

• ✅ Neon database branch
• ✅ Electric Fly.io app
• ✅ Streams Fly.io app

Thank you for your contribution! 🎉