Frontend: make Chat workflow run state and next actions explicit

[AbigailDeng]

Summary

Chat on origin/dev can already stream workflow creation, persist local history, show a Creating/Needs confirmation status, and render step/tool evidence. The current UX still makes a workflow run feel opaque: the user sees a header tag, a collapsed 1 Action affordance inside the assistant message, and a red stop button in the composer, but there is no single place that explains what is happening, what is blocking, and what the safest next action is.

Create a compact Chat run status/action center so workflow creation chats expose their current run state and next step clearly.

Current evidence

• Source branch: origin/dev
• Inspected commit: 88aa93b8c710d75f0490a66f04ec526b213159e7 (88aa93b8c, 2026-07-09)
• User-provided screenshot shows a workflow creation chat in Creating state with a collapsed 1 Action row and the composer converted to a red stop control.
• apps/aevatar-console-web/src/pages/chat/index.tsx already tracks status and session/run metadata:
  • buildAssistantMessagePatch keeps events, pending approval/intervention, steps, thinking, and tool calls.
  • runChat switches needs_confirmation -> creating and streams runtime events into the assistant message.
  • The header only shows a small status tag and optional Studio button.
  • The confirmation path is rendered as a separate inline card below messages.
• apps/aevatar-console-web/src/pages/chat/chatPresentation.tsx already has detailed pending approval/intervention cards and a collapsed action disclosure, but the user must find these inside the message body.
• apps/aevatar-console-web/src/pages/chat/index.test.tsx covers session id, persistence, confirmation, and Studio jump, but does not cover a top-level run status/action summary.

Problem

For a user asking Chat to create a team/member/workflow, the UI does not answer these questions in one place:

1. Is the workflow still planning, creating resources, waiting for approval/input/signal, completed, or failed?
2. What is the current running step or latest meaningful runtime event?
3. Is there an operator action, and where should the user click?
4. What does the red stop button stop, and what happens after stopping?
5. After success, where should the user go next: Team, Member Workflow Studio, or run evidence?

This is especially visible while the conversation status is Creating: the header tag is too small, 1 Action is easy to miss, and the composer area gives a destructive-looking stop affordance without surrounding context.

Proposed scope

Stay within apps/aevatar-console-web/**.

Add a Chat run status/action center in the main Chat surface, likely between the conversation header and message list or as a compact band above the composer. It should derive from the existing activeConversation messages and stored runtime fields rather than inventing a second source of truth.

Suggested behavior:

• For streaming / creating:
  • Show a visible status summary such as Creating workflow, Running step, or Waiting for model response.
  • Surface the latest running step/tool name when available.
  • Show action/event counts in plain language.
  • Keep Stop available, but label the context so it is clear it stops the current Chat run.
• For needs_confirmation:
  • Promote Confirm and create into the status/action center.
  • Explain that no resources are created until the user confirms.
  • Preserve the existing inline card or replace it with the new unified center, but avoid duplicate competing calls to action.
• For pending tool approval or run intervention:
  • Show Action required at the top level with an anchor/focus target or direct primary action that leads to the detailed card.
  • The detailed ApprovalCard / RunInterventionCard can remain in the message body.
• For completed_with_studio_target:
  • Show a completion summary and the correct next navigation action, using the existing resolveStudioJump behavior.
• For error / stopped runs:
  • Show a non-ambiguous stopped/error state and make it clear the user can send a follow-up message or start a new chat.

Acceptance criteria

• A user can understand the current Chat workflow state without expanding the message-level Action disclosure.
• Creating, Needs confirmation, pending approval/intervention, completed target, stopped, and error states each have a distinct visible summary.
• The status/action center uses existing runtime data from ChatMessage / ConversationState / ChatSessionState; no backend API or root-level changes are required.
• The UI remains responsive inside the current two-column Chat layout and does not overlap the composer or sidebar on desktop-width screens.
• Keyboard users can reach the primary action and any link/focus target.
• User-facing copy avoids raw internal IDs by default; IDs may remain available in detailed/debug surfaces when already present.
• Tests are added or updated under apps/aevatar-console-web/src/pages/chat/**, covering at least:
  • streaming/creating summary rendering from mocked SSE step/tool events,
  • confirmation primary action in the unified surface,
  • pending operator action visibility when a pending approval/intervention is present,
  • completed target next-step action remains available.

Validation

Run the frontend checks from the repo root:

pnpm --dir apps/aevatar-console-web tsc
pnpm --dir apps/aevatar-console-web test:ui
pnpm --dir apps/aevatar-console-web build

FKST provenance

• Skill: aevatar-frontend-fkst
• Source: current user screenshot plus origin/dev inspection of Chat files at 88aa93b8c710d75f0490a66f04ec526b213159e7
• Freshness: current origin/dev evidence from 2026-07-09; no duplicate open Chat UX issue found among issues updated since 2026-07-07

---

Migrated from #2700 to correct the GitHub author account. Existing comments and the linked PR #2702 remain on the original issue.