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

hide delete button for selection over 100 - issue #6023 (#6030)

Browse Source 
hide the "Delete" Button when more than 100 records are Selected

---------

Co-authored-by: Weiko <corentin@twenty.com>
This commit is contained in:
ADITHYA THEJAS S
2024-06-27 14:51:45 +05:30
committed by GitHub
parent 97822533db
commit dcb709feee
1 changed files with 35 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

60
packages/twenty-front/src/modules/object-record/record-action-bar/hooks/useRecordActionBar.tsx
View File

@ -1,6 +1,6 @@
import { useCallback, useMemo, useState } from 'react'; import { useCallback, useMemo, useState } from 'react';
import { isNonEmptyString } from '@sniptt/guards'; import { isNonEmptyString } from '@sniptt/guards';
import { useRecoilCallback, useSetRecoilState } from 'recoil'; import { useRecoilCallback, useRecoilValue, useSetRecoilState } from 'recoil';
import { import {
IconClick, IconClick,
IconFileExport, IconFileExport,
@ -11,6 +11,7 @@ import {
IconTrash, IconTrash,
} from 'twenty-ui'; } from 'twenty-ui';
import { apiConfigState } from '@/client-config/states/apiConfigState';
import { useFavorites } from '@/favorites/hooks/useFavorites'; import { useFavorites } from '@/favorites/hooks/useFavorites';
import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem'; import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem';
import { useDeleteManyRecords } from '@/object-record/hooks/useDeleteManyRecords'; import { useDeleteManyRecords } from '@/object-record/hooks/useDeleteManyRecords';
@ -53,6 +54,9 @@ export const useRecordActionBar = ({
objectNameSingular: objectMetadataItem.nameSingular, objectNameSingular: objectMetadataItem.nameSingular,
}); });
const apiConfig = useRecoilValue(apiConfigState);
const maxRecords = apiConfig?.mutationMaximumAffectedRecords;
const handleFavoriteButtonClick = useRecoilCallback( const handleFavoriteButtonClick = useRecoilCallback(
({ snapshot }) => ({ snapshot }) =>
() => { () => {
@ -138,35 +142,41 @@ export const useRecordActionBar = ({
); );
const deletionActions: ContextMenuEntry[] = useMemo( const deletionActions: ContextMenuEntry[] = useMemo(
() => [ () =>
{ maxRecords !== undefined && selectedRecordIds.length <= maxRecords
label: 'Delete', ? [
Icon: IconTrash, {
accent: 'danger', label: 'Delete',
onClick: () => setIsDeleteRecordsModalOpen(true), Icon: IconTrash,
ConfirmationModal: ( accent: 'danger',
<ConfirmationModal onClick: () => setIsDeleteRecordsModalOpen(true),
isOpen={isDeleteRecordsModalOpen} ConfirmationModal: (
setIsOpen={setIsDeleteRecordsModalOpen} <ConfirmationModal
title={`Delete ${selectedRecordIds.length} ${ isOpen={isDeleteRecordsModalOpen}
selectedRecordIds.length === 1 ? `record` : 'records' setIsOpen={setIsDeleteRecordsModalOpen}
}`} title={`Delete ${selectedRecordIds.length} ${
subtitle={`This action cannot be undone. This will permanently delete ${ selectedRecordIds.length === 1 ? `record` : 'records'
selectedRecordIds.length === 1 ? 'this record' : 'these records' }`}
}`} subtitle={`This action cannot be undone. This will permanently delete ${
onConfirmClick={() => handleDeleteClick()} selectedRecordIds.length === 1
deleteButtonText={`Delete ${ ? 'this record'
selectedRecordIds.length > 1 ? 'Records' : 'Record' : 'these records'
}`} }`}
/> onConfirmClick={() => handleDeleteClick()}
), deleteButtonText={`Delete ${
}, selectedRecordIds.length > 1 ? 'Records' : 'Record'
], }`}
/>
),
},
]
: [],
[ [
handleDeleteClick, handleDeleteClick,
selectedRecordIds, selectedRecordIds,
isDeleteRecordsModalOpen, isDeleteRecordsModalOpen,
setIsDeleteRecordsModalOpen, setIsDeleteRecordsModalOpen,
maxRecords,
], ],
); );