admin/twenty
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

add multiple filters of same FieldMetadataType (#5892)

Browse Source 
fixes: #5378
This commit is contained in:
Aditya Pimpalkar
2024-06-18 09:49:33 +01:00
committed by GitHub
parent de2b0527a3
commit 14abd99bb7
19 changed files with 91 additions and 180 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/twenty-front/src/modules/views/components/EditableFilterChip.tsx
View File

@ -16,8 +16,8 @@ export const EditableFilterChip = ({
const { getIcon } = useIcons();
return (
<SortOrFilterChip
key={viewFilter.fieldMetadataId}
testId={viewFilter.fieldMetadataId}
key={viewFilter.id}
testId={viewFilter.id}
labelKey={viewFilter.definition.label}
labelValue={`${getOperandLabelShort(viewFilter.operand)} ${
viewFilter.displayValue

6
packages/twenty-front/src/modules/views/components/EditableFilterDropdownButton.tsx
View File

@ -62,13 +62,13 @@ export const EditableFilterDropdownButton = ({
const handleRemove = () => {
closeDropdown();
removeCombinedViewFilter(viewFilter.fieldMetadataId);
removeCombinedViewFilter(viewFilter.id);
};
const handleDropdownClickOutside = useCallback(() => {
const { value, fieldMetadataId } = viewFilter;
const { id: fieldId, value } = viewFilter;
if (!value) {
removeCombinedViewFilter(fieldMetadataId);
removeCombinedViewFilter(fieldId);
}
}, [viewFilter, removeCombinedViewFilter]);

14
packages/twenty-front/src/modules/views/components/ViewBarDetails.tsx
View File

@ -153,19 +153,17 @@ export const ViewBarDetails = ({
availableFilterDefinitions,
).map((viewFilter) => (
<ObjectFilterDropdownScope
key={viewFilter.fieldMetadataId}
filterScopeId={viewFilter.fieldMetadataId}
key={viewFilter.id}
filterScopeId={viewFilter.id}
>
<DropdownScope dropdownScopeId={viewFilter.fieldMetadataId}>
<ViewBarFilterEffect
filterDropdownId={viewFilter.fieldMetadataId}
/>
<DropdownScope dropdownScopeId={viewFilter.id}>
<ViewBarFilterEffect filterDropdownId={viewFilter.id} />
<EditableFilterDropdownButton
viewFilter={viewFilter}
hotkeyScope={{
scope: viewFilter.fieldMetadataId,
scope: viewFilter.id,
}}
viewFilterDropdownId={viewFilter.fieldMetadataId}
viewFilterDropdownId={viewFilter.id}
/>
</DropdownScope>
</ObjectFilterDropdownScope>

46
packages/twenty-front/src/modules/views/components/ViewBarFilterEffect.tsx
View File

@ -6,6 +6,7 @@ import { useFilterDropdown } from '@/object-record/object-filter-dropdown/hooks/
import { Filter } from '@/object-record/object-filter-dropdown/types/Filter';
import { useViewStates } from '@/views/hooks/internal/useViewStates';
import { useCombinedViewFilters } from '@/views/hooks/useCombinedViewFilters';
import { useGetCurrentView } from '@/views/hooks/useGetCurrentView';
import { isDefined } from '~/utils/isDefined';
type ViewBarFilterEffectProps = {
@ -15,11 +16,12 @@ type ViewBarFilterEffectProps = {
export const ViewBarFilterEffect = ({
filterDropdownId,
}: ViewBarFilterEffectProps) => {
const { availableFilterDefinitionsState, unsavedToUpsertViewFiltersState } =
useViewStates();
const { availableFilterDefinitionsState } = useViewStates();
const { upsertCombinedViewFilter } = useCombinedViewFilters();
const { currentViewWithCombinedFiltersAndSorts } = useGetCurrentView();
const availableFilterDefinitions = useRecoilValue(
availableFilterDefinitionsState,
);
@ -51,47 +53,41 @@ export const ViewBarFilterEffect = ({
upsertCombinedViewFilter,
]);
const unsavedToUpsertViewFilters = useRecoilValue(
unsavedToUpsertViewFiltersState,
);
useEffect(() => {
if (filterDefinitionUsedInDropdown?.type === 'RELATION') {
const viewFilterUsedInDropdown = unsavedToUpsertViewFilters.find(
(filter) =>
filter.fieldMetadataId ===
filterDefinitionUsedInDropdown.fieldMetadataId,
);
const viewFilterUsedInDropdown =
currentViewWithCombinedFiltersAndSorts?.viewFilters.find(
(filter) =>
filter.fieldMetadataId ===
filterDefinitionUsedInDropdown?.fieldMetadataId,
);
const viewFilterSelectedRecordIds = isNonEmptyString(
const viewFilterSelectedRecords = isNonEmptyString(
viewFilterUsedInDropdown?.value,
)
? JSON.parse(viewFilterUsedInDropdown.value)
: [];
setObjectFilterDropdownSelectedRecordIds(viewFilterSelectedRecordIds);
setObjectFilterDropdownSelectedRecordIds(viewFilterSelectedRecords);
} else if (filterDefinitionUsedInDropdown?.type === 'SELECT') {
const viewFilterUsedInDropdown = unsavedToUpsertViewFilters.find(
(filter) =>
filter.fieldMetadataId ===
filterDefinitionUsedInDropdown.fieldMetadataId,
);
const viewFilterUsedInDropdown =
currentViewWithCombinedFiltersAndSorts?.viewFilters.find(
(filter) =>
filter.fieldMetadataId ===
filterDefinitionUsedInDropdown?.fieldMetadataId,
);
const viewFilterSelectedOptionValues = isNonEmptyString(
const viewFilterSelectedRecords = isNonEmptyString(
viewFilterUsedInDropdown?.value,
)
? JSON.parse(viewFilterUsedInDropdown.value)
: [];
setObjectFilterDropdownSelectedOptionValues(
viewFilterSelectedOptionValues,
);
setObjectFilterDropdownSelectedOptionValues(viewFilterSelectedRecords);
}
}, [
filterDefinitionUsedInDropdown,
setObjectFilterDropdownSelectedRecordIds,
setObjectFilterDropdownSelectedOptionValues,
unsavedToUpsertViewFilters,
currentViewWithCombinedFiltersAndSorts,
]);
return <></>;