Skip to content

Commit 2354271

Browse files
robertpiosikrobertpiosik
committed
Replace inline edit format selectors with a quick pick menu in the prompt field
- 'on_edit_format_change' no longer passes format. You should rename 'save edit format' to 'select edit format' and let the user choose one in a quick pick. - restore the old 'save edit format' to work alongside the new 'select edit format'. When on_edit_format_change is invoked without format, use 'select edit format. If with format, use 'save edit format' - current behavior: we show all edit formats. Expected behavior: show only the selected one. Also on_edit_format_change should make the param optional. provide the param value only when changing the edit format with a shortcut - because we display only one, spacer is not needed [Fragment] - below edit format text, render dots spaced 1px, color red, 5px below. - expand this to all so I can better set replacements [Fragment] - in `apps/editor/src/views/panel/backend/message-handlers/handle-select-edit-format.ts` use the same labels: [Fragment] - quick pick in `apps/editor/src/views/panel/backend/message-handlers/handle-select-edit-format.ts` should have close button - quick pick in `apps/editor/src/views/panel/backend/message-handlers/handle-select-edit-format.ts` should have title 'Edit Formats' - 'truncated' edit format should be last - translate labels of `apps/editor/src/views/panel/backend/message-handlers/handle-select-edit-format.ts` - to `apps/editor/src/views/panel/frontend/i18n/translations/prompt-field.ts` add translations regarding edit format labels - [Pasted text] - when hovering over edit format, show tooltip 'Edit format' (nothing else). Take care about proper alignment (centered above the button) - translate [Fragment] - locate and fix missing translations of the prompt field
1 parent bcf2c42 commit 2354271

15 files changed

Lines changed: 767 additions & 219 deletions

File tree

