import { useRouter } from "next/router"; import { observer } from "mobx-react"; // hooks import { useApplication, useCycle } from "hooks/store"; // ui import { Tooltip, ContrastIcon } from "@plane/ui"; // helpers import { renderFormattedDate } from "helpers/date-time.helper"; type Props = { cycleId: string; }; export const CycleGanttBlock: React.FC = observer((props) => { const { cycleId } = props; // router const router = useRouter(); // store hooks const { router: { workspaceSlug }, } = useApplication(); const { getCycleById } = useCycle(); // derived values const cycleDetails = getCycleById(cycleId); const cycleStatus = cycleDetails?.status.toLocaleLowerCase(); return (
router.push(`/${workspaceSlug}/projects/${cycleDetails?.project}/cycles/${cycleDetails?.id}`)} >
{cycleDetails?.name}
{renderFormattedDate(cycleDetails?.start_date ?? "")} to{" "} {renderFormattedDate(cycleDetails?.end_date ?? "")}
} position="top-left" >
{cycleDetails?.name}
); }); export const CycleGanttSidebarBlock: React.FC = observer((props) => { const { cycleId } = props; // router const router = useRouter(); // store hooks const { router: { workspaceSlug }, } = useApplication(); const { getCycleById } = useCycle(); // derived values const cycleDetails = getCycleById(cycleId); const cycleStatus = cycleDetails?.status.toLocaleLowerCase(); return (
router.push(`/${workspaceSlug}/projects/${cycleDetails?.project}/cycles/${cycleDetails?.id}`)} >
{cycleDetails?.name}
); });