Skip to content

Commit 1e8bddf

Browse files
robertpiosikrobertpiosik
committed
Add hover tooltip and translations for the prompt field more button
- in the prompt field show tooltip with text 'More' - the 'more' arrow is misaligned ├── apps │ └── editor │ └── src │ └── views │ └── prompt │ └── frontend │ ├── Main │ │ └── MainView │ │ └── MainView.tsx │ └── i18n │ └── translations │ └── prompt-field.ts └── packages └── ui └── src └── components └── editor └── common ├── Tooltip │ ├── Tooltip.module.scss │ └── Tooltip.tsx └── prompts └── PromptField ├── PromptField.module.scss ├── PromptField.stories.tsx ├── PromptField.tsx ├── hooks │ ├── use-drag-drop.ts │ ├── use-dropdown.ts │ ├── use-ghost-text.ts │ ├── use-handlers │ │ ├── handle-copy.ts │ │ ├── handle-cut.ts │ │ ├── handle-input-change.ts │ │ ├── handle-input-click.ts │ │ ├── handle-key-down.ts │ │ ├── handle-paste.ts │ │ ├── handle-submit.ts │ │ ├── index.ts │ │ ├── types.ts │ │ ├── use-handlers.ts │ │ └── utils.ts │ └── use-keyboard-shortcuts.ts └── index.ts
1 parent 6f69327 commit 1e8bddf

7 files changed

Lines changed: 55 additions & 17 deletions

File tree

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

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -413,7 +413,8 @@ export const MainView: React.FC<Props> = (props) => {
413413
preview_prompt: t('prompt-field.action.preview-prompt'),
414414
send: t('prompt-field.action.send'),
415415
attach_selected_files: t('prompt-field.attach-selected-files'),
416-
target: t('prompt-field.target')
416+
target: t('prompt-field.target'),
417+
more: t('prompt-field.more')
417418
}}
418419
/>
419420
</div>

‎apps/editor/src/views/prompt/frontend/i18n/translations/prompt-field.ts‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -376,5 +376,23 @@ export const prompt_field = {
376376
cs: 'Cíl',
377377
hu: 'Cél',
378378
bg: 'Цел'
379+
},
380+
'prompt-field.more': {
381+
en: 'More',
382+
pl: 'Więcej',
383+
'zh-cn': '更多',
384+
ja: 'もっと見る',
385+
'zh-tw': '更多',
386+
de: 'Mehr',
387+
es: 'Más',
388+
fr: 'Plus',
389+
'pt-br': 'Mais',
390+
ru: 'Ещё',
391+
ko: '더 보기',
392+
it: 'Altro',
393+
tr: 'Daha Fazla',
394+
cs: 'Více',
395+
hu: 'Több',
396+
bg: 'Още'
379397
}
380398
} as const

‎packages/ui/src/components/editor/common/Button/Button.module.scss‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -25,8 +25,8 @@
2525
}
2626

2727
&:disabled {
28-
opacity: 0.5;
29-
cursor: not-allowed;
28+
opacity: var(--disabled-opacity);
29+
cursor: default;
3030

3131
&:hover {
3232
background-color: var(--vscode-button-background);

‎packages/ui/src/components/editor/common/DropdownMenu/DropdownMenu.module.scss‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -81,8 +81,8 @@
8181
}
8282

8383
&--disabled {
84-
opacity: var(--disabled-opacity);
85-
cursor: not-allowed;
84+
opacity: var(--disabled-opacity);
85+
cursor: default;
8686
}
8787
}
8888

‎packages/ui/src/components/editor/common/prompts/PromptField/PromptField.module.scss‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -263,8 +263,8 @@
263263
}
264264

