1
0
Fork 0
mirror of https://github.com/plankanban/planka.git synced 2025-07-22 06:39:44 +02:00

ref: Little refactoring

This commit is contained in:
Maksim Eltyshev 2022-08-23 21:06:50 +02:00
parent c40709a509
commit ac64b28b69
8 changed files with 45 additions and 33 deletions

View file

@ -21,17 +21,17 @@ const LabelsStep = React.memo(
({ items, currentIds, title, onSelect, onDeselect, onCreate, onUpdate, onDelete, onBack }) => {
const [t] = useTranslation();
const [step, openStep, handleBack] = useSteps();
const [searchValue, handleSearchFieldChange] = useField('');
const search = useMemo(() => searchValue.trim().toLowerCase(), [searchValue]);
const [search, handleSearchChange] = useField('');
const cleanSearch = useMemo(() => search.trim().toLowerCase(), [search]);
const filteredItems = useMemo(
() =>
items.filter(
(label) =>
(label.name && label.name.toLowerCase().includes(search)) ||
label.color.includes(search),
(label.name && label.name.toLowerCase().includes(cleanSearch)) ||
label.color.includes(cleanSearch),
),
[items, search],
[items, cleanSearch],
);
const searchField = useRef(null);
@ -109,15 +109,19 @@ const LabelsStep = React.memo(
return (
<>
<Popup.Header onBack={onBack}>{t(title)}</Popup.Header>
<Popup.Header onBack={onBack}>
{t(title, {
context: 'title',
})}
</Popup.Header>
<Popup.Content>
<Input
fluid
ref={searchField}
value={searchValue}
value={search}
placeholder={t('common.searchLabels')}
icon="search"
onChange={handleSearchFieldChange}
onChange={handleSearchChange}
/>
{filteredItems.length > 0 && (
<div className={styles.items}>