import { useState } from "react"; // components import { DeleteCycleModal, SingleCycleCard } from "components/cycles"; import { EmptyState, Loader } from "components/ui"; // image import emptyCycle from "public/empty-state/empty-cycle.svg"; // icon import { XMarkIcon } from "@heroicons/react/24/outline"; // types import { ICycle, SelectCycleType } from "types"; type TCycleStatsViewProps = { cycles: ICycle[] | undefined; setCreateUpdateCycleModal: React.Dispatch>; setSelectedCycle: React.Dispatch>; type: "current" | "upcoming" | "draft"; }; export const CyclesList: React.FC = ({ cycles, setCreateUpdateCycleModal, setSelectedCycle, type, }) => { const [cycleDeleteModal, setCycleDeleteModal] = useState(false); const [selectedCycleForDelete, setSelectedCycleForDelete] = useState(); const [showNoCurrentCycleMessage, setShowNoCurrentCycleMessage] = useState(true); const handleDeleteCycle = (cycle: ICycle) => { setSelectedCycleForDelete({ ...cycle, actionType: "delete" }); setCycleDeleteModal(true); }; const handleEditCycle = (cycle: ICycle) => { setSelectedCycle({ ...cycle, actionType: "edit" }); setCreateUpdateCycleModal(true); }; return ( <> {cycles ? ( cycles.length > 0 ? (
{cycles.map((cycle) => ( handleDeleteCycle(cycle)} handleEditCycle={() => handleEditCycle(cycle)} /> ))}
) : type === "current" ? ( showNoCurrentCycleMessage && (

No current cycle is present.

) ) : ( ) ) : ( )} ); };