[🐛 Bug]: GroupBy Incident Name column - shows the incidents id and not the incidents name

[DolevNe]

Describe the bug When trying to group alerts in the preset by the alert's correlated incident, it shows the incidents id and not its name To Reproduce

1. Go to a preset
2. Click on 'incident name' column , and click on 'group by'
3. See error

Expected behavior it will show the incidents name Screenshots

[dosubot[bot]]

To address the issue where grouping by the 'incident name' column shows the incident ID instead of the incident name, ensure that the cell function for the "name" column is correctly implemented to retrieve and display the incident name. The function getIncidentName(row.original) should be used to display the incident name. Verify that this function is correctly implemented to return the incident name and not the incident ID.

Here's the relevant part of the code:

columnHelper.display({
  id: "name",
  header: "Incident",
  cell: ({ row }) => (
    <div className="min-w-32 lg:min-w-64">
      <Link
        href={`/incidents/${row.original.id}/alerts`}
        className="text-pretty"
      >
        {getIncidentName(row.original)}
      </Link>
      <div className="text-pretty overflow-hidden overflow-ellipsis line-clamp-3">
        <Markdown
          remarkPlugins={[remarkRehype]}
          rehypePlugins={[rehypeRaw]}
        >
          {row.original.user_summary || row.original.generated_summary}
        </Markdown>
      </div>
    </div>
  ),
}),

Additionally, ensure that the logic for displaying incident names in the alert-table-utils.tsx file is correctly implemented. The code checks for the "incident" column and maps over incident IDs to find the corresponding incident object. It then uses either user_generated_name or ai_generated_name to display the incident name. Make sure this logic is correctly fetching and displaying the incident names:

if (context.column.id === "incident") {
  const incidentString = String(value || "");
  const incidentSplit = incidentString.split(",");
  return (
    <div className="flex flex-wrap gap-1 w-full overflow-hidden">
      {incidentSplit.map((incidentId, index) => {
        const incident = incidents?.items.find(
          (incident) => incident.id === incidentId
        );
        if (!incident) return null;
        const title =
          incident.user_generated_name || incident.ai_generated_name;
        return (
          <Link
            key={incidentId}
            href={`/incidents/${incidentId}`}
            title={title}
          >
            {title}
          </Link>
        );
      })}
    </div>
  );
}

Ensure that the incidents object is correctly populated and that the user_generated_name or ai_generated_name fields are being used to display the incident name ^[1][2].

To continue talking to Dosu, mention @dosu.

---

^{Help Dosu learn! Give it feedback: Great Response | Irrelevant Answer | Incorrect Sources | Too Verbose | Hallucination | Bug Report | Other}