import { useRouter } from "next/router"; // ui import { Tooltip, StateGroupIcon, ControlLink } from "@plane/ui"; // helpers import { renderFormattedDate } from "helpers/date-time.helper"; // types import { TIssue } from "@plane/types"; import { useApplication, useIssueDetail, useProject, useProjectState } from "hooks/store"; export const IssueGanttBlock = ({ data }: { data: TIssue }) => { // hooks const { router: { workspaceSlug }, } = useApplication(); const { getProjectStates } = useProjectState(); const { setPeekIssue } = useIssueDetail(); const handleIssuePeekOverview = () => workspaceSlug && data && data.project_id && data.id && setPeekIssue({ workspaceSlug, projectId: data.project_id, issueId: data.id }); const stateColor = getProjectStates(data?.project_id)?.find((state) => state?.id == data?.state_id)?.color || ""; return (
{data?.name}
{renderFormattedDate(data?.start_date ?? "")} to {renderFormattedDate(data?.target_date ?? "")}
} position="top-left" >
{data?.name}
); }; // rendering issues on gantt sidebar export const IssueGanttSidebarBlock = ({ data }: { data: TIssue }) => { // hooks const { getProjectStates } = useProjectState(); const { getProjectById } = useProject(); const { router: { workspaceSlug }, } = useApplication(); const { setPeekIssue } = useIssueDetail(); const handleIssuePeekOverview = () => workspaceSlug && data && data.project_id && data.id && setPeekIssue({ workspaceSlug, projectId: data.project_id, issueId: data.id }); const currentStateDetails = getProjectStates(data?.project_id)?.find((state) => state?.id == data?.state_id) || undefined; return (
{currentStateDetails != undefined && ( )}
{getProjectById(data?.project_id)?.identifier} {data?.sequence_id}
{data?.name}
); };