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

Remove Add New button when softDelete filter is present (#14385)

Browse Source 
Closes https://github.com/twentyhq/twenty/issues/13854

In this PR
- When evaluating whether there was a soft delete filter enabled, we
were only taking into account the filter that shows all deleted records,
that can be enabled from the side panel ("See deleted records"). Now we
are also taking into account any filter on deletedAt.
- We lacked some places where we should not offer to add a new record if
a soft delete filter is on, ex on the empty page + in the kanban headers
- I decided not to add a constraint on api-side because I think there
could be use cases when importing data where we would want to be able to
create soft deleted records
This commit is contained in:
Marie
2025-09-10 18:01:57 +02:00
committed by GitHub
parent 4239fe93b9
commit 6895902ddf
16 changed files with 227 additions and 100 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnHeader.tsx
+20 -12
View File
@@ -7,10 +7,12 @@ import { RecordBoardColumnDropdownMenu } from '@/object-record/record-board/reco
import { RecordBoardColumnHeaderAggregateDropdown } from '@/object-record/record-board/record-board-column/components/RecordBoardColumnHeaderAggregateDropdown';
import { RecordBoardColumnContext } from '@/object-record/record-board/record-board-column/contexts/RecordBoardColumnContext';
import { useAggregateRecordsForRecordBoardColumn } from '@/object-record/record-board/record-board-column/hooks/useAggregateRecordsForRecordBoardColumn';
import { hasAnySoftDeleteFilterOnViewComponentSelector } from '@/object-record/record-filter/states/hasAnySoftDeleteFilterOnView';
import { RecordGroupDefinitionType } from '@/object-record/record-group/types/RecordGroupDefinition';
import { useCreateNewIndexRecord } from '@/object-record/record-table/hooks/useCreateNewIndexRecord';
import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown';
import { useToggleDropdown } from '@/ui/layout/dropdown/hooks/useToggleDropdown';
import { useRecoilComponentValue } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValue';
import { Tag } from 'twenty-ui/components';
import { IconDotsVertical, IconPlus } from 'twenty-ui/display';
import { LightIconButton } from 'twenty-ui/input';
@@ -80,6 +82,10 @@ export const RecordBoardColumnHeader = () => {
const hasObjectUpdatePermissions = objectPermissions.canUpdateObjectRecords;
const hasAnySoftDeleteFilterOnView = useRecoilComponentValue(
hasAnySoftDeleteFilterOnViewComponentSelector,
);
const { createNewIndexRecord } = useCreateNewIndexRecord({
objectMetadataItem: objectMetadataItem,
});
@@ -145,18 +151,20 @@ export const RecordBoardColumnHeader = () => {
});
}}
/>
{hasObjectUpdatePermissions && (
<LightIconButton
accent="tertiary"
Icon={IconPlus}
onClick={() => {
createNewIndexRecord({
position: 'first',
[selectFieldMetadataItem.name]: columnDefinition.value,
});
}}
/>
)}
{hasObjectUpdatePermissions &&
!hasAnySoftDeleteFilterOnView && (
<LightIconButton
accent="tertiary"
Icon={IconPlus}
onClick={() => {
createNewIndexRecord({
position: 'first',
[selectFieldMetadataItem.name]:
columnDefinition.value,
});
}}
/>
)}
</StyledHeaderActions>
)}
</StyledRightContainer>
packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnNewRecordButton.tsx
+10
View File
@@ -1,7 +1,9 @@
import { useObjectPermissionsForObject } from '@/object-record/hooks/useObjectPermissionsForObject';
import { RecordBoardContext } from '@/object-record/record-board/contexts/RecordBoardContext';
import { RecordBoardColumnContext } from '@/object-record/record-board/record-board-column/contexts/RecordBoardColumnContext';
import { hasAnySoftDeleteFilterOnViewComponentSelector } from '@/object-record/record-filter/states/hasAnySoftDeleteFilterOnView';
import { useCreateNewIndexRecord } from '@/object-record/record-table/hooks/useCreateNewIndexRecord';
import { useRecoilComponentValue } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValue';
import { useTheme } from '@emotion/react';
import styled from '@emotion/styled';
import { useContext } from 'react';
@@ -32,6 +34,10 @@ export const RecordBoardColumnNewRecordButton = () => {
const { columnDefinition } = useContext(RecordBoardColumnContext);
const hasAnySoftDeleteFilterOnView = useRecoilComponentValue(
hasAnySoftDeleteFilterOnViewComponentSelector,
);
const objectPermissions = useObjectPermissionsForObject(
objectMetadataItem.id,
);
@@ -46,6 +52,10 @@ export const RecordBoardColumnNewRecordButton = () => {
return null;
}
if (hasAnySoftDeleteFilterOnView) {
return null;
}
return (
<StyledNewButton
onClick={() => {
packages/twenty-front/src/modules/object-record/record-filter/hooks/useCheckIsSoftDeleteFilter.ts
+17 -23
View File
@@ -2,39 +2,33 @@ import { useObjectMetadataItems } from '@/object-metadata/hooks/useObjectMetadat
import { SOFT_DELETE_FILTER_FIELD_NAME } from '@/object-record/record-filter/constants/SoftDeleteFilterFieldName';
import { type RecordFilter } from '@/object-record/record-filter/types/RecordFilter';
import { RecordFilterOperand } from '@/object-record/record-filter/types/RecordFilterOperand';
import { isSoftDeleteFilterActiveComponentState } from '@/object-record/record-table/states/isSoftDeleteFilterActiveComponentState';
import { useRecoilComponentValue } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValue';
import { isDefined } from 'twenty-shared/utils';
import { getRecordFilterFieldMetadataItem } from '@/object-record/record-filter/utils/getRecordFilterFieldMetadataItem';
import { isRecordFilterAboutSoftDelete as isRecordFilterAboutSoftDeleteUtil } from '@/object-record/record-filter/utils/isRecordFilterAboutSoftDelete';
export const useCheckIsSoftDeleteFilter = () => {
const { objectMetadataItems } = useObjectMetadataItems();
const isSoftDeleteFilterActive = useRecoilComponentValue(
isSoftDeleteFilterActiveComponentState,
);
const isRecordFilterAboutSoftDelete = (recordFilter: RecordFilter) => {
return isRecordFilterAboutSoftDeleteUtil({
recordFilter,
objectMetadataItems,
});
};
const checkIsSoftDeleteFilter = (recordFilter: RecordFilter) => {
const allFieldMetadataItems = objectMetadataItems.flatMap(
(objectMetadataItem) => objectMetadataItem.fields,
);
const isSeeDeletedRecordsFilter = (recordFilter: RecordFilter) => {
const foundFieldMetadataItem = getRecordFilterFieldMetadataItem({
recordFilter,
objectMetadataItems,
});
const foundFieldMetadataItem = allFieldMetadataItems.find(
(fieldMetadataItem) =>
fieldMetadataItem.id === recordFilter.fieldMetadataId,
);
if (!isDefined(foundFieldMetadataItem)) {
throw new Error(
`Field metadata item not found for field metadata id: ${recordFilter.fieldMetadataId}`,
);
}
const isNotEmptyFilter =
recordFilter.operand === RecordFilterOperand.IsNotEmpty;
return (
foundFieldMetadataItem.name === SOFT_DELETE_FILTER_FIELD_NAME &&
isSoftDeleteFilterActive &&
recordFilter.operand === RecordFilterOperand.IsNotEmpty
isNotEmptyFilter
);
};
return { checkIsSoftDeleteFilter };
return { isRecordFilterAboutSoftDelete, isSeeDeletedRecordsFilter };
};
packages/twenty-front/src/modules/object-record/record-filter/states/hasAnySoftDeleteFilterOnView.ts
+29
View File
@@ -0,0 +1,29 @@
import { objectMetadataItemsState } from '@/object-metadata/states/objectMetadataItemsState';
import { RecordFiltersComponentInstanceContext } from '@/object-record/record-filter/states/context/RecordFiltersComponentInstanceContext';
import { currentRecordFiltersComponentState } from '@/object-record/record-filter/states/currentRecordFiltersComponentState';
import { isRecordFilterAboutSoftDelete } from '@/object-record/record-filter/utils/isRecordFilterAboutSoftDelete';
import { createComponentSelector } from '@/ui/utilities/state/component-state/utils/createComponentSelector';
export const hasAnySoftDeleteFilterOnViewComponentSelector =
createComponentSelector<boolean>({
key: 'hasAnySoftDeleteFilterOnViewComponentSelector',
componentInstanceContext: RecordFiltersComponentInstanceContext,
get:
({ instanceId }) =>
({ get }) => {
const objectMetadataItems = get(objectMetadataItemsState);
const currentRecordFilters = get(
currentRecordFiltersComponentState.atomFamily({ instanceId }),
);
const hasAnySoftDeleteFilterOnView = currentRecordFilters.some(
(recordFilter) => {
return isRecordFilterAboutSoftDelete({
recordFilter,
objectMetadataItems,
});
},
);
return hasAnySoftDeleteFilterOnView;
},
});
packages/twenty-front/src/modules/object-record/record-filter/utils/getRecordFilterFieldMetadataItem.ts
+28
View File
@@ -0,0 +1,28 @@
import { type ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem';
import { type RecordFilter } from '@/object-record/record-filter/types/RecordFilter';
import { isDefined } from 'twenty-shared/utils';
export const getRecordFilterFieldMetadataItem = ({
recordFilter,
objectMetadataItems,
}: {
recordFilter: RecordFilter;
objectMetadataItems: ObjectMetadataItem[];
}) => {
const allFieldMetadataItems = objectMetadataItems.flatMap(
(objectMetadataItem) => objectMetadataItem.fields,
);
const foundFieldMetadataItem = allFieldMetadataItems.find(
(fieldMetadataItem) =>
fieldMetadataItem.id === recordFilter.fieldMetadataId,
);
if (!isDefined(foundFieldMetadataItem)) {
throw new Error(
`Field metadata item not found for field metadata id: ${recordFilter.fieldMetadataId}`,
);
}
return foundFieldMetadataItem;
};
packages/twenty-front/src/modules/object-record/record-filter/utils/isRecordFilterAboutSoftDelete.ts
+29
View File
@@ -0,0 +1,29 @@
import { type ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem';
import { SOFT_DELETE_FILTER_FIELD_NAME } from '@/object-record/record-filter/constants/SoftDeleteFilterFieldName';
import { type RecordFilter } from '@/object-record/record-filter/types/RecordFilter';
import { RecordFilterOperand } from '@/object-record/record-filter/types/RecordFilterOperand';
import { getRecordFilterFieldMetadataItem } from '@/object-record/record-filter/utils/getRecordFilterFieldMetadataItem';
import isEmpty from 'lodash.isempty';
export const isRecordFilterAboutSoftDelete = ({
recordFilter,
objectMetadataItems,
}: {
recordFilter: RecordFilter;
objectMetadataItems: ObjectMetadataItem[];
}) => {
const foundFieldMetadataItem = getRecordFilterFieldMetadataItem({
recordFilter,
objectMetadataItems,
});
const valueIsNotEmptyFilter =
(recordFilter.operand === RecordFilterOperand.Is &&
!isEmpty(recordFilter.value)) ||
recordFilter.operand === RecordFilterOperand.IsNotEmpty;
return (
foundFieldMetadataItem.name === SOFT_DELETE_FILTER_FIELD_NAME &&
valueIsNotEmptyFilter
);
};
packages/twenty-front/src/modules/object-record/record-table/components/RecordTableAddNew.tsx
+9
View File
@@ -1,4 +1,5 @@
import { useObjectPermissionsForObject } from '@/object-record/hooks/useObjectPermissionsForObject';
import { hasAnySoftDeleteFilterOnViewComponentSelector } from '@/object-record/record-filter/states/hasAnySoftDeleteFilterOnView';
import { useRecordTableContextOrThrow } from '@/object-record/record-table/contexts/RecordTableContext';
import { useCreateNewIndexRecord } from '@/object-record/record-table/hooks/useCreateNewIndexRecord';
import { RecordTableActionRow } from '@/object-record/record-table/record-table-row/components/RecordTableActionRow';
@@ -24,6 +25,14 @@ export const RecordTableAddNew = () => {
const hasObjectUpdatePermissions = objectPermissions.canUpdateObjectRecords;
const hasAnySoftDeleteFilterOnView = useRecoilComponentValue(
hasAnySoftDeleteFilterOnViewComponentSelector,
);
if (hasAnySoftDeleteFilterOnView) {
return null;
}
if (!hasObjectUpdatePermissions || !hasRecordTableFetchedAllRecords) {
return null;
}
packages/twenty-front/src/modules/object-record/record-table/empty-state/components/RecordTableEmptyStateDisplay.tsx
+17 -9
View File
@@ -1,6 +1,8 @@
import { useObjectPermissionsForObject } from '@/object-record/hooks/useObjectPermissionsForObject';
import { isObjectMetadataReadOnly } from '@/object-record/read-only/utils/isObjectMetadataReadOnly';
import { hasAnySoftDeleteFilterOnViewComponentSelector } from '@/object-record/record-filter/states/hasAnySoftDeleteFilterOnView';
import { useRecordTableContextOrThrow } from '@/object-record/record-table/contexts/RecordTableContext';
import { useRecoilComponentValue } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValue';
import { type IconComponent } from 'twenty-ui/display';
import { Button } from 'twenty-ui/input';
import {
@@ -44,6 +46,10 @@ export const RecordTableEmptyStateDisplay = (
objectMetadataItem,
});
const hasAnySoftDeleteFilterOnView = useRecoilComponentValue(
hasAnySoftDeleteFilterOnViewComponentSelector,
);
return (
<AnimatedPlaceholderEmptyContainer>
<AnimatedPlaceholder type={props.animatedPlaceholderType} />
@@ -56,15 +62,17 @@ export const RecordTableEmptyStateDisplay = (
</AnimatedPlaceholderEmptySubTitle>
</AnimatedPlaceholderEmptyTextContainer>
{'buttonComponent' in props && props.buttonComponent}
{'buttonTitle' in props && !isReadOnly && (
<Button
Icon={props.ButtonIcon}
title={props.buttonTitle}
variant="secondary"
onClick={props.onClick}
disabled={props.buttonIsDisabled}
/>
)}
{'buttonTitle' in props &&
!isReadOnly &&
!hasAnySoftDeleteFilterOnView && (
<Button
Icon={props.ButtonIcon}
title={props.buttonTitle}
variant="secondary"
onClick={props.onClick}
disabled={props.buttonIsDisabled}
/>
)}
</AnimatedPlaceholderEmptyContainer>
);
};
packages/twenty-front/src/modules/object-record/record-table/empty-state/components/RecordTableEmptyStateSoftDelete.tsx
+4 -2
View File
@@ -28,10 +28,12 @@ export const RecordTableEmptyStateSoftDelete = () => {
const { removeRecordFilter } = useRemoveRecordFilter();
const { checkIsSoftDeleteFilter } = useCheckIsSoftDeleteFilter();
const { isRecordFilterAboutSoftDelete } = useCheckIsSoftDeleteFilter();
const handleButtonClick = async () => {
const deletedFilter = currentRecordFilters.find(checkIsSoftDeleteFilter);
const deletedFilter = currentRecordFilters.find(
isRecordFilterAboutSoftDelete,
);
if (!isDefined(deletedFilter)) {
throw new Error('Deleted filter not found');
packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeaderLabelIdentifierCell.tsx
+7 -1
View File
@@ -3,6 +3,7 @@ import { useState } from 'react';
import { isObjectMetadataReadOnly } from '@/object-record/read-only/utils/isObjectMetadataReadOnly';
import { hasAnySoftDeleteFilterOnViewComponentSelector } from '@/object-record/record-filter/states/hasAnySoftDeleteFilterOnView';
import { useRecordIndexContextOrThrow } from '@/object-record/record-index/contexts/RecordIndexContext';
import { useRecordTableContextOrThrow } from '@/object-record/record-table/contexts/RecordTableContext';
import { useCreateNewIndexRecord } from '@/object-record/record-table/hooks/useCreateNewIndexRecord';
@@ -124,6 +125,10 @@ export const RecordTableHeaderLabelIdentifierCell = () => {
resizedFieldMetadataIdComponentState,
);
const hasAnySoftDeleteFilterOnView = useRecoilComponentValue(
hasAnySoftDeleteFilterOnViewComponentSelector,
);
if (!recordField) {
return <></>;
}
@@ -171,7 +176,8 @@ export const RecordTableHeaderLabelIdentifierCell = () => {
/>
{(isMobile || iconIsVisible) &&
!isReadOnly &&
hasObjectUpdatePermissions && (
hasObjectUpdatePermissions &&
!hasAnySoftDeleteFilterOnView && (
<StyledHeaderIcon>
<LightIconButton
Icon={IconPlus}