web: native title tooltips explaining each annotation verdict

Same wording as the customer docs; plain browser tooltip, no cursor
change. Applied to the verdict buttons and the read-only pill.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
Oliver Kieselbach
2026-08-11 15:06:50 +02:00
parent b2723168fd
commit 29e7aa675a
2 changed files with 14 additions and 1 deletions
@@ -10,6 +10,7 @@ import {
canWriteLane,
hasContent,
LANE_LABELS,
VERDICT_DESCRIPTIONS,
VERDICT_LABELS,
visibleLanes,
validateNote,
@@ -218,7 +219,10 @@ export default function SessionAnnotationsCard({
<div className="flex items-center flex-wrap gap-2 mb-2">
<span className="text-sm font-medium text-gray-900">{LANE_LABELS[lane]}</span>
{annotation?.verdict != null && !writable && (
<span className={`inline-flex px-2 py-0.5 rounded-full text-xs font-medium ${VERDICT_PILL[annotation.verdict] ?? "bg-gray-100 text-gray-600"}`}>
<span
title={VERDICT_DESCRIPTIONS[annotation.verdict as AnnotationVerdict]}
className={`inline-flex px-2 py-0.5 rounded-full text-xs font-medium ${VERDICT_PILL[annotation.verdict] ?? "bg-gray-100 text-gray-600"}`}
>
{VERDICT_LABELS[annotation.verdict as AnnotationVerdict] ?? annotation.verdict}
</span>
)}
@@ -241,6 +245,7 @@ export default function SessionAnnotationsCard({
type="button"
role="radio"
aria-checked={selected}
title={VERDICT_DESCRIPTIONS[verdict]}
onClick={() =>
setLaneEdit(lane, { verdict: selected ? null : verdict, saveResult: null })
}
@@ -49,6 +49,14 @@ export const VERDICT_LABELS: Record<AnnotationVerdict, string> = {
inconclusive: "Inconclusive",
};
/** Native-tooltip explanations (title attribute) — same wording as the customer docs. */
export const VERDICT_DESCRIPTIONS: Record<AnnotationVerdict, string> = {
root_cause_confirmed: "The analysis was right",
analysis_wrong: "The analysis pointed at the wrong cause",
different_problem: "The real issue was something the rules did not cover",
inconclusive: "The investigation ended without a clear answer",
};
export const LANE_LABELS: Record<AnnotationLane, string> = {
operator: "Operator",
tenantadmin: "Tenant Admin",