Skip to content

feat(desktop): show PR state as sidebar workspace icon#3694

Merged
Kitenite merged 3 commits into
mainfrom
nutritious-pot
Apr 24, 2026
Merged

feat(desktop): show PR state as sidebar workspace icon#3694
Kitenite merged 3 commits into
mainfrom
nutritious-pot

Conversation

@Kitenite
Copy link
Copy Markdown
Collaborator

@Kitenite Kitenite commented Apr 24, 2026

Summary

  • Replace the host-type icon in the v2 dashboard sidebar with a PR state icon (open/merged/closed/draft) colored by state when the workspace has a PR; falls back to the host icon otherwise.
  • Clicking the icon opens the PR on GitHub (same behavior the old status badge had). The bottom-right PR badge has been removed since it's now redundant.
  • Diff stats (+N -M) only colorize green/red when the workspace is active; inactive rows use muted text with no pill background.

Test plan

  • Workspace with an open PR shows a green pull-request icon; clicking opens the PR URL.
  • Merged PR shows purple merge icon; closed shows red dot; draft shows muted draft icon.
  • Workspace with no PR still shows the local-device dot / cloud / cloud-off icon and tooltip.
  • Inactive rows have muted +/- numbers and transparent background; active row has colored numbers.
  • Clicking the PR icon does not also trigger the row's workspace click.

Summary by cubic

Show PR state as the workspace icon in the sidebar, color-coded by state, and open the PR on click. Removes the old PR badge and makes diff stats only colorize for the active workspace.

  • New Features

    • PR icon replaces host icon when a PR exists (open/merged/closed/draft); clicking opens GitHub; falls back to host icon otherwise.
    • Tooltip shows “PR # — ” with a “Click to open on GitHub” hint; otherwise shows host details.
  • Bug Fixes

    • Prevent Enter/Space on the PR icon from triggering the row click.
    • Show hover highlight on the PR icon even when the row is active, and use human-friendly state labels in the tooltip.

Written for commit 5955928. Summary will update on new commits.

Summary by CodeRabbit

  • New Features

    • Pull request indicator in the workspace sidebar is now clickable and keyboard-accessible to open the PR on GitHub.
  • UI Changes

    • Sidebar shows PR-specific icon, color and tooltip ("PR #… — " and "Click to open on GitHub") when a PR exists; workspace status badge is hidden in that case.
    • Workspace diff stats styling simplified; additions/deletions use emphasized colors when active.

Replace the host-type icon in the v2 dashboard sidebar with a PR state
icon (open/merged/closed/draft), colored by state, when a workspace has
an associated pull request. Clicking the icon opens the PR on GitHub.
Drop the now-redundant bottom-right PR badge, and make the diff stats
only colorize when the workspace is active.
@coderabbitai
Copy link
Copy Markdown
Contributor

coderabbitai Bot commented Apr 24, 2026

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 9602b90e-6bef-472f-ae4e-66295f870bf7

📥 Commits

Reviewing files that changed from the base of the PR and between 5443909 and 5955928.

📒 Files selected for processing (1)
  • apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/DashboardSidebar/components/DashboardSidebarWorkspaceItem/components/DashboardSidebarWorkspaceDiffStats/DashboardSidebarWorkspaceDiffStats.tsx
🚧 Files skipped from review as they are similar to previous changes (1)
  • apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/DashboardSidebar/components/DashboardSidebarWorkspaceItem/components/DashboardSidebarWorkspaceDiffStats/DashboardSidebarWorkspaceDiffStats.tsx

📝 Walkthrough

Walkthrough

Expanded workspace row and icon components now surface pull request state, render PR-specific icons/colors, and let users open PR URLs via an Electron TRPC mutation; diff-stats styling was simplified.

Changes

