Skip to content

Commit 8c96c8f

Browse files
robertpiosikrobertpiosik
committed
Add test connection button to provider edit form
- in provider editing form, add 'test connection' button below api key. Test by sending request for /models. Show progress and result in a notification. - use 'text button' - 'test connection' should be a centered text button - 'clear' in forms shouls be lower case - 'test connection' should be placed in footer, on the left side ├── apps │ └── editor │ └── src │ ├── i18n │ │ └── translations │ │ └── views │ │ ├── index.ts │ │ └── settings │ │ ├── handlers │ │ │ ├── handle-create-template.ts │ │ │ ├── handle-delete-provider.ts │ │ │ ├── handle-delete-template.ts │ │ │ ├── handle-open-allow-patterns-settings.ts │ │ │ ├── handle-open-ignore-patterns-settings.ts │ │ │ ├── handle-select-default-api-configuration.ts │ │ │ ├── handle-select-default-cli-configuration.ts │ │ │ ├── handle-select-default-web-configuration.ts │ │ │ ├── handle-test-provider-connection.ts │ │ │ └── index.ts │ │ └── index.ts │ ├── services │ │ ├── model-fetcher.ts │ │ └── providers-manager.ts │ ├── utils │ │ └── build-request-headers.ts │ └── views │ └── settings │ ├── backend │ │ ├── message-handlers │ │ │ ├── handle-test-provider-connection.ts │ │ │ ├── handle-update-provider.ts │ │ │ └── index.ts │ │ └── settings-view-provider.ts │ ├── frontend │ │ ├── Settings.tsx │ │ ├── forms │ │ │ └── EditProviderForm │ │ │ ├── EditProviderForm.module.scss │ │ │ ├── EditProviderForm.tsx │ │ │ └── index.ts │ │ ├── hooks │ │ │ └── use-provider-editing.ts │ │ ├── i18n │ │ │ ├── translations │ │ │ │ ├── actions.ts │ │ │ │ ├── api.ts │ │ │ │ ├── cli.ts │ │ │ │ ├── common.ts │ │ │ │ ├── edit-provider-form.ts │ │ │ │ ├── edit-template-form.ts │ │ │ │ ├── general.ts │ │ │ │ ├── index.ts │ │ │ │ ├── sections.ts │ │ │ │ └── web.ts │ │ │ └── use-translation.tsx │ │ └── utils │ │ └── post-message.ts │ └── types │ └── messages.ts └── packages └── ui └── src └── components └── editor ├── common │ ├── Button │ │ └── Button.tsx │ ├── Field │ │ ├── Field.module.scss │ │ └── Field.tsx │ ├── Input │ │ ├── Input.module.scss │ │ └── Input.tsx │ └── TextButton │ ├── TextButton.module.scss │ └── TextButton.tsx ├── prompt-view │ └── Fieldset │ └── Fieldset.tsx └── settings-view └── Modal └── Form ├── Form.module.scss └── Form.tsx
1 parent 1ecd334 commit 8c96c8f

12 files changed

Lines changed: 196 additions & 33 deletions

File tree

‎apps/editor/src/constants/providers.ts‎

