fix(web): parse scorecard into rail instead of displaying as chat text

Strip helprs-scorecard JSON blocks from assistant message display.
Extract scorecard in real-time from the SSE stream and from stored
events during replay. The scorecard renders in the right rail with
dimension bars instead of showing raw JSON in the transcript.

Author: mariuspruvot

apps/web/src/features/session/ContainerSession.tsx

@@ -23,6 +23,7 @@ import ConversationOutput from './ConversationOutput'
 import SessionRail from './SessionRail'
 import type { ScorecardResponse } from './containerApi'
 import {
+  extractScorecardFromText,
   parseStoredMessage,
   parseStreamMessage,
 } from './containerTypes'
@@ -142,6 +143,18 @@ export default function ContainerSession({
       try {
         const resp = await getSessionEvents(sessionId)
         for (const evt of resp.events) {
+          // Extract scorecard from stored assistant events
+          if (evt.data.type === 'assistant') {
+            const content = (evt.data.message as { content?: Array<{ type: string; text?: string }> })?.content
+            if (content) {
+              for (const block of content) {
+                if (block.type === 'text' && block.text) {
+                  const sc = extractScorecardFromText(block.text)
+                  if (sc) setScorecard(sc as unknown as ScorecardResponse)
+                }
+              }
+            }
+          }
           const parsed = parseStoredMessage(evt.data)
           if (parsed) {
             appendMessage(parsed)
@@ -270,6 +283,21 @@ export default function ContainerSession({
           // ignore
         }
 
+        // Check for scorecard in raw assistant text before it gets stripped
+        try {
+          const rawEvt = JSON.parse(event.data as string) as { type?: string; message?: { content?: Array<{ type: string; text?: string }> } }
+          if (rawEvt.type === 'assistant' && rawEvt.message?.content) {
+            for (const block of rawEvt.message.content) {
+              if (block.type === 'text' && block.text) {
+                const sc = extractScorecardFromText(block.text)
+                if (sc) setScorecard(sc as unknown as ScorecardResponse)
+              }
+            }
+          }
+        } catch {
+          // ignore — best-effort scorecard extraction
+        }
+
         const parsed = parseStreamMessage(event.data as string)
         if (parsed) {
           appendMessage(parsed)

apps/web/src/features/session/containerTypes.ts

@@ -181,7 +181,12 @@ export function parseStreamMessage(raw: string): Omit<StreamMessage, 'id' | 'tim
         // Only extract text blocks — tool_use and thinking are internal
         // activity that we don't display to users.
         if (block.type === 'text' && typeof block.text === 'string') {
-          blocks.push({ type: 'text', text: block.text })
+          // Strip helprs-scorecard JSON blocks from display — they're
+          // parsed separately and shown in the session rail.
+          const cleaned = block.text.replace(/```helprs-scorecard\s*\n[\s\S]*?\n```/g, '').trim()
+          if (cleaned) {
+            blocks.push({ type: 'text', text: cleaned })
+          }
         }
       }
 
@@ -246,3 +251,19 @@ export function parseStreamMessage(raw: string): Omit<StreamMessage, 'id' | 'tim
 export function parseStoredMessage(data: Record<string, unknown>): Omit<StreamMessage, 'id' | 'timestamp'> | null {
   return parseStreamMessage(JSON.stringify(data))
 }
+
+/**
+ * Extract a helprs-scorecard JSON block from assistant text.
+ * Returns the parsed object or null if not found / invalid.
+ */
+export function extractScorecardFromText(raw: string): Record<string, unknown> | null {
+  const match = raw.match(/```helprs-scorecard\s*\n([\s\S]*?)\n```/)
+  if (!match) return null
+  try {
+    const parsed = JSON.parse(match[1]) as Record<string, unknown>
+    if (parsed.dimensions && parsed.skill) return parsed
+    return null
+  } catch {
+    return null
+  }
+}