import React, { useState } from "react"; import { useRouter } from "next/router"; import { mutate } from "swr"; // headless ui import { Dialog, Transition } from "@headlessui/react"; // services import { IntegrationService } from "services/integrations/integration.service"; // hooks import useToast from "hooks/use-toast"; // ui import { Button, Input } from "@plane/ui"; // icons import { AlertTriangle } from "lucide-react"; // types import { IUser, IImporterService } from "@plane/types"; // fetch-keys import { IMPORTER_SERVICES_LIST } from "constants/fetch-keys"; type Props = { isOpen: boolean; handleClose: () => void; data: IImporterService | null; user: IUser | null; }; // services const integrationService = new IntegrationService(); export const DeleteImportModal: React.FC = ({ isOpen, handleClose, data }) => { const [deleteLoading, setDeleteLoading] = useState(false); const [confirmDeleteImport, setConfirmDeleteImport] = useState(false); const router = useRouter(); const { workspaceSlug } = router.query; const { setToastAlert } = useToast(); const handleDeletion = () => { if (!workspaceSlug || !data) return; setDeleteLoading(true); mutate( IMPORTER_SERVICES_LIST(workspaceSlug as string), (prevData) => (prevData ?? []).filter((i) => i.id !== data.id), false ); integrationService .deleteImporterService(workspaceSlug as string, data.service, data.id) .catch(() => setToastAlert({ type: "error", title: "Error!", message: "Something went wrong. Please try again.", }) ) .finally(() => { setDeleteLoading(false); handleClose(); }); }; if (!data) return <>; return (

Delete Project

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

To confirm, type delete import below:

{ if (e.target.value === "delete import") setConfirmDeleteImport(true); else setConfirmDeleteImport(false); }} placeholder="Enter 'delete import'" className="mt-2 w-full" />
); };