"use client"; import { FC, MouseEvent } from "react"; import { observer } from "mobx-react"; import Link from "next/link"; import { useSearchParams } from "next/navigation"; import { Tooltip, PriorityIcon } from "@plane/ui"; // components import { ButtonAvatars } from "@/components/dropdowns/member/avatar"; import { InboxIssueStatus } from "@/components/inbox"; // helpers import { cn } from "@/helpers/common.helper"; import { renderFormattedDate } from "@/helpers/date-time.helper"; // hooks import { useLabel, useMember, useProjectInbox } from "@/hooks/store"; import { usePlatformOS } from "@/hooks/use-platform-os"; type InboxIssueListItemProps = { workspaceSlug: string; projectId: string; projectIdentifier?: string; inboxIssueId: string; setIsMobileSidebar: (value: boolean) => void; }; export const InboxIssueListItem: FC = observer((props) => { const { workspaceSlug, projectId, inboxIssueId, projectIdentifier, setIsMobileSidebar } = props; // router const searchParams = useSearchParams(); const selectedInboxIssueId = searchParams.get("inboxIssueId"); // store const { currentTab, getIssueInboxByIssueId } = useProjectInbox(); const { projectLabels } = useLabel(); const { isMobile } = usePlatformOS(); const { getUserDetails } = useMember(); const inboxIssue = getIssueInboxByIssueId(inboxIssueId); const issue = inboxIssue?.issue; const handleIssueRedirection = (event: MouseEvent, currentIssueId: string | undefined) => { if (selectedInboxIssueId === currentIssueId) event.preventDefault(); setIsMobileSidebar(false); }; if (!issue) return <>; const createdByDetails = issue?.created_by ? getUserDetails(issue?.created_by) : undefined; return ( <> handleIssueRedirection(e, issue.id)} >
{projectIdentifier}-{issue.sequence_id}
{inboxIssue.status !== -2 && }

{issue.name}

{renderFormattedDate(issue.created_at ?? "")}
{issue.priority && ( )} {issue.label_ids && issue.label_ids.length > 3 ? (
{`${issue.label_ids.length} labels`}
) : ( <> {(issue.label_ids ?? []).map((labelId) => { const labelDetails = projectLabels?.find((l) => l.id === labelId); if (!labelDetails) return null; return (
{labelDetails.name}
); })} )}
{/* created by */} {createdByDetails && }
); });