fix(web): keep the provider settings editor from jumping

[rynfar]

Selecting a different provider account resized the whole settings panel. The
master-detail grid had no height of its own, so the editor pane grew to fit
whichever account was open and the surrounding page reflowed. The models list
was separately capped at a max-h-40 scroll box no matter how much room the
editor had.

Gives the grid a fixed height (lg:h-[min(38rem,calc(100dvh-16rem))] with a
30rem floor), makes the list and editor panes scroll independently, pins the
headers and tab strip with shrink-0, and lets the models list grow to fill the
editor.

Adopted from T3 Code f276e632c5a7952655e2455aef3b86c08164b988
(pingdotgg/t3code#8472) — the follow-up to the provider settings split Pylon
adopted in #125.

Adaptation

Upstream #8472 also re-added the account email as a labelled Account email
field in the Configuration tab. Pylon already shows it in the editor header, so
that half is deliberately not adopted: taking both would render the same
redacted address twice in one panel.

Four conflicts, all resolved Pylon-first, preserving:

• the richer ProviderAuthEmail (prefix/separator variant used by the header);
• the widened showEditorStatus (also true when disabled, when an email exists,
  or when sign-in is offered);
• the disabled-account detail message;
• the Provider usage block and its ProviderUsageRows.

Upstream's test for the Configuration placement is retargeted at Pylon's header
placement, keeps its security assertion, and gains a guard that the Configuration
field stays absent. It also needed Pylon's required timestampFormat prop, which
upstream's card does not have — that surfaced as a typecheck error, not a test
failure, since React tolerates the missing prop at runtime.

Verification

• vp test run ProviderInstanceCard.test.ts ProviderSettingsPanel.environment.test.tsx — 9 passed
• vp run -F @t3tools/web typecheck — clean
• vp lint + vp fmt on the four changed files — clean
• Mutation probes on the adapted test, both directions:
  • removing the redacted email from the editor header fails it
    (expected … to contain 'aria-label="Toggle account email visibility"');
  • re-adding upstream's Configuration field fails it
    (expected … not to contain 'Account email').
    The second probe initially passed for the wrong reason — my first injection
    landed somewhere unrendered — so the guard was re-verified against a checked
    insertion point rather than assumed non-vacuous.

Before/after images are pending; this is one of several web changes in the
current upstream batch and they will get one consolidated real-client pass
rather than five separate dev-server runs.

Claude Opus 5 via Claude Code.

---

^{Need help on this PR? Tag @codesmith-bot with what you need. Autofix is disabled.}

[github-actions]

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.2 KiB	−106 B (−0.8%)	15.1 KiB	✅
Codex	Thread snapshot wire	6.9 KiB	6.9 KiB	−5 B (−0.1%)	7.3 KiB	✅
Codex	Live turn WebSocket wire	6.4 KiB	6.3 KiB	−101 B (−1.5%)	7.8 KiB	✅
Codex	Live turn WebSocket decoded	55.5 KiB	54.7 KiB	−822 B (−1.4%)	66.4 KiB	✅
Codex	Live turn messages	9	9	0 (0.0%)	21	✅
Claude	Total thread wire	13.3 KiB	13.3 KiB	−2 B (−0.0%)	15.1 KiB	✅
Claude	Thread snapshot wire	6.9 KiB	6.9 KiB	+16 B (+0.2%)	7.3 KiB	✅
Claude	Live turn WebSocket wire	6.5 KiB	6.4 KiB	−18 B (−0.3%)	7.8 KiB	✅
Claude	Live turn WebSocket decoded	56.4 KiB	56.4 KiB	−44 B (−0.1%)	66.4 KiB	✅
Claude	Live turn messages	11	10	−1 (−9.1%)	21	✅

Baseline: 3d6035f · PR result: c7eaf6a · 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]

Review note — inherited limitation, deliberately not fixed here.

The Configuration tab's new lg:overflow-y-auto scroller sits inside the wrapper
carrying inert={readOnly}. On a view-only environment at lg width with config
content taller than the pane, the scroller is not focusable and its contents are
inert, so the bottom of the read-only configuration may be unreachable — the page
scroller used to handle that.

