import { useState } from "react"; import { useRouter } from "next/router"; import useSWR from "swr"; // services import cyclesService from "services/cycles.service"; // components import { DeleteCycleModal, SingleCycleCard } from "components/cycles"; // icons import { CompletedCycleIcon, ExclamationIcon } from "components/icons"; // types import { ICycle, SelectCycleType } from "types"; // fetch-keys import { CYCLE_COMPLETE_LIST } from "constants/fetch-keys"; import { EmptyState, Loader } from "components/ui"; // image import emptyCycle from "public/empty-state/empty-cycle.svg"; export interface CompletedCyclesListProps { setCreateUpdateCycleModal: React.Dispatch>; setSelectedCycle: React.Dispatch>; } export const CompletedCyclesList: React.FC = ({ setCreateUpdateCycleModal, setSelectedCycle, }) => { const [cycleDeleteModal, setCycleDeleteModal] = useState(false); const [selectedCycleForDelete, setSelectedCycleForDelete] = useState(); const router = useRouter(); const { workspaceSlug, projectId } = router.query; const { data: completedCycles } = useSWR( workspaceSlug && projectId ? CYCLE_COMPLETE_LIST(projectId as string) : null, workspaceSlug && projectId ? () => cyclesService.getCompletedCycles(workspaceSlug as string, projectId as string) : null ); const handleDeleteCycle = (cycle: ICycle) => { setSelectedCycleForDelete({ ...cycle, actionType: "delete" }); setCycleDeleteModal(true); }; const handleEditCycle = (cycle: ICycle) => { setSelectedCycle({ ...cycle, actionType: "edit" }); setCreateUpdateCycleModal(true); }; return ( <> {completedCycles ? ( completedCycles.completed_cycles.length > 0 ? (
Completed cycles are not editable.
{completedCycles.completed_cycles.map((cycle) => ( handleDeleteCycle(cycle)} handleEditCycle={() => handleEditCycle(cycle)} isCompleted /> ))}
) : ( ) ) : ( )} ); };