db5dfb3bdf
* Add checkbox * Add state management for selected opportunities * Use recoil for selected items state, show action bar * Deduplicate code * Add delete action * Enable delete * Add color for selected cards * update board state on delete * Add stories * Enable empty board * Fix story * Handle dark mdoe * Nits * Rename module * Better naming * Fix naming confusion process<>progress
50 lines
1.4 KiB
TypeScript
50 lines
1.4 KiB
TypeScript
import { getOperationName } from '@apollo/client/utilities';
|
|
import { useRecoilState } from 'recoil';
|
|
|
|
import { EntityTableActionBarButton } from '@/ui/components/table/action-bar/EntityTableActionBarButton';
|
|
import { IconTrash } from '@/ui/icons/index';
|
|
import { useDeleteManyPipelineProgressMutation } from '~/generated/graphql';
|
|
|
|
import { GET_PIPELINES } from '../queries';
|
|
import { boardItemsState } from '../states/boardItemsState';
|
|
import { selectedBoardItemsState } from '../states/selectedBoardItemsState';
|
|
|
|
export function BoardActionBarButtonDeletePipelineProgress() {
|
|
const [selectedBoardItems, setSelectedBoardItems] = useRecoilState(
|
|
selectedBoardItemsState,
|
|
);
|
|
const [boardItems, setBoardItems] = useRecoilState(boardItemsState);
|
|
|
|
const [deletePipelineProgress] = useDeleteManyPipelineProgressMutation({
|
|
refetchQueries: [getOperationName(GET_PIPELINES) ?? ''],
|
|
});
|
|
|
|
async function handleDeleteClick() {
|
|
await deletePipelineProgress({
|
|
variables: {
|
|
ids: selectedBoardItems,
|
|
},
|
|
});
|
|
|
|
console.log('boardItems', boardItems);
|
|
|
|
setBoardItems(
|
|
Object.fromEntries(
|
|
Object.entries(boardItems).filter(
|
|
([key]) => !selectedBoardItems.includes(key),
|
|
),
|
|
),
|
|
);
|
|
setSelectedBoardItems([]);
|
|
}
|
|
|
|
return (
|
|
<EntityTableActionBarButton
|
|
label="Delete"
|
|
icon={<IconTrash size={16} />}
|
|
type="warning"
|
|
onClick={handleDeleteClick}
|
|
/>
|
|
);
|
|
}
|