feat(scouts): show scout finding tags on the emission card (#2871)

Co-authored-by: greptile-apps[bot] <165735046+greptile-apps[bot]@users.noreply.github.com>

Author: andrewm4894

packages/api-client/src/posthog-client.ts

@@ -327,6 +327,8 @@ export interface ScoutEmission {
   weight: number;
   confidence: number;
   severity: string | null;
+  /** Slug tags the scout attached to this finding (lowercase kebab-case, e.g. `cost-spike`). */
+  tags?: string[];
   source_id: string;
   emitted_at: string;
 }

packages/ui/src/features/scouts/components/ScoutEmissionCard.tsx

@@ -7,7 +7,7 @@ import { ANALYTICS_EVENTS } from "@posthog/shared";
 import { MarkdownRenderer } from "@posthog/ui/features/editor/components/MarkdownRenderer";
 import { RelativeTimestamp } from "@posthog/ui/primitives/RelativeTimestamp";
 import { track } from "@posthog/ui/shell/analytics";
-import { Box, Flex, Text } from "@radix-ui/themes";
+import { Badge, Box, Flex, Text } from "@radix-ui/themes";
 import { type ReactNode, useEffect, useRef, useState } from "react";
 import { SeverityBadge } from "./ScoutBadges";
 import { ScoutLinkedReportChip } from "./ScoutLinkedReportChip";
@@ -91,6 +91,21 @@ export function ScoutEmissionCard({
       >
         <MarkdownRenderer content={emission.description} />
       </Box>
+      {emission.tags?.length ? (
+        <Flex gap="1" mt="2" wrap="wrap">
+          {emission.tags.map((tag) => (
+            <Badge
+              key={tag}
+              variant="soft"
+              color="gray"
+              size="1"
+              className="text-[11px]"
+            >
+              {tag}
+            </Badge>
+          ))}
+        </Flex>
+      ) : null}
       {expanded ? (
         <Flex
           align="center"