Skip to content

fix(web): clean up the provider settings list and editor - #186

Merged
rynfar merged 2 commits into
pylonfrom
upstream/2026-08-29-provider-settings
Aug 30, 2026
Merged

fix(web): clean up the provider settings list and editor#186
rynfar merged 2 commits into
pylonfrom
upstream/2026-08-29-provider-settings

Conversation

@rynfar

@rynfar rynfar commented Aug 30, 2026

Copy link
Copy Markdown
Collaborator

Problem

The Providers settings page carried a "Provider / On" header row, a bottom refresh bar, 11px status text that overflowed, a fixed 64px row height, status dots on every row regardless of health, and an Advanced section that could not even be opened on a read-only session.

Fix

Manual port of upstream #8504 (5e63aea2d) from the f94a0d646..1f8ed54ad T3 review. PR #172 had already taken its connected-dot hunk; this brings the rest: header row and bottom bar removed, "Checked Xs ago" plus refresh and add-provider as labelled icon buttons in the section header, Configuration tab first, 13px two-line-clamped status text with the probe error inline (and unclamped in the editor), rounded bg-foreground/8 selection, status dots only for warning and error, Advanced openable read-only, one 16px gutter.

ProviderSettingsPanel.tsx is byte-identical to upstream's ported region. ProviderInstanceCard.tsx was re-implemented on Pylon's card rather than merged, because Pylon's version carries drain-order chevrons, environmentId-driven in-app sign-in, and the redacted "Authenticated as" header with reveal — all of which survive and are tested.

Three deliberate deviations, each commented in source:

  • min-h-19 instead of upstream's fixed h-19, because Pylon rows can also carry ProviderUsageSummary, which a hard height would clip.
  • The Sign in button gets its own inert fence. Upstream leaves the whole status line outside the read-only fence because its status line holds no write action; Pylon's does, and a literal port would have made a write clickable on a read-only session.
  • Pylon's motion-reduce-aware animated update marker is kept over upstream's new static advisory icon.

Dropping width="expanded" narrows the page from max-w-6xl to max-w-4xl, as upstream did.

Verification

  • vp test run on ProviderInstanceCard.test.ts, ProviderSettingsPanel.environment.test.tsx, SettingsPanels.logic.test.ts — 37 passed initially, then a review round added read-only coverage: the drain-order chevrons and Sign in each sit inside an inert fence while the email reveal does not; the Advanced trigger is outside the panel's fence; chevron disabled state is pinned to handler presence rather than list edges. Every new assertion was mutation-checked (each of four source mutations fails exactly one case).
  • @t3tools/web typecheck, lint, format, and git diff --check clean.
  • Independent review traced every interactive control for read-only leakage and found none; confirmed both header icon buttons carry aria-labels and the error state stays textual with the dots removed; confirmed ProviderSettingsPanel has a single caller and no prop change.
  • Not done: a visual pass. Highest-value things to look at: light/dark selection tint, a long probe error wrapping to two lines, a row with both status and usage summary, the read-only editor header, and whether the narrower page still fits the 20rem list beside the editor.

Claude Fable 5 in Pylon.


View with [code]smith Autofix with [code]smith
Need help on this PR? Tag @codesmith-bot with what you need. Autofix is disabled.

rynfar added 2 commits August 29, 2026 20:56
The provider settings page was hard to scan: a "Provider / On" column header
over a handful of rows, a separate bottom refresh bar, 11px truncated status
text, a Configuration tab listed second but selected by default, and an
Advanced toggle that did nothing on read-only sessions because its trigger sat
inside the inert wrapper.

Rebuilds the layout: "Checked Xs ago", refresh, and add-provider move into the
section header as compact icon actions; the list scrolls and uses rounded
bg-foreground/8 selection with 13px two-line-clamped status text; status dots
appear only for warning and error; a failed probe's message shows in the list
row and on its own line in the editor header; tabs read Configuration first;
Advanced opens on read-only sessions with only its health-interval controls
inert; list, device strip, and editor share one 16px gutter.

