sourcemap view

otel-ui/src/components/IssuesVisualizer.tsx

@@ -37,7 +37,7 @@ import { NeedleTestModal } from "./NeedleTestModal"
 import { FilterBar, type FilterChip } from "./FilterBar"
 import type { Issue, IssueSample } from "../lib/types"
 
-const kindMeta: Record<string, { label: string; Icon: typeof Activity }> = {
+export const kindMeta: Record<string, { label: string; Icon: typeof Activity }> = {
   span_error: { label: "Trace error", Icon: Activity },
   log_error: { label: "Log error", Icon: ScrollText },
   frontend_error: { label: "Frontend error", Icon: Globe },
@@ -98,7 +98,7 @@ const toneDot: Record<SeverityTone, string> = {
   muted: "bg-ds-text-3",
 }
 
-const tonePill: Record<SeverityTone, string> = {
+export const tonePill: Record<SeverityTone, string> = {
   critical: "bg-ds-critical-bg text-ds-critical",
   warn: "bg-ds-warn-bg text-ds-warn",
   ok: "bg-ds-ok/10 text-ds-ok",
@@ -112,7 +112,7 @@ const toneLabel: Record<SeverityTone, string> = {
   muted: "Ignored",
 }
 
-const toneLine: Record<SeverityTone, string> = {
+export const toneLine: Record<SeverityTone, string> = {
   critical: "border-l-ds-critical",
   warn: "border-l-ds-warn",
   ok: "border-l-ds-ok",
@@ -120,7 +120,7 @@ const toneLine: Record<SeverityTone, string> = {
 }
 
 /** The sparkline + expected-band + breach segment described by the anomaly presentation spec. */
-const IssueSparkline = ({ issue }: { issue: Issue }) => {
+export const IssueSparkline = ({ issue }: { issue: Issue }) => {
   const { points, max, reference, breachIndex } = sparklineSeries(issue, 24)
   const width = 100
   const height = 100
@@ -180,7 +180,7 @@ const IssueSparkline = ({ issue }: { issue: Issue }) => {
   )
 }
 
-const StatCell = ({ label, value, tone }: { label: string; value: ReactNode; tone?: SeverityTone }) => (
+export const StatCell = ({ label, value, tone }: { label: string; value: ReactNode; tone?: SeverityTone }) => (
   <div className="flex flex-1 flex-col gap-1">
     <span className="text-[10.5px] font-semibold uppercase tracking-[0.09em] text-ds-text-3">{label}</span>
     <span