feat(chat-sidebar): real progress feedback during long Claude tasks

[pjdoland]

Summary

Users have been reporting that long Claude tasks feel like they've hung. The chat sits silent, the "Generating" indicator stays static, and there's no signal that anything is still happening. The pattern is loudest in non-streaming mode: when Claude streams tokens, the gradual text arrival is itself the progress feedback ("something keeps appearing, it's working"). When Claude is doing agentic work (tool calls, model-thinking gaps between turns), or when streaming is disabled or paused, there is no equivalent signal. The only UI affordance is a static loading-ellipsis at the bottom of the sidebar, and the only backend signal that ever fires is one `ProgressData("Thinking...")` at chat start.

The result: a 30+ second gap looks identical to a hang. Users assume the request timed out and either cancel and retry (lossy and confusing) or open a support thread.

This PR layers three independent signals onto the same indicator so users can tell at a glance: (a) something is happening, (b) the server is responsive, (c) what the agent is doing right now, independent of whether tokens are streaming.

Solution

Three changes, one indicator:

• Elapsed-time counter. A 1s timer keyed to `copilotRequestInProgress` updates `elapsedSeconds`; the indicator now reads "Generating · 0:23". Doesn't depend on streaming; works for every provider and every chat mode.
• Heartbeat-driven pulse + stall copy. `NBIAPI` now emits a `claudeCodeHeartbeat` Signal each time the existing `BackendMessageType.ClaudeCodeHeartbeat` lands (the frontend used to discard it; it was only being used to keep the websocket alive). The sidebar remounts a small dot via a React `key` keyed to the beat count, so each beat triggers a CSS pulse. After 30s without a beat the copy flips to a "may be slow" variant and the dot turns warning-colored. This is the part most directly tied to the streaming question: the heartbeat fires regardless of whether tokens are being emitted, so a thinking gap between tool calls still looks alive.
• Tool-call activity inline. `claude.py`'s worker loop now surfaces `ToolUseBlock` and `ToolResultBlock` as `ProgressData("↻ …")` and `ProgressData("✓ ")` (or "✗" for errors). A per-query `in_flight_tools` dict maps `tool_use_id` to a humanized label so result echoes can name the tool that finished. `humanize_claude_tool_name` covers NBI's MCP tools and Claude's built-ins with a kebab→sentence fallback for unknowns. This narrates the parts of the turn where streaming has nothing to say.

The per-message progress renderer used to hardcode a `✓` prefix; dropped so streamed text controls the icon. The three other `ProgressData` callers (Copilot non-streaming and the MCP participant) were updated to emit `↻ Thinking…` so their indicator still has an icon.

The load-bearing pieces:

• `src/chat-progress-feedback.ts`: pure helpers `formatElapsedSeconds` and `isHeartbeatStale`, extracted so the formatter + threshold logic can be unit-tested without JL in the import graph.
• `src/api.ts`: new `claudeCodeHeartbeat` Signal.
• `src/chat-sidebar.tsx`: two effects (heartbeat subscription + interval driven by `copilotRequestInProgress`); new props plumbed to `ChatResponse`; non-active messages receive stable primitives so `React.memo` prunes them and the 1Hz tick doesn't re-render the whole history.
• `notebook_intelligence/claude.py`: `_CLAUDE_TOOL_LABELS` map + `humanize_claude_tool_name` helper; worker loop expanded.

Testing

• `tests/ts/chat-progress-feedback.test.ts`: 11 Jest tests for the formatter (mm:ss boundaries, h:mm:ss above 1h, floor vs round, negative input) and the staleness predicate (null, recent, exactly-at-threshold, beyond-threshold, custom threshold).
• `tests/test_claude_tool_humanizer.py`: 8 pytest tests for the humanizer (known NBI tools, known Claude built-ins, MCP wrapper stripping, kebab and snake fallbacks, empty input).
• 521 pytest / tsc clean / lint clean / 115 jest (104 existing + 11 new), all green.
• Manual: ran an agent task with multiple tool calls in both streaming and non-streaming modes, confirmed the elapsed counter ticks, the pulse fires on each heartbeat, the dot turns warning-colored and copy swaps when a tool exceeds 30s, and the activity strip narrates each tool use/result.

Risks / follow-ups

• Stale-request edge case. If the websocket disconnects without a clean `StreamEnd`, the elapsed counter keeps ticking and the stalled banner sticks until the next user-initiated request. The existing error-handling paths reset `copilotRequestInProgress`; if a disconnect path is found that doesn't, this PR makes the symptom more visible (in a good way: the banner becomes the bug report).
• Decorator/label drift. `_CLAUDE_TOOL_LABELS` duplicates the `@tool("...")` names declared elsewhere in `claude.py`. Adding a new `@tool` without updating the map causes the new tool to surface with its raw kebab-case name. Acceptable today; a startup cross-check is the right follow-up.
• `prefers-reduced-motion` only gates the new `nbi-progress-pulse` keyframe. The existing `animated-ellipsis` and `rotate-gen` animations remain ungated. Pre-existing, out of scope for this PR.
• `ThinkingBlock` from Claude's extended-thinking mode lands in `AssistantMessage.content` but is intentionally not surfaced. Could be exposed as a separate signal in a future PR.

[mbektas]

thanks @pjdoland , these look great to me overall. some comments:

• I found ↻ Thinking… to be confusing. as if it is a refresh button to click. could you try another icon / remove the icon?
• the timer for generating is good but its position and misalignment with time on the right isn't looking great. How about we remove ... animation and have the timer next to Generating text like Generating (0:16) or keep the ... animation and move timer right before Generating (0:16)...

[pjdoland]

Thanks @mbektas, addressed both points in 46463bd (after rebasing onto current main and stacking on top of #251):

↻ Thinking… icon removed. The arrow really did read as a button affordance. The icon was being emitted from four ProgressData(...) sites on the backend (claude.py x2, mcp_manager.py, base_chat_participant.py); now they stream just Thinking… (or the humanized tool label) so the label remains informative without the misleading glyph.

Timer inlined into the label. Went with the no-ellipsis variant since the animated ... plus a right-aligned time pulling away from the message timestamp was the main source of the misalignment. New layout: [•] Generating (0:16), with the pulsing dot kept as the activity signal. Renamed the wrapper class from .loading-ellipsis to .generating-label, removed .generating-elapsed, and dropped the @keyframes animated-ellipsis block entirely.

Stalled-state copy also lost an em-dash on the way through (Still working — server may be slow → Still working, server may be slow).

Stack reminder: this branch now stacks main → #251 → #254. PR #256 is independent and will conflict with #254, so the cleanest merge order is #251 → #256 → #254 (or #256 first if you prefer). I'll rebase #254 onto the new tip after the first two land.