mukeshs/twenty_crm
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Remove filter definition (#10227)

Browse Source 
This PR removes completely filter definition usage and states,
everything is now derived from fieldMetadataItem.
This commit is contained in:
Lucas Bordeau
2025-02-14 18:37:34 +01:00
committed by GitHub
parent 68db9a7a8c
commit 70e5cdfe83
51 changed files with 250 additions and 766 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
packages/twenty-front/jest.config.ts
View File

@ -6,7 +6,8 @@ process.env.TZ = 'GMT';
process.env.LC_ALL = 'en_US.UTF-8';
const jestConfig: JestConfigWithTsJest = {
// to enable logs, comment out the following line
silent: false,
silent: true,
verbose: false,
// For more information please have a look to official docs https://jestjs.io/docs/configuration/#prettierpath-string
// Prettier v3 will should be supported in jest v30 https://github.com/jestjs/jest/releases/tag/v30.0.0-alpha.1
prettierPath: null,

8
packages/twenty-front/src/modules/action-menu/actions/record-actions/multiple-records/hooks/__tests__/useDestroyMultipleRecordsAction.test.tsx
View File

@ -90,12 +90,8 @@ describe('useDestroyMultipleRecordsAction', () => {
value: '',
displayValue: '',
operand: ViewFilterOperand.IsNotEmpty,
definition: {
label: 'Deleted',
iconName: 'IconTrash',
fieldMetadataId: personMockObjectMetadataItemDeletedAtField.id,
type: 'DATE_TIME',
},
type: 'DATE_TIME',
label: 'Deleted',
},
],
}),

10
packages/twenty-front/src/modules/context-store/utils/__tests__/computeContextStoreFilters.test.ts
View File

@ -52,14 +52,8 @@ describe('computeContextStoreFilters', () => {
displayValue: 'John',
displayAvatarUrl: undefined,
operand: ViewFilterOperand.Contains,
definition: {
fieldMetadataId: personObjectMetadataItem.fields.find(
(field) => field.name === 'name',
)!.id,
label: 'Name',
iconName: 'person',
type: 'TEXT',
},
type: 'TEXT',
label: 'Name',
},
];

63
packages/twenty-front/src/modules/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions.ts
View File

@ -1,69 +1,8 @@
import { RecordFilterDefinition } from '@/object-record/record-filter/types/RecordFilterDefinition';
import {
FieldMetadataType,
RelationDefinitionType,
} from '~/generated-metadata/graphql';
import { FieldMetadataType } from '~/generated-metadata/graphql';
import { FilterableFieldType } from '@/object-record/record-filter/types/FilterableFieldType';
import { ObjectMetadataItem } from '../types/ObjectMetadataItem';
export const formatFieldMetadataItemsAsFilterDefinitions = ({
fields,
isJsonFilterEnabled,
}: {
fields: Array<ObjectMetadataItem['fields'][0]>;
isJsonFilterEnabled: boolean;
}): RecordFilterDefinition[] => {
return fields.reduce((acc, field) => {
if (
field.type === FieldMetadataType.RELATION &&
field.relationDefinition?.direction !==
RelationDefinitionType.MANY_TO_ONE &&
field.relationDefinition?.direction !== RelationDefinitionType.ONE_TO_ONE
) {
return acc;
}
if (
![
FieldMetadataType.BOOLEAN,
FieldMetadataType.DATE_TIME,
FieldMetadataType.DATE,
FieldMetadataType.TEXT,
FieldMetadataType.EMAILS,
FieldMetadataType.NUMBER,
FieldMetadataType.LINKS,
FieldMetadataType.FULL_NAME,
FieldMetadataType.ADDRESS,
FieldMetadataType.RELATION,
FieldMetadataType.SELECT,
FieldMetadataType.MULTI_SELECT,
FieldMetadataType.CURRENCY,
FieldMetadataType.RATING,
FieldMetadataType.ACTOR,
FieldMetadataType.PHONES,
FieldMetadataType.ARRAY,
...(isJsonFilterEnabled ? [FieldMetadataType.RAW_JSON] : []),
].includes(field.type)
) {
return acc;
}
return [...acc, formatFieldMetadataItemAsFilterDefinition({ field })];
}, [] as RecordFilterDefinition[]);
};
export const formatFieldMetadataItemAsFilterDefinition = ({
field,
}: {
field: ObjectMetadataItem['fields'][0];
}): RecordFilterDefinition => ({
fieldMetadataId: field.id,
label: field.label,
iconName: field.icon ?? 'Icon123',
type: getFilterTypeFromFieldType(field.type),
});
export const getRelationObjectMetadataNameSingular = ({
field,
}: {

17
packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterAddFilterRuleSelect.tsx
View File

@ -1,9 +1,6 @@
import { useObjectMetadataItemById } from '@/object-metadata/hooks/useObjectMetadataItemById';
import { availableFieldMetadataItemsForFilterFamilySelector } from '@/object-metadata/states/availableFieldMetadataItemsForFilterFamilySelector';
import {
formatFieldMetadataItemAsFilterDefinition,
getFilterTypeFromFieldType,
} from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { getFilterTypeFromFieldType } from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { useUpsertCombinedViewFilterGroup } from '@/object-record/advanced-filter/hooks/useUpsertCombinedViewFilterGroup';
import { getRecordFilterOperands } from '@/object-record/record-filter/utils/getRecordFilterOperands';
import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown';
@ -85,10 +82,6 @@ export const AdvancedFilterAddFilterRuleSelect = ({
const defaultFieldMetadataItem = getDefaultFieldMetadataItem();
const defaultFilterDefinition = formatFieldMetadataItemAsFilterDefinition({
field: defaultFieldMetadataItem,
});
const filterType = getFilterTypeFromFieldType(
defaultFieldMetadataItem.type,
);
@ -100,11 +93,11 @@ export const AdvancedFilterAddFilterRuleSelect = ({
operand: getRecordFilterOperands({
filterType,
})[0],
definition: defaultFilterDefinition,
value: '',
displayValue: '',
viewFilterGroupId: viewFilterGroup.id,
positionInViewFilterGroup: newPositionInViewFilterGroup,
label: defaultFieldMetadataItem.label,
});
};
@ -127,10 +120,6 @@ export const AdvancedFilterAddFilterRuleSelect = ({
const defaultFieldMetadataItem = getDefaultFieldMetadataItem();
const defaultFilterDefinition = formatFieldMetadataItemAsFilterDefinition({
field: defaultFieldMetadataItem,
});
const filterType = getFilterTypeFromFieldType(
defaultFieldMetadataItem.type,
);
@ -142,11 +131,11 @@ export const AdvancedFilterAddFilterRuleSelect = ({
operand: getRecordFilterOperands({
filterType,
})[0],
definition: defaultFilterDefinition,
value: '',
displayValue: '',
viewFilterGroupId: newViewFilterGroup.id,
positionInViewFilterGroup: newPositionInViewFilterGroup,
label: defaultFieldMetadataItem.label,
});
};

6
packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterViewFilterValueInput.tsx
View File

@ -1,7 +1,6 @@
import { useCurrentViewFilter } from '@/object-record/advanced-filter/hooks/useCurrentViewFilter';
import { ObjectFilterDropdownFilterInput } from '@/object-record/object-filter-dropdown/components/ObjectFilterDropdownFilterInput';
import { fieldMetadataItemIdUsedInDropdownComponentState } from '@/object-record/object-filter-dropdown/states/fieldMetadataItemIdUsedInDropdownComponentState';
import { filterDefinitionUsedInDropdownComponentState } from '@/object-record/object-filter-dropdown/states/filterDefinitionUsedInDropdownComponentState';
import { selectedFilterComponentState } from '@/object-record/object-filter-dropdown/states/selectedFilterComponentState';
import { selectedOperandInDropdownComponentState } from '@/object-record/object-filter-dropdown/states/selectedOperandInDropdownComponentState';
import { SelectControl } from '@/ui/input/components/SelectControl';
@ -23,10 +22,6 @@ export const AdvancedFilterViewFilterValueInput = ({
const isDisabled = !filter?.fieldMetadataId || !filter.operand;
const setFilterDefinitionUsedInDropdown = useSetRecoilComponentStateV2(
filterDefinitionUsedInDropdownComponentState,
);
const setFieldMetadataItemIdUsedInDropdown = useSetRecoilComponentStateV2(
fieldMetadataItemIdUsedInDropdownComponentState,
);
@ -64,7 +59,6 @@ export const AdvancedFilterViewFilterValueInput = ({
}
onOpen={() => {
setFieldMetadataItemIdUsedInDropdown(filter.fieldMetadataId);
setFilterDefinitionUsedInDropdown(filter.definition);
setSelectedOperandInDropdown(filter.operand);
setSelectedFilter(filter);
}}

11
packages/twenty-front/src/modules/object-record/advanced-filter/hooks/useCurrentViewFilter.ts
View File

@ -1,4 +1,4 @@
import { useFilterDefinitionsFromFilterableFieldMetadataItems } from '@/object-record/record-filter/hooks/useFilterDefinitionsFromFilterableFieldMetadataItems';
import { useFilterableFieldMetadataItemsInRecordIndexContext } from '@/object-record/record-filter/hooks/useFilterableFieldMetadataItemsInRecordIndexContext';
import { useGetCurrentView } from '@/views/hooks/useGetCurrentView';
import { mapViewFiltersToFilters } from '@/views/utils/mapViewFiltersToFilters';
@ -7,8 +7,8 @@ export const useCurrentViewFilter = ({
}: {
viewFilterId?: string;
}) => {
const { filterDefinitions } =
useFilterDefinitionsFromFilterableFieldMetadataItems();
const { filterableFieldMetadataItems } =
useFilterableFieldMetadataItemsInRecordIndexContext();
const { currentViewWithCombinedFiltersAndSorts } = useGetCurrentView();
@ -20,7 +20,10 @@ export const useCurrentViewFilter = ({
return undefined;
}
const [filter] = mapViewFiltersToFilters([viewFilter], filterDefinitions);
const [filter] = mapViewFiltersToFilters(
[viewFilter],
filterableFieldMetadataItems,
);
return filter;
};

12
packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/AdvancedFilterButton.tsx
View File

@ -1,9 +1,6 @@
import { useObjectMetadataItemById } from '@/object-metadata/hooks/useObjectMetadataItemById';
import { availableFieldMetadataItemsForFilterFamilySelector } from '@/object-metadata/states/availableFieldMetadataItemsForFilterFamilySelector';
import {
formatFieldMetadataItemAsFilterDefinition,
getFilterTypeFromFieldType,
} from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { getFilterTypeFromFieldType } from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { useUpsertCombinedViewFilterGroup } from '@/object-record/advanced-filter/hooks/useUpsertCombinedViewFilterGroup';
import { OBJECT_FILTER_DROPDOWN_ID } from '@/object-record/object-filter-dropdown/constants/ObjectFilterDropdownId';
import { getRecordFilterOperands } from '@/object-record/record-filter/utils/getRecordFilterOperands';
@ -110,10 +107,6 @@ export const AdvancedFilterButton = () => {
throw new Error('Missing default filter definition');
}
const filterDefinition = formatFieldMetadataItemAsFilterDefinition({
field: defaultFieldMetadataItem,
});
const filterType = getFilterTypeFromFieldType(
defaultFieldMetadataItem.type,
);
@ -126,10 +119,11 @@ export const AdvancedFilterButton = () => {
id: v4(),
fieldMetadataId: defaultFieldMetadataItem.id,
operand: firstOperand,
definition: filterDefinition,
value: '',
displayValue: '',
viewFilterGroupId: newViewFilterGroup.id,
type: getFilterTypeFromFieldType(defaultFieldMetadataItem.type),
label: defaultFieldMetadataItem.label,
});
}

9
packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownBooleanSelect.tsx
View File

@ -3,7 +3,7 @@ import styled from '@emotion/styled';
import { useEffect, useState } from 'react';
import { v4 } from 'uuid';
import { formatFieldMetadataItemAsFilterDefinition } from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { getFilterTypeFromFieldType } from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { fieldMetadataItemUsedInDropdownComponentSelector } from '@/object-record/object-filter-dropdown/states/fieldMetadataItemUsedInDropdownComponentSelector';
import { selectedFilterComponentState } from '@/object-record/object-filter-dropdown/states/selectedFilterComponentState';
import { selectedOperandInDropdownComponentState } from '@/object-record/object-filter-dropdown/states/selectedOperandInDropdownComponentState';
@ -72,18 +72,15 @@ export const ObjectFilterDropdownBooleanSelect = () => {
return;
}
const filterDefinition = formatFieldMetadataItemAsFilterDefinition({
field: fieldMetadataItemUsedInDropdown,
});
applyRecordFilter({
id: selectedFilter?.id ?? v4(),
definition: filterDefinition,
operand: selectedOperandInDropdown,
displayValue: value ? 'True' : 'False',
fieldMetadataId: fieldMetadataItemUsedInDropdown.id,
value: value.toString(),
viewFilterGroupId: selectedFilter?.viewFilterGroupId,
type: getFilterTypeFromFieldType(fieldMetadataItemUsedInDropdown.type),
label: fieldMetadataItemUsedInDropdown.label,
});
setSelectedValue(value);

16
packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownDateInput.tsx
View File

@ -1,6 +1,6 @@
import { v4 } from 'uuid';
import { formatFieldMetadataItemAsFilterDefinition } from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { getFilterTypeFromFieldType } from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { fieldMetadataItemUsedInDropdownComponentSelector } from '@/object-record/object-filter-dropdown/states/fieldMetadataItemUsedInDropdownComponentSelector';
import { selectedFilterComponentState } from '@/object-record/object-filter-dropdown/states/selectedFilterComponentState';
import { selectedOperandInDropdownComponentState } from '@/object-record/object-filter-dropdown/states/selectedOperandInDropdownComponentState';
@ -49,13 +49,8 @@ export const ObjectFilterDropdownDateInput = () => {
if (!fieldMetadataItemUsedInDropdown || !selectedOperandInDropdown) return;
const filterDefinition = formatFieldMetadataItemAsFilterDefinition({
field: fieldMetadataItemUsedInDropdown,
});
applyRecordFilter({
id: selectedFilter?.id ? selectedFilter.id : v4(),
definition: filterDefinition,
fieldMetadataId: fieldMetadataItemUsedInDropdown.id,
value: newDate?.toISOString() ?? '',
operand: selectedOperandInDropdown,
@ -65,6 +60,8 @@ export const ObjectFilterDropdownDateInput = () => {
: newDate.toLocaleDateString()
: '',
viewFilterGroupId: selectedFilter?.viewFilterGroupId,
type: getFilterTypeFromFieldType(fieldMetadataItemUsedInDropdown.type),
label: fieldMetadataItemUsedInDropdown.label,
});
};
@ -77,10 +74,6 @@ export const ObjectFilterDropdownDateInput = () => {
) => {
if (!fieldMetadataItemUsedInDropdown || !selectedOperandInDropdown) return;
const filterDefinition = formatFieldMetadataItemAsFilterDefinition({
field: fieldMetadataItemUsedInDropdown,
});
const value = relativeDate
? computeVariableDateViewFilterValue(
relativeDate.direction,
@ -95,8 +88,9 @@ export const ObjectFilterDropdownDateInput = () => {
value,
operand: selectedOperandInDropdown,
displayValue: getRelativeDateDisplayValue(relativeDate),
definition: filterDefinition,
viewFilterGroupId: selectedFilter?.viewFilterGroupId,
type: getFilterTypeFromFieldType(fieldMetadataItemUsedInDropdown.type),
label: fieldMetadataItemUsedInDropdown.label,
});
};

15
packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownFilterSelect.tsx
View File

@ -6,7 +6,7 @@ import { useAdvancedFilterDropdown } from '@/object-record/advanced-filter/hooks
import { AdvancedFilterButton } from '@/object-record/object-filter-dropdown/components/AdvancedFilterButton';
import { ObjectFilterDropdownFilterSelectMenuItem } from '@/object-record/object-filter-dropdown/components/ObjectFilterDropdownFilterSelectMenuItem';
import { OBJECT_FILTER_DROPDOWN_ID } from '@/object-record/object-filter-dropdown/constants/ObjectFilterDropdownId';
import { useSelectFilterDefinitionUsedInDropdown } from '@/object-record/object-filter-dropdown/hooks/useSelectFilterDefinitionUsedInDropdown';
import { objectFilterDropdownSearchInputComponentState } from '@/object-record/object-filter-dropdown/states/objectFilterDropdownSearchInputComponentState';
import { useRecordIndexContextOrThrow } from '@/object-record/record-index/contexts/RecordIndexContext';
@ -23,7 +23,7 @@ import { useIsFeatureEnabled } from '@/workspace/hooks/useIsFeatureEnabled';
import { isDefined } from 'twenty-shared';
import { FeatureFlagKey } from '~/generated/graphql';
import { formatFieldMetadataItemAsFilterDefinition } from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { useSelectFilterUsedInDropdown } from '@/object-record/object-filter-dropdown/hooks/useSelectFilterUsedInDropdown';
import { advancedFilterViewFilterIdComponentState } from '@/object-record/object-filter-dropdown/states/advancedFilterViewFilterIdComponentState';
import { fieldMetadataItemIdUsedInDropdownComponentState } from '@/object-record/object-filter-dropdown/states/fieldMetadataItemIdUsedInDropdownComponentState';
import { FiltersHotkeyScope } from '@/object-record/object-filter-dropdown/types/FiltersHotkeyScope';
@ -124,8 +124,7 @@ export const ObjectFilterDropdownFilterSelect = ({
(fieldMetadataItem) => fieldMetadataItem.id,
);
const { selectFilterDefinitionUsedInDropdown } =
useSelectFilterDefinitionUsedInDropdown();
const { selectFilterUsedInDropdown } = useSelectFilterUsedInDropdown();
const setFieldMetadataItemIdUsedInDropdown = useSetRecoilComponentStateV2(
fieldMetadataItemIdUsedInDropdownComponentState,
@ -144,12 +143,8 @@ export const ObjectFilterDropdownFilterSelect = ({
resetSelectedItem();
const selectedFilterDefinition = formatFieldMetadataItemAsFilterDefinition({
field: selectedFieldMetadataItem,
});
selectFilterDefinitionUsedInDropdown({
filterDefinition: selectedFilterDefinition,
selectFilterUsedInDropdown({
fieldMetadataItemId,
});
setFieldMetadataItemIdUsedInDropdown(fieldMetadataItemId);

33
packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownFilterSelectCompositeFieldSubMenu.tsx
View File

@ -5,9 +5,7 @@ import { advancedFilterViewFilterGroupIdComponentState } from '@/object-record/o
import { advancedFilterViewFilterIdComponentState } from '@/object-record/object-filter-dropdown/states/advancedFilterViewFilterIdComponentState';
import { fieldMetadataItemIdUsedInDropdownComponentState } from '@/object-record/object-filter-dropdown/states/fieldMetadataItemIdUsedInDropdownComponentState';
import { fieldMetadataItemUsedInDropdownComponentSelector } from '@/object-record/object-filter-dropdown/states/fieldMetadataItemUsedInDropdownComponentSelector';
import { filterDefinitionUsedInDropdownComponentState } from '@/object-record/object-filter-dropdown/states/filterDefinitionUsedInDropdownComponentState';
import { objectFilterDropdownFilterIsSelectedComponentState } from '@/object-record/object-filter-dropdown/states/objectFilterDropdownFilterIsSelectedComponentState';
import { objectFilterDropdownFirstLevelFilterDefinitionComponentState } from '@/object-record/object-filter-dropdown/states/objectFilterDropdownFirstLevelFilterDefinitionComponentState';
import { objectFilterDropdownIsSelectingCompositeFieldComponentState } from '@/object-record/object-filter-dropdown/states/objectFilterDropdownIsSelectingCompositeFieldComponentState';
import { objectFilterDropdownSearchInputComponentState } from '@/object-record/object-filter-dropdown/states/objectFilterDropdownSearchInputComponentState';
import { objectFilterDropdownSubMenuFieldTypeComponentState } from '@/object-record/object-filter-dropdown/states/objectFilterDropdownSubMenuFieldTypeComponentState';
@ -17,7 +15,6 @@ import { getCompositeSubFieldLabel } from '@/object-record/object-filter-dropdow
import { getFilterableFieldTypeLabel } from '@/object-record/object-filter-dropdown/utils/getFilterableFieldTypeLabel';
import { getInitialFilterValue } from '@/object-record/object-filter-dropdown/utils/getInitialFilterValue';
import { useApplyRecordFilter } from '@/object-record/record-filter/hooks/useApplyRecordFilter';
import { RecordFilterDefinition } from '@/object-record/record-filter/types/RecordFilterDefinition';
import { getRecordFilterOperands } from '@/object-record/record-filter/utils/getRecordFilterOperands';
import { SETTINGS_COMPOSITE_FIELD_TYPE_CONFIGS } from '@/settings/data-model/constants/SettingsCompositeFieldTypeConfigs';
import { DropdownMenuHeader } from '@/ui/layout/dropdown/components/DropdownMenuHeader';
@ -34,13 +31,6 @@ export const ObjectFilterDropdownFilterSelectCompositeFieldSubMenu = () => {
const { getIcon } = useIcons();
const [
objectFilterDropdownFirstLevelFilterDefinition,
setObjectFilterDropdownFirstLevelFilterDefinition,
] = useRecoilComponentStateV2(
objectFilterDropdownFirstLevelFilterDefinitionComponentState,
);
const fieldMetadataItemUsedInDropdown = useRecoilComponentValueV2(
fieldMetadataItemUsedInDropdownComponentSelector,
);
@ -65,10 +55,6 @@ export const ObjectFilterDropdownFilterSelectCompositeFieldSubMenu = () => {
objectFilterDropdownSubMenuFieldTypeComponentState,
);
const setFilterDefinitionUsedInDropdown = useSetRecoilComponentStateV2(
filterDefinitionUsedInDropdownComponentState,
);
const setFieldMetadataItemIdUsedInDropdown = useSetRecoilComponentStateV2(
fieldMetadataItemIdUsedInDropdownComponentState,
);
@ -100,14 +86,6 @@ export const ObjectFilterDropdownFilterSelectCompositeFieldSubMenu = () => {
subFieldName?: string | null | undefined,
) => {
if (isDefined(fieldMetadataItem)) {
const filterDefinition: RecordFilterDefinition = {
fieldMetadataId: fieldMetadataItem.id,
type: getFilterTypeFromFieldType(fieldMetadataItem.type),
label: fieldMetadataItem.label,
iconName: fieldMetadataItem.icon ?? '',
compositeFieldName: subFieldName ?? undefined,
};
if (
isDefined(advancedFilterViewFilterId) &&
isDefined(advancedFilterViewFilterGroupId)
@ -129,13 +107,13 @@ export const ObjectFilterDropdownFilterSelectCompositeFieldSubMenu = () => {
value,
operand,
displayValue,
definition: filterDefinition,
type: getFilterTypeFromFieldType(fieldMetadataItem.type),
label: fieldMetadataItem.label,
viewFilterGroupId: advancedFilterViewFilterGroupId,
subFieldName: subFieldName,
});
}
setFilterDefinitionUsedInDropdown(filterDefinition);
setFieldMetadataItemIdUsedInDropdown(fieldMetadataItem.id);
const type = getFilterTypeFromFieldType(fieldMetadataItem.type);
@ -157,17 +135,12 @@ export const ObjectFilterDropdownFilterSelectCompositeFieldSubMenu = () => {
const handleSubMenuBack = () => {
setFieldMetadataItemIdUsedInDropdown(null);
setFilterDefinitionUsedInDropdown(null);
setObjectFilterDropdownSubMenuFieldType(null);
setObjectFilterDropdownFirstLevelFilterDefinition(null);
setObjectFilterDropdownIsSelectingCompositeField(false);
setObjectFilterDropdownFilterIsSelected(false);
};
if (
!isDefined(objectFilterDropdownSubMenuFieldType) ||
!isDefined(objectFilterDropdownFirstLevelFilterDefinition)
) {
if (!isDefined(objectFilterDropdownSubMenuFieldType)) {
return null;
}

28
packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownFilterSelectMenuItem.tsx
View File

@ -3,17 +3,13 @@ import { OBJECT_FILTER_DROPDOWN_ID } from '@/object-record/object-filter-dropdow
import { advancedFilterViewFilterIdComponentState } from '@/object-record/object-filter-dropdown/states/advancedFilterViewFilterIdComponentState';
import { fieldMetadataItemIdUsedInDropdownComponentState } from '@/object-record/object-filter-dropdown/states/fieldMetadataItemIdUsedInDropdownComponentState';
import { objectFilterDropdownFilterIsSelectedComponentState } from '@/object-record/object-filter-dropdown/states/objectFilterDropdownFilterIsSelectedComponentState';
import { objectFilterDropdownFirstLevelFilterDefinitionComponentState } from '@/object-record/object-filter-dropdown/states/objectFilterDropdownFirstLevelFilterDefinitionComponentState';
import { objectFilterDropdownIsSelectingCompositeFieldComponentState } from '@/object-record/object-filter-dropdown/states/objectFilterDropdownIsSelectingCompositeFieldComponentState';
import { objectFilterDropdownSubMenuFieldTypeComponentState } from '@/object-record/object-filter-dropdown/states/objectFilterDropdownSubMenuFieldTypeComponentState';
import { selectedOperandInDropdownComponentState } from '@/object-record/object-filter-dropdown/states/selectedOperandInDropdownComponentState';
import { FieldMetadataItem } from '@/object-metadata/types/FieldMetadataItem';
import {
formatFieldMetadataItemAsFilterDefinition,
getFilterTypeFromFieldType,
} from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { filterDefinitionUsedInDropdownComponentState } from '@/object-record/object-filter-dropdown/states/filterDefinitionUsedInDropdownComponentState';
import { getFilterTypeFromFieldType } from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { isCompositeField } from '@/object-record/object-filter-dropdown/utils/isCompositeField';
import { getRecordFilterOperands } from '@/object-record/record-filter/utils/getRecordFilterOperands';
import { RelationPickerHotkeyScope } from '@/object-record/relation-picker/types/RelationPickerHotkeyScope';
@ -36,11 +32,6 @@ export const ObjectFilterDropdownFilterSelectMenuItem = ({
fieldMetadataItemIdUsedInDropdownComponentState,
);
const [, setObjectFilterDropdownFirstLevelFilterDefinition] =
useRecoilComponentStateV2(
objectFilterDropdownFirstLevelFilterDefinitionComponentState,
);
const [, setObjectFilterDropdownSubMenuFieldType] = useRecoilComponentStateV2(
objectFilterDropdownSubMenuFieldTypeComponentState,
);
@ -66,10 +57,6 @@ export const ObjectFilterDropdownFilterSelectMenuItem = ({
selectedOperandInDropdownComponentState,
);
const setFilterDefinitionUsedInDropdown = useSetRecoilComponentStateV2(
filterDefinitionUsedInDropdownComponentState,
);
const advancedFilterViewFilterId = useRecoilComponentValueV2(
advancedFilterViewFilterIdComponentState,
);
@ -85,12 +72,6 @@ export const ObjectFilterDropdownFilterSelectMenuItem = ({
setFieldMetadataItemIdUsedInDropdown(fieldMetadataItem.id);
const filterDefinition = formatFieldMetadataItemAsFilterDefinition({
field: fieldMetadataItem,
});
setFilterDefinitionUsedInDropdown(filterDefinition);
const filterType = getFilterTypeFromFieldType(fieldMetadataItem.type);
if (filterType === 'RELATION' || filterType === 'SELECT') {
@ -122,11 +103,6 @@ export const ObjectFilterDropdownFilterSelectMenuItem = ({
if (isCompositeField(filterType)) {
setObjectFilterDropdownSubMenuFieldType(filterType);
const filterDefinition = formatFieldMetadataItemAsFilterDefinition({
field: fieldMetadataItemToSelect,
});
setObjectFilterDropdownFirstLevelFilterDefinition(filterDefinition);
setFieldMetadataItemIdUsedInDropdown(fieldMetadataItemToSelect.id);
setObjectFilterDropdownIsSelectingCompositeField(true);
} else {

11
packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownNumberInput.tsx
View File

@ -1,7 +1,7 @@
import { ChangeEvent, useCallback, useState } from 'react';
import { v4 } from 'uuid';
import { formatFieldMetadataItemAsFilterDefinition } from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { getFilterTypeFromFieldType } from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { fieldMetadataItemUsedInDropdownComponentSelector } from '@/object-record/object-filter-dropdown/states/fieldMetadataItemUsedInDropdownComponentSelector';
import { selectedFilterComponentState } from '@/object-record/object-filter-dropdown/states/selectedFilterComponentState';
import { selectedOperandInDropdownComponentState } from '@/object-record/object-filter-dropdown/states/selectedOperandInDropdownComponentState';
@ -55,17 +55,16 @@ export const ObjectFilterDropdownNumberInput = () => {
setInputValue(newValue);
const filterDefinition = formatFieldMetadataItemAsFilterDefinition({
field: fieldMetadataItemUsedInDropdown,
});
applyRecordFilter({
id: selectedFilter?.id ? selectedFilter.id : v4(),
fieldMetadataId: fieldMetadataItemUsedInDropdown?.id ?? '',
value: newValue,
operand: selectedOperandInDropdown,
displayValue: newValue,
definition: filterDefinition,
type: getFilterTypeFromFieldType(
fieldMetadataItemUsedInDropdown.type,
),
label: fieldMetadataItemUsedInDropdown.label,
viewFilterGroupId: selectedFilter?.viewFilterGroupId,
});
}}

19
packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownOperandSelect.tsx
View File

@ -1,9 +1,6 @@
import { v4 } from 'uuid';
import {
formatFieldMetadataItemAsFilterDefinition,
getFilterTypeFromFieldType,
} from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { getFilterTypeFromFieldType } from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { fieldMetadataItemUsedInDropdownComponentSelector } from '@/object-record/object-filter-dropdown/states/fieldMetadataItemUsedInDropdownComponentSelector';
import { selectedFilterComponentState } from '@/object-record/object-filter-dropdown/states/selectedFilterComponentState';
import { selectedOperandInDropdownComponentState } from '@/object-record/object-filter-dropdown/states/selectedOperandInDropdownComponentState';
@ -68,17 +65,14 @@ export const ObjectFilterDropdownOperandSelect = () => {
setSelectedOperandInDropdown(newOperand);
if (isValuelessOperand && isDefined(fieldMetadataItemUsedInDropdown)) {
const filterDefinition = formatFieldMetadataItemAsFilterDefinition({
field: fieldMetadataItemUsedInDropdown,
});
applyRecordFilter({
id: v4(),
fieldMetadataId: fieldMetadataItemUsedInDropdown.id,
displayValue: '',
operand: newOperand,
value: '',
definition: filterDefinition,
type: getFilterTypeFromFieldType(fieldMetadataItemUsedInDropdown.type),
label: fieldMetadataItemUsedInDropdown.label,
});
return;
}
@ -98,17 +92,14 @@ export const ObjectFilterDropdownOperandSelect = () => {
selectedFilter.displayValue,
);
const filterDefinition = formatFieldMetadataItemAsFilterDefinition({
field: fieldMetadataItemUsedInDropdown,
});
applyRecordFilter({
id: selectedFilter.id ? selectedFilter.id : v4(),
fieldMetadataId: selectedFilter.fieldMetadataId,
displayValue,
operand: newOperand,
value,
definition: filterDefinition,
type: filterType,
label: fieldMetadataItemUsedInDropdown.label,
});
}
};

9
packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownOptionSelect.tsx
View File

@ -13,7 +13,7 @@ import { SelectableList } from '@/ui/layout/selectable-list/components/Selectabl
import { useSelectableListStates } from '@/ui/layout/selectable-list/hooks/internal/useSelectableListStates';
import { useSelectableList } from '@/ui/layout/selectable-list/hooks/useSelectableList';
import { formatFieldMetadataItemAsFilterDefinition } from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { getFilterTypeFromFieldType } from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { fieldMetadataItemUsedInDropdownComponentSelector } from '@/object-record/object-filter-dropdown/states/fieldMetadataItemUsedInDropdownComponentSelector';
import { objectFilterDropdownSearchInputComponentState } from '@/object-record/object-filter-dropdown/states/objectFilterDropdownSearchInputComponentState';
import { objectFilterDropdownSelectedOptionValuesComponentState } from '@/object-record/object-filter-dropdown/states/objectFilterDropdownSelectedOptionValuesComponentState';
@ -134,13 +134,10 @@ export const ObjectFilterDropdownOptionSelect = () => {
? JSON.stringify(selectedOptions.map((option) => option.value))
: EMPTY_FILTER_VALUE;
const filterDefinition = formatFieldMetadataItemAsFilterDefinition({
field: fieldMetadataItemUsedInDropdown,
});
applyRecordFilter({
id: selectedFilter?.id ? selectedFilter.id : v4(),
definition: filterDefinition,
type: getFilterTypeFromFieldType(fieldMetadataItemUsedInDropdown.type),
label: fieldMetadataItemUsedInDropdown.label,
operand: selectedOperandInDropdown,
displayValue: filterDisplayValue,
fieldMetadataId: fieldMetadataItemUsedInDropdown.id,

11
packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownRatingInput.tsx
View File

@ -8,7 +8,7 @@ import { RatingInput } from '@/ui/field/input/components/RatingInput';
import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2';
import { formatFieldMetadataItemAsFilterDefinition } from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { getFilterTypeFromFieldType } from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { fieldMetadataItemUsedInDropdownComponentSelector } from '@/object-record/object-filter-dropdown/states/fieldMetadataItemUsedInDropdownComponentSelector';
import { selectedFilterComponentState } from '@/object-record/object-filter-dropdown/states/selectedFilterComponentState';
const convertFieldRatingValueToNumber = (
@ -59,18 +59,17 @@ export const ObjectFilterDropdownRatingInput = () => {
return;
}
const filterDefinition = formatFieldMetadataItemAsFilterDefinition({
field: fieldMetadataItemUsedInDropdown,
});
applyRecordFilter?.({
id: selectedFilter?.id ? selectedFilter.id : v4(),
fieldMetadataId: fieldMetadataItemUsedInDropdown.id,
value: convertFieldRatingValueToNumber(newValue),
operand: selectedOperandInDropdown,
displayValue: convertFieldRatingValueToNumber(newValue),
definition: filterDefinition,
viewFilterGroupId: selectedFilter?.viewFilterGroupId,
type: getFilterTypeFromFieldType(
fieldMetadataItemUsedInDropdown.type,
),
label: fieldMetadataItemUsedInDropdown.label,
});
}}
/>

21
packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownRecordSelect.tsx
View File

@ -1,12 +1,11 @@
import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem';
import {
formatFieldMetadataItemAsFilterDefinition,
getFilterTypeFromFieldType,
getRelationObjectMetadataNameSingular,
} from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { ObjectFilterDropdownRecordPinnedItems } from '@/object-record/object-filter-dropdown/components/ObjectFilterDropdownRecordPinnedItems';
import { CURRENT_WORKSPACE_MEMBER_SELECTABLE_ITEM_ID } from '@/object-record/object-filter-dropdown/constants/CurrentWorkspaceMemberSelectableItemId';
import { fieldMetadataItemUsedInDropdownComponentSelector } from '@/object-record/object-filter-dropdown/states/fieldMetadataItemUsedInDropdownComponentSelector';
import { filterDefinitionUsedInDropdownComponentState } from '@/object-record/object-filter-dropdown/states/filterDefinitionUsedInDropdownComponentState';
import { objectFilterDropdownSearchInputComponentState } from '@/object-record/object-filter-dropdown/states/objectFilterDropdownSearchInputComponentState';
import { objectFilterDropdownSelectedRecordIdsComponentState } from '@/object-record/object-filter-dropdown/states/objectFilterDropdownSelectedRecordIdsComponentState';
import { selectedFilterComponentState } from '@/object-record/object-filter-dropdown/states/selectedFilterComponentState';
@ -40,10 +39,6 @@ type ObjectFilterDropdownRecordSelectProps = {
export const ObjectFilterDropdownRecordSelect = ({
viewComponentId,
}: ObjectFilterDropdownRecordSelectProps) => {
const filterDefinitionUsedInDropdown = useRecoilComponentValueV2(
filterDefinitionUsedInDropdownComponentState,
);
const fieldMetadataItemUsedInFilterDropdown = useRecoilComponentValueV2(
fieldMetadataItemUsedInDropdownComponentSelector,
);
@ -182,10 +177,7 @@ export const ObjectFilterDropdownRecordSelect = ({
? `${selectedItemNames.length} ${objectLabelPlural.toLowerCase()}`
: selectedItemNames.join(', ');
if (
isDefined(filterDefinitionUsedInDropdown) &&
isDefined(selectedOperandInDropdown)
) {
if (isDefined(selectedOperandInDropdown)) {
const newFilterValue =
newSelectedRecordIds.length > 0 || newIsCurrentWorkspaceMemberSelected
? JSON.stringify({
@ -204,13 +196,12 @@ export const ObjectFilterDropdownRecordSelect = ({
const filterId = viewFilter?.id ?? v4();
const filterDefinition = formatFieldMetadataItemAsFilterDefinition({
field: fieldMetadataItemUsedInFilterDropdown,
});
applyRecordFilter({
id: selectedFilter?.id ? selectedFilter.id : filterId,
definition: filterDefinition,
type: getFilterTypeFromFieldType(
fieldMetadataItemUsedInFilterDropdown.type,
),
label: fieldMetadataItemUsedInFilterDropdown.label,
operand: selectedOperandInDropdown,
displayValue: filterDisplayValue,
fieldMetadataId: fieldMetadataItemUsedInFilterDropdown.id,

11
packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownSourceSelect.tsx
View File

@ -1,7 +1,7 @@
import { useState } from 'react';
import { v4 } from 'uuid';
import { formatFieldMetadataItemAsFilterDefinition } from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { getFilterTypeFromFieldType } from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { useEmptyRecordFilter } from '@/object-record/object-filter-dropdown/hooks/useEmptyRecordFilter';
import { fieldMetadataItemUsedInDropdownComponentSelector } from '@/object-record/object-filter-dropdown/states/fieldMetadataItemUsedInDropdownComponentSelector';
import { objectFilterDropdownSearchInputComponentState } from '@/object-record/object-filter-dropdown/states/objectFilterDropdownSearchInputComponentState';
@ -130,13 +130,12 @@ export const ObjectFilterDropdownSourceSelect = ({
const filterId = viewFilter?.id ?? fieldId;
const filterDefinition = formatFieldMetadataItemAsFilterDefinition({
field: fieldMetadataItemUsedInFilterDropdown,
});
applyRecordFilter({
id: selectedFilter?.id ? selectedFilter.id : filterId,
definition: filterDefinition,
type: getFilterTypeFromFieldType(
fieldMetadataItemUsedInFilterDropdown.type,
),
label: fieldMetadataItemUsedInFilterDropdown.label,
operand: selectedOperandInDropdown || ViewFilterOperand.Is,
displayValue: filterDisplayValue,
fieldMetadataId: fieldMetadataItemUsedInFilterDropdown.id,

11
packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownTextSearchInput.tsx
View File

@ -1,6 +1,6 @@
import { ChangeEvent, useCallback, useState } from 'react';
import { formatFieldMetadataItemAsFilterDefinition } from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { getFilterTypeFromFieldType } from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { fieldMetadataItemUsedInDropdownComponentSelector } from '@/object-record/object-filter-dropdown/states/fieldMetadataItemUsedInDropdownComponentSelector';
import { objectFilterDropdownSearchInputComponentState } from '@/object-record/object-filter-dropdown/states/objectFilterDropdownSearchInputComponentState';
import { selectedFilterComponentState } from '@/object-record/object-filter-dropdown/states/selectedFilterComponentState';
@ -58,18 +58,17 @@ export const ObjectFilterDropdownTextSearchInput = () => {
onChange={(event: ChangeEvent<HTMLInputElement>) => {
setObjectFilterDropdownSearchInput(event.target.value);
const filterDefinition = formatFieldMetadataItemAsFilterDefinition({
field: fieldMetadataItemUsedInDropdown,
});
applyRecordFilter({
id: selectedFilter?.id ?? v4(),
fieldMetadataId: fieldMetadataItemUsedInDropdown.id,
value: event.target.value,
operand: selectedOperandInDropdown,
displayValue: event.target.value,
definition: filterDefinition,
viewFilterGroupId: selectedFilter?.viewFilterGroupId,
type: getFilterTypeFromFieldType(
fieldMetadataItemUsedInDropdown.type,
),
label: fieldMetadataItemUsedInDropdown.label,
});
}}
/>

18
packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/SingleEntityObjectFilterDropdownButtonEffect.tsx
View File

@ -1,9 +1,6 @@
import {
formatFieldMetadataItemAsFilterDefinition,
getFilterTypeFromFieldType,
} from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { getFilterTypeFromFieldType } from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { fieldMetadataItemIdUsedInDropdownComponentState } from '@/object-record/object-filter-dropdown/states/fieldMetadataItemIdUsedInDropdownComponentState';
import { filterDefinitionUsedInDropdownComponentState } from '@/object-record/object-filter-dropdown/states/filterDefinitionUsedInDropdownComponentState';
import { selectedOperandInDropdownComponentState } from '@/object-record/object-filter-dropdown/states/selectedOperandInDropdownComponentState';
import { useFilterableFieldMetadataItemsInRecordIndexContext } from '@/object-record/record-filter/hooks/useFilterableFieldMetadataItemsInRecordIndexContext';
import { getRecordFilterOperands } from '@/object-record/record-filter/utils/getRecordFilterOperands';
@ -11,10 +8,6 @@ import { useSetRecoilComponentStateV2 } from '@/ui/utilities/state/component-sta
import { useEffect } from 'react';
export const SingleEntityObjectFilterDropdownButtonEffect = () => {
const setFilterDefinitionUsedInDropdown = useSetRecoilComponentStateV2(
filterDefinitionUsedInDropdownComponentState,
);
const setFieldMetadataItemIdUsedInDropdown = useSetRecoilComponentStateV2(
fieldMetadataItemIdUsedInDropdownComponentState,
);
@ -28,13 +21,8 @@ export const SingleEntityObjectFilterDropdownButtonEffect = () => {
const firstFieldMetadataItem = filterableFieldMetadataItems[0];
const firstFieldDefinition = formatFieldMetadataItemAsFilterDefinition({
field: firstFieldMetadataItem,
});
useEffect(() => {
setFieldMetadataItemIdUsedInDropdown(firstFieldMetadataItem.id);
setFilterDefinitionUsedInDropdown(firstFieldDefinition);
const filterType = getFilterTypeFromFieldType(firstFieldMetadataItem.type);
@ -43,8 +31,6 @@ export const SingleEntityObjectFilterDropdownButtonEffect = () => {
setSelectedOperandInDropdown(defaultOperand);
}, [
firstFieldMetadataItem,
firstFieldDefinition,
setFilterDefinitionUsedInDropdown,
setSelectedOperandInDropdown,
setFieldMetadataItemIdUsedInDropdown,
]);

18
packages/twenty-front/src/modules/object-record/object-filter-dropdown/hooks/useResetFilterDropdown.ts
View File

@ -1,4 +1,4 @@
import { filterDefinitionUsedInDropdownComponentState } from '@/object-record/object-filter-dropdown/states/filterDefinitionUsedInDropdownComponentState';
import { fieldMetadataItemIdUsedInDropdownComponentState } from '@/object-record/object-filter-dropdown/states/fieldMetadataItemIdUsedInDropdownComponentState';
import { objectFilterDropdownFilterIsSelectedComponentState } from '@/object-record/object-filter-dropdown/states/objectFilterDropdownFilterIsSelectedComponentState';
import { objectFilterDropdownIsSelectingCompositeFieldComponentState } from '@/object-record/object-filter-dropdown/states/objectFilterDropdownIsSelectingCompositeFieldComponentState';
import { objectFilterDropdownSearchInputComponentState } from '@/object-record/object-filter-dropdown/states/objectFilterDropdownSearchInputComponentState';
@ -15,6 +15,12 @@ export const useResetFilterDropdown = (componentInstanceId?: string) => {
componentInstanceId,
);
const fieldMetadataItemIdUsedInDropdownCallbackState =
useRecoilComponentCallbackStateV2(
fieldMetadataItemIdUsedInDropdownComponentState,
componentInstanceId,
);
const objectFilterDropdownSelectedRecordIdsCallbackState =
useRecoilComponentCallbackStateV2(
objectFilterDropdownSelectedRecordIdsComponentState,
@ -26,12 +32,6 @@ export const useResetFilterDropdown = (componentInstanceId?: string) => {
componentInstanceId,
);
const filterDefinitionUsedInDropdownCallbackState =
useRecoilComponentCallbackStateV2(
filterDefinitionUsedInDropdownComponentState,
componentInstanceId,
);
const selectedOperandInDropdownCallbackState =
useRecoilComponentCallbackStateV2(
selectedOperandInDropdownComponentState,
@ -56,19 +56,19 @@ export const useResetFilterDropdown = (componentInstanceId?: string) => {
set(objectFilterDropdownSearchInputCallbackState, '');
set(objectFilterDropdownSelectedRecordIdsCallbackState, []);
set(selectedFilterCallbackState, undefined);
set(filterDefinitionUsedInDropdownCallbackState, null);
set(selectedOperandInDropdownCallbackState, null);
set(objectFilterDropdownFilterIsSelectedCallbackState, false);
set(objectFilterDropdownIsSelectingCompositeFieldCallbackState, false);
set(fieldMetadataItemIdUsedInDropdownCallbackState, null);
},
[
filterDefinitionUsedInDropdownCallbackState,
objectFilterDropdownSearchInputCallbackState,
objectFilterDropdownSelectedRecordIdsCallbackState,
selectedFilterCallbackState,
selectedOperandInDropdownCallbackState,
objectFilterDropdownFilterIsSelectedCallbackState,
objectFilterDropdownIsSelectingCompositeFieldCallbackState,
fieldMetadataItemIdUsedInDropdownCallbackState,
],
);

50
packages/twenty-front/src/modules/object-record/object-filter-dropdown/hooks/useSelectFilterDefinitionUsedInDropdown.ts → packages/twenty-front/src/modules/object-record/object-filter-dropdown/hooks/useSelectFilterUsedInDropdown.ts
View File

@ -1,11 +1,12 @@
import { useGetFieldMetadataItemById } from '@/object-metadata/hooks/useGetFieldMetadataItemById';
import { getFilterTypeFromFieldType } from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { advancedFilterViewFilterGroupIdComponentState } from '@/object-record/object-filter-dropdown/states/advancedFilterViewFilterGroupIdComponentState';
import { advancedFilterViewFilterIdComponentState } from '@/object-record/object-filter-dropdown/states/advancedFilterViewFilterIdComponentState';
import { filterDefinitionUsedInDropdownComponentState } from '@/object-record/object-filter-dropdown/states/filterDefinitionUsedInDropdownComponentState';
import { fieldMetadataItemIdUsedInDropdownComponentState } from '@/object-record/object-filter-dropdown/states/fieldMetadataItemIdUsedInDropdownComponentState';
import { objectFilterDropdownSearchInputComponentState } from '@/object-record/object-filter-dropdown/states/objectFilterDropdownSearchInputComponentState';
import { selectedOperandInDropdownComponentState } from '@/object-record/object-filter-dropdown/states/selectedOperandInDropdownComponentState';
import { getInitialFilterValue } from '@/object-record/object-filter-dropdown/utils/getInitialFilterValue';
import { useApplyRecordFilter } from '@/object-record/record-filter/hooks/useApplyRecordFilter';
import { RecordFilterDefinition } from '@/object-record/record-filter/types/RecordFilterDefinition';
import { getRecordFilterOperands } from '@/object-record/record-filter/utils/getRecordFilterOperands';
import { RelationPickerHotkeyScope } from '@/object-record/relation-picker/types/RelationPickerHotkeyScope';
@ -16,19 +17,17 @@ import { isDefined } from 'twenty-shared';
import { v4 } from 'uuid';
type SelectFilterParams = {
filterDefinition: RecordFilterDefinition;
fieldMetadataItemId: string;
};
export const useSelectFilterDefinitionUsedInDropdown = (
componentInstanceId?: string,
) => {
const setFilterDefinitionUsedInDropdown = useSetRecoilComponentStateV2(
filterDefinitionUsedInDropdownComponentState,
export const useSelectFilterUsedInDropdown = (componentInstanceId?: string) => {
const setSelectedOperandInDropdown = useSetRecoilComponentStateV2(
selectedOperandInDropdownComponentState,
componentInstanceId,
);
const setSelectedOperandInDropdown = useSetRecoilComponentStateV2(
selectedOperandInDropdownComponentState,
const setFieldMetadataItemIdUsedInDropdown = useSetRecoilComponentStateV2(
fieldMetadataItemIdUsedInDropdownComponentState,
componentInstanceId,
);
@ -51,26 +50,36 @@ export const useSelectFilterDefinitionUsedInDropdown = (
const { applyRecordFilter } = useApplyRecordFilter(componentInstanceId);
const selectFilterDefinitionUsedInDropdown = ({
filterDefinition,
const { getFieldMetadataItemById } = useGetFieldMetadataItemById();
const selectFilterUsedInDropdown = ({
fieldMetadataItemId,
}: SelectFilterParams) => {
setFilterDefinitionUsedInDropdown(filterDefinition);
setFieldMetadataItemIdUsedInDropdown(fieldMetadataItemId);
const fieldMetadataItem = getFieldMetadataItemById(fieldMetadataItemId);
if (!isDefined(fieldMetadataItem)) {
return;
}
if (
filterDefinition.type === 'RELATION' ||
filterDefinition.type === 'SELECT'
fieldMetadataItem.type === 'RELATION' ||
fieldMetadataItem.type === 'SELECT'
) {
setHotkeyScope(RelationPickerHotkeyScope.RelationPicker);
}
const filterType = getFilterTypeFromFieldType(fieldMetadataItem.type);
const firstOperand = getRecordFilterOperands({
filterType: filterDefinition.type,
filterType,
})[0];
setSelectedOperandInDropdown(firstOperand);
const { value, displayValue } = getInitialFilterValue(
filterDefinition.type,
filterType,
firstOperand,
);
@ -79,12 +88,13 @@ export const useSelectFilterDefinitionUsedInDropdown = (
if (isAdvancedFilter || value !== '') {
applyRecordFilter({
id: advancedFilterViewFilterId ?? v4(),
fieldMetadataId: filterDefinition.fieldMetadataId,
fieldMetadataId: fieldMetadataItem.id,
displayValue,
operand: firstOperand,
value,
definition: filterDefinition,
viewFilterGroupId: advancedFilterViewFilterGroupId,
type: filterType,
label: fieldMetadataItem.label,
});
}
@ -92,6 +102,6 @@ export const useSelectFilterDefinitionUsedInDropdown = (
};
return {
selectFilterDefinitionUsedInDropdown,
selectFilterUsedInDropdown,
};
};

10
packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/filterDefinitionUsedInDropdownComponentState.ts
View File

@ -1,10 +0,0 @@
import { ObjectFilterDropdownComponentInstanceContext } from '@/object-record/object-filter-dropdown/states/contexts/ObjectFilterDropdownComponentInstanceContext';
import { RecordFilterDefinition } from '@/object-record/record-filter/types/RecordFilterDefinition';
import { createComponentStateV2 } from '@/ui/utilities/state/component-state/utils/createComponentStateV2';
export const filterDefinitionUsedInDropdownComponentState =
createComponentStateV2<RecordFilterDefinition | null>({
key: 'filterDefinitionUsedInDropdownComponentState',
defaultValue: null,
componentInstanceContext: ObjectFilterDropdownComponentInstanceContext,
});

10
packages/twenty-front/src/modules/object-record/object-filter-dropdown/states/objectFilterDropdownFirstLevelFilterDefinitionComponentState.ts
View File

@ -1,10 +0,0 @@
import { ObjectFilterDropdownComponentInstanceContext } from '@/object-record/object-filter-dropdown/states/contexts/ObjectFilterDropdownComponentInstanceContext';
import { RecordFilterDefinition } from '@/object-record/record-filter/types/RecordFilterDefinition';
import { createComponentStateV2 } from '@/ui/utilities/state/component-state/utils/createComponentStateV2';
export const objectFilterDropdownFirstLevelFilterDefinitionComponentState =
createComponentStateV2<RecordFilterDefinition | null>({
key: 'objectFilterDropdownFirstLevelFilterDefinitionComponentState',
defaultValue: null,
componentInstanceContext: ObjectFilterDropdownComponentInstanceContext,
});

11
packages/twenty-front/src/modules/object-record/object-filter-dropdown/utils/isActorSourceCompositeFilter.ts
View File

@ -1,11 +0,0 @@
import { FieldActorValue } from '@/object-record/record-field/types/FieldMetadata';
import { RecordFilterDefinition } from '@/object-record/record-filter/types/RecordFilterDefinition';
export const isActorSourceCompositeFilter = (
filterDefinition: Pick<RecordFilterDefinition, 'compositeFieldName'>,
) => {
return (
filterDefinition.compositeFieldName ===
('source' satisfies keyof FieldActorValue)
);
};

17
packages/twenty-front/src/modules/object-record/record-filter/hooks/__tests__/useRemoveRecordFilter.test.tsx
View File

@ -5,6 +5,7 @@ import { currentRecordFiltersComponentState } from '@/object-record/record-filte
import { RecordFilter } from '@/object-record/record-filter/types/RecordFilter';
import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2';
import { ViewFilterOperand } from '@/views/types/ViewFilterOperand';
import { FieldMetadataType } from '~/generated/graphql';
import { getJestMetadataAndApolloMocksWrapper } from '~/testing/jest/getJestMetadataAndApolloMocksWrapper';
import { useRemoveRecordFilter } from '../useRemoveRecordFilter';
import { useUpsertRecordFilter } from '../useUpsertRecordFilter';
@ -41,14 +42,8 @@ describe('useRemoveRecordFilter', () => {
value: 'test-value',
operand: ViewFilterOperand.Contains,
displayValue: 'test-value',
definition: {
type: 'TEXT',
fieldMetadataId: 'field-1',
label: 'Test Field',
iconName: 'IconText',
},
label: 'Test Field',
type: 'TEXT',
type: FieldMetadataType.TEXT,
};
// First add a filter
@ -92,14 +87,8 @@ describe('useRemoveRecordFilter', () => {
value: 'test-value',
operand: ViewFilterOperand.Contains,
displayValue: 'test-value',
definition: {
type: 'TEXT',
fieldMetadataId: 'field-1',
label: 'Test Field',
iconName: 'IconText',
},
label: 'Test Field',
type: 'TEXT',
type: FieldMetadataType.TEXT,
};
// Add a filter

25
packages/twenty-front/src/modules/object-record/record-filter/hooks/__tests__/useUpsertRecordFilter.test.tsx
View File

@ -5,6 +5,7 @@ import { currentRecordFiltersComponentState } from '@/object-record/record-filte
import { RecordFilter } from '@/object-record/record-filter/types/RecordFilter';
import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2';
import { ViewFilterOperand } from '@/views/types/ViewFilterOperand';
import { FieldMetadataType } from '~/generated/graphql';
import { getJestMetadataAndApolloMocksWrapper } from '~/testing/jest/getJestMetadataAndApolloMocksWrapper';
import { useUpsertRecordFilter } from '../useUpsertRecordFilter';
@ -35,14 +36,8 @@ describe('useUpsertRecordFilter', () => {
value: 'test-value',
operand: ViewFilterOperand.Contains,
displayValue: 'test-value',
definition: {
type: 'TEXT',
fieldMetadataId: 'field-1',
label: 'Test Field',
iconName: 'IconText',
},
label: 'Test Field',
type: 'TEXT',
type: FieldMetadataType.TEXT,
};
act(() => {
@ -75,14 +70,8 @@ describe('useUpsertRecordFilter', () => {
value: 'initial-value',
operand: ViewFilterOperand.Contains,
displayValue: 'initial-value',
definition: {
type: 'TEXT',
fieldMetadataId: 'field-1',
label: 'Test Field',
iconName: 'IconText',
},
label: 'Test Field',
type: 'TEXT',
type: FieldMetadataType.TEXT,
};
const updatedFilter: RecordFilter = {
@ -91,14 +80,8 @@ describe('useUpsertRecordFilter', () => {
value: 'updated-value',
operand: ViewFilterOperand.Contains,
displayValue: 'updated-value',
definition: {
type: 'TEXT',
fieldMetadataId: 'field-1',
label: 'Test Field',
iconName: 'IconText',
},
label: 'Test Field',
type: 'TEXT',
type: FieldMetadataType.TEXT,
};
act(() => {

23
packages/twenty-front/src/modules/object-record/record-filter/hooks/useFilterDefinitionsFromFilterableFieldMetadataItems.ts
View File

@ -1,23 +0,0 @@
import { availableFieldMetadataItemsForFilterFamilySelector } from '@/object-metadata/states/availableFieldMetadataItemsForFilterFamilySelector';
import { formatFieldMetadataItemAsFilterDefinition } from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { useRecordIndexContextOrThrow } from '@/object-record/record-index/contexts/RecordIndexContext';
import { useRecoilValue } from 'recoil';
export const useFilterDefinitionsFromFilterableFieldMetadataItems = () => {
const { objectMetadataItem } = useRecordIndexContextOrThrow();
const availableFieldMetadataItemsForFilter = useRecoilValue(
availableFieldMetadataItemsForFilterFamilySelector({
objectMetadataItemId: objectMetadataItem.id,
}),
);
const filterDefinitions = availableFieldMetadataItemsForFilter.map(
(fieldMetadataItem) =>
formatFieldMetadataItemAsFilterDefinition({
field: fieldMetadataItem,
}),
);
return { filterDefinitions };
};

10
packages/twenty-front/src/modules/object-record/record-filter/hooks/useUpsertRecordFilter.ts
View File

@ -11,20 +11,12 @@ export const useUpsertRecordFilter = () => {
const upsertRecordFilter = useRecoilCallback(
({ set, snapshot }) =>
(filter: RecordFilter) => {
(recordFilterToSet: RecordFilter) => {
const currentRecordFilters = getSnapshotValue(
snapshot,
currentRecordFiltersCallbackState,
);
// TODO: This is a temporary solution to ensure that the record filter is compatible with filter definitions
// Label and type will be set without definition
const recordFilterToSet: RecordFilter = {
...filter,
label: filter.definition.label,
type: filter.definition.type,
};
const foundRecordFilterInCurrentRecordFilters =
currentRecordFilters.some(
(existingFilter) =>

6
packages/twenty-front/src/modules/object-record/record-filter/types/RecordFilter.ts
View File

@ -1,5 +1,4 @@
import { FilterableFieldType } from '@/object-record/record-filter/types/FilterableFieldType';
import { RecordFilterDefinition } from '@/object-record/record-filter/types/RecordFilterDefinition';
import { ViewFilterOperand } from '@/views/types/ViewFilterOperand';
export type RecordFilter = {
@ -7,12 +6,11 @@ export type RecordFilter = {
fieldMetadataId: string;
value: string;
displayValue: string;
type?: FilterableFieldType;
type: FilterableFieldType;
viewFilterGroupId?: string;
displayAvatarUrl?: string;
operand: ViewFilterOperand;
positionInViewFilterGroup?: number | null;
definition: RecordFilterDefinition;
label?: string;
label: string;
subFieldName?: string | null | undefined;
};

9
packages/twenty-front/src/modules/object-record/record-filter/types/RecordFilterDefinition.ts
View File

@ -1,9 +0,0 @@
import { FilterableFieldType } from './FilterableFieldType';
export type RecordFilterDefinition = {
fieldMetadataId: string;
label: string;
iconName: string;
type: FilterableFieldType;
compositeFieldName?: string;
};

191
packages/twenty-front/src/modules/object-record/record-filter/utils/__tests__/computeViewRecordGqlOperationFilter.test.ts
View File

@ -3,6 +3,7 @@ import { RecordFilterOperand } from '@/object-record/record-filter/types/RecordF
import { RecordFilterValueDependencies } from '@/object-record/record-filter/types/RecordFilterValueDependencies';
import { computeViewRecordGqlOperationFilter } from '@/object-record/record-filter/utils/computeViewRecordGqlOperationFilter';
import { ViewFilterOperand } from '@/views/types/ViewFilterOperand';
import { FieldMetadataType } from '~/generated/graphql';
import { getCompaniesMock } from '~/testing/mock-data/companies';
import { generatedMockObjectMetadataItems } from '~/testing/mock-data/generatedMockObjectMetadataItems';
@ -37,12 +38,6 @@ describe('computeViewRecordGqlOperationFilter', () => {
operand: RecordFilterOperand.Contains,
type: 'TEXT',
label: 'Name',
definition: {
type: 'TEXT',
fieldMetadataId: companyMockNameFieldMetadataId?.id,
label: 'Name',
iconName: 'text',
},
};
const result = computeViewRecordGqlOperationFilter(
@ -76,12 +71,8 @@ describe('computeViewRecordGqlOperationFilter', () => {
fieldMetadataId: companyMockNameFieldMetadataId?.id,
displayValue: companiesMock[0].name,
operand: ViewFilterOperand.Contains,
definition: {
type: 'TEXT',
fieldMetadataId: companyMockNameFieldMetadataId?.id,
label: 'Name',
iconName: 'text',
},
type: FieldMetadataType.TEXT,
label: 'Name',
};
const employeesFilter: RecordFilter = {
@ -90,12 +81,8 @@ describe('computeViewRecordGqlOperationFilter', () => {
fieldMetadataId: companyMockEmployeesFieldMetadataId?.id,
displayValue: '1000',
operand: ViewFilterOperand.GreaterThan,
definition: {
type: 'NUMBER',
fieldMetadataId: companyMockEmployeesFieldMetadataId?.id,
label: 'Employees',
iconName: 'number',
},
type: FieldMetadataType.NUMBER,
label: 'Employees',
};
const result = computeViewRecordGqlOperationFilter(
@ -135,12 +122,8 @@ describe('should work as expected for the different field types', () => {
fieldMetadataId: companyMockAddressFieldMetadataId?.id,
displayValue: '123 Main St',
operand: ViewFilterOperand.Contains,
definition: {
type: 'ADDRESS',
fieldMetadataId: companyMockAddressFieldMetadataId?.id,
label: 'Address',
iconName: 'address',
},
type: FieldMetadataType.ADDRESS,
label: 'Address',
};
const addressFilterDoesNotContain: RecordFilter = {
@ -149,12 +132,8 @@ describe('should work as expected for the different field types', () => {
fieldMetadataId: companyMockAddressFieldMetadataId?.id,
displayValue: '123 Main St',
operand: ViewFilterOperand.DoesNotContain,
definition: {
type: 'ADDRESS',
fieldMetadataId: companyMockAddressFieldMetadataId?.id,
label: 'Address',
iconName: 'address',
},
type: FieldMetadataType.ADDRESS,
label: 'Address',
};
const addressFilterIsEmpty: RecordFilter = {
@ -163,12 +142,8 @@ describe('should work as expected for the different field types', () => {
fieldMetadataId: companyMockAddressFieldMetadataId?.id,
displayValue: '',
operand: ViewFilterOperand.IsEmpty,
definition: {
type: 'ADDRESS',
fieldMetadataId: companyMockAddressFieldMetadataId?.id,
label: 'Address',
iconName: 'address',
},
type: FieldMetadataType.ADDRESS,
label: 'Address',
};
const addressFilterIsNotEmpty: RecordFilter = {
@ -177,12 +152,8 @@ describe('should work as expected for the different field types', () => {
fieldMetadataId: companyMockAddressFieldMetadataId?.id,
displayValue: '',
operand: ViewFilterOperand.IsNotEmpty,
definition: {
type: 'ADDRESS',
fieldMetadataId: companyMockAddressFieldMetadataId?.id,
label: 'Address',
iconName: 'address',
},
label: 'Address',
type: FieldMetadataType.ADDRESS,
};
const result = computeViewRecordGqlOperationFilter(
@ -518,12 +489,8 @@ describe('should work as expected for the different field types', () => {
fieldMetadataId: personMockPhonesFieldMetadataId?.id,
displayValue: '1234567890',
operand: ViewFilterOperand.Contains,
definition: {
type: 'PHONES',
fieldMetadataId: personMockPhonesFieldMetadataId?.id,
label: 'Phones',
iconName: 'phone',
},
label: 'Phones',
type: FieldMetadataType.PHONES,
};
const phonesFilterDoesNotContain: RecordFilter = {
@ -532,12 +499,8 @@ describe('should work as expected for the different field types', () => {
fieldMetadataId: personMockPhonesFieldMetadataId?.id,
displayValue: '1234567890',
operand: ViewFilterOperand.DoesNotContain,
definition: {
type: 'PHONES',
fieldMetadataId: personMockPhonesFieldMetadataId?.id,
label: 'Phones',
iconName: 'phone',
},
label: 'Phones',
type: FieldMetadataType.PHONES,
};
const phonesFilterIsEmpty: RecordFilter = {
@ -546,12 +509,8 @@ describe('should work as expected for the different field types', () => {
fieldMetadataId: personMockPhonesFieldMetadataId?.id,
displayValue: '',
operand: ViewFilterOperand.IsEmpty,
definition: {
type: 'PHONES',
fieldMetadataId: personMockPhonesFieldMetadataId?.id,
label: 'Phones',
iconName: 'phone',
},
label: 'Phones',
type: FieldMetadataType.PHONES,
};
const phonesFilterIsNotEmpty: RecordFilter = {
@ -560,12 +519,8 @@ describe('should work as expected for the different field types', () => {
fieldMetadataId: personMockPhonesFieldMetadataId?.id,
displayValue: '',
operand: ViewFilterOperand.IsNotEmpty,
definition: {
type: 'PHONES',
fieldMetadataId: personMockPhonesFieldMetadataId?.id,
label: 'Phones',
iconName: 'phone',
},
label: 'Phones',
type: FieldMetadataType.PHONES,
};
const result = computeViewRecordGqlOperationFilter(
@ -668,12 +623,8 @@ describe('should work as expected for the different field types', () => {
fieldMetadataId: personMockEmailFieldMetadataId?.id,
displayValue: 'test@test.com',
operand: ViewFilterOperand.Contains,
definition: {
type: 'EMAILS',
fieldMetadataId: personMockEmailFieldMetadataId?.id,
iconName: 'email',
label: 'Emails',
},
label: 'Emails',
type: FieldMetadataType.EMAILS,
};
const emailsFilterDoesNotContain: RecordFilter = {
@ -682,12 +633,8 @@ describe('should work as expected for the different field types', () => {
fieldMetadataId: personMockEmailFieldMetadataId?.id,
displayValue: 'test@test.com',
operand: ViewFilterOperand.DoesNotContain,
definition: {
type: 'EMAILS',
fieldMetadataId: personMockEmailFieldMetadataId?.id,
label: 'Emails',
iconName: 'email',
},
label: 'Emails',
type: FieldMetadataType.EMAILS,
};
const emailsFilterIsEmpty: RecordFilter = {
@ -696,12 +643,8 @@ describe('should work as expected for the different field types', () => {
fieldMetadataId: personMockEmailFieldMetadataId?.id,
displayValue: '',
operand: ViewFilterOperand.IsEmpty,
definition: {
type: 'EMAILS',
label: 'Emails',
iconName: 'email',
fieldMetadataId: personMockEmailFieldMetadataId?.id,
},
label: 'Emails',
type: FieldMetadataType.EMAILS,
};
const emailsFilterIsNotEmpty: RecordFilter = {
@ -710,12 +653,8 @@ describe('should work as expected for the different field types', () => {
fieldMetadataId: personMockEmailFieldMetadataId?.id,
displayValue: '',
operand: ViewFilterOperand.IsNotEmpty,
definition: {
type: 'EMAILS',
label: 'Emails',
iconName: 'email',
fieldMetadataId: personMockEmailFieldMetadataId?.id,
},
label: 'Emails',
type: FieldMetadataType.EMAILS,
};
const result = computeViewRecordGqlOperationFilter(
@ -810,12 +749,8 @@ describe('should work as expected for the different field types', () => {
fieldMetadataId: companyMockDateFieldMetadataId?.id,
displayValue: '2024-09-17T20:46:58.922Z',
operand: ViewFilterOperand.IsAfter,
definition: {
type: 'DATE_TIME',
fieldMetadataId: companyMockDateFieldMetadataId?.id,
label: 'Created At',
iconName: 'date',
},
label: 'Created At',
type: FieldMetadataType.DATE_TIME,
};
const dateFilterIsBefore: RecordFilter = {
@ -824,12 +759,8 @@ describe('should work as expected for the different field types', () => {
fieldMetadataId: companyMockDateFieldMetadataId?.id,
displayValue: '2024-09-17T20:46:58.922Z',
operand: ViewFilterOperand.IsBefore,
definition: {
type: 'DATE_TIME',
fieldMetadataId: companyMockDateFieldMetadataId?.id,
label: 'Created At',
iconName: 'date',
},
label: 'Created At',
type: FieldMetadataType.DATE_TIME,
};
const dateFilterIs: RecordFilter = {
@ -838,12 +769,8 @@ describe('should work as expected for the different field types', () => {
fieldMetadataId: companyMockDateFieldMetadataId?.id,
displayValue: '2024-09-17T20:46:58.922Z',
operand: ViewFilterOperand.Is,
definition: {
type: 'DATE_TIME',
fieldMetadataId: companyMockDateFieldMetadataId?.id,
label: 'Created At',
iconName: 'date',
},
label: 'Created At',
type: FieldMetadataType.DATE_TIME,
};
const dateFilterIsEmpty: RecordFilter = {
@ -852,12 +779,8 @@ describe('should work as expected for the different field types', () => {
fieldMetadataId: companyMockDateFieldMetadataId?.id,
displayValue: '',
operand: ViewFilterOperand.IsEmpty,
definition: {
type: 'DATE_TIME',
fieldMetadataId: companyMockDateFieldMetadataId?.id,
label: 'Created At',
iconName: 'date',
},
label: 'Created At',
type: FieldMetadataType.DATE_TIME,
};
const dateFilterIsNotEmpty: RecordFilter = {
@ -866,12 +789,8 @@ describe('should work as expected for the different field types', () => {
fieldMetadataId: companyMockDateFieldMetadataId?.id,
displayValue: '',
operand: ViewFilterOperand.IsNotEmpty,
definition: {
type: 'DATE_TIME',
fieldMetadataId: companyMockDateFieldMetadataId?.id,
label: 'Created At',
iconName: 'date',
},
label: 'Created At',
type: FieldMetadataType.DATE_TIME,
};
const result = computeViewRecordGqlOperationFilter(
@ -941,12 +860,8 @@ describe('should work as expected for the different field types', () => {
fieldMetadataId: companyMockEmployeesFieldMetadataId?.id,
displayValue: '1000',
operand: ViewFilterOperand.GreaterThan,
definition: {
type: 'NUMBER',
fieldMetadataId: companyMockEmployeesFieldMetadataId?.id,
label: 'Employees',
iconName: 'number',
},
label: 'Employees',
type: FieldMetadataType.NUMBER,
};
const employeesFilterIsLessThan: RecordFilter = {
@ -955,12 +870,8 @@ describe('should work as expected for the different field types', () => {
fieldMetadataId: companyMockEmployeesFieldMetadataId?.id,
displayValue: '1000',
operand: ViewFilterOperand.LessThan,
definition: {
type: 'NUMBER',
fieldMetadataId: companyMockEmployeesFieldMetadataId?.id,
label: 'Employees',
iconName: 'number',
},
label: 'Employees',
type: FieldMetadataType.NUMBER,
};
const employeesFilterIsEmpty: RecordFilter = {
@ -969,12 +880,8 @@ describe('should work as expected for the different field types', () => {
fieldMetadataId: companyMockEmployeesFieldMetadataId?.id,
displayValue: '',
operand: ViewFilterOperand.IsEmpty,
definition: {
type: 'NUMBER',
fieldMetadataId: companyMockEmployeesFieldMetadataId?.id,
label: 'Employees',
iconName: 'number',
},
label: 'Employees',
type: FieldMetadataType.NUMBER,
};
const employeesFilterIsNotEmpty: RecordFilter = {
@ -983,12 +890,8 @@ describe('should work as expected for the different field types', () => {
fieldMetadataId: companyMockEmployeesFieldMetadataId?.id,
displayValue: '',
operand: ViewFilterOperand.IsNotEmpty,
definition: {
type: 'NUMBER',
fieldMetadataId: companyMockEmployeesFieldMetadataId?.id,
label: 'Employees',
iconName: 'number',
},
label: 'Employees',
type: FieldMetadataType.NUMBER,
};
const result = computeViewRecordGqlOperationFilter(

1
packages/twenty-front/src/modules/object-record/record-filter/utils/computeViewRecordGqlOperationFilter.ts
View File

@ -280,7 +280,6 @@ export const computeFilterRecordGqlOperationFilter = ({
),
} as RatingFilter,
};
default:
throw new Error(
`Unknown operand ${filter.operand} for ${filterType} filter`,

18
packages/twenty-front/src/modules/object-record/record-index/components/RecordIndexContainer.tsx
View File

@ -26,7 +26,7 @@ import { RecordIndexActionMenu } from '@/action-menu/components/RecordIndexActio
import { ContextStoreCurrentViewTypeEffect } from '@/context-store/components/ContextStoreCurrentViewTypeEffect';
import { contextStoreTargetedRecordsRuleComponentState } from '@/context-store/states/contextStoreTargetedRecordsRuleComponentState';
import { ContextStoreViewType } from '@/context-store/types/ContextStoreViewType';
import { useFilterDefinitionsFromFilterableFieldMetadataItems } from '@/object-record/record-filter/hooks/useFilterDefinitionsFromFilterableFieldMetadataItems';
import { useFilterableFieldMetadataItemsInRecordIndexContext } from '@/object-record/record-filter/hooks/useFilterableFieldMetadataItemsInRecordIndexContext';
import { useSetRecordGroup } from '@/object-record/record-group/hooks/useSetRecordGroup';
import { RecordIndexFiltersToContextStoreEffect } from '@/object-record/record-index/components/RecordIndexFiltersToContextStoreEffect';
import { RecordIndexTableContainerEffect } from '@/object-record/record-index/components/RecordIndexTableContainerEffect';
@ -180,8 +180,8 @@ export const RecordIndexContainer = () => {
contextStoreTargetedRecordsRuleComponentState,
);
const { filterDefinitions } =
useFilterDefinitionsFromFilterableFieldMetadataItems();
const { filterableFieldMetadataItems } =
useFilterableFieldMetadataItemsInRecordIndexContext();
const isCommandMenuV2Enabled = useIsFeatureEnabled(
FeatureFlagKey.IsCommandMenuV2Enabled,
@ -218,17 +218,23 @@ export const RecordIndexContainer = () => {
onViewGroupsChange(view.viewGroups);
setTableViewFilterGroups(view.viewFilterGroups ?? []);
setTableFilters(
mapViewFiltersToFilters(view.viewFilters, filterDefinitions),
mapViewFiltersToFilters(
view.viewFilters,
filterableFieldMetadataItems,
),
);
setRecordIndexFilters(
mapViewFiltersToFilters(view.viewFilters, filterDefinitions),
mapViewFiltersToFilters(
view.viewFilters,
filterableFieldMetadataItems,
),
);
setRecordIndexViewFilterGroups(view.viewFilterGroups ?? []);
setContextStoreTargetedRecordsRule((prev) => ({
...prev,
filters: mapViewFiltersToFilters(
view.viewFilters,
filterDefinitions,
filterableFieldMetadataItems,
),
}));
setTableSorts(

6
packages/twenty-front/src/modules/object-record/record-index/export/hooks/__tests__/useExportFetchRecords.test.ts
View File

@ -6,6 +6,7 @@ import {
useExportFetchRecords,
} from '../useExportFetchRecords';
import { useLazyFetchAllRecords } from '@/object-record/hooks/useLazyFetchAllRecords';
import { useObjectOptionsForBoard } from '@/object-record/object-options-dropdown/hooks/useObjectOptionsForBoard';
import { recordGroupFieldMetadataComponentState } from '@/object-record/record-group/states/recordGroupFieldMetadataComponentState';
import { useRecoilComponentStateV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentStateV2';
@ -13,7 +14,6 @@ import { ViewType } from '@/views/types/ViewType';
import { expect } from '@storybook/test';
import { getJestMetadataAndApolloMocksAndActionMenuWrapper } from '~/testing/jest/getJestMetadataAndApolloMocksAndContextStoreWrapper';
import { generatedMockObjectMetadataItems } from '~/testing/mock-data/generatedMockObjectMetadataItems';
import { useLazyFetchAllRecords } from '@/object-record/hooks/useLazyFetchAllRecords';
const mockPerson = {
__typename: 'Person',
@ -155,7 +155,9 @@ describe('useRecordData', () => {
it('should call the callback function with kanban field included as column if view type is kanban', async () => {
const callback = jest.fn();
mockFetchAllRecords.mockReturnValue([mockPerson]);
const { result } = renderHook(
() => {
const [recordGroupFieldMetadata, setRecordGroupFieldMetadata] =
@ -234,7 +236,7 @@ describe('useRecordData', () => {
displayAsRelativeDate: true,
},
},
position: expect.any(Number),
position: 10,
showLabel: undefined,
size: 100,
type: 'DATE_TIME',

36
packages/twenty-front/src/modules/object-record/record-index/hooks/useHandleToggleColumnFilter.ts
View File

@ -5,19 +5,15 @@ import { useColumnDefinitionsFromFieldMetadata } from '@/object-metadata/hooks/u
import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem';
import { availableFieldMetadataItemsForFilterFamilySelector } from '@/object-metadata/states/availableFieldMetadataItemsForFilterFamilySelector';
import {
formatFieldMetadataItemAsFilterDefinition,
getFilterTypeFromFieldType,
} from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { useSelectFilterDefinitionUsedInDropdown } from '@/object-record/object-filter-dropdown/hooks/useSelectFilterDefinitionUsedInDropdown';
import { fieldMetadataItemIdUsedInDropdownComponentState } from '@/object-record/object-filter-dropdown/states/fieldMetadataItemIdUsedInDropdownComponentState';
import { getFilterTypeFromFieldType } from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { useSelectFilterUsedInDropdown } from '@/object-record/object-filter-dropdown/hooks/useSelectFilterUsedInDropdown';
import { useUpsertRecordFilter } from '@/object-record/record-filter/hooks/useUpsertRecordFilter';
import { RecordFilter } from '@/object-record/record-filter/types/RecordFilter';
import { getRecordFilterOperands } from '@/object-record/record-filter/utils/getRecordFilterOperands';
import { useSetActiveDropdownFocusIdAndMemorizePrevious } from '@/ui/layout/dropdown/hooks/useSetFocusedDropdownIdAndMemorizePrevious';
import { isDropdownOpenComponentState } from '@/ui/layout/dropdown/states/isDropdownOpenComponentState';
import { usePreviousHotkeyScope } from '@/ui/utilities/hotkey/hooks/usePreviousHotkeyScope';
import { useSetRecoilComponentStateV2 } from '@/ui/utilities/state/component-state/hooks/useSetRecoilComponentStateV2';
import { extractComponentState } from '@/ui/utilities/state/component-state/utils/extractComponentState';
import { useGetCurrentView } from '@/views/hooks/useGetCurrentView';
import { useUpsertCombinedViewFilters } from '@/views/hooks/useUpsertCombinedViewFilters';
@ -76,13 +72,8 @@ export const useHandleToggleColumnFilter = ({
const { currentViewWithCombinedFiltersAndSorts } = useGetCurrentView();
const { selectFilterDefinitionUsedInDropdown } =
useSelectFilterDefinitionUsedInDropdown(viewBarId);
const setFieldMetadataItemIdUsedInDropdown = useSetRecoilComponentStateV2(
fieldMetadataItemIdUsedInDropdownComponentState,
viewBarId,
);
const { selectFilterUsedInDropdown } =
useSelectFilterUsedInDropdown(viewBarId);
const handleToggleColumnFilter = useCallback(
async (fieldMetadataId: string) => {
@ -110,14 +101,6 @@ export const useHandleToggleColumnFilter = ({
throw new Error('Field metadata item not found');
}
const filterDefinition = formatFieldMetadataItemAsFilterDefinition({
field: fieldMetadataItem,
});
if (!isDefined(filterDefinition)) {
throw new Error('Filter definition not found');
}
const filterType = getFilterTypeFromFieldType(fieldMetadataItem.type);
const availableOperandsForFilter = getRecordFilterOperands({
@ -131,7 +114,8 @@ export const useHandleToggleColumnFilter = ({
fieldMetadataId,
operand: defaultOperand,
displayValue: '',
definition: filterDefinition,
label: fieldMetadataItem.label,
type: filterType,
value: '',
};
@ -139,8 +123,7 @@ export const useHandleToggleColumnFilter = ({
await upsertCombinedViewFilter(newFilter);
selectFilterDefinitionUsedInDropdown({ filterDefinition });
setFieldMetadataItemIdUsedInDropdown(fieldMetadataId);
selectFilterUsedInDropdown({ fieldMetadataItemId: fieldMetadataId });
}
openDropdown(existingViewFilter?.id ?? newFilterId);
@ -149,11 +132,10 @@ export const useHandleToggleColumnFilter = ({
openDropdown,
columnDefinitions,
upsertCombinedViewFilter,
selectFilterDefinitionUsedInDropdown,
selectFilterUsedInDropdown,
currentViewWithCombinedFiltersAndSorts,
availableFieldMetadataItemsForFilter,
upsertRecordFilter,
setFieldMetadataItemIdUsedInDropdown,
],
);

6
packages/twenty-front/src/modules/object-record/record-index/hooks/useHandleToggleTrashColumnFilter.ts
View File

@ -64,12 +64,6 @@ export const useHandleToggleTrashColumnFilter = ({
displayValue: '',
type: filterType,
label: `Deleted`,
definition: {
label: `Deleted`,
iconName: 'IconTrash',
fieldMetadataId: trashFieldMetadata.id,
type: filterType,
},
value: '',
};

60
packages/twenty-front/src/modules/sign-in-background-mock/constants/SignInBackgroundMockFilterDefinitions.ts
View File

@ -1,60 +0,0 @@
import { RecordFilterDefinition } from '@/object-record/record-filter/types/RecordFilterDefinition';
export const SIGN_IN_BACKGROUND_MOCK_FILTER_DEFINITIONS = [
{
fieldMetadataId: '20202020-5e4e-4007-a630-8a2617914889',
label: 'Domain Name',
iconName: 'IconLink',
type: 'LINKS',
},
{
fieldMetadataId: '20202020-7fbd-41ad-b64d-25a15ff62f04',
label: 'Employees',
iconName: 'IconUsers',
type: 'NUMBER',
},
{
fieldMetadataId: 'REPLACE_ME',
label: 'Name',
iconName: 'IconBuildingSkyscraper',
type: 'TEXT',
},
{
fieldMetadataId: '20202020-ad10-4117-a039-3f04b7a5f939',
label: 'Address',
iconName: 'IconMap',
type: 'ADDRESS',
},
{
fieldMetadataId: '20202020-0739-495d-8e70-c0807f6b2268',
label: 'Account Owner',
iconName: 'IconUserCircle',
relationObjectMetadataNamePlural: 'workspaceMembers',
relationObjectMetadataNameSingular: 'workspaceMember',
type: 'RELATION',
},
{
fieldMetadataId: '20202020-4dc2-47c9-bb15-6e6f19ba9e46',
label: 'Creation date',
iconName: 'IconCalendar',
type: 'DATE_TIME',
},
{
fieldMetadataId: '20202020-a61d-4b78-b998-3fd88b4f73a1',
label: 'Linkedin',
iconName: 'IconBrandLinkedin',
type: 'LINKS',
},
{
fieldMetadataId: '20202020-46e3-479a-b8f4-77137c74daa6',
label: 'X',
iconName: 'IconBrandX',
type: 'LINKS',
},
{
fieldMetadataId: '20202020-4a5a-466f-92d9-c3870d9502a9',
label: 'ARR',
iconName: 'IconMoneybag',
type: 'CURRENCY',
},
] as RecordFilterDefinition[];

22
packages/twenty-front/src/modules/views/components/EditableFilterDropdownButtonEffect.tsx
View File

@ -1,8 +1,7 @@
import { useEffect } from 'react';
import { formatFieldMetadataItemAsFilterDefinition } from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { fieldMetadataItemIdUsedInDropdownComponentState } from '@/object-record/object-filter-dropdown/states/fieldMetadataItemIdUsedInDropdownComponentState';
import { filterDefinitionUsedInDropdownComponentState } from '@/object-record/object-filter-dropdown/states/filterDefinitionUsedInDropdownComponentState';
import { selectedFilterComponentState } from '@/object-record/object-filter-dropdown/states/selectedFilterComponentState';
import { selectedOperandInDropdownComponentState } from '@/object-record/object-filter-dropdown/states/selectedOperandInDropdownComponentState';
import { useFilterableFieldMetadataItemsInRecordIndexContext } from '@/object-record/record-filter/hooks/useFilterableFieldMetadataItemsInRecordIndexContext';
@ -19,11 +18,6 @@ export const EditableFilterDropdownButtonEffect = ({
viewFilterDropdownId,
viewFilter,
}: EditableFilterDropdownButtonEffectProps) => {
const setFilterDefinitionUsedInDropdown = useSetRecoilComponentStateV2(
filterDefinitionUsedInDropdownComponentState,
viewFilterDropdownId,
);
const setFieldMetadataItemIdUsedInDropdown = useSetRecoilComponentStateV2(
fieldMetadataItemIdUsedInDropdownComponentState,
);
@ -51,19 +45,11 @@ export const EditableFilterDropdownButtonEffect = ({
return;
}
const filterDefinition = formatFieldMetadataItemAsFilterDefinition({
field: fieldMetadataItem,
});
if (isDefined(filterDefinition)) {
setFilterDefinitionUsedInDropdown(filterDefinition);
setFieldMetadataItemIdUsedInDropdown(filterDefinition.fieldMetadataId);
setSelectedOperandInDropdown(viewFilter.operand);
setSelectedFilter(viewFilter);
}
setFieldMetadataItemIdUsedInDropdown(fieldMetadataItem.id);
setSelectedOperandInDropdown(viewFilter.operand);
setSelectedFilter(viewFilter);
}, [
filterableFieldMetadataItems,
setFilterDefinitionUsedInDropdown,
setFieldMetadataItemIdUsedInDropdown,
viewFilter,
setSelectedOperandInDropdown,

13
packages/twenty-front/src/modules/views/components/ViewBarRecordFilterEffect.tsx
View File

@ -1,4 +1,3 @@
import { formatFieldMetadataItemAsFilterDefinition } from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { useFilterableFieldMetadataItemsInRecordIndexContext } from '@/object-record/record-filter/hooks/useFilterableFieldMetadataItemsInRecordIndexContext';
import { currentRecordFiltersComponentState } from '@/object-record/record-filter/states/currentRecordFiltersComponentState';
import { usePrefetchedData } from '@/prefetch/hooks/usePrefetchedData';
@ -45,16 +44,12 @@ export const ViewBarRecordFilterEffect = () => {
if (isDataPrefetched && !hasInitializedCurrentRecordFilters) {
const currentView = views.find((view) => view.id === currentViewId);
const filterDefinitions = filterableFieldMetadataItems.map(
(fieldMetadataItem) =>
formatFieldMetadataItemAsFilterDefinition({
field: fieldMetadataItem,
}),
);
if (isDefined(currentView)) {
setCurrentRecordFilters(
mapViewFiltersToFilters(currentView.viewFilters, filterDefinitions),
mapViewFiltersToFilters(
currentView.viewFilters,
filterableFieldMetadataItems,
),
);
setHasInitializedCurrentRecordFilters(true);
}

15
packages/twenty-front/src/modules/views/hooks/__tests__/useApplyCurrentViewFiltersToCurrentRecordFilters.test.tsx
View File

@ -1,12 +1,8 @@
import { act, renderHook } from '@testing-library/react';
import {
formatFieldMetadataItemAsFilterDefinition,
getFilterTypeFromFieldType,
} from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { getFilterTypeFromFieldType } from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { currentRecordFiltersComponentState } from '@/object-record/record-filter/states/currentRecordFiltersComponentState';
import { RecordFilter } from '@/object-record/record-filter/types/RecordFilter';
import { RecordFilterDefinition } from '@/object-record/record-filter/types/RecordFilterDefinition';
import { usePrefetchedData } from '@/prefetch/hooks/usePrefetchedData';
import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2';
import { currentViewIdComponentState } from '@/views/states/currentViewIdComponentState';
@ -34,11 +30,6 @@ describe('useApplyCurrentViewFiltersToCurrentRecordFilters', () => {
const mockFieldMetadataItem = mockObjectMetadataItem.fields[0];
const mockFilterDefinition: RecordFilterDefinition =
formatFieldMetadataItemAsFilterDefinition({
field: mockFieldMetadataItem,
});
const mockViewFilter: ViewFilter = {
__typename: 'ViewFilter',
id: 'filter-1',
@ -48,7 +39,6 @@ describe('useApplyCurrentViewFiltersToCurrentRecordFilters', () => {
displayValue: mockFieldMetadataItem.label,
viewFilterGroupId: 'group-1',
positionInViewFilterGroup: 0,
definition: mockFilterDefinition,
};
const mockView = {
@ -108,8 +98,7 @@ describe('useApplyCurrentViewFiltersToCurrentRecordFilters', () => {
operand: mockViewFilter.operand,
viewFilterGroupId: mockViewFilter.viewFilterGroupId,
positionInViewFilterGroup: mockViewFilter.positionInViewFilterGroup,
definition: mockFilterDefinition,
label: mockViewFilter.displayValue,
label: mockFieldMetadataItem.label,
type: getFilterTypeFromFieldType(mockFieldMetadataItem.type),
} satisfies RecordFilter,
]);

15
packages/twenty-front/src/modules/views/hooks/__tests__/useApplyViewFiltersToCurrentRecordFilters.test.tsx
View File

@ -1,12 +1,8 @@
import { act, renderHook } from '@testing-library/react';
import {
formatFieldMetadataItemAsFilterDefinition,
getFilterTypeFromFieldType,
} from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { getFilterTypeFromFieldType } from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { currentRecordFiltersComponentState } from '@/object-record/record-filter/states/currentRecordFiltersComponentState';
import { RecordFilter } from '@/object-record/record-filter/types/RecordFilter';
import { RecordFilterDefinition } from '@/object-record/record-filter/types/RecordFilterDefinition';
import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2';
import { ViewFilter } from '@/views/types/ViewFilter';
import { ViewFilterOperand } from '@/views/types/ViewFilterOperand';
@ -30,11 +26,6 @@ describe('useApplyViewFiltersToCurrentRecordFilters', () => {
const mockFieldMetadataItem = mockObjectMetadataItem.fields[0];
const mockAvailableFilterDefinition: RecordFilterDefinition =
formatFieldMetadataItemAsFilterDefinition({
field: mockFieldMetadataItem,
});
const mockViewFilter: ViewFilter = {
__typename: 'ViewFilter',
id: 'filter-1',
@ -44,7 +35,6 @@ describe('useApplyViewFiltersToCurrentRecordFilters', () => {
displayValue: mockFieldMetadataItem.label,
viewFilterGroupId: 'group-1',
positionInViewFilterGroup: 0,
definition: mockAvailableFilterDefinition,
};
it('should apply view filters to current record filters', () => {
@ -82,8 +72,7 @@ describe('useApplyViewFiltersToCurrentRecordFilters', () => {
operand: mockViewFilter.operand,
viewFilterGroupId: mockViewFilter.viewFilterGroupId,
positionInViewFilterGroup: mockViewFilter.positionInViewFilterGroup,
definition: mockAvailableFilterDefinition,
label: mockViewFilter.displayValue,
label: mockFieldMetadataItem.label,
type: getFilterTypeFromFieldType(mockFieldMetadataItem.type),
} satisfies RecordFilter,
]);

10
packages/twenty-front/src/modules/views/hooks/internal/useViewFromQueryParams.ts
View File

@ -10,7 +10,6 @@ import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadata
import { useObjectNameSingularFromPlural } from '@/object-metadata/hooks/useObjectNameSingularFromPlural';
import { objectMetadataItemFamilySelector } from '@/object-metadata/states/objectMetadataItemFamilySelector';
import { objectMetadataItemsState } from '@/object-metadata/states/objectMetadataItemsState';
import { formatFieldMetadataItemAsFilterDefinition } from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { getObjectRecordIdentifier } from '@/object-metadata/utils/getObjectRecordIdentifier';
import { ObjectRecord } from '@/object-record/types/ObjectRecord';
import { generateFindManyRecordsQuery } from '@/object-record/utils/generateFindManyRecordsQuery';
@ -18,7 +17,6 @@ import { ViewFilter } from '@/views/types/ViewFilter';
import { ViewFilterOperand } from '@/views/types/ViewFilterOperand';
import { relationFilterValueSchemaObject } from '@/views/view-filter-value/validation-schemas/jsonRelationFilterValueSchema';
import { isDefined } from 'twenty-shared';
import { isUndefinedOrNull } from '~/utils/isUndefinedOrNull';
const filterQueryParamsSchema = z.object({
viewId: z.string().optional(),
@ -85,13 +83,6 @@ export const useViewFromQueryParams = () => {
if (!fieldMetadataItem) return null;
const filterDefinition =
formatFieldMetadataItemAsFilterDefinition({
field: fieldMetadataItem,
});
if (isUndefinedOrNull(filterDefinition)) return null;
const relationObjectMetadataNameSingular =
fieldMetadataItem.relationDefinition?.targetObjectMetadata
?.nameSingular;
@ -178,7 +169,6 @@ export const useViewFromQueryParams = () => {
value: filterValueAsString,
displayValue:
relationRecordNames?.join(', ') ?? filterValueAsString,
definition: filterDefinition,
persistAction: 'NONE',
};
},

11
packages/twenty-front/src/modules/views/hooks/useApplyCurrentViewFiltersToCurrentRecordFilters.ts
View File

@ -1,4 +1,4 @@
import { useFilterDefinitionsFromFilterableFieldMetadataItems } from '@/object-record/record-filter/hooks/useFilterDefinitionsFromFilterableFieldMetadataItems';
import { useFilterableFieldMetadataItemsInRecordIndexContext } from '@/object-record/record-filter/hooks/useFilterableFieldMetadataItemsInRecordIndexContext';
import { currentRecordFiltersComponentState } from '@/object-record/record-filter/states/currentRecordFiltersComponentState';
import { usePrefetchedData } from '@/prefetch/hooks/usePrefetchedData';
import { PrefetchKey } from '@/prefetch/types/PrefetchKey';
@ -19,15 +19,18 @@ export const useApplyCurrentViewFiltersToCurrentRecordFilters = () => {
currentRecordFiltersComponentState,
);
const { filterDefinitions } =
useFilterDefinitionsFromFilterableFieldMetadataItems();
const { filterableFieldMetadataItems } =
useFilterableFieldMetadataItemsInRecordIndexContext();
const applyCurrentViewFiltersToCurrentRecordFilters = () => {
const currentView = views.find((view) => view.id === currentViewId);
if (isDefined(currentView)) {
setCurrentRecordFilters(
mapViewFiltersToFilters(currentView.viewFilters, filterDefinitions),
mapViewFiltersToFilters(
currentView.viewFilters,
filterableFieldMetadataItems,
),
);
}
};

8
packages/twenty-front/src/modules/views/hooks/useApplyViewFiltersToCurrentRecordFilters.ts
View File

@ -1,4 +1,4 @@
import { useFilterDefinitionsFromFilterableFieldMetadataItems } from '@/object-record/record-filter/hooks/useFilterDefinitionsFromFilterableFieldMetadataItems';
import { useFilterableFieldMetadataItemsInRecordIndexContext } from '@/object-record/record-filter/hooks/useFilterableFieldMetadataItemsInRecordIndexContext';
import { currentRecordFiltersComponentState } from '@/object-record/record-filter/states/currentRecordFiltersComponentState';
import { useSetRecoilComponentStateV2 } from '@/ui/utilities/state/component-state/hooks/useSetRecoilComponentStateV2';
import { ViewFilter } from '@/views/types/ViewFilter';
@ -9,15 +9,15 @@ export const useApplyViewFiltersToCurrentRecordFilters = () => {
currentRecordFiltersComponentState,
);
const { filterDefinitions } =
useFilterDefinitionsFromFilterableFieldMetadataItems();
const { filterableFieldMetadataItems } =
useFilterableFieldMetadataItemsInRecordIndexContext();
const applyViewFiltersToCurrentRecordFilters = (
viewFilters: ViewFilter[],
) => {
const recordFiltersToApply = mapViewFiltersToFilters(
viewFilters,
filterDefinitions,
filterableFieldMetadataItems,
);
setCurrentRecordFilters(recordFiltersToApply);

7
packages/twenty-front/src/modules/views/hooks/useQueryVariablesFromActiveFieldsOfViewOrDefaultView.ts
View File

@ -3,8 +3,6 @@ import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem';
import { useFilterValueDependencies } from '@/object-record/record-filter/hooks/useFilterValueDependencies';
import { useViewOrDefaultViewFromPrefetchedViews } from '@/views/hooks/useViewOrDefaultViewFromPrefetchedViews';
import { getQueryVariablesFromView } from '@/views/utils/getQueryVariablesFromView';
import { useIsFeatureEnabled } from '@/workspace/hooks/useIsFeatureEnabled';
import { FeatureFlagKey } from '~/generated/graphql';
export const useQueryVariablesFromActiveFieldsOfViewOrDefaultView = ({
objectMetadataItem,
@ -22,17 +20,12 @@ export const useQueryVariablesFromActiveFieldsOfViewOrDefaultView = ({
objectMetadataItem,
});
const isJsonFilterEnabled = useIsFeatureEnabled(
FeatureFlagKey.IsJsonFilterEnabled,
);
const { filterValueDependencies } = useFilterValueDependencies();
const { filter, orderBy } = getQueryVariablesFromView({
fieldMetadataItems: activeFieldMetadataItems,
objectMetadataItem,
view,
isJsonFilterEnabled,
filterValueDependencies,
});

2
packages/twenty-front/src/modules/views/types/ViewFilter.ts
View File

@ -1,4 +1,3 @@
import { RecordFilterDefinition } from '@/object-record/record-filter/types/RecordFilterDefinition';
import { ViewFilterOperand } from './ViewFilterOperand';
export type ViewFilter = {
@ -14,5 +13,4 @@ export type ViewFilter = {
viewId?: string;
viewFilterGroupId?: string;
positionInViewFilterGroup?: number | null;
definition?: RecordFilterDefinition;
};

26
packages/twenty-front/src/modules/views/utils/__tests__/viewMapFunctions.test.ts
View File

@ -20,6 +20,15 @@ const baseDefinition = {
fieldName: 'fieldName',
};
const baseFieldMetadataItem = {
id: '05731f68-6e7a-4903-8374-c0b6a9063482',
createdAt: '2021-01-01',
updatedAt: '2021-01-01',
name: 'name',
label: 'Name',
type: FieldMetadataType.FULL_NAME,
};
describe('mapViewSortsToSorts', () => {
it('should map each ViewSort object to a corresponding Sort object', () => {
const viewSorts: ViewSort[] = [
@ -62,23 +71,12 @@ describe('mapViewFiltersToFilters', () => {
value: 'testValue',
displayValue: 'Test Display Value',
operand: ViewFilterOperand.Is,
definition: {
...baseDefinition,
type: 'FULL_NAME',
},
label: baseDefinition.label,
type: 'FULL_NAME',
positionInViewFilterGroup: undefined,
viewFilterGroupId: undefined,
label: baseFieldMetadataItem.label,
type: FieldMetadataType.FULL_NAME,
},
];
expect(
mapViewFiltersToFilters(viewFilters, [
{
...baseDefinition,
type: 'FULL_NAME',
},
]),
mapViewFiltersToFilters(viewFilters, [baseFieldMetadataItem]),
).toEqual(expectedFilters);
});
});

11
packages/twenty-front/src/modules/views/utils/getQueryVariablesFromView.ts
View File

@ -1,6 +1,6 @@
import { FieldMetadataItem } from '@/object-metadata/types/FieldMetadataItem';
import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem';
import { formatFieldMetadataItemsAsFilterDefinitions } from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { formatFieldMetadataItemsAsSortDefinitions } from '@/object-metadata/utils/formatFieldMetadataItemsAsSortDefinitions';
import { turnSortsIntoOrderBy } from '@/object-record/object-sort-dropdown/utils/turnSortsIntoOrderBy';
import { RecordFilterValueDependencies } from '@/object-record/record-filter/types/RecordFilterValueDependencies';
@ -15,13 +15,11 @@ export const getQueryVariablesFromView = ({
view,
fieldMetadataItems,
objectMetadataItem,
isJsonFilterEnabled,
filterValueDependencies,
}: {
view: View | null | undefined;
fieldMetadataItems: FieldMetadataItem[];
objectMetadataItem: ObjectMetadataItem;
isJsonFilterEnabled: boolean;
filterValueDependencies: RecordFilterValueDependencies;
}) => {
if (!isDefined(view)) {
@ -33,18 +31,13 @@ export const getQueryVariablesFromView = ({
const { viewFilterGroups, viewFilters, viewSorts } = view;
const filterDefinitions = formatFieldMetadataItemsAsFilterDefinitions({
fields: fieldMetadataItems,
isJsonFilterEnabled,
});
const sortDefinitions = formatFieldMetadataItemsAsSortDefinitions({
fields: fieldMetadataItems,
});
const filter = computeViewRecordGqlOperationFilter(
filterValueDependencies,
mapViewFiltersToFilters(viewFilters, filterDefinitions),
mapViewFiltersToFilters(viewFilters, fieldMetadataItems),
objectMetadataItem?.fields ?? [],
viewFilterGroups ?? [],
);

27
packages/twenty-front/src/modules/views/utils/mapViewFiltersToFilters.ts
View File

@ -1,21 +1,31 @@
import { RecordFilter } from '@/object-record/record-filter/types/RecordFilter';
import { isDefined } from 'twenty-shared';
import { RecordFilterDefinition } from '@/object-record/record-filter/types/RecordFilterDefinition';
import { FieldMetadataItem } from '@/object-metadata/types/FieldMetadataItem';
import { getFilterTypeFromFieldType } from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
import { ViewFilter } from '../types/ViewFilter';
export const mapViewFiltersToFilters = (
viewFilters: ViewFilter[],
availableFilterDefinitions: RecordFilterDefinition[],
availableFieldMetadataItems: FieldMetadataItem[],
): RecordFilter[] => {
return viewFilters
.map((viewFilter) => {
const availableFilterDefinition = availableFilterDefinitions.find(
(filterDefinition) =>
filterDefinition.fieldMetadataId === viewFilter.fieldMetadataId,
const availableFieldMetadataItem = availableFieldMetadataItems.find(
(fieldMetadataItem) =>
fieldMetadataItem.id === viewFilter.fieldMetadataId,
);
if (!availableFilterDefinition) return null;
if (!isDefined(availableFieldMetadataItem)) {
throw new Error(
`Field metadata item not found for view filter ${viewFilter.id} and field metadata id ${viewFilter.fieldMetadataId}`,
);
}
const filterType = getFilterTypeFromFieldType(
availableFieldMetadataItem.type,
);
return {
id: viewFilter.id,
@ -25,9 +35,8 @@ export const mapViewFiltersToFilters = (
operand: viewFilter.operand,
viewFilterGroupId: viewFilter.viewFilterGroupId,
positionInViewFilterGroup: viewFilter.positionInViewFilterGroup,
definition: viewFilter.definition ?? availableFilterDefinition,
label: viewFilter.definition?.label ?? availableFilterDefinition.label,
type: viewFilter.definition?.type ?? availableFilterDefinition.type,
label: availableFieldMetadataItem.label,
type: filterType,
};
})
.filter(isDefined);