feat(providers): custom icon URL for compatible providers#2166
Open
whale9820 wants to merge 1 commit into
Open
feat(providers): custom icon URL for compatible providers#2166whale9820 wants to merge 1 commit into
whale9820 wants to merge 1 commit into
Conversation
OpenAI/Anthropic-compatible (custom) providers could only ever show a hardcoded text badge (OC/AC) or a non-existent bundled icon — there was no way to set your own. This adds an optional 'Icon URL' field to the Add and Edit modals; the image is shown in the provider card grid and the provider detail header, falling back to the text badge if unset or the image fails to load. - New optional iconUrl field on provider nodes (stored in the existing JSON data blob, no schema migration) - POST/PUT /api/provider-nodes pass iconUrl through (previously dropped by field whitelisting) - nodesRepo.createProviderNode persists iconUrl - AddCompatibleModal + EditCompatibleNodeModal: one Input field each - providers list page + detail page: prefer iconUrl as the icon src - ProviderIcon already supported a remote src + text fallback; exported it from the components barrel and reused it for the remote case to avoid next/image remotePatterns config
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What
Lets users set their own icon for OpenAI/Anthropic-compatible (custom) providers via an optional Icon URL field in the Add and Edit modals. The image shows up in the provider card grid and the provider detail header, falling back to the existing text badge (OC/AC) if unset or if it fails to load.
/cc @decolua — quick note on why this is trivial to land: see "Why this is a 1-click add" below.
Why
Custom providers currently can only show a hardcoded
OC/ACtext badge, or a non-existent bundled asset (/providers/<id>.png→ 404 → text fallback). There was no way to brand a self-hosted / custom endpoint. This adds the missing optionaliconUrlfield end-to-end.Changes (8 files, +43/-4)
Data layer —
iconUrlis stored in the provider node's existing JSONdatablob, so no schema migration and it round-trips through backups automatically:src/lib/db/repos/nodesRepo.js—createProviderNodenow persistsiconUrl(was dropped by the hardcoded field list;updateProviderNodealready spread extras).POST /api/provider-nodes(route.js) — destructure + passiconUrlthrough to all three node types (openai-compatible, anthropic-compatible, custom-embedding).PUT /api/provider-nodes/[id]— passiconUrlthrough inupdates.UI — one optional
Input("Icon URL") in each modal:AddCompatibleModal.js— field + send on create.EditCompatibleNodeModal.js— field + send on save.Render — prefer
iconUrlas the iconsrc:providers/page.js— both card components + the custom-node mappings now carryiconUrl.providers/[id]/page.js— header icon; usesProviderIcon(plain<img>) for the remote case to avoidnext/imageremotePatternsconfig, keepsnext/imagefor bundled assets.shared/components/index.js— export the existingProviderIcon(it already supportedsrc+ text fallback).Why this is a 1-click add
The infrastructure already existed —
ProviderIconhas supported a remotesrcwith a text fallback since day one, and provider nodes are stored as a flexible JSON blob that already round-trips arbitrary fields throughupdateProviderNode. The only reason custom icons didn't work was a field whitelist: the API routes andcreateProviderNodeexplicitly enumerated{name, prefix, apiType, baseUrl}and silently dropped everything else, and the render sites hardcodedsrc={/providers/\${id}.png}. So this PR is almost entirely "stop dropping the field + add one text input +src={iconUrl || existing}" — no new abstractions, no DB migration, no image upload/storage, no config. The hardest decision (Next.js remote image config) is sidestepped by reusing the existing<img>-basedProviderIconfor remote URLs.Verification
node --checkpasses on all 8 edited files.iconUrlis optional; unset nodes behave exactly as before (text badge fallback).Out of scope (deliberately)
next/imageremotePatternschanges — remote icons go throughProviderIcon's plain<img>.