‎apps/editor/src/i18n/index.ts‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ import { translations as views_settings_handlers_open_ignore_patterns_settings }
77
import { translations as views_settings_handlers_select_default_api_configuration } from './translations/views/settings/handlers/select-default-api-configuration'
88
import { translations as views_panel_handlers_voice_input } from './translations/views/panel/handlers/voice-input'
99
import { translations as views_panel_handlers_hash_sign } from './translations/views/panel/handlers/hash-sign'
10+
import { translations as views_panel_handlers_select_edit_format } from './translations/views/panel/handlers/select-edit-format'
1011
import { translations as views_handlers_common } from './translations/views/common/handlers/common'
1112
import { translations as views_shared_actions_api_create_interactions_verify_model } from './translations/views/shared/actions/api/create/interactions/verify-model'
1213
import { translations as views_shared_actions_api_create_interactions_initial_select_provider } from './translations/views/shared/actions/api/create/interactions/initial-select-provider'
@@ -35,6 +36,7 @@ const translations = {
3536
...views_settings_handlers_select_default_api_configuration,
3637
...views_panel_handlers_voice_input,
3738
...views_panel_handlers_hash_sign,
39+
...views_panel_handlers_select_edit_format,
3840
...views_handlers_common,
3941
...views_shared_actions_api_create_interactions_verify_model,
4042
...views_shared_actions_api_create_interactions_initial_select_provider,

‎apps/editor/src/i18n/translations/views/panel/handlers/select-edit-format.ts‎

Lines changed: 110 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,110 @@
1+
export const translations = {
2+
'views.panel.handlers.select-edit-format.items.whole': {
3+
en: 'Whole-File Overwrite',
4+
pl: 'Nadpisanie całego pliku',
5+
'zh-cn': '全文件覆盖',
6+
ja: 'ファイル全体の上書き',
7+
'zh-tw': '全檔案覆寫',
8+
de: 'Komplette Datei überschreiben',
9+
es: 'Sobrescribir archivo completo',
10+
fr: 'Remplacement de fichier entier',
11+
'pt-br': 'Substituição de arquivo inteiro',
12+
ru: 'Перезапись всего файла',
13+
ko: '전체 파일 덮어쓰기',
14+
it: "Sovrascrittura dell'intero file",
15+
tr: 'Tüm Dosyanın Üzerine Yaz',
16+
cs: 'Přepsání celého souboru',
17+
hu: 'Teljes fájl felülírása',
18+
bg: 'Презаписване на целия файл'
19+
},
20+
'views.panel.handlers.select-edit-format.items.search-replace': {
21+
en: 'Search & Replace',
22+
pl: 'Wyszukaj i zamień',
23+
'zh-cn': '搜索并替换',
24+
ja: '検索して置換',
25+
'zh-tw': '搜尋並取代',
26+
de: 'Suchen & Ersetzen',
27+
es: 'Buscar y reemplazar',
28+
fr: 'Rechercher et remplacer',
29+
'pt-br': 'Buscar e Substituir',
30+
ru: 'Поиск и замена',
31+
ko: '검색 및 바꾸기',
32+
it: 'Cerca e sostituisci',
33+
tr: 'Bul ve Değiştir',
34+
cs: 'Hledat a nahradit',
35+
hu: 'Keresés és csere',
36+
bg: 'Търсене и заместване'
37+
},
38+
'views.panel.handlers.select-edit-format.items.diff': {
39+
en: 'Unified Diff',
40+
pl: 'Zunifikowany Diff',
41+
'zh-cn': '统一差异 (Unified Diff)',
42+
ja: 'Unified Diff',
43+
'zh-tw': '統一差異 (Unified Diff)',
44+
de: 'Unified Diff',
45+
es: 'Diff unificado',
46+
fr: 'Diff unifié',
47+
'pt-br': 'Diff Unificado',
48+
ru: 'Унифицированный Diff',
49+
ko: '통합 Diff (Unified Diff)',
50+
it: 'Diff unificato',
51+
tr: 'Birleşik Diff (Unified Diff)',
52+
cs: 'Unified Diff',
53+
hu: 'Egyesített Diff',
54+
bg: 'Обединен Diff (Unified Diff)'
55+
},
56+
'views.panel.handlers.select-edit-format.items.truncated': {
57+
en: 'Ellipsis truncations',
58+
pl: 'Skrócenie za pomocą wielokropka',
59+
'zh-cn': '省略号截断',
60+
ja: '省略記号による切り捨て',
61+
'zh-tw': '省略號截斷',
62+
de: 'Auslassungspunkte (Truncations)',
63+
es: 'Truncamiento con elipsis',
64+
fr: 'Troncature par points de suspension',
65+
'pt-br': 'Truncamento por elipse',
66+
ru: 'Усечение с многоточием',
67+
ko: '줄임표 자르기',
68+
it: 'Troncamenti con ellissi',
69+
tr: 'Üç nokta ile kesilmeler',
70+
cs: 'Zkrácení výpustkou',
71+
hu: 'Csonkítás ellipszissel',
72+
bg: 'Съкращения с многоточие'
73+
},
74+
'views.panel.handlers.select-edit-format.placeholder': {
75+
en: 'Select edit format',
76+
pl: 'Wybierz format edycji',
77+
'zh-cn': '选择编辑格式',
78+
ja: '編集フォーマットを選択',
79+
'zh-tw': '選擇編輯格式',
80+
de: 'Bearbeitungsformat auswählen',
81+
es: 'Seleccionar formato de edición',
82+
fr: "Sélectionner le format d'édition",
83+
'pt-br': 'Selecione o formato de edição',
84+
ru: 'Выберите формат редактирования',
85+
ko: '편집 형식 선택',
86+
it: 'Seleziona formato di modifica',
87+
tr: 'Düzenleme formatını seçin',
88+
cs: 'Vyberte formát úprav',
89+
hu: 'Szerkesztési formátum kiválasztása',
90+
bg: 'Изберете формат за редактиране'
91+
},
92+
'views.panel.handlers.select-edit-format.title': {
93+
en: 'Edit Formats',
94+
pl: 'Formaty edycji',
95+
'zh-cn': '编辑格式',
96+
ja: '編集フォーマット',
97+
'zh-tw': '編輯格式',
98+
de: 'Bearbeitungsformate',
99+
es: 'Formatos de edición',
100+
fr: "Formats d'édition",
101+
'pt-br': 'Formatos de Edição',
102+
ru: 'Форматы редактирования',
103+
ko: '편집 형식',
104+
it: 'Formati di modifica',
105+
tr: 'Düzenleme Formatları',
106+
cs: 'Formáty úprav',
107+
hu: 'Szerkesztési formátumok',
108+
bg: 'Формати за редактиране'
109+
}
110+
} as const

‎apps/editor/src/views/panel/backend/message-handlers/handle-save-edit-format.ts‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,4 +30,10 @@ export const handle_save_edit_format = async (
3030
message.edit_format
3131
)
3232
}
33+
34+
panel_view_provider.send_message({
35+
command: 'EDIT_FORMAT',
36+
chat_edit_format: panel_view_provider.chat_edit_format,
37+
api_edit_format: panel_view_provider.api_edit_format
38+
})
3339
}

‎apps/editor/src/views/panel/backend/message-handlers/handle-select-edit-format.ts‎

