import React, { useState } from "react"; import { useRouter } from "next/router"; import { mutate } from "swr"; // headless ui import { Dialog, Transition } from "@headlessui/react"; // services import modulesService from "services/modules.service"; // hooks import useToast from "hooks/use-toast"; // ui import { SecondaryButton, DangerButton } from "components/ui"; // icons import { ExclamationTriangleIcon } from "@heroicons/react/24/outline"; // types import type { IModule } from "types"; // fetch-keys import { MODULE_LIST } from "constants/fetch-keys"; type Props = { isOpen: boolean; setIsOpen: React.Dispatch>; data?: IModule; }; export const DeleteModuleModal: React.FC = ({ isOpen, setIsOpen, data }) => { const [isDeleteLoading, setIsDeleteLoading] = useState(false); const router = useRouter(); const { workspaceSlug, projectId, moduleId } = router.query; const { setToastAlert } = useToast(); const handleClose = () => { setIsOpen(false); setIsDeleteLoading(false); }; const handleDeletion = async () => { setIsDeleteLoading(true); if (!workspaceSlug || !projectId || !data) return; mutate( MODULE_LIST(projectId as string), (prevData) => prevData?.filter((m) => m.id !== data.id), false ); await modulesService .deleteModule(workspaceSlug as string, projectId as string, data.id) .then(() => { if (moduleId) router.push(`/${workspaceSlug}/projects/${data.project}/modules`); handleClose(); }) .catch(() => { setToastAlert({ type: "error", title: "Error!", message: "Module could not be deleted. Please try again.", }); setIsDeleteLoading(false); }); }; return (
Delete Module

Are you sure you want to delete module-{" "} {data?.name} ? All of the data related to the module will be permanently removed. This action cannot be undone.

Cancel {isDeleteLoading ? "Deleting..." : "Delete"}
); };