Manual port of pingdotgg/t3code#8504 (5e63aea2d). Pylon's card diverges from
upstream's by the drain-order chevrons, the environmentId-driven in-app
sign-in, the animated list update marker, and the provider usage rows, so
upstream's rewritten card was re-implemented on Pylon's rather than taken.
Pylon keeps a minimum list-row height instead of upstream's fixed one because
a row may also carry the usage summary, and the sign-in button gets its own
inert fence so the read-only editor header stays honest while its email reveal
keeps working.

Built with Claude Opus 5 in the Claude Code harness.
The fork-only guard case added with the port rendered with the default
`readOnly`, so it proved the drain-order chevrons and the in-app sign-in still
render but not that the rebuilt inert fences actually cover them — and its
`position: 0, total: 2` fixture left the "earlier" chevron disabled by
position, so a permanently disabled control would still have passed on the
strength of its aria-label.

Renders the card three ways instead: middle of three accounts with both
handlers (both chevrons must be enabled), first of three (only "earlier" is
disabled), and read-only, where the drain-order controls and the sign-in
button must sit inside `inert` fences while the status line's email reveal
must not. Adds two markup helpers, since these tests render to a string with
no DOM: one balances tags to return the contents of each inert fence, the
other extracts a button's opening tag with its class attribute stripped so an
assertion on `disabled=""` cannot be satisfied by the `disabled:` variants
baked into the button's class list.

Also asserts in the panel's read-only case that the Advanced trigger stays
outside the inert fence, which is what makes Advanced openable on a read-only
session.

Every new assertion was checked against a deliberate mutation of the source:
permanently disabled chevrons, a sign-in button outside its fence, the email
reveal pulled inside the header fence, and the Advanced trigger moved inside
the fence each fail exactly one case.

Built with Claude Opus 5 in the Claude Code harness.
@github-actions github-actions Bot added vouch:trusted PR author is trusted by repo permissions or the VOUCHED list. size:L labels Aug 30, 2026
@github-actions

Copy link
Copy Markdown

Thread transfer impact

✅ Thread transfer remains within every enforced ceiling.

Provider Metric Main baseline This PR Impact PR ceiling
Codex Total thread wire 13.3 KiB 13.5 KiB +194 B (+1.4%) 15.1 KiB
Codex Thread snapshot wire 6.9 KiB 6.9 KiB −7 B (−0.1%) 7.3 KiB
Codex Live turn WebSocket wire 6.4 KiB 6.6 KiB +201 B (+3.1%) 7.8 KiB
Codex Live turn WebSocket decoded 55.5 KiB 57.0 KiB +1.5 KiB (+2.7%) 66.4 KiB
Codex Live turn messages 9 11 +2 (+22.2%) 21
Claude Total thread wire 13.3 KiB 13.3 KiB −68 B (−0.5%) 15.1 KiB
Claude Thread snapshot wire 6.9 KiB 6.9 KiB −9 B (−0.1%) 7.3 KiB
Claude Live turn WebSocket wire 6.4 KiB 6.4 KiB −59 B (−0.9%) 7.8 KiB
Claude Live turn WebSocket decoded 56.4 KiB 56.3 KiB −44 B (−0.1%) 66.4 KiB
Claude Live turn messages 10 9 −1 (−10.0%) 21

Baseline: abe70a7 · PR result: 16d0c75 · Source CI: success

Scenario and decoded snapshot size

10 historical turns, 5 command tools per turn, 878.9 KiB retained MCP result per historical turn, and a 1.05 MiB retained result in the measured turn.

  • Codex decoded thread snapshot: 109.4 KiB
  • Claude decoded thread snapshot: 110.1 KiB

Updated in place by a trusted workflow. PR artifacts are strictly validated and never executed.

@rynfar
rynfar merged commit b749051 into pylon Aug 30, 2026
14 checks passed
@rynfar
rynfar deleted the upstream/2026-08-29-provider-settings branch August 30, 2026 19:03
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

size:L vouch:trusted PR author is trusted by repo permissions or the VOUCHED list.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant