48 lines
1.2 KiB
TypeScript
48 lines
1.2 KiB
TypeScript
|
/**
|
||
|
|
* ConfirmDeleteModal — generic二次确认 (confirm-before-delete) dialog.
|
||
|
|
* Used by both poo and location delete flows (M2-T10, reused by T09).
|
||
|
|
*/
|
||
|
|
|
||
|
|
import { Modal, Stack, Text, Button, Group } from '@mantine/core'
|
||
|
|
|
||
|
|
export interface ConfirmDeleteModalProps {
|
||
|
|
/** Message shown to the user, e.g. "Delete this poo record?" */
|
||
|
|
message: string
|
||
|
|
/** Whether the delete action is in flight. */
|
||
|
|
loading?: boolean
|
||
|
|
onConfirm: () => void
|
||
|
|
onCancel: () => void
|
||
|
|
}
|
||
|
|
|
||
|
|
export function ConfirmDeleteModal({
|
||
|
|
message,
|
||
|
|
loading = false,
|
||
|
|
onConfirm,
|
||
|
|
onCancel,
|
||
|
|
}: ConfirmDeleteModalProps) {
|
||
|
|
return (
|
||
|
|
<Modal opened onClose={onCancel} title="Confirm Delete" size="sm" data-testid="confirm-delete-modal">
|
||
|
|
<Stack gap="md">
|
||
|
|
<Text data-testid="confirm-delete-message">{message}</Text>
|
||
|
|
<Group justify="flex-end" gap="sm">
|
||
|
|
<Button
|
||
|
|
variant="default"
|
||
|
|
onClick={onCancel}
|
||
|
|
data-testid="confirm-delete-cancel"
|
||
|
|
>
|
||
|
|
Cancel
|
||
|
|
</Button>
|
||
|
|
<Button
|
||
|
|
color="red"
|
||
|
|
loading={loading}
|
||
|
|
onClick={onConfirm}
|
||
|
|
data-testid="confirm-delete-confirm"
|
||
|
|
>
|
||
|
|
Delete
|
||
|
|
</Button>
|
||
|
|
</Group>
|
||
|
|
</Stack>
|
||
|
|
</Modal>
|
||
|
|
)
|
||
|
|
}
|