265265
&:disabled {
266-
opacity: var(--disabled-opacity);
267-
cursor: not-allowed;
266+
opacity: var(--disabled-opacity);
267+
cursor: default;
268268

269269
&:hover {
270270
background-color: none;

‎packages/ui/src/components/editor/common/prompts/PromptField/PromptField.stories.tsx‎

Lines changed: 20 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -67,7 +67,8 @@ export const Empty = () => (
6767
preview_prompt: 'Preview prompt',
6868
send: 'Send',
6969
attach_selected_files: 'Attach selected files',
70-
target: 'Target'
70+
target: 'Target',
71+
more: 'More'
7172
}}
7273
/>
7374
)
@@ -133,7 +134,8 @@ export const WithText = () => (
133134
preview_prompt: 'Preview prompt',
134135
send: 'Send',
135136
attach_selected_files: 'Attach selected files',
136-
target: 'Target'
137+
target: 'Target',
138+
more: 'More'
137139
}}
138140
/>
139141
)
@@ -199,7 +201,8 @@ export const LongText = () => (
199201
preview_prompt: 'Preview prompt',
200202
send: 'Send',
201203
attach_selected_files: 'Attach selected files',
202-
target: 'Target'
204+
target: 'Target',
205+
more: 'More'
203206
}}
204207
/>
205208
)
@@ -265,7 +268,8 @@ export const WithPlaceholderSavedContext = () => (
265268
preview_prompt: 'Preview prompt',
266269
send: 'Send',
267270
attach_selected_files: 'Attach selected files',
268-
target: 'Target'
271+
target: 'Target',
272+
more: 'More'
269273
}}
270274
/>
271275
)
@@ -331,7 +335,8 @@ export const WithCommit = () => (
331335
preview_prompt: 'Preview prompt',
332336
send: 'Send',
333337
attach_selected_files: 'Attach selected files',
334-
target: 'Target'
338+
target: 'Target',
339+
more: 'More'
335340
}}
336341
/>
337342
)
@@ -396,7 +401,8 @@ export const WithCommitWithQuotes = () => (
396401
preview_prompt: 'Preview prompt',
397402
send: 'Send',
398403
attach_selected_files: 'Attach selected files',
399-
target: 'Target'
404+
target: 'Target',
405+
more: 'More'
400406
}}
401407
/>
402408
)
@@ -469,7 +475,8 @@ export const WithEditFormatSelector = () => {
469475
preview_prompt: 'Preview prompt',
470476
send: 'Send',
471477
attach_selected_files: 'Attach selected files',
472-
target: 'Target'
478+
target: 'Target',
479+
more: 'More'
473480
}}
474481
/>
475482
)
@@ -534,7 +541,8 @@ export const WithWarning = () => (
534541
preview_prompt: 'Preview prompt',
535542
send: 'Send',
536543
attach_selected_files: 'Attach selected files',
537-
target: 'Target'
544+
target: 'Target',
545+
more: 'More'
538546
}}
539547
/>
540548
)
@@ -600,7 +608,8 @@ export const WithFilePaths = () => (
600608
preview_prompt: 'Preview prompt',
601609
send: 'Send',
602610
attach_selected_files: 'Attach selected files',
603-
target: 'Target'
611+
target: 'Target',
612+
more: 'More'
604613
}}
605614
/>
606615
)
@@ -694,7 +703,8 @@ export const WithTabs = () => {
694703
preview_prompt: 'Preview prompt',
695704
send: 'Send',
696705
attach_selected_files: 'Attach selected files',
697-
target: 'Target'
706+
target: 'Target',
707+
more: 'More'
698708
}}
699709
/>
700710
)

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

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -114,6 +114,7 @@ export type PromptFieldProps = {
114114
send: string
115115
attach_selected_files: string
116116
target: string
117+
more: string
117118
}
118119
}
119120

@@ -127,6 +128,7 @@ export const PromptField: React.FC<PromptFieldProps> = (props) => {
127128
const [is_focused, set_is_focused] = useState(false)
128129
const [is_recording_hovered, set_is_recording_hovered] = useState(false)
129130
const [is_edit_format_hovered, set_is_edit_format_hovered] = useState(false)
131+
const [is_more_hovered, set_is_more_hovered] = useState(false)
130132
const [is_target_switch_hovered, set_is_target_switch_hovered] =
131133
useState(false)
132134
const [hovered_left_action, set_hovered_left_action] = useState<
@@ -489,6 +491,9 @@ export const PromptField: React.FC<PromptFieldProps> = (props) => {
489491
align="right"
490492
/>
491493
)}
494+
{is_more_hovered && (
495+
<Tooltip message={props.translations.more} align="right" offset={11} />
496+
)}
492497
<div
493498
className={styles.footer__left}
494499
onClick={(e) => {
@@ -753,6 +758,8 @@ export const PromptField: React.FC<PromptFieldProps> = (props) => {
753758
onClick={() => {
754759
toggle_dropdown()
755760
}}
761+
onMouseEnter={() => set_is_more_hovered(true)}
762+
onMouseLeave={() => set_is_more_hovered(false)}
756763
>
757764
<span
758765
className={cn(
@@ -835,6 +842,8 @@ export const PromptField: React.FC<PromptFieldProps> = (props) => {
835842
onClick={() => {
836843
toggle_dropdown()
837844
}}
845+
onMouseEnter={() => set_is_more_hovered(true)}
846+
onMouseLeave={() => set_is_more_hovered(false)}
838847
>
839848
<span
840849
className={cn(

0 commit comments

Comments
 (0)