Cohort / File(s) Summary
Expanded workspace row
apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/DashboardSidebar/components/DashboardSidebarWorkspaceItem/components/DashboardSidebarExpandedWorkspaceRow/DashboardSidebarExpandedWorkspaceRow.tsx
Adds a clickable PR icon/button (stops event propagation, supports Enter/Space), creates/uses electronTrpc.external.openUrl mutation to open pullRequest.url, switches tooltip to PR-specific copy, and omits the separate status badge when a pullRequest exists.
Workspace icon
apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/DashboardSidebar/components/DashboardSidebarWorkspaceItem/components/DashboardSidebarWorkspaceIcon/DashboardSidebarWorkspaceIcon.tsx
Adds optional `pullRequestState?: ...
Diff stats styling
apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/DashboardSidebar/components/DashboardSidebarWorkspaceItem/components/DashboardSidebarWorkspaceDiffStats/DashboardSidebarWorkspaceDiffStats.tsx
Removes cn usage and conditional wrapper classes; standardizes outer classes and moves isActive-dependent color logic to additions/deletions text.

Sequence Diagram(s)

sequenceDiagram
    participant User
    participant Renderer as ExpandedWorkspaceRow (renderer)
    participant TRPC as electronTrpc.external (client)
    participant Main as Electron Main

    User->>Renderer: Click PR icon / press Enter or Space
    Renderer->>Renderer: stopPropagation(), handleKeyboard()
    Renderer->>TRPC: mutation.openUrl({ url: pullRequest.url })
    TRPC->>Main: IPC request to open external URL
    Main->>Main: open external browser to pullRequest.url
    Main-->>TRPC: IPC response
    TRPC-->>Renderer: mutation result
Loading

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Poem

🐰 A tiny PR hops into view,
Click the badge — off to GitHub you flew,
Icons change color, states now sing,
Diffs stay tidy, neat as spring,
I nibble code and hum anew.

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Write docstrings for the functions missing them to satisfy the coverage threshold.
✅ Passed checks (4 passed)
Check name Status Explanation
Title check ✅ Passed The title clearly summarizes the main change: adding PR state visibility as the workspace icon in the sidebar, which is the primary focus of the changeset.
Description check ✅ Passed The description includes a comprehensive summary of changes, test plan, and additional context, though it deviates from the template structure by using a custom format instead of the required template sections.
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.

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

✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch nutritious-pot

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

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

@greptile-apps
Copy link
Copy Markdown

greptile-apps Bot commented Apr 24, 2026

Greptile Summary

This PR replaces the host-type icon in the expanded dashboard sidebar row with a PR-state icon (open/merged/closed/draft) coloured by state when a PR exists, and removes the now-redundant bottom-right DashboardSidebarWorkspaceStatusBadge. Diff stats are also updated so that +/- colours only appear on the active row, with inactive rows falling back to muted text and no pill background. The DashboardSidebarWorkspaceStatusBadge component file is no longer imported anywhere and can be deleted as a follow-up cleanup.

Confidence Score: 5/5

Safe to merge; all remaining findings are minor cosmetic P2 suggestions.

The logic is correct — all four PR states are handled, event propagation is stopped, the fallback host icon path is preserved, and the diff-stat colour change is intentional. The two inline comments are purely cosmetic (hover token visibility on active rows, and tooltip capitalisation); neither is a functional defect.

No files require special attention. As a follow-up, DashboardSidebarWorkspaceStatusBadge (and its index.ts barrel) can be deleted since it is no longer imported anywhere.

Important Files Changed

Filename Overview
apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/DashboardSidebar/components/DashboardSidebarWorkspaceItem/components/DashboardSidebarExpandedWorkspaceRow/DashboardSidebarExpandedWorkspaceRow.tsx Replaces the host-type icon with a clickable PR-state icon (button) when a PR exists; removes the bottom-right StatusBadge; minor UX gap: hover state on the PR button is invisible when the row is active.
apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/DashboardSidebar/components/DashboardSidebarWorkspaceItem/components/DashboardSidebarWorkspaceIcon/DashboardSidebarWorkspaceIcon.tsx Adds pullRequestState prop and PR_ICON_BY_STATE/PR_COLOR_BY_STATE lookup tables; renames renderHostIconrenderPrimaryIcon; logic is correct and all four PR states are handled.
apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/DashboardSidebar/components/DashboardSidebarWorkspaceItem/components/DashboardSidebarWorkspaceDiffStats/DashboardSidebarWorkspaceDiffStats.tsx Removes the conditional pill background and makes +/- text color conditional on isActive; cn import correctly removed; change matches the PR description.
Prompt To Fix All With AI
This is a comment left during a code review.
Path: apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/DashboardSidebar/components/DashboardSidebarWorkspaceItem/components/DashboardSidebarExpandedWorkspaceRow/DashboardSidebarExpandedWorkspaceRow.tsx
Line: 132

Comment:
**No hover feedback on active rows**

The PR icon button uses `hover:bg-muted`, but active rows already have `bg-muted` as their row background — so hovering the button on an active row produces no visual change. Consider using a slightly stronger hover token (e.g. `hover:bg-foreground/10`) so the button hitbox is still visible when the row is active.

```suggestion
className="relative mr-2.5 flex size-5 shrink-0 cursor-pointer items-center justify-center rounded hover:bg-foreground/10"
```

How can I resolve this? If you propose a fix, please make it concise.

---

This is a comment left during a code review.
Path: apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/DashboardSidebar/components/DashboardSidebarWorkspaceItem/components/DashboardSidebarExpandedWorkspaceRow/DashboardSidebarExpandedWorkspaceRow.tsx
Line: 162-163

Comment:
**PR state displayed raw/lowercase in tooltip**

The tooltip renders `{pullRequest.state}` directly (e.g. "open", "closed", "draft"), which shows lowercase internal enum values to users. Consider capitalising or mapping these to human-friendly labels to match the polished copy used elsewhere in the UI (e.g. "Open", "Merged", "Closed", "Draft").

How can I resolve this? If you propose a fix, please make it concise.

Reviews (1): Last reviewed commit: "feat(desktop): show PR state as sidebar ..." | Re-trigger Greptile

openUrl.mutate(pullRequest.url);
}}
aria-label={`Open pull request #${pullRequest.number}`}
className="relative mr-2.5 flex size-5 shrink-0 cursor-pointer items-center justify-center rounded hover:bg-muted"
Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

