Skip to content

fix: make logo asset menus accessible by keyboard - #1395

Open
tannerlinsley wants to merge 1 commit into
mainfrom
taren/brand-context-menu-accessibility
Open

tannerlinsley wants to merge 1 commit into
mainfrom
taren/brand-context-menu-accessibility

Conversation

@tannerlinsley

@tannerlinsley tannerlinsley commented Oct 17, 2026 •

Copy link
Copy Markdown
Member

Logo asset menus now have a named keyboard entry point in the navbar and sign-in screens. The button appears when focused, and logo links keep their normal navigation behavior.

AI review notes:
Replaces the empty dropdown trigger with Radix Menu's virtual anchor, reusing the menu dependency already installed through Dropdown. Only the outer navbar/login/OAuth wrappers expose a button, so nested logo wrappers do not add duplicate tab stops or buttons inside links.
Agent-run isolated browser checks covered Tab, Enter, Space, Shift+F10, the ContextMenu key, arrow navigation, Escape focus restoration, normal link activation, and right-click with nested wrappers. The fixture used the real component and generated Tailwind styles, with navigation, toast and clipboard services stubbed. This is not a full application or production verification.
pnpm test passed: TypeScript, lint, 552 unit tests (4 skipped), 2,269 chat tests, and 20 desktop tests (1 skipped). Isolated minified component gzip increased by 475 bytes, which is not a production bundle measurement. The lockfile adds only a direct reference to the already installed Radix Menu version.

Related to #775.

Summary by CodeRabbit

  • New Features
    • Added a logo context menu that can be opened with a right-click or keyboard shortcuts.
    • Added a focusable “Logo assets” button to open the menu from the navigation bar and sign-in screens.
    • The menu continues to provide logo-copy actions and a link to all logo assets.

@tannerlinsley
tannerlinsley requested a review from a team October 17, 2026 01:50
@changeset-bot

changeset-bot Bot commented Oct 17, 2026

Copy link
Copy Markdown

⚠️ No Changeset found

Latest commit: a2c64a0

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

@cloudflare-workers-and-pages

cloudflare-workers-and-pages Bot commented Oct 17, 2026 •

Copy link
Copy Markdown

Deploying with  Cloudflare Workers  Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

Status Name Latest Commit Updated (UTC)
✅ Deployment successful!
View logs
tanstack-com a2c64a0 Oct 17 2026, 01:52 AM

@coderabbitai

coderabbitai Bot commented Oct 17, 2026 •

Copy link
Copy Markdown

Review in Change Stack →

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration
  • Configuration used: defaults
  • Review profile: CHILL
  • Plan: Advanced
  • Run ID: 3eb5177f-be35-44c1-88e9-faf1b8f906cf
📥 Commits

Reviewing files that changed from the base of the PR and between 9ab080e and a2c64a0.

⛔ Files ignored due to path filters: 1
  • pnpm-lock.yaml is excluded by !**/pnpm-lock.yaml
📒 Files selected for processing: 5
  • package.json
  • src/components/BrandContextMenu.tsx
  • src/components/Navbar.tsx
  • src/routes/login.tsx
  • src/routes/oauth/authorize.tsx

Included review availability: This review used your included allowance. Your plan provides up to 4 included reviews per hour; 3 remain after this review.

📝 Walkthrough

BrandContextMenu now uses Radix Menu for logo actions and supports pointer, keyboard, and optional button activation. Navbar, login, and OAuth authorization enable the button trigger.

Changes: Logo menu

Layer / File(s) Summary
Radix menu behavior
package.json, src/components/BrandContextMenu.tsx
Adds @radix-ui/react-menu and replaces the custom dropdown with Radix Menu. Right-click and keyboard events open the menu at the target position. An optional “Logo assets” button opens it below itself. Logo choices and navigation remain available as menu items.
Enable the logo trigger
src/components/Navbar.tsx, src/routes/login.tsx, src/routes/oauth/authorize.tsx
These three locations pass showTrigger to BrandContextMenu.

Priority: ➖ Normal

Estimated code review effort: 3 (Moderate) | ~20 minutes

Change: Bug fix

Sequence Diagram(s)

sequenceDiagram
  actor User
  participant BrandContextMenu
  participant RadixMenu as Radix Menu
  User->>BrandContextMenu: Right-click or use ContextMenu / Shift+F10
  BrandContextMenu->>RadixMenu: Open at the event target position
  RadixMenu-->>User: Show logo choices and navigation item
Loading

Suggested reviewers: abeuty

Merge Risk: ⚪ Minimal · up to a2c64

The keyboard-accessible logo menu appears ready to merge after normal checks; no actionable blocker is established.

Pre-merge checks: Passed 4 · Failed 1

Failed 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%. Docstring coverage is scoped to functions touched by this diff. Analyzed 4 functions across 4 files. (1 skipped: 1 … Write docstrings for the functions missing them to satisfy the coverage threshold.
Passed Passed checks: 4 passed
Check name Status Explanation
Description Check Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check Passed The title clearly and concisely describes the main change: adding keyboard accessibility to the logo asset menus.
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.
Full details: Docstring Coverage

Explanation

Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 4 functions across 4 files. (1 skipped: 1 unsupported.)

Resolution

Write docstrings for the functions missing them to satisfy the coverage threshold.

  • Fix all pre-merge checks with AI
✨ Finishing Touches: 💡 1
📝 Generate docstrings: 💡
  • Commit to this branch
  • Create a new PR
🧪 Generate unit tests (beta)
  • Commit to this branch
  • Create a new PR
  • Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

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.

This branch has not been deployed

No deployments
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