Upstream has the identical structure (readOnly came from #8380, the scroller
from #8472), so this is not a Pylon regression and not something this adoption
introduces. Fixing it means moving inert off the scrolling element onto an inner
wrapper, which is a structural divergence from upstream and a separate concern
from the layout fix. Flagging it here so it is on the record rather than silently
carried.

Also cosmetic and identical upstream: at lg width but short height (e.g.
1280x600) the lg:min-h-[30rem] floor can produce nested page-then-pane
scrolling.

[rynfar]

Before / after

Captured against the seeded database at 1280x860, same provider (Codex), same
Configuration tab, toasts dismissed.

Before — the panel has no height of its own, so the editor runs past the
viewport and the whole page scrolls. Advanced is off-screen entirely.

After — the grid is height-bounded, the editor pane scrolls internally (note
"Path to the Codex binary…" clipped at the pane edge rather than the page edge),
the list pane keeps its own footer, and Advanced is now visible below the
panel instead of being pushed off-screen.

Verification note: the first capture attempt produced an identical-looking
"after" because Vite was still serving the pre-switch module — confirmed by
curling /src/components/settings/ProviderSettingsPanel.tsx and finding zero
occurrences of the new min(38rem…) class. The dev server was restarted and the
class confirmed served before recapturing, so these two images really do differ
by this branch.

The account email stays in the editor header in both, which is the placement this
PR deliberately keeps rather than adopting upstream's Configuration-tab field.

[rynfar]

Selecting a different provider account resized the whole settings panel. The
master-detail grid had no height of its own, so the editor pane grew to fit
whichever account was open and the surrounding page reflowed. The models list
was separately capped at a max-h-40 scroll box no matter how much room the
editor had.

Gives the grid a fixed height (lg:h-[min(38rem,calc(100dvh-16rem))] with a
30rem floor), makes the list and editor panes scroll independently, pins the
headers and tab strip with shrink-0, and lets the models list grow to fill the
editor.

Adopted from T3 Code f276e632c5a7952655e2455aef3b86c08164b988
(pingdotgg/t3code#8472) — the follow-up to the provider settings split Pylon
adopted in #125.

Adaptation

Upstream #8472 also re-added the account email as a labelled Account email
field in the Configuration tab. Pylon already shows it in the editor header, so
that half is deliberately not adopted: taking both would render the same
redacted address twice in one panel.

Four conflicts, all resolved Pylon-first, preserving:

• the richer ProviderAuthEmail (prefix/separator variant used by the header);
• the widened showEditorStatus (also true when disabled, when an email exists,
  or when sign-in is offered);
• the disabled-account detail message;
• the Provider usage block and its ProviderUsageRows.

Upstream's test for the Configuration placement is retargeted at Pylon's header
placement, keeps its security assertion, and gains a guard that the Configuration
field stays absent. It also needed Pylon's required timestampFormat prop, which
upstream's card does not have — that surfaced as a typecheck error, not a test
failure, since React tolerates the missing prop at runtime.

Verification

• vp test run ProviderInstanceCard.test.ts ProviderSettingsPanel.environment.test.tsx — 9 passed
• vp run -F @t3tools/web typecheck — clean
• vp lint + vp fmt on the four changed files — clean
• Mutation probes on the adapted test, both directions:
  • removing the redacted email from the editor header fails it
    (expected … to contain 'aria-label="Toggle account email visibility"');
  • re-adding upstream's Configuration field fails it
    (expected … not to contain 'Account email').
    The second probe initially passed for the wrong reason — my first injection
    landed somewhere unrendered — so the guard was re-verified against a checked
    insertion point rather than assumed non-vacuous.

Before/after images are pending; this is one of several web changes in the
current upstream batch and they will get one consolidated real-client pass
rather than five separate dev-server runs.

Claude Opus 5 via Claude Code.

---

^{Need help on this PR? Tag @codesmith-bot with what you need. Autofix is disabled.}

[github-actions]

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.2 KiB	−106 B (−0.8%)	15.1 KiB	✅
Codex	Thread snapshot wire	6.9 KiB	6.9 KiB	−5 B (−0.1%)	7.3 KiB	✅
Codex	Live turn WebSocket wire	6.4 KiB	6.3 KiB	−101 B (−1.5%)	7.8 KiB	✅
Codex	Live turn WebSocket decoded	55.5 KiB	54.7 KiB	−822 B (−1.4%)	66.4 KiB	✅
Codex	Live turn messages	9	9	0 (0.0%)	21	✅
Claude	Total thread wire	13.3 KiB	13.3 KiB	−2 B (−0.0%)	15.1 KiB	✅
Claude	Thread snapshot wire	6.9 KiB	6.9 KiB	+16 B (+0.2%)	7.3 KiB	✅
Claude	Live turn WebSocket wire	6.5 KiB	6.4 KiB	−18 B (−0.3%)	7.8 KiB	✅
Claude	Live turn WebSocket decoded	56.4 KiB	56.4 KiB	−44 B (−0.1%)	66.4 KiB	✅
Claude	Live turn messages	11	10	−1 (−9.1%)	21	✅

Baseline: 3d6035f · PR result: c7eaf6a · 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]

Review note — inherited limitation, deliberately not fixed here.

The Configuration tab's new lg:overflow-y-auto scroller sits inside the wrapper
carrying inert={readOnly}. On a view-only environment at lg width with config
content taller than the pane, the scroller is not focusable and its contents are
inert, so the bottom of the read-only configuration may be unreachable — the page
scroller used to handle that.

Upstream has the identical structure (readOnly came from #8380, the scroller
from #8472), so this is not a Pylon regression and not something this adoption
introduces. Fixing it means moving inert off the scrolling element onto an inner
wrapper, which is a structural divergence from upstream and a separate concern
from the layout fix. Flagging it here so it is on the record rather than silently
carried.

Also cosmetic and identical upstream: at lg width but short height (e.g.
1280x600) the lg:min-h-[30rem] floor can produce nested page-then-pane
scrolling.

[rynfar]

Before / after

Captured against the seeded database at 1280x860, same provider (Codex), same
Configuration tab, toasts dismissed.

Before — the panel has no height of its own, so the editor runs past the
viewport and the whole page scrolls. Advanced is off-screen entirely.

After — the grid is height-bounded, the editor pane scrolls internally (note
"Path to the Codex binary…" clipped at the pane edge rather than the page edge),
the list pane keeps its own footer, and Advanced is now visible below the
panel instead of being pushed off-screen.

Verification note: the first capture attempt produced an identical-looking
"after" because Vite was still serving the pre-switch module — confirmed by
curling /src/components/settings/ProviderSettingsPanel.tsx and finding zero
occurrences of the new min(38rem…) class. The dev server was restarted and the
class confirmed served before recapturing, so these two images really do differ
by this branch.

The account email stays in the editor header in both, which is the placement this
PR deliberately keeps rather than adopting upstream's Configuration-tab field.

[rynfar]

Selecting a different provider account resized the whole settings panel. The
master-detail grid had no height of its own, so the editor pane grew to fit
whichever account was open and the surrounding page reflowed. The models list
was separately capped at a max-h-40 scroll box no matter how much room the
editor had.

Gives the grid a fixed height (lg:h-[min(38rem,calc(100dvh-16rem))] with a
30rem floor), makes the list and editor panes scroll independently, pins the
headers and tab strip with shrink-0, and lets the models list grow to fill the
editor.

Adopted from T3 Code f276e632c5a7952655e2455aef3b86c08164b988
(pingdotgg/t3code#8472) — the follow-up to the provider settings split Pylon
adopted in #125.

Adaptation

Upstream #8472 also re-added the account email as a labelled Account email
field in the Configuration tab. Pylon already shows it in the editor header, so
that half is deliberately not adopted: taking both would render the same
redacted address twice in one panel.

Four conflicts, all resolved Pylon-first, preserving:

• the richer ProviderAuthEmail (prefix/separator variant used by the header);
• the widened showEditorStatus (also true when disabled, when an email exists,
  or when sign-in is offered);
• the disabled-account detail message;
• the Provider usage block and its ProviderUsageRows.

Upstream's test for the Configuration placement is retargeted at Pylon's header
placement, keeps its security assertion, and gains a guard that the Configuration
field stays absent. It also needed Pylon's required timestampFormat prop, which
upstream's card does not have — that surfaced as a typecheck error, not a test
failure, since React tolerates the missing prop at runtime.

Verification

• vp test run ProviderInstanceCard.test.ts ProviderSettingsPanel.environment.test.tsx — 9 passed
• vp run -F @t3tools/web typecheck — clean
• vp lint + vp fmt on the four changed files — clean
• Mutation probes on the adapted test, both directions:
  • removing the redacted email from the editor header fails it
    (expected … to contain 'aria-label="Toggle account email visibility"');
  • re-adding upstream's Configuration field fails it
    (expected … not to contain 'Account email').
    The second probe initially passed for the wrong reason — my first injection
    landed somewhere unrendered — so the guard was re-verified against a checked
    insertion point rather than assumed non-vacuous.

Before/after images are pending; this is one of several web changes in the
current upstream batch and they will get one consolidated real-client pass
rather than five separate dev-server runs.

Claude Opus 5 via Claude Code.

---

^{Need help on this PR? Tag @codesmith-bot with what you need. Autofix is disabled.}

[github-actions]

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.2 KiB	−106 B (−0.8%)	15.1 KiB	✅
Codex	Thread snapshot wire	6.9 KiB	6.9 KiB	−5 B (−0.1%)	7.3 KiB	✅
Codex	Live turn WebSocket wire	6.4 KiB	6.3 KiB	−101 B (−1.5%)	7.8 KiB	✅
Codex	Live turn WebSocket decoded	55.5 KiB	54.7 KiB	−822 B (−1.4%)	66.4 KiB	✅
Codex	Live turn messages	9	9	0 (0.0%)	21	✅
Claude	Total thread wire	13.3 KiB	13.3 KiB	−2 B (−0.0%)	15.1 KiB	✅
Claude	Thread snapshot wire	6.9 KiB	6.9 KiB	+16 B (+0.2%)	7.3 KiB	✅
Claude	Live turn WebSocket wire	6.5 KiB	6.4 KiB	−18 B (−0.3%)	7.8 KiB	✅
Claude	Live turn WebSocket decoded	56.4 KiB	56.4 KiB	−44 B (−0.1%)	66.4 KiB	✅
Claude	Live turn messages	11	10	−1 (−9.1%)	21	✅

Baseline: 3d6035f · PR result: c7eaf6a · 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]

Review note — inherited limitation, deliberately not fixed here.

The Configuration tab's new lg:overflow-y-auto scroller sits inside the wrapper
carrying inert={readOnly}. On a view-only environment at lg width with config
content taller than the pane, the scroller is not focusable and its contents are
inert, so the bottom of the read-only configuration may be unreachable — the page
scroller used to handle that.

Upstream has the identical structure (readOnly came from #8380, the scroller
from #8472), so this is not a Pylon regression and not something this adoption
introduces. Fixing it means moving inert off the scrolling element onto an inner
wrapper, which is a structural divergence from upstream and a separate concern
from the layout fix. Flagging it here so it is on the record rather than silently
carried.

Also cosmetic and identical upstream: at lg width but short height (e.g.
1280x600) the lg:min-h-[30rem] floor can produce nested page-then-pane
scrolling.

[rynfar]

Before / after

Captured against the seeded database at 1280x860, same provider (Codex), same
Configuration tab, toasts dismissed.

Before — the panel has no height of its own, so the editor runs past the
viewport and the whole page scrolls. Advanced is off-screen entirely.

After — the grid is height-bounded, the editor pane scrolls internally (note
"Path to the Codex binary…" clipped at the pane edge rather than the page edge),
the list pane keeps its own footer, and Advanced is now visible below the
panel instead of being pushed off-screen.

Verification note: the first capture attempt produced an identical-looking
"after" because Vite was still serving the pre-switch module — confirmed by
curling /src/components/settings/ProviderSettingsPanel.tsx and finding zero
occurrences of the new min(38rem…) class. The dev server was restarted and the
class confirmed served before recapturing, so these two images really do differ
by this branch.

The account email stays in the editor header in both, which is the placement this
PR deliberately keeps rather than adopting upstream's Configuration-tab field.

[rynfar]

Selecting a different provider account resized the whole settings panel. The
master-detail grid had no height of its own, so the editor pane grew to fit
whichever account was open and the surrounding page reflowed. The models list
was separately capped at a max-h-40 scroll box no matter how much room the
editor had.

Gives the grid a fixed height (lg:h-[min(38rem,calc(100dvh-16rem))] with a
30rem floor), makes the list and editor panes scroll independently, pins the
headers and tab strip with shrink-0, and lets the models list grow to fill the
editor.

Adopted from T3 Code f276e632c5a7952655e2455aef3b86c08164b988
(pingdotgg/t3code#8472) — the follow-up to the provider settings split Pylon
adopted in #125.

Adaptation

Upstream #8472 also re-added the account email as a labelled Account email
field in the Configuration tab. Pylon already shows it in the editor header, so
that half is deliberately not adopted: taking both would render the same
redacted address twice in one panel.

Four conflicts, all resolved Pylon-first, preserving:

• the richer ProviderAuthEmail (prefix/separator variant used by the header);
• the widened showEditorStatus (also true when disabled, when an email exists,
  or when sign-in is offered);
• the disabled-account detail message;
• the Provider usage block and its ProviderUsageRows.

Upstream's test for the Configuration placement is retargeted at Pylon's header
placement, keeps its security assertion, and gains a guard that the Configuration
field stays absent. It also needed Pylon's required timestampFormat prop, which
upstream's card does not have — that surfaced as a typecheck error, not a test
failure, since React tolerates the missing prop at runtime.

Verification

• vp test run ProviderInstanceCard.test.ts ProviderSettingsPanel.environment.test.tsx — 9 passed
• vp run -F @t3tools/web typecheck — clean
• vp lint + vp fmt on the four changed files — clean
• Mutation probes on the adapted test, both directions:
  • removing the redacted email from the editor header fails it
    (expected … to contain 'aria-label="Toggle account email visibility"');
  • re-adding upstream's Configuration field fails it
    (expected … not to contain 'Account email').
    The second probe initially passed for the wrong reason — my first injection
    landed somewhere unrendered — so the guard was re-verified against a checked
    insertion point rather than assumed non-vacuous.

Before/after images are pending; this is one of several web changes in the
current upstream batch and they will get one consolidated real-client pass
rather than five separate dev-server runs.

Claude Opus 5 via Claude Code.

---

^{Need help on this PR? Tag @codesmith-bot with what you need. Autofix is disabled.}

[github-actions]

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.2 KiB	−106 B (−0.8%)	15.1 KiB	✅
Codex	Thread snapshot wire	6.9 KiB	6.9 KiB	−5 B (−0.1%)	7.3 KiB	✅
Codex	Live turn WebSocket wire	6.4 KiB	6.3 KiB	−101 B (−1.5%)	7.8 KiB	✅
Codex	Live turn WebSocket decoded	55.5 KiB	54.7 KiB	−822 B (−1.4%)	66.4 KiB	✅
Codex	Live turn messages	9	9	0 (0.0%)	21	✅
Claude	Total thread wire	13.3 KiB	13.3 KiB	−2 B (−0.0%)	15.1 KiB	✅
Claude	Thread snapshot wire	6.9 KiB	6.9 KiB	+16 B (+0.2%)	7.3 KiB	✅
Claude	Live turn WebSocket wire	6.5 KiB	6.4 KiB	−18 B (−0.3%)	7.8 KiB	✅
Claude	Live turn WebSocket decoded	56.4 KiB	56.4 KiB	−44 B (−0.1%)	66.4 KiB	✅
Claude	Live turn messages	11	10	−1 (−9.1%)	21	✅

Baseline: 3d6035f · PR result: c7eaf6a · 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]

Review note — inherited limitation, deliberately not fixed here.

The Configuration tab's new lg:overflow-y-auto scroller sits inside the wrapper
carrying inert={readOnly}. On a view-only environment at lg width with config
content taller than the pane, the scroller is not focusable and its contents are
inert, so the bottom of the read-only configuration may be unreachable — the page
scroller used to handle that.

Upstream has the identical structure (readOnly came from #8380, the scroller
from #8472), so this is not a Pylon regression and not something this adoption
introduces. Fixing it means moving inert off the scrolling element onto an inner
wrapper, which is a structural divergence from upstream and a separate concern
from the layout fix. Flagging it here so it is on the record rather than silently
carried.

Also cosmetic and identical upstream: at lg width but short height (e.g.
1280x600) the lg:min-h-[30rem] floor can produce nested page-then-pane
scrolling.

[rynfar]

Before / after

Captured against the seeded database at 1280x860, same provider (Codex), same
Configuration tab, toasts dismissed.

Before — the panel has no height of its own, so the editor runs past the
viewport and the whole page scrolls. Advanced is off-screen entirely.

After — the grid is height-bounded, the editor pane scrolls internally (note
"Path to the Codex binary…" clipped at the pane edge rather than the page edge),
the list pane keeps its own footer, and Advanced is now visible below the
panel instead of being pushed off-screen.

Verification note: the first capture attempt produced an identical-looking
"after" because Vite was still serving the pre-switch module — confirmed by
curling /src/components/settings/ProviderSettingsPanel.tsx and finding zero
occurrences of the new min(38rem…) class. The dev server was restarted and the
class confirmed served before recapturing, so these two images really do differ
by this branch.

The account email stays in the editor header in both, which is the placement this
PR deliberately keeps rather than adopting upstream's Configuration-tab field.

[rynfar]

Selecting a different provider account resized the whole settings panel. The
master-detail grid had no height of its own, so the editor pane grew to fit
whichever account was open and the surrounding page reflowed. The models list
was separately capped at a max-h-40 scroll box no matter how much room the
editor had.

Gives the grid a fixed height (lg:h-[min(38rem,calc(100dvh-16rem))] with a
30rem floor), makes the list and editor panes scroll independently, pins the
headers and tab strip with shrink-0, and lets the models list grow to fill the
editor.

Adopted from T3 Code f276e632c5a7952655e2455aef3b86c08164b988
(pingdotgg/t3code#8472) — the follow-up to the provider settings split Pylon
adopted in #125.

Adaptation

Upstream #8472 also re-added the account email as a labelled Account email
field in the Configuration tab. Pylon already shows it in the editor header, so
that half is deliberately not adopted: taking both would render the same
redacted address twice in one panel.

Four conflicts, all resolved Pylon-first, preserving:

• the richer ProviderAuthEmail (prefix/separator variant used by the header);
• the widened showEditorStatus (also true when disabled, when an email exists,
  or when sign-in is offered);
• the disabled-account detail message;
• the Provider usage block and its ProviderUsageRows.

Upstream's test for the Configuration placement is retargeted at Pylon's header
placement, keeps its security assertion, and gains a guard that the Configuration
field stays absent. It also needed Pylon's required timestampFormat prop, which
upstream's card does not have — that surfaced as a typecheck error, not a test
failure, since React tolerates the missing prop at runtime.

Verification

• vp test run ProviderInstanceCard.test.ts ProviderSettingsPanel.environment.test.tsx — 9 passed
• vp run -F @t3tools/web typecheck — clean
• vp lint + vp fmt on the four changed files — clean
• Mutation probes on the adapted test, both directions:
  • removing the redacted email from the editor header fails it
    (expected … to contain 'aria-label="Toggle account email visibility"');
  • re-adding upstream's Configuration field fails it
    (expected … not to contain 'Account email').
    The second probe initially passed for the wrong reason — my first injection
    landed somewhere unrendered — so the guard was re-verified against a checked
    insertion point rather than assumed non-vacuous.

Before/after images are pending; this is one of several web changes in the
current upstream batch and they will get one consolidated real-client pass
rather than five separate dev-server runs.

Claude Opus 5 via Claude Code.

---

^{Need help on this PR? Tag @codesmith-bot with what you need. Autofix is disabled.}

[github-actions]

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.2 KiB	−106 B (−0.8%)	15.1 KiB	✅
Codex	Thread snapshot wire	6.9 KiB	6.9 KiB	−5 B (−0.1%)	7.3 KiB	✅
Codex	Live turn WebSocket wire	6.4 KiB	6.3 KiB	−101 B (−1.5%)	7.8 KiB	✅
Codex	Live turn WebSocket decoded	55.5 KiB	54.7 KiB	−822 B (−1.4%)	66.4 KiB	✅
Codex	Live turn messages	9	9	0 (0.0%)	21	✅
Claude	Total thread wire	13.3 KiB	13.3 KiB	−2 B (−0.0%)	15.1 KiB	✅
Claude	Thread snapshot wire	6.9 KiB	6.9 KiB	+16 B (+0.2%)	7.3 KiB	✅
Claude	Live turn WebSocket wire	6.5 KiB	6.4 KiB	−18 B (−0.3%)	7.8 KiB	✅
Claude	Live turn WebSocket decoded	56.4 KiB	56.4 KiB	−44 B (−0.1%)	66.4 KiB	✅
Claude	Live turn messages	11	10	−1 (−9.1%)	21	✅

Baseline: 3d6035f · PR result: c7eaf6a · 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]

Review note — inherited limitation, deliberately not fixed here.

The Configuration tab's new lg:overflow-y-auto scroller sits inside the wrapper
carrying inert={readOnly}. On a view-only environment at lg width with config
content taller than the pane, the scroller is not focusable and its contents are
inert, so the bottom of the read-only configuration may be unreachable — the page
scroller used to handle that.

Upstream has the identical structure (readOnly came from #8380, the scroller
from #8472), so this is not a Pylon regression and not something this adoption
introduces. Fixing it means moving inert off the scrolling element onto an inner
wrapper, which is a structural divergence from upstream and a separate concern
from the layout fix. Flagging it here so it is on the record rather than silently
carried.

Also cosmetic and identical upstream: at lg width but short height (e.g.
1280x600) the lg:min-h-[30rem] floor can produce nested page-then-pane
scrolling.

[rynfar]

Before / after

Captured against the seeded database at 1280x860, same provider (Codex), same
Configuration tab, toasts dismissed.

Before — the panel has no height of its own, so the editor runs past the
viewport and the whole page scrolls. Advanced is off-screen entirely.

After — the grid is height-bounded, the editor pane scrolls internally (note
"Path to the Codex binary…" clipped at the pane edge rather than the page edge),
the list pane keeps its own footer, and Advanced is now visible below the
panel instead of being pushed off-screen.

Verification note: the first capture attempt produced an identical-looking
"after" because Vite was still serving the pre-switch module — confirmed by
curling /src/components/settings/ProviderSettingsPanel.tsx and finding zero
occurrences of the new min(38rem…) class. The dev server was restarted and the
class confirmed served before recapturing, so these two images really do differ
by this branch.

The account email stays in the editor header in both, which is the placement this
PR deliberately keeps rather than adopting upstream's Configuration-tab field.

[rynfar]

Selecting a different provider account resized the whole settings panel. The
master-detail grid had no height of its own, so the editor pane grew to fit
whichever account was open and the surrounding page reflowed. The models list
was separately capped at a max-h-40 scroll box no matter how much room the
editor had.

Gives the grid a fixed height (lg:h-[min(38rem,calc(100dvh-16rem))] with a
30rem floor), makes the list and editor panes scroll independently, pins the
headers and tab strip with shrink-0, and lets the models list grow to fill the
editor.

Adopted from T3 Code f276e632c5a7952655e2455aef3b86c08164b988
(pingdotgg/t3code#8472) — the follow-up to the provider settings split Pylon
adopted in #125.

Adaptation

Upstream #8472 also re-added the account email as a labelled Account email
field in the Configuration tab. Pylon already shows it in the editor header, so
that half is deliberately not adopted: taking both would render the same
redacted address twice in one panel.

Four conflicts, all resolved Pylon-first, preserving:

• the richer ProviderAuthEmail (prefix/separator variant used by the header);
• the widened showEditorStatus (also true when disabled, when an email exists,
  or when sign-in is offered);
• the disabled-account detail message;
• the Provider usage block and its ProviderUsageRows.

Upstream's test for the Configuration placement is retargeted at Pylon's header
placement, keeps its security assertion, and gains a guard that the Configuration
field stays absent. It also needed Pylon's required timestampFormat prop, which
upstream's card does not have — that surfaced as a typecheck error, not a test
failure, since React tolerates the missing prop at runtime.

Verification

• vp test run ProviderInstanceCard.test.ts ProviderSettingsPanel.environment.test.tsx — 9 passed
• vp run -F @t3tools/web typecheck — clean
• vp lint + vp fmt on the four changed files — clean
• Mutation probes on the adapted test, both directions:
  • removing the redacted email from the editor header fails it
    (expected … to contain 'aria-label="Toggle account email visibility"');
  • re-adding upstream's Configuration field fails it
    (expected … not to contain 'Account email').
    The second probe initially passed for the wrong reason — my first injection
    landed somewhere unrendered — so the guard was re-verified against a checked
    insertion point rather than assumed non-vacuous.

Before/after images are pending; this is one of several web changes in the
current upstream batch and they will get one consolidated real-client pass
rather than five separate dev-server runs.

Claude Opus 5 via Claude Code.

---

^{Need help on this PR? Tag @codesmith-bot with what you need. Autofix is disabled.}

[github-actions]

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.2 KiB	−106 B (−0.8%)	15.1 KiB	✅
Codex	Thread snapshot wire	6.9 KiB	6.9 KiB	−5 B (−0.1%)	7.3 KiB	✅
Codex	Live turn WebSocket wire	6.4 KiB	6.3 KiB	−101 B (−1.5%)	7.8 KiB	✅
Codex	Live turn WebSocket decoded	55.5 KiB	54.7 KiB	−822 B (−1.4%)	66.4 KiB	✅
Codex	Live turn messages	9	9	0 (0.0%)	21	✅
Claude	Total thread wire	13.3 KiB	13.3 KiB	−2 B (−0.0%)	15.1 KiB	✅
Claude	Thread snapshot wire	6.9 KiB	6.9 KiB	+16 B (+0.2%)	7.3 KiB	✅
Claude	Live turn WebSocket wire	6.5 KiB	6.4 KiB	−18 B (−0.3%)	7.8 KiB	✅
Claude	Live turn WebSocket decoded	56.4 KiB	56.4 KiB	−44 B (−0.1%)	66.4 KiB	✅
Claude	Live turn messages	11	10	−1 (−9.1%)	21	✅

Baseline: 3d6035f · PR result: c7eaf6a · 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]

Review note — inherited limitation, deliberately not fixed here.

The Configuration tab's new lg:overflow-y-auto scroller sits inside the wrapper
carrying inert={readOnly}. On a view-only environment at lg width with config
content taller than the pane, the scroller is not focusable and its contents are
inert, so the bottom of the read-only configuration may be unreachable — the page
scroller used to handle that.

Upstream has the identical structure (readOnly came from #8380, the scroller
from #8472), so this is not a Pylon regression and not something this adoption
introduces. Fixing it means moving inert off the scrolling element onto an inner
wrapper, which is a structural divergence from upstream and a separate concern
from the layout fix. Flagging it here so it is on the record rather than silently
carried.

Also cosmetic and identical upstream: at lg width but short height (e.g.
1280x600) the lg:min-h-[30rem] floor can produce nested page-then-pane
scrolling.

[rynfar]

Before / after

Captured against the seeded database at 1280x860, same provider (Codex), same
Configuration tab, toasts dismissed.

Before — the panel has no height of its own, so the editor runs past the
viewport and the whole page scrolls. Advanced is off-screen entirely.

After — the grid is height-bounded, the editor pane scrolls internally (note
"Path to the Codex binary…" clipped at the pane edge rather than the page edge),
the list pane keeps its own footer, and Advanced is now visible below the
panel instead of being pushed off-screen.

Verification note: the first capture attempt produced an identical-looking
"after" because Vite was still serving the pre-switch module — confirmed by
curling /src/components/settings/ProviderSettingsPanel.tsx and finding zero
occurrences of the new min(38rem…) class. The dev server was restarted and the
class confirmed served before recapturing, so these two images really do differ
by this branch.

The account email stays in the editor header in both, which is the placement this
PR deliberately keeps rather than adopting upstream's Configuration-tab field.

[rynfar]

Selecting a different provider account resized the whole settings panel. The
master-detail grid had no height of its own, so the editor pane grew to fit
whichever account was open and the surrounding page reflowed. The models list
was separately capped at a max-h-40 scroll box no matter how much room the
editor had.

Gives the grid a fixed height (lg:h-[min(38rem,calc(100dvh-16rem))] with a
30rem floor), makes the list and editor panes scroll independently, pins the
headers and tab strip with shrink-0, and lets the models list grow to fill the
editor.

Adopted from T3 Code f276e632c5a7952655e2455aef3b86c08164b988
(pingdotgg/t3code#8472) — the follow-up to the provider settings split Pylon
adopted in #125.

Adaptation

Upstream #8472 also re-added the account email as a labelled Account email
field in the Configuration tab. Pylon already shows it in the editor header, so
that half is deliberately not adopted: taking both would render the same
redacted address twice in one panel.

Four conflicts, all resolved Pylon-first, preserving:

• the richer ProviderAuthEmail (prefix/separator variant used by the header);
• the widened showEditorStatus (also true when disabled, when an email exists,
  or when sign-in is offered);
• the disabled-account detail message;
• the Provider usage block and its ProviderUsageRows.

Upstream's test for the Configuration placement is retargeted at Pylon's header
placement, keeps its security assertion, and gains a guard that the Configuration
field stays absent. It also needed Pylon's required timestampFormat prop, which
upstream's card does not have — that surfaced as a typecheck error, not a test
failure, since React tolerates the missing prop at runtime.

Verification

• vp test run ProviderInstanceCard.test.ts ProviderSettingsPanel.environment.test.tsx — 9 passed
• vp run -F @t3tools/web typecheck — clean
• vp lint + vp fmt on the four changed files — clean
• Mutation probes on the adapted test, both directions:
  • removing the redacted email from the editor header fails it
    (expected … to contain 'aria-label="Toggle account email visibility"');
  • re-adding upstream's Configuration field fails it
    (expected … not to contain 'Account email').
    The second probe initially passed for the wrong reason — my first injection
    landed somewhere unrendered — so the guard was re-verified against a checked
    insertion point rather than assumed non-vacuous.

Before/after images are pending; this is one of several web changes in the
current upstream batch and they will get one consolidated real-client pass
rather than five separate dev-server runs.

Claude Opus 5 via Claude Code.

---

^{Need help on this PR? Tag @codesmith-bot with what you need. Autofix is disabled.}

[github-actions]

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.2 KiB	−106 B (−0.8%)	15.1 KiB	✅
Codex	Thread snapshot wire	6.9 KiB	6.9 KiB	−5 B (−0.1%)	7.3 KiB	✅
Codex	Live turn WebSocket wire	6.4 KiB	6.3 KiB	−101 B (−1.5%)	7.8 KiB	✅
Codex	Live turn WebSocket decoded	55.5 KiB	54.7 KiB	−822 B (−1.4%)	66.4 KiB	✅
Codex	Live turn messages	9	9	0 (0.0%)	21	✅
Claude	Total thread wire	13.3 KiB	13.3 KiB	−2 B (−0.0%)	15.1 KiB	✅
Claude	Thread snapshot wire	6.9 KiB	6.9 KiB	+16 B (+0.2%)	7.3 KiB	✅
Claude	Live turn WebSocket wire	6.5 KiB	6.4 KiB	−18 B (−0.3%)	7.8 KiB	✅
Claude	Live turn WebSocket decoded	56.4 KiB	56.4 KiB	−44 B (−0.1%)	66.4 KiB	✅
Claude	Live turn messages	11	10	−1 (−9.1%)	21	✅

Baseline: 3d6035f · PR result: c7eaf6a · 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]

Review note — inherited limitation, deliberately not fixed here.

The Configuration tab's new lg:overflow-y-auto scroller sits inside the wrapper
carrying inert={readOnly}. On a view-only environment at lg width with config
content taller than the pane, the scroller is not focusable and its contents are
inert, so the bottom of the read-only configuration may be unreachable — the page
scroller used to handle that.

Upstream has the identical structure (readOnly came from #8380, the scroller
from #8472), so this is not a Pylon regression and not something this adoption
introduces. Fixing it means moving inert off the scrolling element onto an inner
wrapper, which is a structural divergence from upstream and a separate concern
from the layout fix. Flagging it here so it is on the record rather than silently
carried.

Also cosmetic and identical upstream: at lg width but short height (e.g.
1280x600) the lg:min-h-[30rem] floor can produce nested page-then-pane
scrolling.

[rynfar]

Before / after

Captured against the seeded database at 1280x860, same provider (Codex), same
Configuration tab, toasts dismissed.

Before — the panel has no height of its own, so the editor runs past the
viewport and the whole page scrolls. Advanced is off-screen entirely.

After — the grid is height-bounded, the editor pane scrolls internally (note
"Path to the Codex binary…" clipped at the pane edge rather than the page edge),
the list pane keeps its own footer, and Advanced is now visible below the
panel instead of being pushed off-screen.

Verification note: the first capture attempt produced an identical-looking
"after" because Vite was still serving the pre-switch module — confirmed by
curling /src/components/settings/ProviderSettingsPanel.tsx and finding zero
occurrences of the new min(38rem…) class. The dev server was restarted and the
class confirmed served before recapturing, so these two images really do differ
by this branch.

The account email stays in the editor header in both, which is the placement this
PR deliberately keeps rather than adopting upstream's Configuration-tab field.

[rynfar]

Selecting a different provider account resized the whole settings panel. The
master-detail grid had no height of its own, so the editor pane grew to fit
whichever account was open and the surrounding page reflowed. The models list
was separately capped at a max-h-40 scroll box no matter how much room the
editor had.

Gives the grid a fixed height (lg:h-[min(38rem,calc(100dvh-16rem))] with a
30rem floor), makes the list and editor panes scroll independently, pins the
headers and tab strip with shrink-0, and lets the models list grow to fill the
editor.

Adopted from T3 Code f276e632c5a7952655e2455aef3b86c08164b988
(pingdotgg/t3code#8472) — the follow-up to the provider settings split Pylon
adopted in #125.

Adaptation

Upstream #8472 also re-added the account email as a labelled Account email
field in the Configuration tab. Pylon already shows it in the editor header, so
that half is deliberately not adopted: taking both would render the same
redacted address twice in one panel.

Four conflicts, all resolved Pylon-first, preserving:

• the richer ProviderAuthEmail (prefix/separator variant used by the header);
• the widened showEditorStatus (also true when disabled, when an email exists,
  or when sign-in is offered);
• the disabled-account detail message;
• the Provider usage block and its ProviderUsageRows.

Upstream's test for the Configuration placement is retargeted at Pylon's header
placement, keeps its security assertion, and gains a guard that the Configuration
field stays absent. It also needed Pylon's required timestampFormat prop, which
upstream's card does not have — that surfaced as a typecheck error, not a test
failure, since React tolerates the missing prop at runtime.

Verification

• vp test run ProviderInstanceCard.test.ts ProviderSettingsPanel.environment.test.tsx — 9 passed
• vp run -F @t3tools/web typecheck — clean
• vp lint + vp fmt on the four changed files — clean
• Mutation probes on the adapted test, both directions:
  • removing the redacted email from the editor header fails it
    (expected … to contain 'aria-label="Toggle account email visibility"');
  • re-adding upstream's Configuration field fails it
    (expected … not to contain 'Account email').
    The second probe initially passed for the wrong reason — my first injection
    landed somewhere unrendered — so the guard was re-verified against a checked
    insertion point rather than assumed non-vacuous.

Before/after images are pending; this is one of several web changes in the
current upstream batch and they will get one consolidated real-client pass
rather than five separate dev-server runs.

Claude Opus 5 via Claude Code.

---

^{Need help on this PR? Tag @codesmith-bot with what you need. Autofix is disabled.}

[github-actions]

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.2 KiB	−106 B (−0.8%)	15.1 KiB	✅
Codex	Thread snapshot wire	6.9 KiB	6.9 KiB	−5 B (−0.1%)	7.3 KiB	✅
Codex	Live turn WebSocket wire	6.4 KiB	6.3 KiB	−101 B (−1.5%)	7.8 KiB	✅
Codex	Live turn WebSocket decoded	55.5 KiB	54.7 KiB	−822 B (−1.4%)	66.4 KiB	✅
Codex	Live turn messages	9	9	0 (0.0%)	21	✅
Claude	Total thread wire	13.3 KiB	13.3 KiB	−2 B (−0.0%)	15.1 KiB	✅
Claude	Thread snapshot wire	6.9 KiB	6.9 KiB	+16 B (+0.2%)	7.3 KiB	✅
Claude	Live turn WebSocket wire	6.5 KiB	6.4 KiB	−18 B (−0.3%)	7.8 KiB	✅
Claude	Live turn WebSocket decoded	56.4 KiB	56.4 KiB	−44 B (−0.1%)	66.4 KiB	✅
Claude	Live turn messages	11	10	−1 (−9.1%)	21	✅

Baseline: 3d6035f · PR result: c7eaf6a · 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]

Review note — inherited limitation, deliberately not fixed here.

The Configuration tab's new lg:overflow-y-auto scroller sits inside the wrapper
carrying inert={readOnly}. On a view-only environment at lg width with config
content taller than the pane, the scroller is not focusable and its contents are
inert, so the bottom of the read-only configuration may be unreachable — the page
scroller used to handle that.

Upstream has the identical structure (readOnly came from #8380, the scroller
from #8472), so this is not a Pylon regression and not something this adoption
introduces. Fixing it means moving inert off the scrolling element onto an inner
wrapper, which is a structural divergence from upstream and a separate concern
from the layout fix. Flagging it here so it is on the record rather than silently
carried.

Also cosmetic and identical upstream: at lg width but short height (e.g.
1280x600) the lg:min-h-[30rem] floor can produce nested page-then-pane
scrolling.

[rynfar]

Before / after

Captured against the seeded database at 1280x860, same provider (Codex), same
Configuration tab, toasts dismissed.

Before — the panel has no height of its own, so the editor runs past the
viewport and the whole page scrolls. Advanced is off-screen entirely.

After — the grid is height-bounded, the editor pane scrolls internally (note
"Path to the Codex binary…" clipped at the pane edge rather than the page edge),
the list pane keeps its own footer, and Advanced is now visible below the
panel instead of being pushed off-screen.

Verification note: the first capture attempt produced an identical-looking
"after" because Vite was still serving the pre-switch module — confirmed by
curling /src/components/settings/ProviderSettingsPanel.tsx and finding zero
occurrences of the new min(38rem…) class. The dev server was restarted and the
class confirmed served before recapturing, so these two images really do differ
by this branch.

The account email stays in the editor header in both, which is the placement this
PR deliberately keeps rather than adopting upstream's Configuration-tab field.