Function IssueCard

app/components/issue-card.tsx:54–96

(issue: IssueCardProps)

/** Render ONE Linear issue as a rich Block Kit card. */
export function IssueCard(issue: IssueCardProps): ChannelNode {
  const titleText = issue.url
    ? `[**${issue.title}**](${issue.url})`
    : `**${issue.title}**`;

  const prio = priorityGlyph(issue.priority);

  const description = issue.description
    ? issue.description.length > 600
      ? `${issue.description.slice(0, 600)}…`
      : issue.description
    : undefined;

  const footer: string[] = [];
  if (issue.labels?.length) footer.push(`🏷️ ${issue.labels.join("  ")}`);
  if (issue.url) footer.push(`[Open in Linear →](${issue.url})`);
  const footerText = footer.length ? footer.join("   ·   ") : undefined;

  return (
    <Message accent={accentForIssue(issue)}>
      <Header>
        {`${issue.justCreated ? "✅ " : `${stateGlyph(issue.state)} `}${issue.identifier}`}
      </Header>
      <Section>{titleText}</Section>
      {issue.justCreated ? <Context>{"✨ Filed in Linear"}</Context> : null}
      <Fields>
        <Field>{`**Status**\n${stateGlyph(issue.state)} ${issue.state ?? "—"}`}</Field>
        <Field>{`**Assignee**\n${issue.assignee ?? "_unassigned_"}`}</Field>
        {issue.priority ? (
          <Field>{`**Priority**\n${prio ? `${prio} ` : ""}${issue.priority}`}</Field>
        ) : null}
        {issue.team ? <Field>{`**Team**\n${issue.team}`}</Field> : null}
        {issue.cycle ? <Field>{`**Cycle**\n${issue.cycle}`}</Field> : null}
        {issue.updated ? (
          <Field>{`**Updated**\n${issue.updated}`}</Field>
        ) : null}
      </Fields>
      {description ? <Divider /> : null}
      {description ? <Section>{description}</Section> : null}
      {footerText ? <Context>{footerText}</Context> : null}
    </Message>
  );
}