Skip to content

mock-policy-server: move Product Overrides to the Policies sidebar - #333696

Draft
joshspicer wants to merge 1 commit into
mainfrom
agents/move-deploy-file-sidebar-simplify-ux
Draft

mock-policy-server: move Product Overrides to the Policies sidebar#333696
joshspicer wants to merge 1 commit into
mainfrom
agents/move-deploy-file-sidebar-simplify-ux

Conversation

@joshspicer

Copy link
Copy Markdown
Member

Summary

Moves the Product overrides action (the "deploy as a file" that writes product.overrides.json) out of the Setup modal and into a compact widget in the Policies right sidebar, and simplifies the surrounding UX. Scope is limited to the dev-only, non-shipped scripts/mock-policy-server/ GUI.

What changed

  • Product Overrides widget (Policies sidebar): a status pill (Applied / Not applied) and a single full-width Apply Overrides / Restore Original button, sitting above Live Requests. Applying still wires/unwires product.overrides.json and updates the global connection indicator exactly as before.
  • All the detail moved behind an (i): the two-step "apply / reload & sync / clear cache" instructions now live in a hoverable and keyboard-focusable (i) popover, so the widget stays minimal. Escape dismisses the popover while keeping focus on the trigger (WCAG 1.4.13).
  • Simplified Setup dialog: with only the System Proxy method left, the radio-based method picker (fieldset/radios/badges/dimming) and its now-dead selectSetupMethod logic are removed, leaving one clean card. The intro now points at the sidebar for the one-click Code OSS option.
  • README updated to describe the sidebar widget vs. the proxy dialog.

No changes to server.ts or the control API — the /api/wire and /api/unwire behavior is unchanged; the element IDs (overrides-action, override-status) were only relocated.

Verification

Driven end-to-end in a headless browser against the running server:

  • Apply → Restore toggles button label/style (full-width preserved), flips the status pill to green Applied ✓, and updates the header to Code OSS overrides active; the override files are cleaned up on restore.
  • The (i) popover reveals on hover and focus, and Escape hides it while keeping focus on the trigger (re-focus reopens it).
  • The Setup dialog renders as a single System Proxy card; the narrow (<900px) single-column layout fits and the popover doesn't clip.
  • Zero browser console errors; a standalone strict tsc on public/app.ts is clean.

Screenshots

Sidebar widget (i) popover Simplified Setup dialog
Product Overrides above Live Requests Full instructions on hover/focus Single System Proxy card

Move the Code OSS product.overrides.json deploy action out of the Setup
dialog into a compact Product Overrides widget in the Policies sidebar: a
status pill plus a single Apply Overrides / Restore Original button, with
the full instructions tucked behind a hoverable and keyboard-focusable (i)
popover (Escape dismisses it while keeping focus on the trigger).

With only the system proxy method left, simplify the Setup dialog by
dropping the radio-based method picker and its now-dead selection logic.

Update the README to match.

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Copilot AI balanced review requested due to automatic review settings September 1, 2026 00:37
@joshspicer
joshspicer marked this pull request as draft September 1, 2026 00:38

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Copilot review overview

Review tier: Balanced
Findings: 1 High severity · 1 Medium severity · 1 Low severity

New issues introduced by this change (3)
Severity Finding
High severity scripts/​mock-policy-server/​public/​index.html — The newly always-visible action is enabled before /api/state initializes overridesWired, and it…
Medium severity scripts/​mock-policy-server/​public/​app.ts — Escape is only observed when the trigger owns keyboard focus. If the panel was opened by hover…
Low severity scripts/​mock-policy-server/​public/​style.css — The popover's new translate/fade transition still runs for users who request reduced motion; the…
What changed in this PR

Moves Product Overrides from Setup into the Policies sidebar and simplifies Setup to system proxy configuration.

Changes:

  • Adds a sidebar override-status widget and informational popover.
  • Simplifies the Setup dialog.
  • Updates supporting styles, behavior, and documentation.
File Description
README.md Documents the revised connection workflows.
public/​style.css Styles the simplified dialog and sidebar popover.
public/​index.html Relocates Product Overrides and simplifies Setup.
public/​app.ts Removes method selection and adds popover behavior.

💡 Configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

</div>
</span>
</div>
<button id="overrides-action" type="button" class="btn-primary btn-full">Apply Overrides</button>
Comment on lines +944 to +948
trigger.addEventListener('keydown', event => {
if (event.key === 'Escape') {
popover.classList.add('dismissed');
}
});
Comment on lines +875 to +881
.info-popover:hover .info-popover-panel,
.info-popover:focus-within .info-popover-panel {
opacity: 1;
visibility: visible;
transform: translateY(0);
transition: opacity 0.15s ease, transform 0.15s ease;
}
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.

2 participants