Lines changed: 0 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -11,30 +11,12 @@ export const PROVIDERS = {
1111
Cerebras: {
1212
base_url: 'https://api.cerebras.ai/v1'
1313
},
14-
Chutes: {
15-
base_url: 'https://llm.chutes.ai/v1'
16-
},
17-
DeepInfra: {
18-
base_url: 'https://api.deepinfra.com/v1'
19-
},
2014
DeepSeek: {
2115
base_url: 'https://api.deepseek.com/v1'
2216
},
23-
Fireworks: {
24-
base_url: 'https://api.fireworks.ai/inference/v1'
25-
},
2617
Google: {
2718
base_url: 'https://generativelanguage.googleapis.com/v1beta/openai/v1'
2819
},
29-
Groq: {
30-
base_url: 'https://api.groq.com/openai/v1'
31-
},
32-
Hyperbolic: {
33-
base_url: 'https://api.hyperbolic.xyz/v1'
34-
},
35-
HuggingFace: {
36-
base_url: 'https://router.huggingface.co/v1'
37-
},
3820
'LM Studio': {
3921
base_url: 'http://localhost:1234/v1'
4022
},

‎apps/editor/src/i18n/translations/views/settings/handlers/handle-test-provider-connection.ts‎

Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
export const translations = {
2+
'views.settings.handlers.handle-test-provider-connection.testing': {
3+
en: 'Testing connection...',
4+
pl: 'Testowanie połączenia...',
5+
'zh-cn': '测试连接中...',
6+
ja: '接続をテスト中...',
7+
'zh-tw': '測試連線中...',
8+
de: 'Verbindung wird getestet...',
9+
es: 'Probando conexión...',
10+
fr: 'Test de connexion...',
11+
'pt-br': 'Testando conexão...',
12+
ru: 'Проверка соединения...',
13+
ko: '연결 테스트 중...',
14+
it: 'Test della connessione...',
15+
tr: 'Bağlantı test ediliyor...',
16+
cs: 'Testování připojení...',
17+
hu: 'Kapcsolat tesztelése...',
18+
bg: 'Тестване на връзката...'
19+
},
20+
'views.settings.handlers.handle-test-provider-connection.success': {
21+
en: 'Connection successful!',
22+
pl: 'Połączenie udane!',
23+
'zh-cn': '连接成功！',
24+
ja: '接続に成功しました！',
25+
'zh-tw': '連線成功！',
26+
de: 'Verbindung erfolgreich!',
27+
es: '¡Conexión exitosa!',
28+
fr: 'Connexion réussie !',
29+
'pt-br': 'Conexão bem-sucedida!',
30+
ru: 'Соединение успешно!',
31+
ko: '연결 성공!',
32+
it: 'Connessione riuscita!',
33+
tr: 'Bağlantı başarılı!',
34+
cs: 'Připojení úspěšné!',
35+
hu: 'Sikeres kapcsolat!',
36+
bg: 'Връзката е успешна!'
37+
},
38+
'views.settings.handlers.handle-test-provider-connection.failure': {
39+
en: 'Connection failed: {error}',
40+
pl: 'Błąd połączenia: {error}',
41+
'zh-cn': '连接失败：{error}',
42+
ja: '接続に失敗しました: {error}',
43+
'zh-tw': '連線失敗：{error}',
44+
de: 'Verbindung fehlgeschlagen: {error}',
45+
es: 'Fallo de conexión: {error}',
46+
fr: 'Échec de la connexion : {error}',
47+
'pt-br': 'Falha na conexão: {error}',
48+
ru: 'Ошибка соединения: {error}',
49+
ko: '연결 실패: {error}',
50+
it: 'Connessione fallita: {error}',
51+
tr: 'Bağlantı başarısız: {error}',
52+
cs: 'Připojení selhalo: {error}',
53+
hu: 'Kapcsolódási hiba: {error}',
54+
bg: 'Неуспешна връзка: {error}'
55+
}
56+
} as const

‎apps/editor/src/i18n/translations/views/settings/handlers/index.ts‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import { translations as handle_delete_template } from './handle-delete-template
66
import { translations as handle_delete_provider } from './handle-delete-provider'
77
import { translations as handle_select_default_web_configuration } from './handle-select-default-web-configuration'
88
import { translations as handle_select_default_cli_configuration } from './handle-select-default-cli-configuration'
9+
import { translations as handle_test_provider_connection } from './handle-test-provider-connection'
910

1011
export const translations = {
1112
...handle_open_allow_patterns_settings,
@@ -15,5 +16,6 @@ export const translations = {
1516
...handle_delete_template,
1617
...handle_delete_provider,
1718
...handle_select_default_web_configuration,
18-
...handle_select_default_cli_configuration
19+
...handle_select_default_cli_configuration,
20+
...handle_test_provider_connection
1921
}

‎apps/editor/src/views/settings/backend/message-handlers/handle-test-provider-connection.ts‎

Lines changed: 61 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,61 @@
1+
import * as vscode from 'vscode'
2+
import { TestProviderConnectionMessage } from '@/views/settings/types/messages'
3+
import { ModelFetcher } from '@/services/model-fetcher'
4+
import { t } from '@/i18n'
5+
import { SettingsViewProvider } from '../settings-view-provider'
6+
import { ProvidersManager } from '@/services/providers-manager'
7+
8+
export const handle_test_provider_connection = async (
9+
provider: SettingsViewProvider,
10+
message: TestProviderConnectionMessage
11+
): Promise<void> => {
12+
await vscode.window.withProgress(
13+
{
14+
location: vscode.ProgressLocation.Notification,
15+
title: t(
16+
'views.settings.handlers.handle-test-provider-connection.testing'
17+
),
18+
cancellable: false
19+
},
20+
async () => {
21+
try {
22+
const normalize_base_url = (url: string): string => {
23+
return url.trim().replace(/\/+$/, '')
24+
}
25+
26+
const base_url = normalize_base_url(message.base_url)
27+
if (!base_url) {
28+
throw new Error('Base URL is required')
29+
}
30+
31+
let api_key = message.api_key
32+
if (!api_key && !message.is_api_key_cleared && message.original_name) {
33+
const providers_manager = new ProvidersManager(
34+
provider.extension_context
35+
)
36+
const existing = await providers_manager.get_provider(
37+
message.original_name
38+
)
39+
if (existing) {
40+
api_key = existing.api_key
41+
}
42+
}
43+
44+
const fetcher = new ModelFetcher()
45+
await fetcher.get_models({
46+
base_url,
47+
api_key: api_key
48+
})
49+
vscode.window.showInformationMessage(
50+
t('views.settings.handlers.handle-test-provider-connection.success')
51+
)
52+
} catch (error: any) {
53+
vscode.window.showErrorMessage(
54+
t('views.settings.handlers.handle-test-provider-connection.failure', {
55+
error: error.message
56+
})
57+
)
58+
}
59+
}
60+
)
61+
}

‎apps/editor/src/views/settings/backend/message-handlers/index.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -67,3 +67,4 @@ export * from './handle-get-is-modern-ui'
6767
export * from './handle-set-default-cli-configuration'
6868
export * from './handle-select-default-cli-configuration'
6969
export * from './handle-open-editor-settings'
70+
export * from './handle-test-provider-connection'

‎apps/editor/src/views/settings/backend/settings-view-provider.ts‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -72,7 +72,8 @@ import {
7272
handle_select_default_cli_configuration,
7373
handle_open_editor_settings,
7474
handle_hash_sign_quick_pick,
75-
handle_cancel_template_edit
75+
handle_cancel_template_edit,
76+
handle_test_provider_connection
7677
} from './message-handlers'
7778
import { webview_html } from '@/views/shared/utils/webview-html'
7879

@@ -146,6 +147,8 @@ export class SettingsViewProvider {
146147
await handle_delete_provider(this, message)
147148
} else if (message.command === 'UPDATE_PROVIDER') {
148149
await handle_update_provider(this, message)
150+
} else if (message.command === 'TEST_PROVIDER_CONNECTION') {
151+
await handle_test_provider_connection(this, message)
149152
} else if (message.command === 'SHOW_HASH_SIGN_QUICK_PICK') {
150153
await handle_hash_sign_quick_pick(this)
151154
} else if (message.command === 'GET_TEMPLATES') {

‎apps/editor/src/views/settings/frontend/Settings.tsx‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,10 +14,13 @@ import { EditApiConfigurationForm } from '@/views/shared/forms/EditApiConfigurat
1414
import { EditProviderForm } from './forms/EditProviderForm'
1515
import { EditTemplateForm } from './forms/EditTemplateForm'
1616
import { use_template_editing } from './hooks/use-template-editing'
17+
import { TextButton as UiTextButton } from '@ui/components/editor/common/TextButton'
18+
import { use_translation } from './i18n/use-translation'
1719

1820
const vscode = acquireVsCodeApi()
1921

2022
export const Settings = () => {
23+
const { t } = use_translation()
2124
const settings_hook = use_settings(vscode)
2225
const {
2326
updating_web_configuration,
@@ -49,6 +52,7 @@ export const Settings = () => {
4952

5053
const {
5154
updating_provider,
55+
updated_provider,
5256
set_updating_provider,
5357
set_updated_provider,
5458
edit_provider_cancel_handler,
@@ -424,6 +428,21 @@ export const Settings = () => {
424428
title="Edit Provider"
425429
on_save={edit_provider_save_handler}
426430
on_cancel={edit_provider_cancel_handler}
431+
custom_footer_left={
432+
<UiTextButton
433+
on_click={() => {
434+
post_message(vscode, {
435+
command: 'TEST_PROVIDER_CONNECTION',
436+
original_name: updating_provider.original_name,
437+
base_url: updated_provider?.base_url ?? updating_provider.provider.base_url,
438+
api_key: updated_provider?.api_key ?? '',
439+
is_api_key_cleared: updated_provider?.is_api_key_cleared ?? false
440+
})
441+
}}
442+
>
443+
{t('edit-provider-form.action.test-connection')}
444+
</UiTextButton>
445+
}
427446
>
428447
<EditProviderForm
429448
provider={updating_provider.provider}

‎apps/editor/src/views/settings/frontend/forms/EditProviderForm/EditProviderForm.module.scss‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,3 +19,4 @@
1919
text-decoration: underline;
2020
}
2121
}
22+

‎apps/editor/src/views/settings/frontend/i18n/translations/edit-provider-form.ts‎

Lines changed: 30 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -72,22 +72,22 @@ export const translations = {
7272
bg: 'API Ключ'
7373
},
7474
'edit-provider-form.api-key.action.clear': {
75-
en: 'Clear',
76-
pl: 'Wyczyść',
75+
en: 'clear',
76+
pl: 'wyczyść',
7777
'zh-cn': '清除',
7878
ja: 'クリア',
7979
'zh-tw': '清除',
80-
de: 'Löschen',
81-
es: 'Borrar',
82-
fr: 'Effacer',
83-
'pt-br': 'Limpar',
84-
ru: 'Очистить',
80+
de: 'löschen',
81+
es: 'borrar',
82+
fr: 'effacer',
83+
'pt-br': 'limpar',
84+
ru: 'очистить',
8585
ko: '지우기',
86-
it: 'Cancella',
87-
tr: 'Temizle',
88-
cs: 'Vymazat',
89-
hu: 'Törlés',
90-
bg: 'Изчистване'
86+
it: 'cancella',
87+
tr: 'temizle',
88+
cs: 'vymazat',
89+
hu: 'törlés',
90+
bg: 'изчистване'
9191
},
9292
'edit-provider-form.api-key.placeholder.default': {
9393
en: 'Enter API Key',
@@ -161,5 +161,23 @@ export const translations = {
161161
cs: 'Dozvědět se více',
162162
hu: 'Tudjon meg többet',
163163
bg: 'Научете повече'
164+
},
165+
'edit-provider-form.action.test-connection': {
166+
en: 'Test Connection',
167+
pl: 'Testuj połączenie',
168+
'zh-cn': '测试连接',
169+
ja: '接続をテスト',
170+
'zh-tw': '測試連線',
171+
de: 'Verbindung testen',
172+
es: 'Probar conexión',
173+
fr: 'Tester la connexion',
174+
'pt-br': 'Testar Conexão',
175+
ru: 'Проверить соединение',
176+
ko: '연결 테스트',
177+
it: 'Testa connessione',
178+
tr: 'Bağlantıyı Test Et',
179+
cs: 'Testovat připojení',
180+
hu: 'Kapcsolat tesztelése',
181+
bg: 'Тестване на връзка'
164182
}
165183
} as const

‎apps/editor/src/views/settings/types/messages.ts‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -333,6 +333,14 @@ export interface UpdateProviderMessage {
333333
insertion_index?: number
334334
}
335335

336+
export interface TestProviderConnectionMessage {
337+
command: 'TEST_PROVIDER_CONNECTION'
338+
original_name?: string
339+
base_url: string
340+
api_key?: string
341+
is_api_key_cleared?: boolean
342+
}
343+
336344
export type Template = {
337345
name?: string
338346
template: string
@@ -428,6 +436,7 @@ export type FrontendMessage =
428436
| PickApiModelMessage
429437
| PickApiReasoningEffortMessage
430438
| UpdateProviderMessage
439+
| TestProviderConnectionMessage
431440
| GetIsModernUiMessage
432441
| GetTemplatesMessage
433442
| UpdateTemplatesMessage

0 commit comments

Comments
 (0)