feat: searchable unit picker in the work form

Units dictionary has around a hundred entries; typing now filters the
list and Enter picks the first match. Only dictionary values can be
chosen, as before. Generic SearchableSelect lives in shared until the
ui-kit gets one.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
This commit is contained in:
Тимур Городецкий
2026-10-19 10:07:07 +05:00
parent 7ca71c6b6c
commit cb810972c4
8 changed files with 258 additions and 8 deletions
@@ -2,6 +2,7 @@ import * as React from 'react';
import { Alert, Button, Dialog, FormField, Select, TextInput } from '@tnsu/ui-kit';
import { ITree } from '../_tree/treeRules';
import { FormInput } from '../_tree/FormInput';
import { SearchableSelect } from '../../shared/components/SearchableSelect';
import { IWorkEditor } from './useWorkEditor';
import { parentOptions, unitOptions } from './worksRules';
import { IWork } from './worksTypes';
@@ -60,12 +61,15 @@ export const WorkModal: React.FC<Props> = ({ editor, tree, units, objectTitle })
/>
</FormField>
<FormField label={TEXTS.unit} htmlFor="work-unit" full>
<Select
<SearchableSelect
id="work-unit"
value={form.unit}
onChange={(value) => setField('unit', value)}
options={unitOptions(units, form.unit)}
placeholder={TEXTS.unitPlaceholder}
searchPlaceholder={TEXTS.unitSearch}
notFoundText={TEXTS.unitNotFound}
clearLabel={TEXTS.cancel}
/>
</FormField>
<FormField label={TEXTS.volume} htmlFor="work-volume" full>
@@ -93,7 +97,14 @@ export const WorkModal: React.FC<Props> = ({ editor, tree, units, objectTitle })
<TextInput id="work-start" type="date" value={form.start} onChange={(value) => setField('start', value)} />
</FormField>
<FormField label={TEXTS.finish} htmlFor="work-finish" full>
<TextInput id="work-finish" type="date" value={form.finish} onChange={(value) => setField('finish', value)} />
{/* min — календарь не даёт выбрать окончание раньше начала. */}
<TextInput
id="work-finish"
type="date"
value={form.finish}
min={form.start || undefined}
onChange={(value) => setField('finish', value)}
/>
</FormField>
{editor.saveError && <Alert variant="err">{editor.saveError}</Alert>}
</div>
+4 -1
View File
@@ -45,7 +45,10 @@ export const WORKS_TEXTS = {
add: 'Добавить',
save: 'Сохранить',
saving: 'Сохранение...',
saveError: 'Ошибка при сохранении. Проверьте права доступа к Dataverse.'
saveError: 'Ошибка при сохранении. Проверьте права доступа к Dataverse.',
dateRangeError: 'Дата окончания не может быть раньше даты начала',
unitSearch: 'Начните вводить ед. изм.',
unitNotFound: 'Ничего не найдено'
},
confirmDelete: {
title: 'Подтвердите удаление',