feat: add clear button to the project search field

Clears only the search text and reopens the list, the selected project
stays. Requested during manual testing.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
This commit is contained in:
Тимур Городецкий
2026-10-16 12:33:38 +05:00
parent 45c974d0c6
commit c69a11d167
3 changed files with 39 additions and 0 deletions
@@ -40,6 +40,14 @@ export const ProjectPicker: React.FC = () => {
setIsOpen(true);
};
// Очистка не сбрасывает выбранный проект — только текст поиска, чтобы сразу искать другой.
const onClear = (event: React.MouseEvent): void => {
event.preventDefault();
setQuery('');
setIsOpen(true);
inputRef.current?.focus();
};
// mousedown, а не click: иначе поле теряет фокус раньше, чем срабатывает выбор.
const onPick = (event: React.MouseEvent, project: IAccessibleProject): void => {
event.preventDefault();
@@ -67,6 +75,17 @@ export const ProjectPicker: React.FC = () => {
onFocus={onFocus}
onChange={onChange}
/>
{query && (
<button
type="button"
className={styles.clearButton}
title={TEXTS.clear}
aria-label={TEXTS.clear}
onMouseDown={onClear}
>
<Icon name="close" size="sm" />
</button>
)}
{currentProject?.status && (
<span className={styles.selectedBadge}>
<ProjectStatusBadge status={currentProject.status} />