Skip to content

Show OpenRouter first in onboarding provider dialog #4379

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
wwwillchen merged 1 commit into from
Aug 27, 2026
+11 −7
Merged

Show OpenRouter first in onboarding provider dialog #4379

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion AGENTS.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,7 @@ When you create a new git worktree for this repository, run `npm install` inside

After installation, verify that `node_modules/.bin/oxfmt` exists before running formatting. If `npm install` reports success without materializing `node_modules`, run `npm ci`; otherwise `npx` may download an unpinned formatter and rewrite unrelated files.

A worktree's `node_modules` can also be _sparsely_ populated — every package directory exists, so `npm install` exits 0 and repairs nothing, but files inside are missing (`Cannot find module '.../oxfmt/dist/cli.js'`, `oxlint/dist/cli.js`, or a dangling `.bin/tsgo` symlink). Deleting the broken package directories and rerunning `npm install` then aborts at the `better-sqlite3` native rebuild (`gyp ERR! not ok`) before any JS package is written. Use `npm install --ignore-scripts` to restore the JS toolchain; it skips the native rebuild, which `npm run fmt` / `lint` / `ts` do not need.
A worktree's `node_modules` can also be _sparsely_ populated — every package directory exists, so `npm install` exits 0 and repairs nothing, but files inside are missing (`Cannot find module '.../oxfmt/dist/cli.js'`, `oxlint/dist/cli.js`, or a dangling `.bin/tsgo` symlink). Deleting the broken package directories and rerunning `npm install` then aborts at the `better-sqlite3` native rebuild (`gyp ERR! not ok`) before any JS package is written. Use `npm install --ignore-scripts` to restore the JS toolchain; it skips the native rebuild, which `npm run fmt` / `lint` / `ts` do not need. If you subsequently need `npm run build`, run `npm rebuild dugite` first; otherwise Electron Forge packaging fails with `ENOENT: no such file or directory, lstat 'node_modules/dugite/git'`.

Also run `npm install` in `testing/fake-llm-server/` before `npm run ts` in a fresh worktree. Otherwise the root type-check reports missing declarations for that package's local `express` and `cors` dependencies.

Expand Down
4 changes: 4 additions & 0 deletions e2e-tests/setup.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,10 @@ const testSetup = testWithConfig({

testSetup("setup ai provider", async ({ po }) => {
const dialog = await openAiSetupDialog(po);
const providerButtons = dialog.locator(".grid").getByRole("button");

@dyad-assistant dyad-assistant Bot Aug 26, 2026

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.

🟡 MEDIUM

Ordering assertion anchored to Tailwind .grid utility class

The new ordering assertion resolves the provider buttons through the Tailwind utility class .grid. The Base UI dialog popup itself also carries a grid class (src/components/ui/dialog.tsx:53); this works today only because Locator.locator() matches descendants rather than the root. Because a chained locator over several .grid matches does not raise a strict-mode error, adding any grid-classed wrapper inside the dialog later would silently change which elements nth(0)/nth(1) resolve to, turning a real ordering regression into a passing (or confusingly failing) test rather than a clear failure. Styling classes are not a stable contract for structural assertions.

💡 Suggestion: Add a stable hook to the provider row in SetupBanner.tsx (e.g. data-testid="provider-options") and locate via dialog.getByTestId("provider-options").getByRole("button"), so the assertion no longer depends on Tailwind class names.


await expect(providerButtons.nth(0)).toHaveAccessibleName(/OpenRouter/);
await expect(providerButtons.nth(1)).toHaveAccessibleName(/Google/);

await dialog.getByRole("button", { name: /Google/ }).click();
await expect(
Expand Down
12 changes: 6 additions & 6 deletions src/components/SetupBanner.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -153,12 +153,6 @@ export function SetupBanner({
Or use your own API key
</p>
<div className="grid gap-2 sm:grid-cols-3">
<ProviderOptionButton
label="Google"
chip="Free"
onClick={handleGoogleSetupClick}
icon={<img src={googleIcon} alt="Google" className="size-4" />}
/>
<ProviderOptionButton
label="OpenRouter"
chip="Free"
Expand All @@ -171,6 +165,12 @@ export function SetupBanner({
/>
}
/>
<ProviderOptionButton
label="Google"
chip="Free"
onClick={handleGoogleSetupClick}
icon={<img src={googleIcon} alt="Google" className="size-4" />}
/>
<ProviderOptionButton
label="Other providers"
onClick={handleOtherProvidersClick}
Expand Down
Loading