Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2025-04-01 01:18:10 +02:00
Code Issues Projects Releases Wiki Activity

feat: project filter names (#5627)

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/component/common/FilterDateItem/FilterDateItem.tsx
View File

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

4
frontend/src/component/filter/FilterItem/FilterItem.test.tsx
View File

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

6
frontend/src/component/filter/FilterItem/FilterItem.tsx
View File

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

10
frontend/src/component/filter/FilterItem/FilterItemChip/FilterItemChip.tsx
View File

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