Coding Moments never renders Claude Code screenshots (counted but not extracted)

Description

Coding Moments counts screenshots from Claude Code sessions but can never display them. The tab lists the moments, then reports "No Loadable Images Found — These sessions referenced images, but the raw screenshots could not be loaded."

Nothing is missing on disk. The images are in the transcripts; there is no code path that reads them.

Two separate gaps, and both have to be closed for the tab to work:

1. No Claude image extractor. getSessionImages (src/webview/panel-rpc.ts:753) only ever calls extractSessionImages, which lives in parser-vscode-files.ts and parses VS Code's chat format. Claude Code stores images as inline base64 content blocks:

{"type":"image","source":{"type":"base64","media_type":"image/png","data":"iVBORw0KGgo..."}}

parser-claude.ts only ever counts them (countClaudeImages, line 228) — the count is what populates the gallery, which is why the moments appear at all.

2. Claude sessions have no source entry. Every sessionSourceIndex.set() in the codebase is in parser-vscode.ts. So even with an extractor wired in, the handler returns early:

const source = p.sessionSourceIndex.get(sessionId);
if (!source) return { images: [] };        // ← every Claude session stops here

I hit a false lead here worth mentioning: clearing ~/.copilot-analytics-cache and reparsing did not help. The index still held 3 entries, which is what showed the gap is structural rather than stale cache.

Steps to Reproduce

1. Use Claude Code and paste a screenshot into a session
2. Open the dashboard → Coding Moments
3. Moments are listed with correct counts, dates and workspaces; no image renders

Directly:

$ curl -s -X POST http://127.0.0.1:PORT/rpc -H 'Content-Type: application/json' \
    -d '{"id":1,"method":"getSessionImages","params":{"sessionId":"<id>","requestId":"<moment id>"}}'
{"data":{"images":[]}}

Expected Behavior

Screenshots pasted into a Claude Code session render in Coding Moments, as they do for VS Code sessions.

Notes toward a fix

Useful detail: the gallery's moment id is the transcript line's uuid, which makes both gaps closable without touching the parser.

For gap 2, sessionId is the transcript's filename stem, so the path is recoverable by scanning ~/.claude/projects (subagent transcripts sit one level deeper). Validating the id against /^[A-Za-z0-9._-]+$/ first keeps a crafted id from escaping the directory.

For gap 1, match the line by uuid, then pull type: 'image' blocks whose source.type === 'base64' into data URIs. Worth mirroring the VS Code extractor's contract — cap at 4 per request, and whitelist image MIME types rather than interpolating media_type unchecked.

I implemented this locally and all 16 moments render. Happy to open a PR if the approach looks right — in particular whether you would prefer sessionSourceIndex to be populated by the Claude parser instead, which is the cleaner fix but a wider change than I wanted to make unprompted.

Extension Version

0.1.0 (reproduced against main as of 2026-09-15)

Start with getSessionImages in src/webview/panel-rpc.ts and compare its flow with extractSessionImages in parser-vscode-files.ts. Read parser-claude.ts, especially countClaudeImages, and trace sessionSourceIndex population in parser-vscode.ts; use the Coding Moments reproduction or the existing image tests if available. Done means Claude transcript images are returned for the matching moment and render in the gallery without breaking the existing VS Code path.