79 lines
2.9 KiB
TypeScript
79 lines
2.9 KiB
TypeScript
import { t } from "@/config/i18n";
|
|
import { useGetDeleteDependencies } from "@/services/api";
|
|
import { Button, Group, List, Modal, Text, type ModalBaseProps } from "@mantine/core";
|
|
import { IconCancel, IconCheck } from "@tabler/icons-react";
|
|
import { Link } from "react-router";
|
|
|
|
export type DeleteModalProps = ModalBaseProps & {
|
|
handleSubmit: (id: number) => void;
|
|
entityType: string;
|
|
entity?: { name: string; id: number } | undefined;
|
|
};
|
|
|
|
export function DeleteModal({
|
|
opened,
|
|
onClose,
|
|
handleSubmit,
|
|
entityType,
|
|
entity,
|
|
}: DeleteModalProps) {
|
|
if (!entity) {
|
|
return null;
|
|
}
|
|
const { data: deleteDependencies } = useGetDeleteDependencies(entityType, entity.id);
|
|
|
|
return (
|
|
<Modal
|
|
opened={opened}
|
|
onClose={onClose}
|
|
title={t("delete entity", { capfirst: true, entity: t(entityType) })}
|
|
>
|
|
<Text>{`${t("are you sure you want to delete", { capfirst: true })} : "${entity.name}"`}</Text>
|
|
{deleteDependencies && deleteDependencies.length > 0 ? (
|
|
<Text>{`${t("this will also delete", { capfirst: true })} :`}</Text>
|
|
) : null}
|
|
{
|
|
<List>
|
|
{deleteDependencies?.map((dependency) => (
|
|
<List.Item key={dependency.id}>
|
|
{dependency.type === "contract" ? (
|
|
`${t(dependency.type, { capfirst: true })} - ${dependency.name}`
|
|
) : (
|
|
<Link
|
|
to={`/dashboard/${dependency.type}s/${dependency.id}/edit`}
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
>
|
|
{`${t(dependency.type, { capfirst: true })} - ${dependency.name}`}
|
|
</Link>
|
|
)}
|
|
</List.Item>
|
|
))}
|
|
</List>
|
|
}
|
|
<Group mt="sm" justify="space-between">
|
|
<Button
|
|
variant="filled"
|
|
color="red"
|
|
aria-label={t("cancel", { capfirst: true })}
|
|
leftSection={<IconCancel />}
|
|
onClick={onClose}
|
|
>
|
|
{t("cancel", { capfirst: true })}
|
|
</Button>
|
|
<Button
|
|
variant="filled"
|
|
aria-label={t("delete entity", { capfirst: true, entity: t(entityType) })}
|
|
leftSection={<IconCheck />}
|
|
onClick={() => {
|
|
handleSubmit(entity.id);
|
|
onClose();
|
|
}}
|
|
>
|
|
{t("delete", { capfirst: true })}
|
|
</Button>
|
|
</Group>
|
|
</Modal>
|
|
);
|
|
}
|