Skip to content

Commit 6dd4b62

Browse files
committed
Make template prompt symbols non-interactive and clean up preview changes error handling
- user should not be able to click on symbols in Templates (settings) but do in prompt field (panel) ├── apps │ └── editor │ └── src │ └── views │ ├── prompt │ │ └── frontend │ │ └── Main │ │ └── MainView │ │ └── MainView.tsx │ └── settings │ ├── backend │ │ ├── message-handlers │ │ │ └── handle-hash-sign-quick-pick.ts │ │ └── settings-view-provider.ts │ ├── frontend │ │ ├── Home │ │ │ └── sections │ │ │ └── GeneralSection.tsx │ │ ├── Settings.tsx │ │ └── forms │ │ └── EditTemplateForm │ │ ├── EditTemplateForm.module.scss │ │ ├── EditTemplateForm.tsx │ │ └── index.ts │ └── types │ └── messages.ts └── packages └── ui └── src └── components └── editor ├── common │ └── prompts │ ├── PromptField │ │ ├── PromptField.tsx │ │ ├── components │ │ │ └── Footer │ │ │ └── Footer.tsx │ │ └── hooks │ │ └── use-handlers │ │ └── handle-input-click.ts │ ├── Template │ │ ├── Template.module.scss │ │ └── Template.tsx │ └── shared │ └── symbols │ ├── caret.ts │ ├── get-highlighted-text.tsx │ ├── index.ts │ ├── position-mapping.ts │ ├── prompt-symbols.module.scss │ ├── reconstruct-raw-value.ts │ └── use-symbol-deletion.ts └── settings-view └── Templates └── Templates.tsx
1 parent c10463c commit 6dd4b62

4 files changed

Lines changed: 31 additions & 32 deletions

File tree

‎apps/editor/src/views/prompt/backend/message-handlers/handle-preview-changes-symbol.ts‎

Lines changed: 1 addition & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
import * as vscode from 'vscode'
21
import { replace_changes_symbol } from '../utils/symbols/git/replace-git-symbols'
32
import { preview_text_in_temp_file } from '../utils/preview-text-in-temp-file'
43

@@ -17,12 +16,6 @@ export const handle_preview_changes_symbol = async (message: {
1716
content: changes_definitions.trim(),
1817
extension: '.md'
1918
})
20-
} else {
21-
vscode.window.showInformationMessage(
22-
'No changes found or failed to generate diff.'
23-
)
2419
}
25-
} catch (error) {
26-
vscode.window.showErrorMessage(`Failed to preview changes: ${error}`)
27-
}
20+
} catch {}
2821
}

