Skip to content

fix(rate-ui): clamp top-toolstrip popovers inside constrained viewports (#4300) - #5255

Open
dieterolson wants to merge 3 commits into
mainfrom
fix/issue-4300-toolstrip-popover-viewport-clamping
Open

dieterolson wants to merge 3 commits into
mainfrom
fix/issue-4300-toolstrip-popover-viewport-clamping

Conversation

@dieterolson

@dieterolson dieterolson commented Sep 19, 2026

Copy link
Copy Markdown
Collaborator

Fixes #4300

rate-visual-exemption: Clamped top-toolstrip popovers inside constrained viewport bounds without altering tab layout

Summary

On the Rate of Closure React surface at a 520 x 900 viewport, opening top-toolstrip menus (File, View, Tools) caused popovers to position partially outside the viewport, clipping items and text.

This PR:

  • Wires the existing useViewportClampedPopover hook into FileMenu, ViewMenu, and ToolsMenu in AppToolstrip.tsx.
  • Extracts ToolsMenu into a clean component complying with Law of Demeter and max line limits.
  • Adds unit tests in AppToolstrip.test.tsx verifying horizontal popover translation under constrained viewports.
  • Adds Playwright E2E regression test in src/rate_of_closure/web/e2e/toolstrip-popover-viewport.spec.ts proving all popovers stay within the 520x900 viewport with no document horizontal overflow.
  • Regenerates module inventory and updates SPEC.md, DEVELOPMENT_LOG.md (DL-Rate UI: keep top-toolstrip menus inside constrained viewports #4300), and HANDOFF.md.

@chatgpt-codex-connector chatgpt-codex-connector Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: b048e5a67e

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

<div
ref={popover.panelRef}
style={popover.style}
className={`${POPOVER_CLASS} min-w-96`}

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 Badge Allow the View popover to shrink on narrow screens

At the repository's existing 390 px chromium-narrow viewport (playwright.config.ts:63-68), min-w-96 forces this panel to 384 px while useViewportClampedPopover reserves a 16 px gutter on each side. The clamp therefore places its left edge at 16 px and its right edge at 400 px, leaving the View menu outside the supported viewport; the new test only exercises 520 px and is excluded from the narrow project by that project's testMatch. Make this panel responsive or relax the gutter when its width exceeds the available space, and cover the 390 px configuration.

AGENTS.md reference: AGENTS.md:L339-L343

Useful? React with 👍 / 👎.

@chatgpt-codex-connector

Copy link
Copy Markdown

Codex Review Summary

This comment shows the latest Codex review activity on this pull request.

Review Status Commit Review trigger
📝 Code Review Completed 2026-09-19T19:53:55.678925Z b048e5a PR opened
ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review" or "@codex security review".

Codex reacts with 👀 while any review is running, comments if it has suggestions, and reacts with 👍 once all reviews finish with no findings.

@dieterolson
dieterolson enabled auto-merge (squash) September 20, 2026 01:15
rate-visual-exemption: Clamped top-toolstrip popovers inside constrained viewport bounds without altering tab layout
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.

Rate UI: keep top-toolstrip menus inside constrained viewports

1 participant