🌐 US-Proxy
class="logged-out env-production page-responsive" style="word-wrap: break-word;" >
Skip to content

feat: add custom AI provider icons and instance-based model picker grouping - #27026

Merged
DanielleMaywood merged 3 commits into
mainfrom
dm/provider-display-grouping-icons
Jul 6, 2026
Merged

feat: add custom AI provider icons and instance-based model picker grouping#27026
DanielleMaywood merged 3 commits into
mainfrom
dm/provider-display-grouping-icons

Conversation

@DanielleMaywood

Copy link
Copy Markdown
Contributor

Custom AI providers (e.g. an anthropic-compatible provider named "Hyper") were shown under their provider type label ("Anthropic") in the chat model picker, and providers had no way to set a custom icon.

Changes

Model picker grouping/labels

  • The chat model picker (and the subagent model override picker) now groups models by provider instance instead of provider type, labeling each group with the provider's display name and falling back to the type label. Two providers of the same type form separate groups.
  • Group headings show the provider icon (custom icon when set, type icon otherwise).

Custom provider icons

  • New migration adds an icon column to ai_providers, plumbed through queries, audit table, codersdk (AIProvider, create/update requests, AIProviderSummary, ChatProviderConfig, UserChatProviderConfig), and handlers.
  • The provider create/update form gains an icon field using the same IconPickerField as the MCP servers page, pre-filled with the current type-based icon. The page header avatar live-previews the picked icon.
  • ProviderIcon and the providers list prefer the custom icon over the type mapping.

Shared IconPickerField fix

  • Clicks inside the portaled emoji picker bubbled through the React tree to InputGroupAddon's click handler, which refocused the text input (stealing focus from the picker's search box and dismissing the popover). Fixed with a stopPropagation on the popover content; verified in a real browser on both the provider and MCP server forms.

Out of scope: the type-based icon maps on the AI Gateway pages and ChatModelAdminPanel are unchanged; they render historical usage by provider type.

Testing

  • make gen, make fmt, make lint, pnpm check, tsc
  • Go: TestAIProvidersCRUD, TestUserAIProviderKeys
  • Frontend: modelOptions.test.ts, ModelSelector.test.tsx, providerFormApiMap.test.ts; new/updated Storybook stories
  • Emoji picker focus/dismissal behavior verified in Chromium via Storybook + Playwright
Decision log
  • Grouping fix adds providerId/providerLabel/providerIcon to ModelSelectorOption rather than repurposing the existing provider (type) field, which is still used for icon fallback and selection semantics.
  • Icon stored as icon (matching the templates pattern) rather than icon_url; the form reuses the MCP page's IconPickerField per review feedback, replacing the initial IconField approach.
  • Icon field is pre-filled with the type-based default icon on create and edit, so saved providers keep today's icon unless changed.
  • An earlier onFocusOutside guard in IconPickerField was removed once the InputGroupAddon focus-steal root cause was found; the surviving fix is a single stopPropagation.
  • ProviderForm notifies the page header of icon changes via a direct onIconChange callback in the change handler (no useEffect on state).

🤖 This PR was generated by Coder Agents on behalf of @DanielleMaywood.

@github-actions

github-actions Bot commented Jul 6, 2026

Copy link
Copy Markdown

Docs preview

📖 View docs preview for docs/admin/security/audit-logs.md

@DanielleMaywood
DanielleMaywood marked this pull request as ready for review July 6, 2026 21:38
@DanielleMaywood
DanielleMaywood merged commit d517624 into main Jul 6, 2026
37 of 38 checks passed
@DanielleMaywood
DanielleMaywood deleted the dm/provider-display-grouping-icons branch July 6, 2026 22:00
@github-actions github-actions Bot locked and limited conversation to collaborators Jul 6, 2026
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants