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

Clean record filter and record sort (#10466)

Browse Source 
This PR removes what's left from record filter and record sort previous
logic to handle CRUD and state management with view.

So everything that is named combinedFilter and combinedSort is removed
here.

We implement currentRecordFilters and currentRecordSorts everywhere.

We also remove the event in a state onSortSelectComponentState. (a
pattern we want to avoid)
This commit is contained in:
Lucas Bordeau
2025-02-25 15:03:30 +01:00
committed by GitHub
parent 61904050ac
commit 2247d3fa91
53 changed files with 236 additions and 1233 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
packages/twenty-front/src/modules/views/components/AdvancedFilterDropdownButton.tsx
View File

@ -4,29 +4,35 @@ import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown';
import { AdvancedFilterRootLevelViewFilterGroup } from '@/object-record/advanced-filter/components/AdvancedFilterRootLevelViewFilterGroup';
import { useDeleteCombinedViewFilterGroup } from '@/object-record/advanced-filter/hooks/useDeleteCombinedViewFilterGroup';
import { useRemoveRecordFilter } from '@/object-record/record-filter/hooks/useRemoveRecordFilter';
import { currentRecordFiltersComponentState } from '@/object-record/record-filter/states/currentRecordFiltersComponentState';
import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2';
import { AdvancedFilterChip } from '@/views/components/AdvancedFilterChip';
import { ADVANCED_FILTER_DROPDOWN_ID } from '@/views/constants/AdvancedFilterDropdownId';
import { useDeleteCombinedViewFilters } from '@/views/hooks/useDeleteCombinedViewFilters';
import { useGetCurrentView } from '@/views/hooks/useGetCurrentView';
import { isDefined } from 'twenty-shared';
export const AdvancedFilterDropdownButton = () => {
const { deleteCombinedViewFilter } = useDeleteCombinedViewFilters();
const { deleteCombinedViewFilterGroup } = useDeleteCombinedViewFilterGroup();
const { currentViewWithCombinedFiltersAndSorts } = useGetCurrentView();
const advancedViewFilterIds =
currentViewWithCombinedFiltersAndSorts?.viewFilters
.filter((viewFilter) => isDefined(viewFilter.viewFilterGroupId))
.map((viewFilter) => viewFilter.id);
const currentRecordFilters = useRecoilComponentValueV2(
currentRecordFiltersComponentState,
);
const advancedRecordFilterIds = currentRecordFilters
.filter((recordFilter) => isDefined(recordFilter.viewFilterGroupId))
.map((recordFilter) => recordFilter.id);
const { removeRecordFilter } = useRemoveRecordFilter();
const handleDropdownClickOutside = useCallback(() => {}, []);
const handleDropdownClose = () => {};
const removeAdvancedFilter = useCallback(async () => {
if (!advancedViewFilterIds) {
if (!advancedRecordFilterIds) {
throw new Error('No advanced view filters to remove');
}
@ -39,12 +45,12 @@ export const AdvancedFilterDropdownButton = () => {
await deleteCombinedViewFilterGroup(viewFilterGroupId);
}
for (const viewFilterId of advancedViewFilterIds) {
await deleteCombinedViewFilter(viewFilterId);
for (const recordFilterId of advancedRecordFilterIds) {
removeRecordFilter(recordFilterId);
}
}, [
advancedViewFilterIds,
deleteCombinedViewFilter,
advancedRecordFilterIds,
removeRecordFilter,
deleteCombinedViewFilterGroup,
currentViewWithCombinedFiltersAndSorts?.viewFilterGroups,
]);
@ -64,7 +70,7 @@ export const AdvancedFilterDropdownButton = () => {
clickableComponent={
<AdvancedFilterChip
onRemove={removeAdvancedFilter}
advancedFilterCount={advancedViewFilterIds?.length}
advancedFilterCount={advancedRecordFilterIds?.length}
/>
}
dropdownComponents={

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

@ -10,7 +10,6 @@ import { ObjectFilterOperandSelectAndInput } from '@/object-record/object-filter
import { useRemoveRecordFilter } from '@/object-record/record-filter/hooks/useRemoveRecordFilter';
import { RecordFilterOperand } from '@/object-record/record-filter/types/RecordFilterOperand';
import { EditableFilterDropdownButtonEffect } from '@/views/components/EditableFilterDropdownButtonEffect';
import { useDeleteCombinedViewFilters } from '@/views/hooks/useDeleteCombinedViewFilters';
type EditableFilterDropdownButtonProps = {
viewFilterDropdownId: string;
@ -25,19 +24,16 @@ export const EditableFilterDropdownButton = ({
}: EditableFilterDropdownButtonProps) => {
const { closeDropdown } = useDropdown(viewFilterDropdownId);
const { deleteCombinedViewFilter } = useDeleteCombinedViewFilters();
const { removeRecordFilter } = useRemoveRecordFilter();
const handleRemove = () => {
closeDropdown();
deleteCombinedViewFilter(viewFilter.id);
removeRecordFilter(viewFilter.fieldMetadataId);
};
const handleDropdownClickOutside = useCallback(() => {
const { id: fieldId, value, operand, fieldMetadataId } = viewFilter;
const { value, operand, fieldMetadataId } = viewFilter;
if (
!value &&
![
@ -49,9 +45,8 @@ export const EditableFilterDropdownButton = ({
].includes(operand)
) {
removeRecordFilter(fieldMetadataId);
deleteCombinedViewFilter(fieldId);
}
}, [viewFilter, deleteCombinedViewFilter, removeRecordFilter]);
}, [viewFilter, removeRecordFilter]);
return (
<>

8
packages/twenty-front/src/modules/views/components/EditableSortChip.tsx
View File

@ -5,24 +5,17 @@ import { useRemoveRecordSort } from '@/object-record/record-sort/hooks/useRemove
import { useUpsertRecordSort } from '@/object-record/record-sort/hooks/useUpsertRecordSort';
import { RecordSort } from '@/object-record/record-sort/types/RecordSort';
import { SortOrFilterChip } from '@/views/components/SortOrFilterChip';
import { useDeleteCombinedViewSorts } from '@/views/hooks/useDeleteCombinedViewSorts';
import { useUpsertCombinedViewSorts } from '@/views/hooks/useUpsertCombinedViewSorts';
type EditableSortChipProps = {
recordSort: RecordSort;
};
export const EditableSortChip = ({ recordSort }: EditableSortChipProps) => {
const { deleteCombinedViewSort } = useDeleteCombinedViewSorts();
const { removeRecordSort } = useRemoveRecordSort();
const { upsertCombinedViewSort } = useUpsertCombinedViewSorts();
const { upsertRecordSort } = useUpsertRecordSort();
const handleRemoveClick = () => {
deleteCombinedViewSort(recordSort.fieldMetadataId);
removeRecordSort(recordSort.fieldMetadataId);
};
@ -36,7 +29,6 @@ export const EditableSortChip = ({ recordSort }: EditableSortChipProps) => {
direction: recordSort.direction === 'asc' ? 'desc' : 'asc',
};
upsertCombinedViewSort(newSort);
upsertRecordSort(newSort);
};

17
packages/twenty-front/src/modules/views/components/QueryParamsFiltersEffect.tsx
View File

@ -1,26 +1,13 @@
import { useEffect } from 'react';
import { contextStoreCurrentViewIdComponentState } from '@/context-store/states/contextStoreCurrentViewIdComponentState';
import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2';
import { useSetRecoilComponentFamilyStateV2 } from '@/ui/utilities/state/component-state/hooks/useSetRecoilComponentFamilyStateV2';
import { useViewFromQueryParams } from '@/views/hooks/internal/useViewFromQueryParams';
import { useApplyViewFiltersToCurrentRecordFilters } from '@/views/hooks/useApplyViewFiltersToCurrentRecordFilters';
import { useResetUnsavedViewStates } from '@/views/hooks/useResetUnsavedViewStates';
import { unsavedToUpsertViewFiltersComponentFamilyState } from '@/views/states/unsavedToUpsertViewFiltersComponentFamilyState';
export const QueryParamsFiltersEffect = () => {
const { hasFiltersQueryParams, getFiltersFromQueryParams, viewIdQueryParam } =
const { hasFiltersQueryParams, getFiltersFromQueryParams } =
useViewFromQueryParams();
const currentViewId = useRecoilComponentValueV2(
contextStoreCurrentViewIdComponentState,
);
const setUnsavedViewFilter = useSetRecoilComponentFamilyStateV2(
unsavedToUpsertViewFiltersComponentFamilyState,
{ viewId: viewIdQueryParam ?? currentViewId },
);
const { resetUnsavedViewStates } = useResetUnsavedViewStates();
const { applyViewFiltersToCurrentRecordFilters } =
@ -34,7 +21,6 @@ export const QueryParamsFiltersEffect = () => {
getFiltersFromQueryParams().then((filtersFromParams) => {
if (Array.isArray(filtersFromParams)) {
applyViewFiltersToCurrentRecordFilters(filtersFromParams);
setUnsavedViewFilter(filtersFromParams);
}
});
}, [
@ -42,7 +28,6 @@ export const QueryParamsFiltersEffect = () => {
getFiltersFromQueryParams,
hasFiltersQueryParams,
resetUnsavedViewStates,
setUnsavedViewFilter,
]);
return <></>;

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

@ -4,15 +4,12 @@ import { useFieldMetadataItemById } from '@/object-metadata/hooks/useFieldMetada
import { useRemoveRecordFilter } from '@/object-record/record-filter/hooks/useRemoveRecordFilter';
import { RecordFilter } from '@/object-record/record-filter/types/RecordFilter';
import { SortOrFilterChip } from '@/views/components/SortOrFilterChip';
import { useDeleteCombinedViewFilters } from '@/views/hooks/useDeleteCombinedViewFilters';
type RecordFilterChipProps = {
recordFilter: RecordFilter;
};
export const RecordFilterChip = ({ recordFilter }: RecordFilterChipProps) => {
const { deleteCombinedViewFilter } = useDeleteCombinedViewFilters();
const { fieldMetadataItem } = useFieldMetadataItemById(
recordFilter.fieldMetadataId,
);
@ -24,7 +21,6 @@ export const RecordFilterChip = ({ recordFilter }: RecordFilterChipProps) => {
const FieldMetadataItemIcon = getIcon(fieldMetadataItem.icon);
const handleRemoveClick = () => {
deleteCombinedViewFilter(recordFilter.id);
removeRecordFilter(recordFilter.fieldMetadataId);
};

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

@ -5,7 +5,6 @@ import { RecordFilter } from '@/object-record/record-filter/types/RecordFilter';
import { isSoftDeleteFilterActiveComponentState } from '@/object-record/record-table/states/isSoftDeleteFilterActiveComponentState';
import { useSetRecoilComponentStateV2 } from '@/ui/utilities/state/component-state/hooks/useSetRecoilComponentStateV2';
import { SortOrFilterChip } from '@/views/components/SortOrFilterChip';
import { useDeleteCombinedViewFilters } from '@/views/hooks/useDeleteCombinedViewFilters';
type SoftDeleteFilterChipProps = {
recordFilter: RecordFilter;
@ -16,8 +15,6 @@ export const SoftDeleteFilterChip = ({
recordFilter,
viewBarId,
}: SoftDeleteFilterChipProps) => {
const { deleteCombinedViewFilter } = useDeleteCombinedViewFilters();
const setIsSoftDeleteFilterActive = useSetRecoilComponentStateV2(
isSoftDeleteFilterActiveComponentState,
viewBarId,
@ -28,7 +25,6 @@ export const SoftDeleteFilterChip = ({
const { getIcon } = useIcons();
const handleRemoveClick = () => {
deleteCombinedViewFilter(recordFilter.id);
removeRecordFilter(recordFilter.fieldMetadataId);
setIsSoftDeleteFilterActive(false);

3
packages/twenty-front/src/modules/views/components/ViewBar.tsx
View File

@ -10,7 +10,6 @@ import { QueryParamsFiltersEffect } from '@/views/components/QueryParamsFiltersE
import { ViewBarFilterEffect } from '@/views/components/ViewBarFilterEffect';
import { ViewBarPageTitle } from '@/views/components/ViewBarPageTitle';
import { ViewBarSkeletonLoader } from '@/views/components/ViewBarSkeletonLoader';
import { ViewBarSortEffect } from '@/views/components/ViewBarSortEffect';
import { ViewPickerDropdown } from '@/views/view-picker/components/ViewPickerDropdown';
import { ViewsHotkeyScope } from '../types/ViewsHotkeyScope';
@ -51,9 +50,7 @@ export const ViewBar = ({
<ViewBarRecordFilterEffect />
<ViewBarRecordSortEffect />
<ViewBarFilterEffect filterDropdownId={filterDropdownId} />
<ViewBarSortEffect />
<QueryParamsFiltersEffect />
<ViewBarPageTitle viewBarId={viewBarId} />
<TopBar
className={className}

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

@ -7,7 +7,7 @@ import { useSetRecoilComponentStateV2 } from '@/ui/utilities/state/component-sta
import { fieldMetadataItemUsedInDropdownComponentSelector } from '@/object-record/object-filter-dropdown/states/fieldMetadataItemUsedInDropdownComponentSelector';
import { objectFilterDropdownSelectedOptionValuesComponentState } from '@/object-record/object-filter-dropdown/states/objectFilterDropdownSelectedOptionValuesComponentState';
import { objectFilterDropdownSelectedRecordIdsComponentState } from '@/object-record/object-filter-dropdown/states/objectFilterDropdownSelectedRecordIdsComponentState';
import { useGetCurrentView } from '@/views/hooks/useGetCurrentView';
import { currentRecordFiltersComponentState } from '@/object-record/record-filter/states/currentRecordFiltersComponentState';
import { jsonRelationFilterValueSchema } from '@/views/view-filter-value/validation-schemas/jsonRelationFilterValueSchema';
import { simpleRelationFilterValueSchema } from '@/views/view-filter-value/validation-schemas/simpleRelationFilterValueSchema';
import { isDefined } from 'twenty-shared';
@ -19,8 +19,6 @@ type ViewBarFilterEffectProps = {
export const ViewBarFilterEffect = ({
filterDropdownId,
}: ViewBarFilterEffectProps) => {
const { currentViewWithCombinedFiltersAndSorts } = useGetCurrentView();
const fieldMetadataItemUsedInDropdown = useRecoilComponentValueV2(
fieldMetadataItemUsedInDropdownComponentSelector,
filterDropdownId,
@ -37,46 +35,48 @@ export const ViewBarFilterEffect = ({
filterDropdownId,
);
const currentRecordFilters = useRecoilComponentValueV2(
currentRecordFiltersComponentState,
);
useEffect(() => {
if (fieldMetadataItemUsedInDropdown?.type === 'RELATION') {
const viewFilterUsedInDropdown =
currentViewWithCombinedFiltersAndSorts?.viewFilters.find(
(filter) =>
filter.fieldMetadataId === fieldMetadataItemUsedInDropdown?.id,
);
const recordFilterUsedInDropdown = currentRecordFilters.find(
(filter) =>
filter.fieldMetadataId === fieldMetadataItemUsedInDropdown?.id,
);
const { selectedRecordIds } = jsonRelationFilterValueSchema
.catch({
isCurrentWorkspaceMemberSelected: false,
selectedRecordIds: simpleRelationFilterValueSchema.parse(
viewFilterUsedInDropdown?.value,
recordFilterUsedInDropdown?.value,
),
})
.parse(viewFilterUsedInDropdown?.value);
.parse(recordFilterUsedInDropdown?.value);
setObjectFilterDropdownSelectedRecordIds(selectedRecordIds);
} else if (
isDefined(fieldMetadataItemUsedInDropdown) &&
['SELECT', 'MULTI_SELECT'].includes(fieldMetadataItemUsedInDropdown.type)
) {
const viewFilterUsedInDropdown =
currentViewWithCombinedFiltersAndSorts?.viewFilters.find(
(filter) =>
filter.fieldMetadataId === fieldMetadataItemUsedInDropdown?.id,
);
const recordFilterUsedInDropdown = currentRecordFilters.find(
(filter) =>
filter.fieldMetadataId === fieldMetadataItemUsedInDropdown?.id,
);
const viewFilterSelectedRecords = isNonEmptyString(
viewFilterUsedInDropdown?.value,
const recordFilterSelectedRecords = isNonEmptyString(
recordFilterUsedInDropdown?.value,
)
? JSON.parse(viewFilterUsedInDropdown.value)
? JSON.parse(recordFilterUsedInDropdown.value)
: [];
setObjectFilterDropdownSelectedOptionValues(viewFilterSelectedRecords);
setObjectFilterDropdownSelectedOptionValues(recordFilterSelectedRecords);
}
}, [
fieldMetadataItemUsedInDropdown,
setObjectFilterDropdownSelectedRecordIds,
setObjectFilterDropdownSelectedOptionValues,
currentViewWithCombinedFiltersAndSorts,
currentRecordFilters,
]);
return <></>;

29
packages/twenty-front/src/modules/views/components/ViewBarSortEffect.tsx
View File

@ -1,29 +0,0 @@
import { useEffect } from 'react';
import { onSortSelectComponentState } from '@/object-record/object-sort-dropdown/states/onSortSelectScopedState';
import { useUpsertRecordSort } from '@/object-record/record-sort/hooks/useUpsertRecordSort';
import { RecordSort } from '@/object-record/record-sort/types/RecordSort';
import { useSetRecoilComponentStateV2 } from '@/ui/utilities/state/component-state/hooks/useSetRecoilComponentStateV2';
import { useUpsertCombinedViewSorts } from '@/views/hooks/useUpsertCombinedViewSorts';
import { isDefined } from 'twenty-shared';
export const ViewBarSortEffect = () => {
const { upsertCombinedViewSort } = useUpsertCombinedViewSorts();
const { upsertRecordSort } = useUpsertRecordSort();
const setOnSortSelect = useSetRecoilComponentStateV2(
onSortSelectComponentState,
);
useEffect(() => {
setOnSortSelect(() => (sort: RecordSort | null) => {
if (isDefined(sort)) {
upsertCombinedViewSort(sort);
upsertRecordSort(sort);
}
});
}, [setOnSortSelect, upsertCombinedViewSort, upsertRecordSort]);
return <></>;
};

39
packages/twenty-front/src/modules/views/hooks/useCreateViewFromCurrentView.ts
View File

@ -2,23 +2,26 @@ import { contextStoreCurrentViewIdComponentState } from '@/context-store/states/
import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
import { useCreateOneRecord } from '@/object-record/hooks/useCreateOneRecord';
import { useLazyFindManyRecords } from '@/object-record/hooks/useLazyFindManyRecords';
import { currentRecordFiltersComponentState } from '@/object-record/record-filter/states/currentRecordFiltersComponentState';
import { useRecordIndexContextOrThrow } from '@/object-record/record-index/contexts/RecordIndexContext';
import { currentRecordSortsComponentState } from '@/object-record/record-sort/states/currentRecordSortsComponentState';
import { prefetchViewFromViewIdFamilySelector } from '@/prefetch/states/selector/prefetchViewFromViewIdFamilySelector';
import { getSnapshotValue } from '@/ui/utilities/recoil-scope/utils/getSnapshotValue';
import { useRecoilComponentCallbackStateV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentCallbackStateV2';
import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2';
import { usePersistViewFieldRecords } from '@/views/hooks/internal/usePersistViewFieldRecords';
import { usePersistViewFilterGroupRecords } from '@/views/hooks/internal/usePersistViewFilterGroupRecords';
import { usePersistViewFilterRecords } from '@/views/hooks/internal/usePersistViewFilterRecords';
import { usePersistViewGroupRecords } from '@/views/hooks/internal/usePersistViewGroupRecords';
import { usePersistViewSortRecords } from '@/views/hooks/internal/usePersistViewSortRecords';
import { useGetViewFilterGroupsCombined } from '@/views/hooks/useGetCombinedViewFilterGroups';
import { useGetViewFiltersCombined } from '@/views/hooks/useGetCombinedViewFilters';
import { useGetViewSortsCombined } from '@/views/hooks/useGetCombinedViewSorts';
import { isPersistingViewFieldsState } from '@/views/states/isPersistingViewFieldsState';
import { GraphQLView } from '@/views/types/GraphQLView';
import { View } from '@/views/types/View';
import { ViewGroup } from '@/views/types/ViewGroup';
import { ViewType } from '@/views/types/ViewType';
import { mapRecordFilterToViewFilter } from '@/views/utils/mapRecordFilterToViewFilter';
import { mapRecordSortToViewSort } from '@/views/utils/mapRecordSortToViewSort';
import { useRecoilCallback } from 'recoil';
import { isDefined } from 'twenty-shared';
import { v4 } from 'uuid';
@ -36,9 +39,6 @@ export const useCreateViewFromCurrentView = (viewBarComponentId?: string) => {
const { createViewFieldRecords } = usePersistViewFieldRecords();
const { getViewSortsCombined } = useGetViewSortsCombined(viewBarComponentId);
const { getViewFiltersCombined } =
useGetViewFiltersCombined(viewBarComponentId);
const { getViewFilterGroupsCombined } =
useGetViewFilterGroupsCombined(viewBarComponentId);
@ -57,6 +57,14 @@ export const useCreateViewFromCurrentView = (viewBarComponentId?: string) => {
fetchPolicy: 'network-only',
});
const currentRecordSorts = useRecoilComponentValueV2(
currentRecordSortsComponentState,
);
const currentRecordFilters = useRecoilComponentValueV2(
currentRecordFiltersComponentState,
);
const createViewFromCurrentView = useRecoilCallback(
({ snapshot, set }) =>
async (
@ -160,13 +168,16 @@ export const useCreateViewFromCurrentView = (viewBarComponentId?: string) => {
const sourceViewCombinedFilterGroups = getViewFilterGroupsCombined(
sourceView.id,
);
const sourceViewCombinedFilters = getViewFiltersCombined(
sourceView.id,
);
const sourceViewCombinedSorts = getViewSortsCombined(sourceView.id);
await createViewSortRecords(sourceViewCombinedSorts, newView);
await createViewFilterRecords(sourceViewCombinedFilters, newView);
const viewSortsToCreate = currentRecordSorts.map(
mapRecordSortToViewSort,
);
const viewFiltersToCreate = currentRecordFilters.map(
mapRecordFilterToViewFilter,
);
await createViewSortRecords(viewSortsToCreate, newView);
await createViewFilterRecords(viewFiltersToCreate, newView);
await createViewFilterGroupRecords(
sourceViewCombinedFilterGroups,
newView,
@ -182,13 +193,13 @@ export const useCreateViewFromCurrentView = (viewBarComponentId?: string) => {
createViewFieldRecords,
findManyRecords,
objectMetadataItem.fields,
createViewGroupRecords,
getViewFilterGroupsCombined,
getViewFiltersCombined,
getViewSortsCombined,
createViewGroupRecords,
createViewSortRecords,
createViewFilterRecords,
createViewFilterGroupRecords,
currentRecordFilters,
currentRecordSorts,
],
);

101
packages/twenty-front/src/modules/views/hooks/useDeleteCombinedViewFilters.ts
View File

@ -1,101 +0,0 @@
import { useRecoilCallback } from 'recoil';
import { contextStoreCurrentViewIdComponentState } from '@/context-store/states/contextStoreCurrentViewIdComponentState';
import { getSnapshotValue } from '@/ui/utilities/recoil-scope/utils/getSnapshotValue';
import { useRecoilComponentCallbackStateV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentCallbackStateV2';
import { useGetViewFromPrefetchState } from '@/views/hooks/useGetViewFromPrefetchState';
import { unsavedToDeleteViewFilterIdsComponentFamilyState } from '@/views/states/unsavedToDeleteViewFilterIdsComponentFamilyState';
import { unsavedToUpsertViewFiltersComponentFamilyState } from '@/views/states/unsavedToUpsertViewFiltersComponentFamilyState';
import { isDefined } from 'twenty-shared';
export const useDeleteCombinedViewFilters = (viewBarComponentId?: string) => {
const unsavedToUpsertViewFiltersCallbackState =
useRecoilComponentCallbackStateV2(
unsavedToUpsertViewFiltersComponentFamilyState,
viewBarComponentId,
);
const unsavedToDeleteViewFilterIdsCallbackState =
useRecoilComponentCallbackStateV2(
unsavedToDeleteViewFilterIdsComponentFamilyState,
viewBarComponentId,
);
const currentViewIdCallbackState = useRecoilComponentCallbackStateV2(
contextStoreCurrentViewIdComponentState,
viewBarComponentId,
);
const { getViewFromPrefetchState } = useGetViewFromPrefetchState();
const deleteCombinedViewFilter = useRecoilCallback(
({ snapshot, set }) =>
async (fieldId: string) => {
const currentViewId = getSnapshotValue(
snapshot,
currentViewIdCallbackState,
);
const unsavedToUpsertViewFilters = getSnapshotValue(
snapshot,
unsavedToUpsertViewFiltersCallbackState({ viewId: currentViewId }),
);
const unsavedToDeleteViewFilterIds = getSnapshotValue(
snapshot,
unsavedToDeleteViewFilterIdsCallbackState({ viewId: currentViewId }),
);
if (!currentViewId) {
return;
}
const currentView = await getViewFromPrefetchState(currentViewId);
if (!currentView) {
return;
}
const matchingFilterInCurrentView = currentView.viewFilters.find(
(viewFilter) => viewFilter.id === fieldId,
);
const matchingFilterInUnsavedFilters = unsavedToUpsertViewFilters.find(
(viewFilter) => viewFilter.id === fieldId,
);
if (isDefined(matchingFilterInUnsavedFilters)) {
set(
unsavedToUpsertViewFiltersCallbackState({ viewId: currentViewId }),
unsavedToUpsertViewFilters.filter(
(viewFilter) => viewFilter.id !== fieldId,
),
);
}
if (isDefined(matchingFilterInCurrentView)) {
set(
unsavedToDeleteViewFilterIdsCallbackState({
viewId: currentViewId,
}),
[
...new Set([
...unsavedToDeleteViewFilterIds,
matchingFilterInCurrentView.id,
]),
],
);
}
},
[
currentViewIdCallbackState,
getViewFromPrefetchState,
unsavedToDeleteViewFilterIdsCallbackState,
unsavedToUpsertViewFiltersCallbackState,
],
);
return {
deleteCombinedViewFilter,
};
};

99
packages/twenty-front/src/modules/views/hooks/useDeleteCombinedViewSorts.ts
View File

@ -1,99 +0,0 @@
import { useRecoilCallback } from 'recoil';
import { contextStoreCurrentViewIdComponentState } from '@/context-store/states/contextStoreCurrentViewIdComponentState';
import { getSnapshotValue } from '@/ui/utilities/recoil-scope/utils/getSnapshotValue';
import { useRecoilComponentCallbackStateV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentCallbackStateV2';
import { useGetViewFromPrefetchState } from '@/views/hooks/useGetViewFromPrefetchState';
import { unsavedToDeleteViewSortIdsComponentFamilyState } from '@/views/states/unsavedToDeleteViewSortIdsComponentFamilyState';
import { unsavedToUpsertViewSortsComponentFamilyState } from '@/views/states/unsavedToUpsertViewSortsComponentFamilyState';
import { isDefined } from 'twenty-shared';
export const useDeleteCombinedViewSorts = (viewBarComponentId?: string) => {
const currentViewIdCallbackState = useRecoilComponentCallbackStateV2(
contextStoreCurrentViewIdComponentState,
);
const unsavedToUpsertViewSortsCallbackState =
useRecoilComponentCallbackStateV2(
unsavedToUpsertViewSortsComponentFamilyState,
viewBarComponentId,
);
const unsavedToDeleteViewSortIdsCallbackState =
useRecoilComponentCallbackStateV2(
unsavedToDeleteViewSortIdsComponentFamilyState,
viewBarComponentId,
);
const { getViewFromPrefetchState } = useGetViewFromPrefetchState();
const deleteCombinedViewSort = useRecoilCallback(
({ snapshot, set }) =>
async (fieldMetadataId: string) => {
const currentViewId = getSnapshotValue(
snapshot,
currentViewIdCallbackState,
);
if (!currentViewId) {
return;
}
const unsavedToUpsertViewSorts = getSnapshotValue(
snapshot,
unsavedToUpsertViewSortsCallbackState({ viewId: currentViewId }),
);
const unsavedToDeleteViewSortIds = getSnapshotValue(
snapshot,
unsavedToDeleteViewSortIdsCallbackState({ viewId: currentViewId }),
);
const currentView = await getViewFromPrefetchState(currentViewId);
if (!currentView) {
return;
}
const matchingSortInCurrentView = currentView.viewSorts.find(
(viewSort) => viewSort.fieldMetadataId === fieldMetadataId,
);
const matchingSortInUnsavedSorts = unsavedToUpsertViewSorts.find(
(viewSort) => viewSort.fieldMetadataId === fieldMetadataId,
);
if (isDefined(matchingSortInUnsavedSorts)) {
set(
unsavedToUpsertViewSortsCallbackState({ viewId: currentViewId }),
unsavedToUpsertViewSorts.filter(
(viewSort) => viewSort.fieldMetadataId !== fieldMetadataId,
),
);
return;
}
if (isDefined(matchingSortInCurrentView)) {
set(
unsavedToDeleteViewSortIdsCallbackState({ viewId: currentViewId }),
[
...new Set([
...unsavedToDeleteViewSortIds,
matchingSortInCurrentView.id,
]),
],
);
}
},
[
currentViewIdCallbackState,
getViewFromPrefetchState,
unsavedToDeleteViewSortIdsCallbackState,
unsavedToUpsertViewSortsCallbackState,
],
);
return {
deleteCombinedViewSort,
};
};

68
packages/twenty-front/src/modules/views/hooks/useGetCombinedViewFilters.ts
View File

@ -1,68 +0,0 @@
import { useRecoilCallback } from 'recoil';
import { prefetchViewFromViewIdFamilySelector } from '@/prefetch/states/selector/prefetchViewFromViewIdFamilySelector';
import { getSnapshotValue } from '@/ui/utilities/recoil-scope/utils/getSnapshotValue';
import { useRecoilComponentCallbackStateV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentCallbackStateV2';
import { unsavedToDeleteViewFilterIdsComponentFamilyState } from '@/views/states/unsavedToDeleteViewFilterIdsComponentFamilyState';
import { unsavedToUpsertViewFiltersComponentFamilyState } from '@/views/states/unsavedToUpsertViewFiltersComponentFamilyState';
import { getCombinedViewFilters } from '@/views/utils/getCombinedViewFilters';
import { isDefined } from 'twenty-shared';
export const useGetViewFiltersCombined = (viewBarComponentId?: string) => {
const unsavedToUpsertViewFiltersCallbackState =
useRecoilComponentCallbackStateV2(
unsavedToUpsertViewFiltersComponentFamilyState,
viewBarComponentId,
);
const unsavedToDeleteViewFilterIdsCallbackState =
useRecoilComponentCallbackStateV2(
unsavedToDeleteViewFilterIdsComponentFamilyState,
viewBarComponentId,
);
const getViewFiltersCombined = useRecoilCallback(
({ snapshot }) =>
(viewId: string) => {
const view = snapshot
.getLoadable(
prefetchViewFromViewIdFamilySelector({
viewId,
}),
)
.getValue();
if (!isDefined(view)) {
throw new Error(
`Cannot get view with id ${viewId}, because it cannot be found in client cache data.`,
);
}
const unsavedToUpsertViewFilters = getSnapshotValue(
snapshot,
unsavedToUpsertViewFiltersCallbackState({ viewId: view.id }),
);
const unsavedToDeleteViewFilterIds = getSnapshotValue(
snapshot,
unsavedToDeleteViewFilterIdsCallbackState({ viewId: view.id }),
);
const combinedViewFilters = getCombinedViewFilters(
view.viewFilters,
unsavedToUpsertViewFilters,
unsavedToDeleteViewFilterIds,
);
return combinedViewFilters;
},
[
unsavedToDeleteViewFilterIdsCallbackState,
unsavedToUpsertViewFiltersCallbackState,
],
);
return {
getViewFiltersCombined,
};
};

69
packages/twenty-front/src/modules/views/hooks/useGetCombinedViewSorts.ts
View File

@ -1,69 +0,0 @@
import { useRecoilCallback } from 'recoil';
import { prefetchViewFromViewIdFamilySelector } from '@/prefetch/states/selector/prefetchViewFromViewIdFamilySelector';
import { getSnapshotValue } from '@/ui/utilities/recoil-scope/utils/getSnapshotValue';
import { useRecoilComponentCallbackStateV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentCallbackStateV2';
import { unsavedToDeleteViewSortIdsComponentFamilyState } from '@/views/states/unsavedToDeleteViewSortIdsComponentFamilyState';
import { unsavedToUpsertViewSortsComponentFamilyState } from '@/views/states/unsavedToUpsertViewSortsComponentFamilyState';
import { getCombinedViewSorts } from '@/views/utils/getCombinedViewSorts';
import { isDefined } from 'twenty-shared';
// TODO: fix naming
export const useGetViewSortsCombined = (viewBarComponentId?: string) => {
const unsavedToUpsertViewSortsCallbackState =
useRecoilComponentCallbackStateV2(
unsavedToUpsertViewSortsComponentFamilyState,
viewBarComponentId,
);
const unsavedToDeleteViewSortIdsCallbackState =
useRecoilComponentCallbackStateV2(
unsavedToDeleteViewSortIdsComponentFamilyState,
viewBarComponentId,
);
const getViewSortsCombined = useRecoilCallback(
({ snapshot }) =>
(viewId: string) => {
const view = snapshot
.getLoadable(
prefetchViewFromViewIdFamilySelector({
viewId,
}),
)
.getValue();
if (!isDefined(view)) {
throw new Error(
`Cannot get view with id ${viewId}, because it cannot be found in client cache data.`,
);
}
const unsavedToUpsertViewSorts = getSnapshotValue(
snapshot,
unsavedToUpsertViewSortsCallbackState({ viewId: view.id }),
);
const unsavedToDeleteViewSortIds = getSnapshotValue(
snapshot,
unsavedToDeleteViewSortIdsCallbackState({ viewId: view.id }),
);
const combinedViewSorts = getCombinedViewSorts(
view.viewSorts,
unsavedToUpsertViewSorts,
unsavedToDeleteViewSortIds,
);
return combinedViewSorts;
},
[
unsavedToDeleteViewSortIdsCallbackState,
unsavedToUpsertViewSortsCallbackState,
],
);
return {
getViewSortsCombined,
};
};

41
packages/twenty-front/src/modules/views/hooks/useGetCurrentView.ts
View File

@ -12,14 +12,8 @@ import { useSetRecoilComponentStateV2 } from '@/ui/utilities/state/component-sta
import { ViewComponentInstanceContext } from '@/views/states/contexts/ViewComponentInstanceContext';
import { isCurrentViewKeyIndexComponentState } from '@/views/states/isCurrentViewIndexComponentState';
import { unsavedToDeleteViewFilterGroupIdsComponentFamilyState } from '@/views/states/unsavedToDeleteViewFilterGroupIdsComponentFamilyState';
import { unsavedToDeleteViewFilterIdsComponentFamilyState } from '@/views/states/unsavedToDeleteViewFilterIdsComponentFamilyState';
import { unsavedToDeleteViewSortIdsComponentFamilyState } from '@/views/states/unsavedToDeleteViewSortIdsComponentFamilyState';
import { unsavedToUpsertViewFilterGroupsComponentFamilyState } from '@/views/states/unsavedToUpsertViewFilterGroupsComponentFamilyState';
import { unsavedToUpsertViewFiltersComponentFamilyState } from '@/views/states/unsavedToUpsertViewFiltersComponentFamilyState';
import { unsavedToUpsertViewSortsComponentFamilyState } from '@/views/states/unsavedToUpsertViewSortsComponentFamilyState';
import { getCombinedViewFilterGroups } from '@/views/utils/getCombinedViewFilterGroups';
import { getCombinedViewFilters } from '@/views/utils/getCombinedViewFilters';
import { getCombinedViewSorts } from '@/views/utils/getCombinedViewSorts';
import { useRecoilValue } from 'recoil';
import { isDefined } from 'twenty-shared';
@ -71,42 +65,18 @@ export const useGetCurrentView = (viewBarInstanceId?: string) => {
}),
);
const unsavedToUpsertViewFilters = useRecoilComponentFamilyValueV2(
unsavedToUpsertViewFiltersComponentFamilyState,
{ viewId },
instanceId,
);
const unsavedToUpsertViewFilterGroups = useRecoilComponentFamilyValueV2(
unsavedToUpsertViewFilterGroupsComponentFamilyState,
{ viewId },
instanceId,
);
const unsavedToUpsertViewSorts = useRecoilComponentFamilyValueV2(
unsavedToUpsertViewSortsComponentFamilyState,
{ viewId },
instanceId,
);
const unsavedToDeleteViewFilterIds = useRecoilComponentFamilyValueV2(
unsavedToDeleteViewFilterIdsComponentFamilyState,
{ viewId },
instanceId,
);
const unsavedToDeleteViewFilterGroupIds = useRecoilComponentFamilyValueV2(
unsavedToDeleteViewFilterGroupIdsComponentFamilyState,
{ viewId },
instanceId,
);
const unsavedToDeleteViewSortIds = useRecoilComponentFamilyValueV2(
unsavedToDeleteViewSortIdsComponentFamilyState,
{ viewId },
instanceId,
);
if (!isDefined(currentView)) {
return {
instanceId,
@ -118,26 +88,15 @@ export const useGetCurrentView = (viewBarInstanceId?: string) => {
const currentViewWithCombinedFiltersAndSorts = {
...currentView,
viewFilters: getCombinedViewFilters(
currentView.viewFilters,
unsavedToUpsertViewFilters,
unsavedToDeleteViewFilterIds,
),
viewFilterGroups: getCombinedViewFilterGroups(
currentView.viewFilterGroups ?? [],
unsavedToUpsertViewFilterGroups,
unsavedToDeleteViewFilterGroupIds,
),
viewSorts: getCombinedViewSorts(
currentView.viewSorts,
unsavedToUpsertViewSorts,
unsavedToDeleteViewSortIds,
),
};
return {
instanceId,
currentViewWithSavedFiltersAndSorts: currentView,
currentViewWithCombinedFiltersAndSorts,
viewsOnCurrentObject: viewsOnCurrentObject ?? [],
currentViewId,

36
packages/twenty-front/src/modules/views/hooks/useResetUnsavedViewStates.ts
View File

@ -1,43 +1,15 @@
import { useRecoilComponentCallbackStateV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentCallbackStateV2';
import { unsavedToDeleteViewFilterGroupIdsComponentFamilyState } from '@/views/states/unsavedToDeleteViewFilterGroupIdsComponentFamilyState';
import { unsavedToDeleteViewFilterIdsComponentFamilyState } from '@/views/states/unsavedToDeleteViewFilterIdsComponentFamilyState';
import { unsavedToDeleteViewSortIdsComponentFamilyState } from '@/views/states/unsavedToDeleteViewSortIdsComponentFamilyState';
import { unsavedToUpsertViewFilterGroupsComponentFamilyState } from '@/views/states/unsavedToUpsertViewFilterGroupsComponentFamilyState';
import { unsavedToUpsertViewFiltersComponentFamilyState } from '@/views/states/unsavedToUpsertViewFiltersComponentFamilyState';
import { unsavedToUpsertViewSortsComponentFamilyState } from '@/views/states/unsavedToUpsertViewSortsComponentFamilyState';
import { useRecoilCallback } from 'recoil';
export const useResetUnsavedViewStates = (viewBarInstanceId?: string) => {
const setUnsavedToDeleteViewFilterIdsCallbackState =
useRecoilComponentCallbackStateV2(
unsavedToDeleteViewFilterIdsComponentFamilyState,
viewBarInstanceId,
);
const setUnsavedToDeleteViewSortIdsCallbackState =
useRecoilComponentCallbackStateV2(
unsavedToDeleteViewSortIdsComponentFamilyState,
viewBarInstanceId,
);
const unsavedToDeleteViewFilterGroupIdsCallbackState =
useRecoilComponentCallbackStateV2(
unsavedToDeleteViewFilterGroupIdsComponentFamilyState,
viewBarInstanceId,
);
const setUnsavedToUpsertViewFiltersCallbackState =
useRecoilComponentCallbackStateV2(
unsavedToUpsertViewFiltersComponentFamilyState,
viewBarInstanceId,
);
const unsavedToUpsertViewSortsCallbackState =
useRecoilComponentCallbackStateV2(
unsavedToUpsertViewSortsComponentFamilyState,
viewBarInstanceId,
);
const unsavedToUpsertViewFilterGroupsCallbackState =
useRecoilComponentCallbackStateV2(
unsavedToUpsertViewFilterGroupsComponentFamilyState,
@ -48,18 +20,10 @@ export const useResetUnsavedViewStates = (viewBarInstanceId?: string) => {
({ set }) =>
(viewId: string) => {
set(unsavedToDeleteViewFilterGroupIdsCallbackState({ viewId }), []);
set(setUnsavedToDeleteViewFilterIdsCallbackState({ viewId }), []);
set(setUnsavedToDeleteViewSortIdsCallbackState({ viewId }), []);
set(unsavedToUpsertViewFilterGroupsCallbackState({ viewId }), []);
set(setUnsavedToUpsertViewFiltersCallbackState({ viewId }), []);
set(unsavedToUpsertViewSortsCallbackState({ viewId }), []);
},
[
unsavedToUpsertViewSortsCallbackState,
setUnsavedToUpsertViewFiltersCallbackState,
unsavedToUpsertViewFilterGroupsCallbackState,
setUnsavedToDeleteViewSortIdsCallbackState,
setUnsavedToDeleteViewFilterIdsCallbackState,
unsavedToDeleteViewFilterGroupIdsCallbackState,
],
);

132
packages/twenty-front/src/modules/views/hooks/useUpsertCombinedViewFilters.ts
View File

@ -1,132 +0,0 @@
import { useRecoilCallback } from 'recoil';
import { contextStoreCurrentViewIdComponentState } from '@/context-store/states/contextStoreCurrentViewIdComponentState';
import { RecordFilter } from '@/object-record/record-filter/types/RecordFilter';
import { getSnapshotValue } from '@/ui/utilities/recoil-scope/utils/getSnapshotValue';
import { useRecoilComponentCallbackStateV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentCallbackStateV2';
import { useGetViewFromPrefetchState } from '@/views/hooks/useGetViewFromPrefetchState';
import { unsavedToDeleteViewFilterIdsComponentFamilyState } from '@/views/states/unsavedToDeleteViewFilterIdsComponentFamilyState';
import { unsavedToUpsertViewFiltersComponentFamilyState } from '@/views/states/unsavedToUpsertViewFiltersComponentFamilyState';
import { ViewFilter } from '@/views/types/ViewFilter';
import { shouldReplaceFilter } from '@/views/utils/shouldReplaceFilter';
import { isDefined } from 'twenty-shared';
export const useUpsertCombinedViewFilters = (viewBarComponentId?: string) => {
const unsavedToUpsertViewFiltersCallbackState =
useRecoilComponentCallbackStateV2(
unsavedToUpsertViewFiltersComponentFamilyState,
viewBarComponentId,
);
const unsavedToDeleteViewFilterIdsCallbackState =
useRecoilComponentCallbackStateV2(
unsavedToDeleteViewFilterIdsComponentFamilyState,
viewBarComponentId,
);
const currentViewIdCallbackState = useRecoilComponentCallbackStateV2(
contextStoreCurrentViewIdComponentState,
viewBarComponentId,
);
const { getViewFromPrefetchState } = useGetViewFromPrefetchState();
const upsertCombinedViewFilter = useRecoilCallback(
({ snapshot, set }) =>
async (upsertedFilter: RecordFilter) => {
const currentViewId = getSnapshotValue(
snapshot,
currentViewIdCallbackState,
);
const unsavedToUpsertViewFilters = getSnapshotValue(
snapshot,
unsavedToUpsertViewFiltersCallbackState({ viewId: currentViewId }),
);
const unsavedToDeleteViewFilterIds = getSnapshotValue(
snapshot,
unsavedToDeleteViewFilterIdsCallbackState({ viewId: currentViewId }),
);
if (!currentViewId) {
return;
}
const currentView = await getViewFromPrefetchState(currentViewId);
if (!currentView) {
return;
}
const matchingFilterInCurrentView = currentView.viewFilters.find(
(viewFilter) => shouldReplaceFilter(viewFilter, upsertedFilter),
);
const matchingFilterInUnsavedFilters = unsavedToUpsertViewFilters.find(
(viewFilter) => shouldReplaceFilter(viewFilter, upsertedFilter),
);
if (isDefined(matchingFilterInUnsavedFilters)) {
const updatedFilters = unsavedToUpsertViewFilters.map((viewFilter) =>
shouldReplaceFilter(viewFilter, matchingFilterInUnsavedFilters)
? { ...viewFilter, ...upsertedFilter, id: viewFilter.id }
: viewFilter,
);
set(
unsavedToUpsertViewFiltersCallbackState({ viewId: currentViewId }),
updatedFilters,
);
return;
}
if (isDefined(matchingFilterInCurrentView)) {
set(
unsavedToUpsertViewFiltersCallbackState({ viewId: currentViewId }),
[
...unsavedToUpsertViewFilters,
{
...matchingFilterInCurrentView,
...upsertedFilter,
id: matchingFilterInCurrentView.id,
},
],
);
set(
unsavedToDeleteViewFilterIdsCallbackState({
viewId: currentViewId,
}),
unsavedToDeleteViewFilterIds.filter(
(id) => id !== matchingFilterInCurrentView.id,
),
);
return;
}
const newValue = [
...unsavedToUpsertViewFilters,
{
...upsertedFilter,
id: upsertedFilter.id,
__typename: 'ViewFilter',
} satisfies ViewFilter,
] satisfies ViewFilter[];
set(
unsavedToUpsertViewFiltersCallbackState({ viewId: currentViewId }),
newValue,
);
},
[
currentViewIdCallbackState,
getViewFromPrefetchState,
unsavedToDeleteViewFilterIdsCallbackState,
unsavedToUpsertViewFiltersCallbackState,
],
);
return {
upsertCombinedViewFilter,
};
};

120
packages/twenty-front/src/modules/views/hooks/useUpsertCombinedViewSorts.ts
View File

@ -1,120 +0,0 @@
import { useRecoilCallback } from 'recoil';
import { contextStoreCurrentViewIdComponentState } from '@/context-store/states/contextStoreCurrentViewIdComponentState';
import { RecordSort } from '@/object-record/record-sort/types/RecordSort';
import { getSnapshotValue } from '@/ui/utilities/recoil-scope/utils/getSnapshotValue';
import { useRecoilComponentCallbackStateV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentCallbackStateV2';
import { useGetViewFromPrefetchState } from '@/views/hooks/useGetViewFromPrefetchState';
import { unsavedToDeleteViewSortIdsComponentFamilyState } from '@/views/states/unsavedToDeleteViewSortIdsComponentFamilyState';
import { unsavedToUpsertViewSortsComponentFamilyState } from '@/views/states/unsavedToUpsertViewSortsComponentFamilyState';
import { ViewSort } from '@/views/types/ViewSort';
import { isDefined } from 'twenty-shared';
export const useUpsertCombinedViewSorts = (viewBarComponentId?: string) => {
const currentViewIdCallbackState = useRecoilComponentCallbackStateV2(
contextStoreCurrentViewIdComponentState,
);
const unsavedToUpsertViewSortsCallbackState =
useRecoilComponentCallbackStateV2(
unsavedToUpsertViewSortsComponentFamilyState,
viewBarComponentId,
);
const unsavedToDeleteViewSortIdsCallbackState =
useRecoilComponentCallbackStateV2(
unsavedToDeleteViewSortIdsComponentFamilyState,
viewBarComponentId,
);
const { getViewFromPrefetchState } = useGetViewFromPrefetchState();
const upsertCombinedViewSort = useRecoilCallback(
({ snapshot, set }) =>
async (upsertedSort: RecordSort) => {
const currentViewId = getSnapshotValue(
snapshot,
currentViewIdCallbackState,
);
const unsavedToUpsertViewSorts = getSnapshotValue(
snapshot,
unsavedToUpsertViewSortsCallbackState({ viewId: currentViewId }),
);
const unsavedToDeleteViewSortIds = getSnapshotValue(
snapshot,
unsavedToDeleteViewSortIdsCallbackState({ viewId: currentViewId }),
);
if (!currentViewId) {
return;
}
const currentView = await getViewFromPrefetchState(currentViewId);
if (!currentView) {
return;
}
const matchingSortInCurrentView = currentView.viewSorts.find(
(viewSort) =>
viewSort.fieldMetadataId === upsertedSort.fieldMetadataId,
);
const matchingSortInUnsavedSorts = unsavedToUpsertViewSorts.find(
(viewSort) =>
viewSort.fieldMetadataId === upsertedSort.fieldMetadataId,
);
if (isDefined(matchingSortInUnsavedSorts)) {
const updatedSorts = unsavedToUpsertViewSorts.map((viewSort) =>
viewSort.id === matchingSortInUnsavedSorts.id
? { ...viewSort, ...upsertedSort }
: viewSort,
);
set(
unsavedToUpsertViewSortsCallbackState({ viewId: currentViewId }),
updatedSorts,
);
return;
}
if (isDefined(matchingSortInCurrentView)) {
set(
unsavedToUpsertViewSortsCallbackState({ viewId: currentViewId }),
[
...unsavedToUpsertViewSorts,
{ ...matchingSortInCurrentView, ...upsertedSort },
],
);
set(
unsavedToDeleteViewSortIdsCallbackState({ viewId: currentViewId }),
unsavedToDeleteViewSortIds.filter(
(id) => id !== matchingSortInCurrentView.id,
),
);
return;
}
set(unsavedToUpsertViewSortsCallbackState({ viewId: currentViewId }), [
...unsavedToUpsertViewSorts,
{
...upsertedSort,
__typename: 'ViewSort',
} satisfies ViewSort,
]);
},
[
currentViewIdCallbackState,
getViewFromPrefetchState,
unsavedToDeleteViewSortIdsCallbackState,
unsavedToUpsertViewSortsCallbackState,
],
);
return {
upsertCombinedViewSort,
};
};

28
packages/twenty-front/src/modules/views/states/selectors/areViewSortsDifferentFromRecordSortsFamilySelector.ts
View File

@ -1,28 +0,0 @@
import { createComponentFamilySelectorV2 } from '@/ui/utilities/state/component-state/utils/createComponentFamilySelectorV2';
import { ViewComponentInstanceContext } from '@/views/states/contexts/ViewComponentInstanceContext';
import { unsavedToDeleteViewSortIdsComponentFamilyState } from '@/views/states/unsavedToDeleteViewSortIdsComponentFamilyState';
import { unsavedToUpsertViewSortsComponentFamilyState } from '@/views/states/unsavedToUpsertViewSortsComponentFamilyState';
export const areViewSortsDifferentFromRecordSortsSelector =
createComponentFamilySelectorV2<boolean, { viewId?: string }>({
key: 'areViewSortsDifferentFromRecordSortsSelector',
get:
({ familyKey, instanceId }) =>
({ get }) => {
return (
get(
unsavedToUpsertViewSortsComponentFamilyState.atomFamily({
familyKey,
instanceId,
}),
).length > 0 ||
get(
unsavedToDeleteViewSortIdsComponentFamilyState.atomFamily({
familyKey,
instanceId,
}),
).length > 0
);
},
componentInstanceContext: ViewComponentInstanceContext,
});

9
packages/twenty-front/src/modules/views/states/unsavedToDeleteViewFilterIdsComponentFamilyState.ts
View File

@ -1,9 +0,0 @@
import { createComponentFamilyStateV2 } from '@/ui/utilities/state/component-state/utils/createComponentFamilyStateV2';
import { ViewComponentInstanceContext } from '@/views/states/contexts/ViewComponentInstanceContext';
export const unsavedToDeleteViewFilterIdsComponentFamilyState =
createComponentFamilyStateV2<string[], { viewId?: string }>({
key: 'unsavedToDeleteViewFilterIdsComponentFamilyState',
defaultValue: [],
componentInstanceContext: ViewComponentInstanceContext,
});

9
packages/twenty-front/src/modules/views/states/unsavedToDeleteViewSortIdsComponentFamilyState.ts
View File

@ -1,9 +0,0 @@
import { createComponentFamilyStateV2 } from '@/ui/utilities/state/component-state/utils/createComponentFamilyStateV2';
import { ViewComponentInstanceContext } from '@/views/states/contexts/ViewComponentInstanceContext';
export const unsavedToDeleteViewSortIdsComponentFamilyState =
createComponentFamilyStateV2<string[], { viewId?: string }>({
key: 'unsavedToDeleteViewSortIdsComponentFamilyState',
defaultValue: [],
componentInstanceContext: ViewComponentInstanceContext,
});

10
packages/twenty-front/src/modules/views/states/unsavedToUpsertViewFiltersComponentFamilyState.ts
View File

@ -1,10 +0,0 @@
import { createComponentFamilyStateV2 } from '@/ui/utilities/state/component-state/utils/createComponentFamilyStateV2';
import { ViewComponentInstanceContext } from '@/views/states/contexts/ViewComponentInstanceContext';
import { ViewFilter } from '@/views/types/ViewFilter';
export const unsavedToUpsertViewFiltersComponentFamilyState =
createComponentFamilyStateV2<ViewFilter[], { viewId?: string }>({
key: 'unsavedToUpsertViewFiltersComponentFamilyState',
defaultValue: [],
componentInstanceContext: ViewComponentInstanceContext,
});

10
packages/twenty-front/src/modules/views/states/unsavedToUpsertViewSortsComponentFamilyState.ts
View File

@ -1,10 +0,0 @@
import { createComponentFamilyStateV2 } from '@/ui/utilities/state/component-state/utils/createComponentFamilyStateV2';
import { ViewComponentInstanceContext } from '@/views/states/contexts/ViewComponentInstanceContext';
import { ViewSort } from '../types/ViewSort';
export const unsavedToUpsertViewSortsComponentFamilyState =
createComponentFamilyStateV2<ViewSort[], { viewId?: string }>({
key: 'unsavedToUpsertViewSortsComponentFamilyState',
defaultValue: [],
componentInstanceContext: ViewComponentInstanceContext,
});

112
packages/twenty-front/src/modules/views/utils/__tests__/getCombinedViewFilters.test.ts
View File

@ -1,112 +0,0 @@
// Generate test for getCombinedViewFilters
import { ViewFilter } from '@/views/types/ViewFilter';
import { ViewFilterOperand } from '@/views/types/ViewFilterOperand';
import { getCombinedViewFilters } from '../getCombinedViewFilters';
describe('getCombinedViewFilters', () => {
it('should return expected combined view filters when additional filters are present', () => {
const viewFilters: ViewFilter[] = [
{
__typename: 'ViewFilter',
id: 'id',
fieldMetadataId: '05731f68-6e7a-4903-8374-c0b6a9063482',
value: 'testValue',
displayValue: 'Test Display Value',
operand: ViewFilterOperand.Is,
},
];
const toUpsertViewFilters: ViewFilter[] = [
{
__typename: 'ViewFilter',
id: 'id',
fieldMetadataId: '05731f68-6e7a-4903-8374-c0b6a9063482',
value: 'testValue',
displayValue: 'Test Display Value',
operand: ViewFilterOperand.Is,
},
];
const toDeleteViewFilterIds: string[] = [];
expect(
getCombinedViewFilters(
viewFilters,
toUpsertViewFilters,
toDeleteViewFilterIds,
),
).toEqual([
{
__typename: 'ViewFilter',
id: 'id',
fieldMetadataId: '05731f68-6e7a-4903-8374-c0b6a9063482',
value: 'testValue',
displayValue: 'Test Display Value',
operand: ViewFilterOperand.Is,
},
]);
});
it('should return expected combined view filters when additional filters are not present', () => {
const viewFilters: ViewFilter[] = [
{
__typename: 'ViewFilter',
id: 'id',
fieldMetadataId: '05731f68-6e7a-4903-8374-c0b6a9063482',
value: 'testValue',
displayValue: 'Test Display Value',
operand: ViewFilterOperand.Is,
},
];
const toUpsertViewFilters: ViewFilter[] = [];
const toDeleteViewFilterIds: string[] = [];
expect(
getCombinedViewFilters(
viewFilters,
toUpsertViewFilters,
toDeleteViewFilterIds,
),
).toEqual([
{
__typename: 'ViewFilter',
id: 'id',
fieldMetadataId: '05731f68-6e7a-4903-8374-c0b6a9063482',
value: 'testValue',
displayValue: 'Test Display Value',
operand: ViewFilterOperand.Is,
},
]);
});
it('should return expected combined view filters when additional filters are present and some filters are to be deleted', () => {
const viewFilters: ViewFilter[] = [
{
__typename: 'ViewFilter',
id: 'id',
fieldMetadataId: '05731f68-6e7a-4903-8374-c0b6a9063482',
value: 'testValue',
displayValue: 'Test Display Value',
operand: ViewFilterOperand.Is,
},
];
const toUpsertViewFilters: ViewFilter[] = [
{
__typename: 'ViewFilter',
id: 'id',
fieldMetadataId: '05731f68-6e7a-4903-8374-c0b6a9063482',
value: 'testValue',
displayValue: 'Test Display Value',
operand: ViewFilterOperand.Is,
},
];
const toDeleteViewFilterIds: string[] = ['id'];
expect(
getCombinedViewFilters(
viewFilters,
toUpsertViewFilters,
toDeleteViewFilterIds,
),
).toEqual([]);
});
});

33
packages/twenty-front/src/modules/views/utils/getCombinedViewFilters.ts
View File

@ -1,33 +0,0 @@
import { ViewFilter } from '@/views/types/ViewFilter';
export const getCombinedViewFilters = (
viewFilters: ViewFilter[],
toUpsertViewFilters: ViewFilter[],
toDeleteViewFilterIds: string[],
): ViewFilter[] => {
const toCreateViewFilters = toUpsertViewFilters.filter(
(toUpsertViewFilter) =>
!viewFilters.some(
(viewFilter) => viewFilter.id === toUpsertViewFilter.id,
),
);
const toUpdateViewFilters = toUpsertViewFilters.filter((toUpsertViewFilter) =>
viewFilters.some((viewFilter) => viewFilter.id === toUpsertViewFilter.id),
);
const combinedViewFilters = viewFilters
.filter((viewFilter) => !toDeleteViewFilterIds.includes(viewFilter.id))
.map((viewFilter) => {
const toUpdateViewFilter = toUpdateViewFilters.find(
(toUpdateViewFilter) => toUpdateViewFilter.id === viewFilter.id,
);
return toUpdateViewFilter ?? viewFilter;
})
.concat(toCreateViewFilters);
return Object.values(
combinedViewFilters.reduce((acc, obj) => ({ ...acc, [obj.id]: obj }), {}),
);
};

34
packages/twenty-front/src/modules/views/utils/getCombinedViewSorts.ts
View File

@ -1,34 +0,0 @@
import { ViewSort } from '@/views/types/ViewSort';
export const getCombinedViewSorts = (
viewSort: ViewSort[],
toUpsertViewSorts: ViewSort[],
toDeleteViewSortIds: string[],
): ViewSort[] => {
const toCreateViewSorts = toUpsertViewSorts.filter(
(toUpsertViewSort) =>
!viewSort.some((viewSort) => viewSort.id === toUpsertViewSort.id),
);
const toUpdateViewSorts = toUpsertViewSorts.filter((toUpsertViewSort) =>
viewSort.some((viewSort) => viewSort.id === toUpsertViewSort.id),
);
const combinedViewSorts = viewSort
.filter((viewSort) => !toDeleteViewSortIds.includes(viewSort.id))
.map((viewSort) => {
const toUpdateViewSort = toUpdateViewSorts.find(
(toUpdateViewSort) => toUpdateViewSort.id === viewSort.id,
);
return toUpdateViewSort ?? viewSort;
})
.concat(toCreateViewSorts);
return Object.values(
combinedViewSorts.reduce(
(acc, obj) => ({ ...acc, [obj.fieldMetadataId]: obj }),
{},
),
);
};