Commit d203b98
feat: redesign Provider settings UI with brand icons and dialog-based quick-add
Completely rewrites the Provider management page in Settings to follow
the OpenCode reference design with two clear sections.
ProviderManager.tsx — full rewrite:
- Top section "Connected Providers": shows all configured providers as a
clean list with brand icons from @lobehub/icons, name, badge, edit and
disconnect buttons. Environment variables also shown here.
- Bottom section "Add Provider": preset list with icon + name + description
+ Connect button. Clicking Connect opens a dialog with only the fields
needed for that preset.
- First 3 presets: Custom API (all fields), Anthropic Third-party API
(name + URL + key), Anthropic Official (key only).
- Other presets (GLM, Kimi, Moonshot, MiniMax, etc.) simplified to key-only.
- Bedrock/Vertex show environment variable config.
- Removed the top-right "Add Provider" button entirely.
- Added PresetConnectDialog component: shows brand icon in title, only
relevant fields, advanced options fold for extra_env, Cancel/Connect footer.
package.json:
- Add @lobehub/icons dependency for AI brand icons
- Bump version to 0.15.0
i18n (en.ts, zh.ts):
- Add translations: connectedProviders, noConnected, connect, disconnect,
disconnectProvider, disconnectConfirm, addProviderSection, addProviderDesc,
disconnecting
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>1 parent 448738d commit d203b98
5 files changed
Lines changed: 4221 additions & 406 deletions
0 commit comments