import { observer } from "mobx-react"; import Link from "next/link"; import { useRouter } from "next/router"; // hooks // ui import { Tooltip, ContrastIcon } from "@plane/ui"; // helpers import { renderFormattedDate } from "@/helpers/date-time.helper"; import { useAppRouter, useCycle } from "@/hooks/store"; import { usePlatformOS } from "@/hooks/use-platform-os"; type Props = { cycleId: string; }; export const CycleGanttBlock: React.FC = observer((props) => { const { cycleId } = props; // router const router = useRouter(); // store hooks const { workspaceSlug } = useAppRouter(); const { getCycleById } = useCycle(); // derived values const cycleDetails = getCycleById(cycleId); const { isMobile } = usePlatformOS(); const cycleStatus = cycleDetails?.status?.toLocaleLowerCase(); return (
router.push(`/${workspaceSlug}/projects/${cycleDetails?.project_id}/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; // store hooks const { workspaceSlug } = useAppRouter(); const { getCycleById } = useCycle(); // derived values const cycleDetails = getCycleById(cycleId); const cycleStatus = cycleDetails?.status?.toLocaleLowerCase(); return (
{cycleDetails?.name}
); });