Fixed error with contains filters.

This commit is contained in:
Mike Cao 2025-02-13 19:29:41 -08:00
parent ab08fcb00f
commit 35dc6ef83b

View file

@ -1,13 +1,7 @@
import { import { useMemo, useState } from 'react';
useFilters, import { useFilters, useFormat, useMessages, useWebsiteValues } from '@/components/hooks';
useFormat,
useLocale,
useMessages,
useWebsiteValues,
} from '@/components/hooks';
import { OPERATORS } from '@/lib/constants'; import { OPERATORS } from '@/lib/constants';
import { isEqualsOperator } from '@/lib/params'; import { isEqualsOperator } from '@/lib/params';
import { useMemo, useState } from 'react';
import { import {
Button, Button,
Dropdown, Dropdown,
@ -61,7 +55,6 @@ export default function FieldFilterEditForm({
const [selected, setSelected] = useState(isEquals ? value : ''); const [selected, setSelected] = useState(isEquals ? value : '');
const { filters } = useFilters(); const { filters } = useFilters();
const { formatValue } = useFormat(); const { formatValue } = useFormat();
const { locale } = useLocale();
const isDisabled = !operator || (isEquals && !selected) || (!isEquals && !value); const isDisabled = !operator || (isEquals && !selected) || (!isEquals && !value);
const { const {
data: values = [], data: values = [],
@ -86,29 +79,17 @@ export default function FieldFilterEditForm({
}; };
const formattedValues = useMemo(() => { const formattedValues = useMemo(() => {
if (!values) { return values.reduce((obj: { [x: string]: string }, { value }: { value: string }) => {
return {}; obj[value] = formatValue(value, name);
}
const formatted = {};
const format = (val: string) => {
formatted[val] = formatValue(val, name);
return formatted[val];
};
if (values?.length !== 1) { return obj;
const { compare } = new Intl.Collator(locale, { numeric: true }); }, {});
values.sort((a, b) => compare(formatted[a] ?? format(a), formatted[b] ?? format(b))); }, [formatValue, name, values]);
} else {
format(values[0]);
}
return formatted;
}, [formatValue, locale, name, values]);
const filteredValues = useMemo(() => { const filteredValues = useMemo(() => {
return value return value
? values.filter((n: string | number) => ? values.filter((n: string | number) =>
formattedValues[n].toLowerCase().includes(value.toLowerCase()), formattedValues[n]?.toLowerCase()?.includes(value.toLowerCase()),
) )
: values; : values;
}, [value, formattedValues]); }, [value, formattedValues]);