Lines changed: 94 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,94 @@
1+
import * as vscode from 'vscode'
2+
import {
3+
API_EDIT_FORMAT_STATE_KEY,
4+
CHAT_EDIT_FORMAT_STATE_KEY
5+
} from '@/constants/state-keys'
6+
import { PanelViewProvider } from '@/views/panel/backend/panel-view-provider'
7+
import { SelectEditFormatMessage } from '@/views/panel/types/messages'
8+
import { EditFormat } from '@shared/types/edit-format'
9+
import { t } from '@/i18n'
10+
11+
export const handle_select_edit_format = async (
12+
panel_view_provider: PanelViewProvider,
13+
message: SelectEditFormatMessage
14+
): Promise<void> => {
15+
const items: (vscode.QuickPickItem & { value: EditFormat })[] = [
16+
{
17+
label: t('views.panel.handlers.select-edit-format.items.whole'),
18+
value: 'whole'
19+
},
20+
{
21+
label: t('views.panel.handlers.select-edit-format.items.search-replace'),
22+
value: 'search-replace'
23+
},
24+
{
25+
label: t('views.panel.handlers.select-edit-format.items.diff'),
26+
value: 'diff'
27+
},
28+
{
29+
label: t('views.panel.handlers.select-edit-format.items.truncated'),
30+
value: 'truncated'
31+
}
32+
]
33+
34+
const quick_pick = vscode.window.createQuickPick<
35+
vscode.QuickPickItem & { value: EditFormat }
36+
>()
37+
quick_pick.items = items
38+
quick_pick.placeholder = t(
39+
'views.panel.handlers.select-edit-format.placeholder'
40+
)
41+
quick_pick.title = t('views.panel.handlers.select-edit-format.title')
42+
quick_pick.buttons = [
43+
{ iconPath: new vscode.ThemeIcon('close'), tooltip: t('common.close') }
44+
]
45+
46+
const selection = await new Promise<
47+
(vscode.QuickPickItem & { value: EditFormat }) | undefined
48+
>((resolve) => {
49+
quick_pick.onDidAccept(() => {
50+
resolve(quick_pick.selectedItems[0])
51+
quick_pick.hide()
52+
})
53+
quick_pick.onDidTriggerButton(() => {
54+
quick_pick.hide()
55+
})
56+
quick_pick.onDidHide(() => {
57+
resolve(undefined)
58+
quick_pick.dispose()
59+
})
60+
quick_pick.show()
61+
})
62+
63+
if (!selection) {
64+
return
65+
}
66+
67+
if (message.target == 'chat') {
68+
panel_view_provider.chat_edit_format = selection.value
69+
await panel_view_provider.extension_context.workspaceState.update(
70+
CHAT_EDIT_FORMAT_STATE_KEY,
71+
selection.value
72+
)
73+
await panel_view_provider.extension_context.globalState.update(
74+
CHAT_EDIT_FORMAT_STATE_KEY,
75+
selection.value
76+
)
77+
} else if (message.target == 'api') {
78+
panel_view_provider.api_edit_format = selection.value
79+
await panel_view_provider.extension_context.workspaceState.update(
80+
API_EDIT_FORMAT_STATE_KEY,
81+
selection.value
82+
)
83+
await panel_view_provider.extension_context.globalState.update(
84+
API_EDIT_FORMAT_STATE_KEY,
85+
selection.value
86+
)
87+
}
88+
89+
panel_view_provider.send_message({
90+
command: 'EDIT_FORMAT',
91+
chat_edit_format: panel_view_provider.chat_edit_format,
92+
api_edit_format: panel_view_provider.api_edit_format
93+
})
94+
}

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

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ export * from './handle-preview-web-configuration'
88
export * from './handle-request-editor-selection-state'
99
export * from './handle-response-preview'
1010
export * from './handle-request-editor-state'
11+
export * from './handle-select-edit-format'
1112
export * from './handle-save-edit-format'
1213
export * from './handle-save-history'
1314
export * from './handle-save-instructions'

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

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,6 @@ import {
1919
handle_update_web_configuration,
2020
handle_delete_web_configuration,
2121
handle_preview_web_configuration,
22-
handle_save_edit_format,
2322
handle_reorder_web_configurations,
2423
handle_toggle_pinned_web_configuration,
2524
handle_get_connection_status,
@@ -32,6 +31,7 @@ import {
3231
handle_request_editor_selection_state,
3332
handle_make_api_call,
3433
handle_get_edit_format,
34+
handle_save_edit_format,
3535
handle_get_edit_format_instructions,
3636
handle_at_sign_quick_pick,
3737
handle_get_web_prompt_type,
@@ -89,6 +89,7 @@ import { handle_update_api_configuration } from './message-handlers/handle-updat
8989
import { handle_pick_model_provider } from './message-handlers/handle-pick-model-provider'
9090
import { handle_pick_api_model } from './message-handlers/handle-pick-api-model'
9191
import { handle_pick_api_reasoning_effort } from './message-handlers/handle-pick-api-reasoning-effort'
92+
import { handle_select_edit_format } from './message-handlers/handle-select-edit-format'
9293
import { SelectionState } from '../types/messages'
9394
import {
9495
API_EDIT_FORMAT_STATE_KEY,
@@ -785,6 +786,8 @@ export class PanelViewProvider implements vscode.WebviewViewProvider {
785786
handle_get_edit_format(this)
786787
} else if (message.command == 'SAVE_EDIT_FORMAT') {
787788
await handle_save_edit_format(this, message)
789+
} else if (message.command == 'SELECT_EDIT_FORMAT') {
790+
await handle_select_edit_format(this, message)
788791
} else if (message.command == 'CARET_POSITION_CHANGED') {
789792
this.caret_position = message.caret_position
790793
} else if (message.command == 'MODE_CHANGED') {

‎apps/editor/src/views/panel/frontend/Main/Main.tsx‎

Lines changed: 26 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -380,22 +380,34 @@ export const Main: React.FC<Props> = (props) => {
380380
})
381381
}
382382

383-
const handle_chat_edit_format_change = (edit_format: EditFormat) => {
384-
set_chat_edit_format(edit_format)
385-
post_message(props.vscode, {
386-
command: 'SAVE_EDIT_FORMAT',
387-
target: 'chat',
388-
edit_format
389-
})
383+
const handle_chat_edit_format_change = (format?: EditFormat) => {
384+
if (format) {
385+
post_message(props.vscode, {
386+
command: 'SAVE_EDIT_FORMAT',
387+
edit_format: format,
388+
target: 'chat'
389+
})
390+
} else {
391+
post_message(props.vscode, {
392+
command: 'SELECT_EDIT_FORMAT',
393+
target: 'chat'
394+
})
395+
}
390396
}
391397

392-
const handle_api_edit_format_change = (edit_format: EditFormat) => {
393-
set_api_edit_format(edit_format)
394-
post_message(props.vscode, {
395-
command: 'SAVE_EDIT_FORMAT',
396-
target: 'api',
397-
edit_format
398-
})
398+
const handle_api_edit_format_change = (format?: EditFormat) => {
399+
if (format) {
400+
post_message(props.vscode, {
401+
command: 'SAVE_EDIT_FORMAT',
402+
edit_format: format,
403+
target: 'api'
404+
})
405+
} else {
406+
post_message(props.vscode, {
407+
command: 'SELECT_EDIT_FORMAT',
408+
target: 'api'
409+
})
410+
}
399411
}
400412

401413
const handle_caret_position_change = (caret_position: number) => {

‎apps/editor/src/views/panel/frontend/Main/MainView/MainView.tsx‎

Lines changed: 21 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -63,8 +63,8 @@ type Props = {
6363
on_api_prompt_type_change: (prompt_type: ApiPromptType) => void
6464
chat_edit_format: EditFormat
6565
api_edit_format: EditFormat
66-
on_chat_edit_format_change: (edit_format: EditFormat) => void
67-
on_api_edit_format_change: (edit_format: EditFormat) => void
66+
on_chat_edit_format_change: (format?: EditFormat) => void
67+
on_api_edit_format_change: (format?: EditFormat) => void
6868
on_web_configurations_reorder: (
6969
reordered_web_configurations: WebConfiguration[]
7070
) => void
@@ -411,7 +411,25 @@ export const MainView: React.FC<Props> = (props) => {
411411
exit_voice_input: t('prompt-field.exit-voice-input'),
412412
reference_file: t('prompt-field.reference-file'),
413413
insert_symbol: t('prompt-field.insert-symbol'),
414-
prompt_templates: t('prompt-field.prompt-templates')
414+
prompt_templates: t('prompt-field.prompt-templates'),
415+
edit_format: t('prompt-field.edit-format'),
416+
edit_format_whole: t('prompt-field.edit-format.whole'),
417+
edit_format_search_replace: t(
418+
'prompt-field.edit-format.search-replace'
419+
),
420+
edit_format_diff: t('prompt-field.edit-format.diff'),
421+
edit_format_truncated: t('prompt-field.edit-format.truncated'),
422+
placeholder_code_history: t(
423+
'prompt-field.placeholder.code-history'
424+
),
425+
placeholder_code: t('prompt-field.placeholder.code'),
426+
placeholder_history: t('prompt-field.placeholder.history'),
427+
placeholder_default: t('prompt-field.placeholder.default'),
428+
send_with: t('prompt-field.action.send-with'),
429+
send_with_ellipsis: t('prompt-field.action.send-with-ellipsis'),
430+
copy_prompt: t('prompt-field.action.copy-prompt'),
431+
more_actions: t('prompt-field.action.more-actions'),
432+
send: t('prompt-field.action.send')
415433
}}
416434
/>
417435
<UiContextUtilisation

0 commit comments

Comments
 (0)