Polish thread-row, tool-row, composer, and delete-project UI - #151
Conversation
- Use Accordion primitives in tool-row.tsx; fix a selector bug that
stomped the check/cross icon colors and misaligned the chevron
- Add delete affordance, cancel option, and destructive hover color
to sidebar thread rows; swap timestamp/delete-icon instantly on
hover to avoid an animation-timing overlap; scope the focus ring to
keyboard navigation instead of firing on every mouse click
- Shrink composer-context-usage and move it beside the send button
- Make delete-project confirm button destructive
- Fix LinkedAccounts showing a "link" CTA for an already-linked
provider by setting multipleAccountsPerProvider={false}
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
Warning Review limit reached
Next review available in: 26 minutes You've used all free OSS reviews for now. Wait for the free limit to reset to keep reviewing this public repository. How can I continue?After more reviews become available, a review can be triggered using the To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews. How do review limits work?CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability. For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window. Please refer docs for additional details. Review details⚙️ Run configurationConfiguration used: defaults Review profile: CHILL Plan: Pro Plus Run ID: 📒 Files selected for processing (4)
📝 WalkthroughWalkthroughThe PR relocates and resizes composer context usage, replaces custom tool-row expansion with shared accordion components, updates deletion controls, and disables multiple accounts per identity provider. ChangesComposer context usage
Tool-row accordion behavior
Project deletion controls
Authentication configuration
Estimated code review effort: 3 (Moderate) | ~20 minutes Possibly related PRs
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✨ Finishing Touches 💡 1📝 Generate docstrings 💡
🧪 Generate unit tests (beta)
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. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 3
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@apps/web/src/components/chat/work-log/tool-row.tsx`:
- Around line 50-89: Update ToolRowHeading so the accordion trigger contains
valid phrasing content: replace the wrapper <div> and nested <p> around
presentation.heading and preview with <span> elements, preserving the existing
flex, truncation, spacing, and text classes.
In `@apps/web/src/components/sidebar/projects/thread-row.tsx`:
- Around line 45-79: Move the rename `<input>` out of the selection `<button>`
in `ThreadRow` so `renaming` renders two separate siblings instead of nesting
interactive controls. Keep the existing `onClick`/`onDoubleClick` selection and
rename behavior on the button, and preserve the current input handlers
(`onBlur`, `onChange`, `onKeyDown`, `ref`) on the standalone input. Use the
existing `renaming`, `setRenaming`, `draft`, `thread.id`, and `onRename` flow
unchanged, just relocate the conditional rendering structure.
- Around line 101-106: Update both delete-button variants in the thread row to
include group-focus-within/sub:flex alongside the existing visibility classes,
ensuring keyboard focus within the group reveals the buttons on desktop while
preserving hover and small-screen behavior.
🪄 Autofix
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 Plus
Run ID: 1a8d22f9-c7d9-4b9a-b811-ff027c1355d5
📒 Files selected for processing (8)
apps/web/src/components/chat/composer/composer-context-usage.tsxapps/web/src/components/chat/composer/footer-controls.tsxapps/web/src/components/chat/composer/index.tsxapps/web/src/components/chat/work-log/tool-row.tsxapps/web/src/components/portals/delete-project-dialog.tsxapps/web/src/components/sidebar/projects/thread-row.tsxapps/web/src/components/ui/accordion.tsxapps/web/src/main.tsx
💤 Files with no reviewable changes (1)
- apps/web/src/components/chat/composer/footer-controls.tsx
- tool-row.tsx: AccordionTrigger renders as a real <button>; replace the <div>/<p> wrappers in ToolRowHeading with <span>s since block-level content isn't valid inside phrasing content - thread-row.tsx: move the rename <input> out of the selection <button> in both variants (a button can't contain another interactive control) - thread-row.tsx: reveal the delete button on keyboard focus (group-focus-within/sub:flex), not just mouse hover / small screens Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
- thread-row.test.tsx: cover select, rename (commit/cancel/blur), and delete-confirm flows for both "sub" and "list" variants - While writing the delete-confirm test, found the "list" variant never got the Cancel button added to "sub" earlier — added it for parity - tool-row.test.tsx: regression test locking the accordion trigger's chevron styling to `[&>svg]` (direct child) instead of `[&_svg:last-child]` (descendant), which had leaked onto the kind/status icons Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
1 participant
Summary
tool-row.tsxon theAccordionprimitive (was manualuseState); fixes a selector bug ([&_svg:last-child]→[&>svg]) that had unintentionally matched the kind-icon and status-icon svgs, stomping the check/cross icon colors and adding atranslate-y-0.5misalignment to the chevronthread-row.tsxsidebar rows: add a delete button (backenddeleteThreadalready existed end-to-end, just had no UI trigger), a Cancel option next to Confirm, destructive hover color on the delete icon, and swap the timestamp/delete-icon with an instantdisplaytoggle instead of mismatched opacity-transition vs.hidden, which caused a visible overlap frame during the swapfocus-visible(keyboard nav) instead offocus-within(fires on every mouse click)composer-context-usage.tsx: shrink (32px→24px ring, 9px→8px font) and move from the scrolling footer-controls row to sit directly left of the send buttondelete-project-dialog.tsx: confirm button is nowvariant="destructive"main.tsx: setmultipleAccountsPerProvider={false}onAuthProviderso LinkedAccounts stops showing a "link" CTA for a provider (GitHub) that's already linkedTest plan
bun run check:types(all packages)biome checkon touched files🤖 Generated with Claude Code
Summary by CodeRabbit