P2 No hover feedback on active rows

The PR icon button uses hover:bg-muted, but active rows already have bg-muted as their row background — so hovering the button on an active row produces no visual change. Consider using a slightly stronger hover token (e.g. hover:bg-foreground/10) so the button hitbox is still visible when the row is active.

Suggested change
className="relative mr-2.5 flex size-5 shrink-0 cursor-pointer items-center justify-center rounded hover:bg-muted"
className="relative mr-2.5 flex size-5 shrink-0 cursor-pointer items-center justify-center rounded hover:bg-foreground/10"
Prompt To Fix With AI
This is a comment left during a code review.
Path: apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/DashboardSidebar/components/DashboardSidebarWorkspaceItem/components/DashboardSidebarExpandedWorkspaceRow/DashboardSidebarExpandedWorkspaceRow.tsx
Line: 132

Comment:
**No hover feedback on active rows**

The PR icon button uses `hover:bg-muted`, but active rows already have `bg-muted` as their row background — so hovering the button on an active row produces no visual change. Consider using a slightly stronger hover token (e.g. `hover:bg-foreground/10`) so the button hitbox is still visible when the row is active.

```suggestion
className="relative mr-2.5 flex size-5 shrink-0 cursor-pointer items-center justify-center rounded hover:bg-foreground/10"
```

How can I resolve this? If you propose a fix, please make it concise.

Comment on lines +162 to +163
PR #{pullRequest.number} — {pullRequest.state}
</p>
Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

P2 PR state displayed raw/lowercase in tooltip

The tooltip renders {pullRequest.state} directly (e.g. "open", "closed", "draft"), which shows lowercase internal enum values to users. Consider capitalising or mapping these to human-friendly labels to match the polished copy used elsewhere in the UI (e.g. "Open", "Merged", "Closed", "Draft").

Prompt To Fix With AI
This is a comment left during a code review.
Path: apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/DashboardSidebar/components/DashboardSidebarWorkspaceItem/components/DashboardSidebarExpandedWorkspaceRow/DashboardSidebarExpandedWorkspaceRow.tsx
Line: 162-163

Comment:
**PR state displayed raw/lowercase in tooltip**

The tooltip renders `{pullRequest.state}` directly (e.g. "open", "closed", "draft"), which shows lowercase internal enum values to users. Consider capitalising or mapping these to human-friendly labels to match the polished copy used elsewhere in the UI (e.g. "Open", "Merged", "Closed", "Draft").

How can I resolve this? If you propose a fix, please make it concise.

Note: If this suggestion doesn't match your team's coding style, reply to this and let me know. I'll remember it for next time!

Copy link
Copy Markdown
Contributor

@coderabbitai coderabbitai Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🧹 Nitpick comments (3)
apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/DashboardSidebar/components/DashboardSidebarWorkspaceItem/components/DashboardSidebarWorkspaceDiffStats/DashboardSidebarWorkspaceDiffStats.tsx (1)

14-14: Minor: leftover rounded px-1.5 no longer serves a purpose.

Now that the conditional background has been removed, rounded and px-1.5 have no visual effect (no border, no background). Consider dropping them to keep the container classes honest, or keep px-1.5 only if you rely on the horizontal inset for layout.