‎packages/ui/src/components/editor/common/prompts/Template/Template.tsx‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -86,7 +86,8 @@ export const Template = forwardRef<TemplateHandle, TemplateProps>(
8686
const highlighted_html = useMemo(() => {
8787
return get_highlighted_text({
8888
text: props.value || '',
89-
context_file_paths: []
89+
context_file_paths: [],
90+
interactive_text: false
9091
})
9192
}, [props.value])
9293

‎packages/ui/src/components/editor/common/prompts/shared/symbols/get-highlighted-text.tsx‎

Lines changed: 20 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,7 @@ const escape_html = (str: string): string => {
1717
const process_text_part_for_files = (params: {
1818
text: string
1919
context_file_paths: string[]
20+
interactive_text: boolean
2021
}): string => {
2122
const file_path_regex = /`([^`]+)`/g
2223
const parts = params.text.split(file_path_regex)
@@ -27,10 +28,7 @@ const process_text_part_for_files = (params: {
2728
const file_path = part
2829
if (params.context_file_paths.includes(file_path)) {
2930
const filename = file_path.split('/').pop() || file_path
30-
return `<span class="${cn(
31-
styles['symbol'],
32-
styles['symbol--file']
33-
)}" data-type="file-symbol" data-path="${escape_html(
31+
return `<span class="${cn(styles['symbol'], styles['symbol--file'], { [styles['symbol--non-interactive']]: !params.interactive_text })}" data-type="file-symbol" data-path="${escape_html(
3432
file_path
3533
)}" title="${escape_html(file_path)}"><span class="${
3634
styles['symbol__icon']
@@ -54,7 +52,9 @@ export const get_highlighted_text = (params: {
5452
count: number
5553
active_index: number
5654
}
55+
interactive_text?: boolean
5756
}): string => {
57+
const interactive_text = params.interactive_text ?? true
5858
const saved_context_regex_part =
5959
'#SavedContext\\((?:WorkspaceState|JSON) "(?:\\\\.|[^"\\\\])*"\\)'
6060

@@ -95,11 +95,7 @@ export const get_highlighted_text = (params: {
9595

9696
const is_warning = !params.context_file_paths.includes(path)
9797

98-
return `<span class="${cn(
99-
styles['symbol'],
100-
styles['symbol--pasted-lines'],
101-
{ [styles['symbol--error']]: is_warning }
102-
)}" data-type="pasted-lines-symbol"${
98+
return `<span class="${cn(styles['symbol'], styles['symbol--pasted-lines'], { [styles['symbol--error']]: is_warning, [styles['symbol--non-interactive']]: !interactive_text })}" data-type="pasted-lines-symbol"${
10399
is_warning ? ' title="File with selection is not selected"' : ''
104100
} data-path="${escape_html(path)}" data-start-line="${start_line}" data-start-col="${start_col}" data-end-line="${end_line}" data-end-col="${end_col}"><span class="${
105101
styles['symbol__icon']
@@ -110,10 +106,7 @@ export const get_highlighted_text = (params: {
110106

111107
if (part && /^#Changes\([^)]+\)$/.test(part)) {
112108
const branch_name = part.slice(9, -1)
113-
return `<span class="${cn(
114-
styles['symbol'],
115-
styles['symbol--changes']
116-
)}" data-type="changes-symbol" data-branch-name="${escape_html(
109+
return `<span class="${cn(styles['symbol'], styles['symbol--changes'], { [styles['symbol--non-interactive']]: !interactive_text })}" data-type="changes-symbol" data-branch-name="${escape_html(
117110
branch_name
118111
)}"><span class="${
119112
styles['symbol__icon']
@@ -133,7 +126,8 @@ export const get_highlighted_text = (params: {
133126
.replace(/\\\\/g, '\\')
134127
return `<span class="${cn(
135128
styles['symbol'],
136-
styles['symbol--saved-context']
129+
styles['symbol--saved-context'],
130+
{ [styles['symbol--non-interactive']]: !interactive_text }
137131
)}" data-type="saved-context-symbol" data-context-type="${context_type}" data-context-name="${escape_html(
138132
context_name
139133
)}"><span class="${
@@ -155,7 +149,8 @@ export const get_highlighted_text = (params: {
155149
const short_hash = commit_hash.substring(0, 7)
156150
return `<span class="${cn(
157151
styles['symbol'],
158-
styles[`symbol--${symbol.toLowerCase()}`]
152+
styles[`symbol--${symbol.toLowerCase()}`],
153+
{ [styles['symbol--non-interactive']]: !interactive_text }
159154
)}" data-type="${symbol.toLowerCase()}-symbol" data-repo-name="${escape_html(
160155
repo_name
161156
)}" data-commit-hash="${escape_html(
@@ -175,10 +170,7 @@ export const get_highlighted_text = (params: {
175170
const repo = skill_match[2]
176171
const skill_name = skill_match[3]
177172

178-
return `<span class="${cn(
179-
styles['symbol'],
180-
styles['symbol--skill']
181-
)}" data-type="skill-symbol" data-agent="${escape_html(
173+
return `<span class="${cn(styles['symbol'], styles['symbol--skill'], { [styles['symbol--non-interactive']]: !interactive_text })}" data-type="skill-symbol" data-agent="${escape_html(
182174
agent
183175
)}" data-repo="${escape_html(repo)}" data-skill-name="${escape_html(
184176
skill_name
@@ -194,7 +186,8 @@ export const get_highlighted_text = (params: {
194186
const hash = image_match[1]
195187
const is_warning = params.is_web_target
196188
return `<span class="${cn(styles['symbol'], styles['symbol--image'], {
197-
[styles['symbol--error']]: is_warning
189+
[styles['symbol--error']]: is_warning,
190+
[styles['symbol--non-interactive']]: !interactive_text
198191
})}" data-type="image-symbol" data-hash="${hash}"${
199192
is_warning
200193
? ' title="The prompt autofill feature can\'t handle images.\nUpload in chatbot or use API with a multimodal model."'
@@ -217,7 +210,9 @@ export const get_highlighted_text = (params: {
217210
label = website_match[3].replace(/\\"/g, '"').replace(/\\\\/g, '\\')
218211
}
219212

220-
return `<span class="${cn(styles['symbol'], styles['symbol--website'])}" data-type="website-symbol" data-url="${escape_html(url)}" data-id-and-token="${id_and_token}" data-title="${escape_html(website_match[3] || '')}" title="${escape_html(label)}"><span class="${styles['symbol__icon']}" data-role="symbol-icon"></span><span class="${styles['symbol__text']}" data-role="symbol-text">${escape_html(label)}</span></span>`
213+
return `<span class="${cn(styles['symbol'], styles['symbol--website'], {
214+
[styles['symbol--non-interactive']]: !interactive_text
215+
})}" data-type="website-symbol" data-url="${escape_html(url)}" data-id-and-token="${id_and_token}" data-title="${escape_html(website_match[3] || '')}" title="${escape_html(label)}"><span class="${styles['symbol__icon']}" data-role="symbol-icon"></span><span class="${styles['symbol__text']}" data-role="symbol-text">${escape_html(label)}</span></span>`
221216
}
222217

223218
const pasted_text_match = part.match(
@@ -230,7 +225,8 @@ export const get_highlighted_text = (params: {
230225
const label = `Pasted ${display_token_count(token_count)} tokens`
231226
return `<span class="${cn(
232227
styles['symbol'],
233-
styles['symbol--pasted-text']
228+
styles['symbol--pasted-text'],
229+
{ [styles['symbol--non-interactive']]: !interactive_text }
234230
)}" data-type="pasted-text-symbol" data-hash="${hash}" data-token-count="${token_count_str}"><span class="${
235231
styles['symbol__icon']
236232
}" data-role="symbol-icon"></span><span class="${
@@ -240,7 +236,8 @@ export const get_highlighted_text = (params: {
240236

241237
return process_text_part_for_files({
242238
text: part,
243-
context_file_paths: params.context_file_paths
239+
context_file_paths: params.context_file_paths,
240+
interactive_text
244241
})
245242
})
246243
.join('')

‎packages/ui/src/components/editor/common/prompts/shared/symbols/prompt-symbols.module.scss‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -211,6 +211,14 @@
211211
transparent
212212
);
213213
}
214+
215+
&--non-interactive &__text {
216+
cursor: text !important;
217+
218+
&:hover {
219+
background-color: transparent !important;
220+
}
221+
}
214222
}
215223

216224
.inline-code {

0 commit comments

Comments
 (0)