File "delete-selected-items-action.tsx"
Full Path: /home/markqprx/iniasli.pro/client/datatable/page/delete-selected-items-action.tsx
File size: 1.39 KB
MIME-type: text/plain
Charset: utf-8
import {Button} from '../../ui/buttons/button';
import {Trans} from '../../i18n/trans';
import {ConfirmationDialog} from '../../ui/overlays/dialog/confirmation-dialog';
import {DialogTrigger} from '../../ui/overlays/dialog/dialog-trigger';
import React from 'react';
import {useDeleteSelectedRows} from '../requests/delete-selected-rows';
import {useDataTable} from './data-table-context';
import {useDialogContext} from '@common/ui/overlays/dialog/dialog-context';
export function DeleteSelectedItemsAction() {
return (
<DialogTrigger type="modal">
<Button variant="flat" color="danger" className="ml-auto">
<Trans message="Delete" />
</Button>
<DeleteItemsDialog />
</DialogTrigger>
);
}
function DeleteItemsDialog() {
const deleteSelectedRows = useDeleteSelectedRows();
const {selectedRows} = useDataTable();
const {close} = useDialogContext();
return (
<ConfirmationDialog
isLoading={deleteSelectedRows.isPending}
title={
<Trans
message="Delete [one 1 item|other :count items]?"
values={{count: selectedRows.length}}
/>
}
body={
<Trans message="This will permanently remove the items and cannot be undone." />
}
confirm={<Trans message="Delete" />}
isDanger
onConfirm={() => {
deleteSelectedRows.mutate(undefined, {onSuccess: () => close()});
}}
/>
);
}