♻️ Proposed tidy-up
-			className="flex h-5 w-fit shrink-0 items-center justify-self-end rounded px-1.5 text-[10px] font-mono tabular-nums transition-[opacity,visibility] group-hover:opacity-0 group-hover:invisible"
+			className="flex h-5 w-fit shrink-0 items-center justify-self-end text-[10px] font-mono tabular-nums transition-[opacity,visibility] group-hover:opacity-0 group-hover:invisible"
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In
`@apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/DashboardSidebar/components/DashboardSidebarWorkspaceItem/components/DashboardSidebarWorkspaceDiffStats/DashboardSidebarWorkspaceDiffStats.tsx`
at line 14, In DashboardSidebarWorkspaceDiffStats (the component in
DashboardSidebarWorkspaceDiffStats.tsx) remove the now-unused Tailwind utilities
"rounded" and "px-1.5" from the className string on the container since the
conditional background was removed; if horizontal padding is required for layout
keep only "px-1.5", otherwise drop both to keep the class list honest and
minimal.
apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/DashboardSidebar/components/DashboardSidebarWorkspaceItem/components/DashboardSidebarExpandedWorkspaceRow/DashboardSidebarExpandedWorkspaceRow.tsx (1)

159-167: Consider formatting the raw PR state in the tooltip.

