import { useState } from "react"; import { observer } from "mobx-react"; import { useRouter } from "next/router"; // icons import { ArchiveRestoreIcon, LinkIcon, Pencil, Trash2 } from "lucide-react"; // ui import { ArchiveIcon, CustomMenu, TOAST_TYPE, setToast } from "@plane/ui"; // components import { ArchiveCycleModal, CycleCreateUpdateModal, CycleDeleteModal } from "@/components/cycles"; // constants import { EUserProjectRoles } from "@/constants/project"; // helpers import { copyUrlToClipboard } from "@/helpers/string.helper"; // hooks import { useCycle, useEventTracker, useUser } from "@/hooks/store"; type Props = { cycleId: string; projectId: string; workspaceSlug: string; isArchived?: boolean; }; export const CycleQuickActions: React.FC = observer((props) => { const { cycleId, projectId, workspaceSlug, isArchived } = props; // router const router = useRouter(); // states const [updateModal, setUpdateModal] = useState(false); const [archiveCycleModal, setArchiveCycleModal] = useState(false); const [deleteModal, setDeleteModal] = useState(false); // store hooks const { setTrackElement } = useEventTracker(); const { membership: { currentWorkspaceAllProjectsRole }, } = useUser(); const { getCycleById, restoreCycle } = useCycle(); // derived values const cycleDetails = getCycleById(cycleId); const isCompleted = cycleDetails?.status?.toLowerCase() === "completed"; // auth const isEditingAllowed = !!currentWorkspaceAllProjectsRole && currentWorkspaceAllProjectsRole[projectId] >= EUserProjectRoles.MEMBER; const handleCopyText = (e: React.MouseEvent) => { e.preventDefault(); e.stopPropagation(); copyUrlToClipboard(`${workspaceSlug}/projects/${projectId}/cycles/${cycleId}`).then(() => { setToast({ type: TOAST_TYPE.SUCCESS, title: "Link Copied!", message: "Cycle link copied to clipboard.", }); }); }; const handleEditCycle = (e: React.MouseEvent) => { e.preventDefault(); e.stopPropagation(); setTrackElement("Cycles page list layout"); setUpdateModal(true); }; const handleArchiveCycle = (e: React.MouseEvent) => { e.preventDefault(); e.stopPropagation(); setArchiveCycleModal(true); }; const handleRestoreCycle = async (e: React.MouseEvent) => { e.preventDefault(); e.stopPropagation(); await restoreCycle(workspaceSlug, projectId, cycleId) .then(() => { setToast({ type: TOAST_TYPE.SUCCESS, title: "Restore success", message: "Your cycle can be found in project cycles.", }); router.push(`/${workspaceSlug}/projects/${projectId}/archives/cycles`); }) .catch(() => setToast({ type: TOAST_TYPE.ERROR, title: "Error!", message: "Cycle could not be restored. Please try again.", }) ); }; const handleDeleteCycle = (e: React.MouseEvent) => { e.preventDefault(); e.stopPropagation(); setTrackElement("Cycles page list layout"); setDeleteModal(true); }; return ( <> {cycleDetails && (
setUpdateModal(false)} workspaceSlug={workspaceSlug} projectId={projectId} /> setArchiveCycleModal(false)} /> setDeleteModal(false)} workspaceSlug={workspaceSlug} projectId={projectId} />
)} {!isCompleted && isEditingAllowed && !isArchived && ( Edit cycle )} {isEditingAllowed && !isArchived && ( {isCompleted ? (
Archive cycle
) : (

Archive cycle

Only completed cycle
can be archived.

)}
)} {isEditingAllowed && isArchived && ( Restore cycle )} {!isArchived && ( Copy cycle link )}
{!isCompleted && isEditingAllowed && ( Delete cycle )}
); });