1
0
mirror of https://github.com/Unleash/unleash.git synced 2024-12-22 19:07:54 +01:00

feat: project filter names (#5627)

This commit is contained in:
Mateusz Kwasniewski 2023-12-13 11:34:30 +01:00 committed by GitHub
parent e32fa396fc
commit 54316cace3
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 13 additions and 9 deletions

View File

@ -72,7 +72,7 @@ export const FilterDateItem: FC<IFilterDateItemProps> = ({
<Box ref={ref}>
<FilterItemChip
label={label}
selectedOptions={selectedOptions}
selectedDisplayOptions={selectedOptions}
onDelete={onDelete}
onClick={open}
operator={currentOperator}

View File

@ -46,7 +46,7 @@ describe('FilterItem Component', () => {
const recordedChanges = setup(mockState);
const valuesElement = await screen.findByText('1, 3');
const valuesElement = await screen.findByText('Option 1, Option 3');
await screen.findByText('is any of');
expect(valuesElement).toBeInTheDocument();
@ -83,7 +83,7 @@ describe('FilterItem Component', () => {
const recordedChanges = setup(mockState);
const valuesElement = await screen.findByText('1, 3 +1');
const valuesElement = await screen.findByText('Option 1, Option 3 +1');
await screen.findByText('is any of');
expect(valuesElement).toBeInTheDocument();
});

View File

@ -56,6 +56,9 @@ export const FilterItem: FC<IFilterItemProps> = ({
};
const selectedOptions = state ? state.values : [];
const selectedDisplayOptions = selectedOptions
.map((value) => options.find((option) => option.value === value)?.label)
.filter((label): label is string => label !== undefined);
const currentOperator = state ? state.operator : currentOperators[0];
const onDelete = () => {
@ -99,7 +102,7 @@ export const FilterItem: FC<IFilterItemProps> = ({
<Box ref={ref}>
<FilterItemChip
label={label}
selectedOptions={selectedOptions}
selectedDisplayOptions={selectedDisplayOptions}
onDelete={onDelete}
onClick={open}
operator={currentOperator}
@ -129,6 +132,7 @@ export const FilterItem: FC<IFilterItemProps> = ({
value={searchText}
onChange={(event) => setSearchText(event.target.value)}
placeholder='Search'
autoFocus
InputProps={{
startAdornment: (
<InputAdornment position='start'>

View File

@ -68,7 +68,7 @@ const Arrow = () => (
interface IFilterItemChipProps {
label: string;
selectedOptions?: string[];
selectedDisplayOptions?: string[];
operatorOptions: string[];
operator: string;
onChangeOperator: (value: string) => void;
@ -78,17 +78,17 @@ interface IFilterItemChipProps {
export const FilterItemChip: FC<IFilterItemChipProps> = ({
label,
selectedOptions = [],
selectedDisplayOptions = [],
operatorOptions,
operator,
onChangeOperator,
onClick,
onDelete,
}) => {
const hasSelectedOptions = selectedOptions.length > 0;
const hasSelectedOptions = selectedDisplayOptions.length > 0;
const maxExplicitOptions = 2;
const explicitOptions = selectedOptions.slice(0, maxExplicitOptions);
const remainingOptions = selectedOptions.length - maxExplicitOptions;
const explicitOptions = selectedDisplayOptions.slice(0, maxExplicitOptions);
const remainingOptions = selectedDisplayOptions.length - maxExplicitOptions;
const { trackEvent } = usePlausibleTracker();
const onChange = (operator: string) => {