pingdotgg / pingdotgg/t3code

[Bug]: Providers settings page makes the Configuration form the focus instead of provider list and models (regression from #8380)

Open
#8,521 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
23k
Forks
5.9k
Avg merge
11h 14m
Merged PRs (30d)
357

Description

Before submitting
  • I searched existing issues and did not find a duplicate.
  • I included enough detail to reproduce or investigate the problem.
Area

apps/web

Summary

Since #8380 (feat(web): split provider settings into list and editor, merged 2026-08-27) the Providers page is dominated by a wide editor pane whose default tab is Configuration — display name, accent color, environment variables, binary path. Those are set-once, rarely-touched settings, yet they are now the hero of the page. The information users actually scan and change day to day (which providers exist, their auth/status, on/off, and the Models list) is squeezed into a narrow 20rem column or hidden behind a second click.

#8472 (fix(web): stabilize the provider settings editor) fixed the editor height jump and restored the account email, but kept this hierarchy.

Steps to reproduce
  1. Open Settings → Providers on a desktop-width window (≥ lg).
  2. Observe the page without clicking anything.
Expected behavior
  • The first thing on screen is the provider list with status and enable switches, readable without truncation.
  • Selecting a provider surfaces the Models tab (or the last-used tab), since that is what users change most.
  • Instance plumbing (display name, accent color, env vars, binary path) is available but secondary — e.g. a collapsed section, or at least not the default tab.
Actual behavior
  • ProviderInstanceCard initialises activeTab to "configuration" (apps/web/src/components/settings/ProviderInstanceCard.tsx:429 on main @ 4c51b4c9b), so every provider you click opens on the Configuration form even though Models is listed first in the tab bar.
  • The grid is lg:grid-cols-[20rem_minmax(0,1fr)] (ProviderSettingsPanel.tsx:840), so the editor takes ~70% of the width while the list truncates its status line ("Authenticated · ChatGPT Plus Subscri…").
  • The list column is mostly empty space below the seven providers while the editor column scrolls internally.
  • Net effect: a low-value form is the visual focus of the page, and the screen looks worse than the pre-#8380 single-column list to the people who only ever toggle providers and models.
Suggested direction
  • Default activeTab to "models" when the driver is known (fall back to "configuration" only when there is no driver option), and/or persist the last-used tab.
  • Fold display name / accent color / env vars / binary path under an "Instance settings" or "Advanced" disclosure inside the editor.
  • Give the list column enough width to show the full status line, or move the status detail to the editor header and keep the list to name + dot + switch.
Impact

Minor bug or occasional failure (UX regression; nothing is broken functionally)

Version or commit

Regressed in main @ e2d4d12a8 (#8380); still present at 4c51b4c9b (main, 2026-08-28). Observed on the desktop nightly build.

Environment

macOS desktop app connected to a local environment plus a remote Windows environment; Codex v0.150.1 authenticated. Provider count: 7 instances.

Screenshots, recordings, or supporting files

Screenshot of the Providers page to be attached in a follow-up comment (cannot be uploaded via API).

Related
  • #8380 — introduced the master–detail layout and the Configuration default tab
  • #8472 — follow-up that stabilised editor height and restored the account email; does not change the hierarchy

Filed by Claude (claude-fable-5) via Claude Code on behalf of @abdulbari149.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start in apps/web/src/components/settings/ProviderInstanceCard.tsx around line 429 and inspect how the active tab is initialized, then review the layout in ProviderSettingsPanel.tsx around line 840. Compare the provider list and editor at desktop widths, and use the reported expected behavior as the completion check: the list remains readable and Models or the last-used tab receives primary focus while configuration stays secondary.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
design, frontend
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Active
Clarity
Mostly clear
Newbie friendliness
55/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.