import { useState, Fragment, FC } from "react"; import { useRouter } from "next/router"; import { mutate } from "swr"; import { Dialog, Transition } from "@headlessui/react"; // services import { APITokenService } from "services/api_token.service"; // hooks import useToast from "hooks/use-toast"; // ui import { Button } from "@plane/ui"; // types import { IApiToken } from "types/api_token"; // fetch-keys import { API_TOKENS_LIST } from "constants/fetch-keys"; type Props = { isOpen: boolean; onClose: () => void; tokenId: string; }; const apiTokenService = new APITokenService(); export const DeleteApiTokenModal: FC = (props) => { const { isOpen, onClose, tokenId } = props; // states const [deleteLoading, setDeleteLoading] = useState(false); // hooks const { setToastAlert } = useToast(); // router const router = useRouter(); const { workspaceSlug } = router.query; const handleClose = () => { onClose(); setDeleteLoading(false); }; const handleDeletion = () => { if (!workspaceSlug) return; setDeleteLoading(true); apiTokenService .deleteApiToken(workspaceSlug.toString(), tokenId) .then(() => { setToastAlert({ type: "success", title: "Success!", message: "Token deleted successfully.", }); mutate( API_TOKENS_LIST(workspaceSlug.toString()), (prevData) => (prevData ?? []).filter((token) => token.id !== tokenId), false ); handleClose(); }) .catch((err) => setToastAlert({ type: "error", title: "Error", message: err?.message ?? "Something went wrong. Please try again.", }) ) .finally(() => setDeleteLoading(false)); }; return (

Are you sure you want to delete the token?

Any application using this token will no longer have the access to Plane data. This action cannot be undone.

); };