diff --git a/desktop/src/pages/settings/ProviderSettings.test.tsx b/desktop/src/pages/settings/ProviderSettings.test.tsx index 4d32d592a5..9e536daeab 100644 --- a/desktop/src/pages/settings/ProviderSettings.test.tsx +++ b/desktop/src/pages/settings/ProviderSettings.test.tsx @@ -195,6 +195,9 @@ describe('active sponsor providers', () => { expect(sponsor.nextElementSibling).toBe(dialog.getByRole('button', { name: 'Atlas Cloud' })) expect(within(sponsor).getByText('New')).toBeInTheDocument() expect(within(sponsor).getByLabelText('Sponsor')).toBeInTheDocument() + expect(sponsor.querySelector('img')?.getAttribute('src')).toContain('modelflare-logo') + expect(dialog.getByRole('button', { name: 'AruHub' }).querySelector('img')?.getAttribute('src')).toContain('aruhub-logo') + expect(dialog.getByRole('button', { name: 'Atlas Cloud' }).querySelector('img')).toBeNull() expect(dialog.queryByRole('button', { name: 'ApiSmart' })).not.toBeInTheDocument() fireEvent.click(sponsor) diff --git a/desktop/src/pages/settings/ProviderSettings.tsx b/desktop/src/pages/settings/ProviderSettings.tsx index edc58ef515..d13d04035a 100644 --- a/desktop/src/pages/settings/ProviderSettings.tsx +++ b/desktop/src/pages/settings/ProviderSettings.tsx @@ -30,6 +30,7 @@ import { Wrench, } from 'lucide-react' import aruhubLogo from '../../../../docs/images/sponsors/aruhub-logo.png' +import modelflareLogo from '../../../../docs/images/sponsors/modelflare-logo.png' import { useSettingsStore } from '../../stores/settingsStore' import { useProviderStore } from '../../stores/providerStore' import { useUIStore } from '../../stores/uiStore' @@ -69,6 +70,11 @@ import { getDesktopHost } from '../../lib/desktopHost' import { API_KEY_JSON_PLACEHOLDER, maskSettingsJsonSecrets, restoreSettingsJsonSecrets, stripProviderSettingsJsonEnv } from '../../lib/providerSettingsJson' import { cx } from '@/lib/cx' +const SPONSOR_LOGOS: Record = { + aruhub: aruhubLogo, + modelflare: modelflareLogo, +} + /** Section label inside the provider dialog — the same 13px label as a settings section. */ const FORM_SECTION_LABEL = 'block text-[13px] font-semibold text-[var(--color-text-secondary)]' /** Field label matching `Input`'s own, for the fields that cannot use `Input` directly. */ @@ -1730,9 +1736,9 @@ function ProviderFormModal({ open, onClose, mode, provider, presets, browserMode selected={selectedPreset.id === preset.id} onClick={() => handlePresetChange(preset)} > - {preset.id === 'aruhub' && } + {SPONSOR_LOGOS[preset.id] && } {presetLabel(preset)} - {(preset.id === 'aruhub' || preset.id === 'modelflare') && } + {SPONSOR_LOGOS[preset.id] && } {preset.isNew && ( {t('settings.providers.new')} diff --git a/docs/images/sponsors/modelflare-logo.png b/docs/images/sponsors/modelflare-logo.png new file mode 100644 index 0000000000..05613790d6 Binary files /dev/null and b/docs/images/sponsors/modelflare-logo.png differ