refactor(profile): keep an outcome's icon with its words

`ReviewObservationRow` held a second table mapping each outcome to an icon,
beside the one in `observation-outcome` holding the label and the tone for the
same six values. A seventh outcome could have gained words there and no glyph
here, and nothing would have said so. The icon moves in with them.

The review-run fixtures also pinned `reviewedAt` to a calendar date while the
story clock moves, so a timeline that reads "2 days ago" today reads as ancient
next year. They take it from `daysBefore` now, like the profile stories beside
them. The `createdAt` literals stay: nothing renders them.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01MAQxdMw579siMh1wXKEEh4

Author: Valentin Grüner

webapp/src/components/profile/PracticeGroupDetailPage.test.tsx

@@ -1,6 +1,7 @@
 import { fireEvent, render, screen } from "@testing-library/react";
 import { describe, expect, it, vi } from "vitest";
 import type { PracticeGroup, PracticeGroupReviewRun, PracticeGroupStanding } from "@/api/types.gen";
+import { daysBefore } from "@/components/common/story-clock";
 import { PracticeGroupDetailPage } from "./PracticeGroupDetailPage";
 
 const group: PracticeGroup = {
@@ -23,7 +24,7 @@ const standing: PracticeGroupStanding = {
 
 const run: PracticeGroupReviewRun = {
 	reviewId: "00000000-0000-0000-0000-000000000901",
-	reviewedAt: new Date("2026-08-12T10:26:00Z"),
+	reviewedAt: daysBefore(2),
 	reviewedWork: { id: 902, type: "scm.pull_request", provider: "GITHUB", number: 902 },
 	observations: [],
 };

webapp/src/components/profile/ReviewObservationRow.tsx

@@ -1,12 +1,4 @@
-import {
-	ChevronDownIcon,
-	CircleAlertIcon,
-	CircleCheckIcon,
-	CircleDashedIcon,
-	CircleHelpIcon,
-	CircleXIcon,
-	ShieldCheckIcon,
-} from "lucide-react";
+import { ChevronDownIcon } from "lucide-react";
 import type { PracticeGroupReviewObservation } from "@/api/types.gen";
 import { QueryErrorAlert } from "@/components/common/QueryErrorAlert";
 import {
@@ -31,26 +23,13 @@ import { cn } from "@/lib/utils";
 import { toEvidenceLocations } from "./evidence";
 import { EvidenceFileBlock } from "./EvidenceFileBlock";
 import { FeedbackComment } from "./FeedbackComment";
-import {
-	OBSERVATION_OUTCOME_PRESENTATION,
-	type ObservationOutcome,
-	observationOutcome,
-} from "./observation-outcome";
+import { OBSERVATION_OUTCOME_PRESENTATION, observationOutcome } from "./observation-outcome";
 import {
 	type FeedbackResponse,
 	feedbackResponseOf,
 	type ObservationDetailState,
 } from "./review-runs";
 
-const OUTCOME_ICON: Record<ObservationOutcome, typeof CircleCheckIcon> = {
-	PRESENT_GOOD: CircleCheckIcon,
-	ABSENT_GOOD: ShieldCheckIcon,
-	PRESENT_BAD: CircleAlertIcon,
-	ABSENT_BAD: CircleXIcon,
-	NOT_APPLICABLE: CircleDashedIcon,
-	INCONCLUSIVE: CircleHelpIcon,
-};
-
 interface ResponseChoiceProps<TValue extends string> {
 	legend: string;
 	defs: StatusDefs<TValue>;
@@ -126,7 +105,7 @@ export function ReviewObservationRow({
 }: ReviewObservationRowProps) {
 	const outcome = observationOutcome(observation);
 	const status = OBSERVATION_OUTCOME_PRESENTATION[outcome];
-	const StatusIcon = OUTCOME_ICON[outcome];
+	const StatusIcon = status.icon;
 	const canRespond = Boolean(observation.feedbackId && onRespond);
 	const canOpen = onToggle !== undefined || canRespond;
 	const detail = detailState?.detail;

webapp/src/components/profile/ReviewRunTimeline.stories.tsx

@@ -1,11 +1,12 @@
 import type { Meta, StoryObj } from "@storybook/react";
 import type { PracticeGroupReviewRun } from "@/api/types.gen";
+import { daysBefore } from "@/components/common/story-clock";
 import { ReviewRunTimeline } from "./ReviewRunTimeline";
 
 const runs: PracticeGroupReviewRun[] = [
 	{
 		reviewId: "00000000-0000-0000-0000-000000000101",
-		reviewedAt: new Date("2026-08-12T10:26:00Z"),
+		reviewedAt: daysBefore(2),
 		reviewedWork: {
 			type: "scm.pull_request",
 			id: 902,
@@ -27,7 +28,7 @@ const runs: PracticeGroupReviewRun[] = [
 	},
 	{
 		reviewId: "00000000-0000-0000-0000-000000000201",
-		reviewedAt: new Date("2026-08-09T16:40:00Z"),
+		reviewedAt: daysBefore(5),
 		reviewedWork: {
 			type: "chat.conversation_thread",
 			id: 42,

webapp/src/components/profile/ReviewRunTimeline.test.tsx

@@ -1,6 +1,7 @@
 import { fireEvent, render, screen } from "@testing-library/react";
 import { describe, expect, it, vi } from "vitest";
 import type { PracticeGroupReviewObservation, PracticeGroupReviewRun } from "@/api/types.gen";
+import { daysBefore } from "@/components/common/story-clock";
 import { ReviewRunTimeline } from "./ReviewRunTimeline";
 
 const baseObservation = {
@@ -18,7 +19,7 @@ const baseObservation = {
 
 const run = {
 	reviewId: "00000000-0000-0000-0000-000000000101",
-	reviewedAt: new Date("2026-08-12T10:26:00Z"),
+	reviewedAt: daysBefore(2),
 	reviewedWork: {
 		type: "scm.pull_request",
 		id: 902,

webapp/src/components/profile/observation-outcome.ts

@@ -1,3 +1,13 @@
+import {
+	CircleAlertIcon,
+	CircleCheckIcon,
+	CircleDashedIcon,
+	CircleHelpIcon,
+	CircleXIcon,
+	type LucideIcon,
+	ShieldCheckIcon,
+} from "lucide-react";
+
 import type { Assessment } from "@/components/practice-vocabulary/assessment-defs";
 import type { Presence } from "@/components/practice-vocabulary/presence-defs";
 
@@ -21,32 +31,41 @@ export type ObservationOutcome =
 export const OBSERVATION_OUTCOME_PRESENTATION = {
 	PRESENT_GOOD: {
 		label: "Strength shown",
+		icon: CircleCheckIcon,
 		className: "text-success",
 	},
 	ABSENT_GOOD: {
 		label: "Risk avoided",
+		icon: ShieldCheckIcon,
 		className: "text-success",
 	},
 	PRESENT_BAD: {
 		label: "Problem observed",
+		icon: CircleAlertIcon,
 		className: "text-destructive",
 	},
 	ABSENT_BAD: {
 		label: "Expected practice missing",
+		icon: CircleXIcon,
 		className: "text-destructive",
 	},
 	NOT_APPLICABLE: {
 		label: "Not assessed",
+		icon: CircleDashedIcon,
 		className: "text-muted-foreground",
 	},
 	// A distinct silence from NOT_APPLICABLE: the reviewer looked at work that DID offer the opportunity
 	// and could not claim either way. Collapsing the two would report "no opportunity" for a practice the
 	// reviewer was simply unsure about.
 	INCONCLUSIVE: {
 		label: "Not certain enough to say",
+		icon: CircleHelpIcon,
 		className: "text-muted-foreground",
 	},
-} as const satisfies Record<ObservationOutcome, { label: string; className: string }>;
+} as const satisfies Record<
+	ObservationOutcome,
+	{ label: string; icon: LucideIcon; className: string }
+>;
 
 /**
  * Derives the complete 2×2 observation state plus the two verdict-less states. The API guarantees no