pullRequest.state is rendered directly (e.g. PR #123 — open / PR #123 — draft). A capitalized/humanized form (Open, Draft, Merged, Closed) would read more naturally in a tooltip.

✨ Proposed refactor
-								<p className="text-xs font-medium">
-									PR #{pullRequest.number} — {pullRequest.state}
-								</p>
+								<p className="text-xs font-medium">
+									PR #{pullRequest.number} —{" "}
+									{pullRequest.state.charAt(0).toUpperCase() +
+										pullRequest.state.slice(1)}
+								</p>
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In
`@apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/DashboardSidebar/components/DashboardSidebarWorkspaceItem/components/DashboardSidebarExpandedWorkspaceRow/DashboardSidebarExpandedWorkspaceRow.tsx`
around lines 159 - 167, The PR state is shown raw in
DashboardSidebarExpandedWorkspaceRow as pullRequest.state; update the rendering
to display a human-friendly, capitalized form (e.g., "Open", "Draft", "Merged",
"Closed") instead of the raw lowercase; implement a small mapping or helper
function (e.g., humanizePrState(state) or a STATE_LABELS map) and use it where
pullRequest.state is interpolated so the tooltip and PR line show the humanized
label.
apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/DashboardSidebar/components/DashboardSidebarWorkspaceItem/components/DashboardSidebarWorkspaceIcon/DashboardSidebarWorkspaceIcon.tsx (1)

34-46: Use LuGitPullRequestClosed for improved icon semantics.

LuCircleDot typically represents open issues on GitHub rather than closed pull requests. Using LuGitPullRequestClosed makes the icon semantically accurate and more intuitive when paired with the red color state.

🎨 Proposed refactor
 import {
-	LuCircleDot,
 	LuCloud,
 	LuCloudOff,
 	LuGitMerge,
 	LuGitPullRequest,
+	LuGitPullRequestClosed,
 	LuGitPullRequestDraft,
 } from "react-icons/lu";
@@
 const PR_ICON_BY_STATE = {
 	open: LuGitPullRequest,
 	merged: LuGitMerge,
-	closed: LuCircleDot,
+	closed: LuGitPullRequestClosed,
 	draft: LuGitPullRequestDraft,
 } as const;
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In
`@apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/DashboardSidebar/components/DashboardSidebarWorkspaceItem/components/DashboardSidebarWorkspaceIcon/DashboardSidebarWorkspaceIcon.tsx`
around lines 34 - 46, Replace the semantic mismatch in PR_ICON_BY_STATE by
swapping LuCircleDot with LuGitPullRequestClosed: update the PR_ICON_BY_STATE
mapping (and its import) so the "closed" key uses LuGitPullRequestClosed instead
of LuCircleDot, keeping PR_COLOR_BY_STATE unchanged; ensure the new icon is
imported where DashboardSidebarWorkspaceIcon is defined (replace or add the
LuGitPullRequestClosed import and remove LuCircleDot if no longer used).
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.

Inline comments:
In
`@apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/DashboardSidebar/components/DashboardSidebarWorkspaceItem/components/DashboardSidebarExpandedWorkspaceRow/DashboardSidebarExpandedWorkspaceRow.tsx`:
- Around line 124-143: The PR icon's inner button only stops click propagation,
so keyboard activation still bubbles key events to the parent row's onKeyDown
(in DashboardSidebarExpandedWorkspaceRow) and triggers the workspace click; add
an onKeyDown handler to the button that calls event.stopPropagation() (and
optionally event.nativeEvent.stopImmediatePropagation() if needed) to prevent
the parent row's onKeyDown from running on Enter/Space key presses, ensuring
keyboard activation only opens the PR and does not activate the workspace.

---

Nitpick comments:
In
`@apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/DashboardSidebar/components/DashboardSidebarWorkspaceItem/components/DashboardSidebarExpandedWorkspaceRow/DashboardSidebarExpandedWorkspaceRow.tsx`:
- Around line 159-167: The PR state is shown raw in
DashboardSidebarExpandedWorkspaceRow as pullRequest.state; update the rendering
to display a human-friendly, capitalized form (e.g., "Open", "Draft", "Merged",
"Closed") instead of the raw lowercase; implement a small mapping or helper
function (e.g., humanizePrState(state) or a STATE_LABELS map) and use it where
pullRequest.state is interpolated so the tooltip and PR line show the humanized
label.

In
`@apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/DashboardSidebar/components/DashboardSidebarWorkspaceItem/components/DashboardSidebarWorkspaceDiffStats/DashboardSidebarWorkspaceDiffStats.tsx`:
- Line 14: In DashboardSidebarWorkspaceDiffStats (the component in
DashboardSidebarWorkspaceDiffStats.tsx) remove the now-unused Tailwind utilities
"rounded" and "px-1.5" from the className string on the container since the
conditional background was removed; if horizontal padding is required for layout
keep only "px-1.5", otherwise drop both to keep the class list honest and
minimal.

In
`@apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/DashboardSidebar/components/DashboardSidebarWorkspaceItem/components/DashboardSidebarWorkspaceIcon/DashboardSidebarWorkspaceIcon.tsx`:
- Around line 34-46: Replace the semantic mismatch in PR_ICON_BY_STATE by
swapping LuCircleDot with LuGitPullRequestClosed: update the PR_ICON_BY_STATE
mapping (and its import) so the "closed" key uses LuGitPullRequestClosed instead
of LuCircleDot, keeping PR_COLOR_BY_STATE unchanged; ensure the new icon is
imported where DashboardSidebarWorkspaceIcon is defined (replace or add the
LuGitPullRequestClosed import and remove LuCircleDot if no longer used).
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: c5c2e43f-bb21-4805-9aa1-67a831f41393

📥 Commits

Reviewing files that changed from the base of the PR and between 48ba63a and e3bb924.

📒 Files selected for processing (3)
  • apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/DashboardSidebar/components/DashboardSidebarWorkspaceItem/components/DashboardSidebarExpandedWorkspaceRow/DashboardSidebarExpandedWorkspaceRow.tsx
  • apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/DashboardSidebar/components/DashboardSidebarWorkspaceItem/components/DashboardSidebarWorkspaceDiffStats/DashboardSidebarWorkspaceDiffStats.tsx
  • apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/DashboardSidebar/components/DashboardSidebarWorkspaceItem/components/DashboardSidebarWorkspaceIcon/DashboardSidebarWorkspaceIcon.tsx

Copy link
Copy Markdown
Contributor

@cubic-dev-ai cubic-dev-ai Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

1 issue found across 3 files

Prompt for AI agents (unresolved issues)

Check if these issues are valid — if so, understand the root cause of each and fix them. If appropriate, use sub-agents to investigate and fix each issue separately.


<file name="apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/DashboardSidebar/components/DashboardSidebarWorkspaceItem/components/DashboardSidebarExpandedWorkspaceRow/DashboardSidebarExpandedWorkspaceRow.tsx">

<violation number="1" location="apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/DashboardSidebar/components/DashboardSidebarWorkspaceItem/components/DashboardSidebarExpandedWorkspaceRow/DashboardSidebarExpandedWorkspaceRow.tsx:125">
P2: The PR button stops propagation only on `click`, but keyboard activation (Enter/Space) fires a `keydown` event that bubbles to the parent row's `onKeyDown` handler, which also calls `onClick()`. This means keyboard users will both open the PR URL and switch workspaces. Add an `onKeyDown` handler that stops propagation for Enter and Space.</violation>
</file>

Reply with feedback, questions, or to request a fix. Tag @cubic-dev-ai to re-run a review.

- Stop keydown propagation on the PR icon button so keyboard activation
  (Enter/Space) does not also trigger the parent row's workspace click.
- Use hover:bg-foreground/10 on the PR icon button so hover is visible
  even when the row is active (which already has bg-muted).
- Humanize PR state in the icon tooltip (Open/Merged/Closed/Draft).
- Drop the stale rounded class from the diff-stats container now that
  its background is gone.
- Use LuGitPullRequestClosed instead of LuCircleDot for closed PRs.
Copy link
Copy Markdown
Contributor

@coderabbitai coderabbitai Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🧹 Nitpick comments (1)
apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/DashboardSidebar/components/DashboardSidebarWorkspaceItem/components/DashboardSidebarWorkspaceIcon/DashboardSidebarWorkspaceIcon.tsx (1)

62-71: Minor: PR icon size differs from cloud/host icons.

size-3.5 for the PR icon vs size-4 for LuCloud/LuCloudOff will cause a ~2px footprint shift when a row transitions between "no PR" and "has PR" states. If that's intentional for visual balance (PR glyphs are denser), feel free to ignore; otherwise consider unifying to size-4 to avoid layout jitter.

🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In
`@apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/DashboardSidebar/components/DashboardSidebarWorkspaceItem/components/DashboardSidebarWorkspaceIcon/DashboardSidebarWorkspaceIcon.tsx`
around lines 62 - 71, The PR icon in renderPrimaryIcon uses className "size-3.5"
causing a footprint mismatch with the cloud icons (LuCloud/LuCloudOff) which use
"size-4"; update the PR icon sizing to "size-4" for consistency by changing the
className applied to the PrIcon in renderPrimaryIcon (referencing
PR_ICON_BY_STATE and PR_COLOR_BY_STATE) so the PR glyph uses the same size class
as the cloud icons and prevents layout jitter when toggling between PR/no-PR
states.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.

Nitpick comments:
In
`@apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/DashboardSidebar/components/DashboardSidebarWorkspaceItem/components/DashboardSidebarWorkspaceIcon/DashboardSidebarWorkspaceIcon.tsx`:
- Around line 62-71: The PR icon in renderPrimaryIcon uses className "size-3.5"
causing a footprint mismatch with the cloud icons (LuCloud/LuCloudOff) which use
"size-4"; update the PR icon sizing to "size-4" for consistency by changing the
className applied to the PrIcon in renderPrimaryIcon (referencing
PR_ICON_BY_STATE and PR_COLOR_BY_STATE) so the PR glyph uses the same size class
as the cloud icons and prevents layout jitter when toggling between PR/no-PR
states.

ℹ️ Review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 80356b31-b067-4ea7-ad7f-a375f694b7f4

📥 Commits

Reviewing files that changed from the base of the PR and between e3bb924 and 5443909.

📒 Files selected for processing (3)
  • apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/DashboardSidebar/components/DashboardSidebarWorkspaceItem/components/DashboardSidebarExpandedWorkspaceRow/DashboardSidebarExpandedWorkspaceRow.tsx
  • apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/DashboardSidebar/components/DashboardSidebarWorkspaceItem/components/DashboardSidebarWorkspaceDiffStats/DashboardSidebarWorkspaceDiffStats.tsx
  • apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/DashboardSidebar/components/DashboardSidebarWorkspaceItem/components/DashboardSidebarWorkspaceIcon/DashboardSidebarWorkspaceIcon.tsx
✅ Files skipped from review due to trivial changes (1)
  • apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/DashboardSidebar/components/DashboardSidebarWorkspaceItem/components/DashboardSidebarWorkspaceDiffStats/DashboardSidebarWorkspaceDiffStats.tsx
🚧 Files skipped from review as they are similar to previous changes (1)
  • apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/DashboardSidebar/components/DashboardSidebarWorkspaceItem/components/DashboardSidebarExpandedWorkspaceRow/DashboardSidebarExpandedWorkspaceRow.tsx

@Kitenite Kitenite merged commit e367ec4 into main Apr 24, 2026
7 checks passed
@github-actions
Copy link
Copy Markdown
Contributor

🧹 Preview Cleanup Complete

The following preview resources have been cleaned up:

  • ✅ Neon database branch

Thank you for your contribution! 🎉

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant