feat(chat-messages): add activity trace pattern

[robertwilde]

Closes #2339

Changes

• Supports running, completed, and failed states.
• Provides expandable markdown details.
• Supports readonly and interactive inline entities.
• Emits entity clicks with the parent trace ID.
• Adds activity icons and connector lines.

---

Documentation.
Examples.
Dashboards Demo.
Playwright report.

Coverage Reports:

• charts-ng
• dashboards-ng
• element-ng
• element-translate-ng
• maps-ng
• native-charts-ng

[dr-itz]

Some comments:

• looks awesome
• creates a hard dependency on the markdown renderer with customization of the inlineCode handling. In chat-message we have content projection instead, so this creates an inconsistency
• the problem addressed is how to handle "file links" provided by the AI
• copying a chat session from VSCode, I get files in the format [](file:///Users/dritz/devel/siemens/element/projects/element-ng/markdown/extensions/code/si-markdown-code.component.spec.ts#20-20), so basically a link w/o a label
  • currently renders nothing
  • maybe should render as file like you did here
  • i.e. we need to handle this generically anway
  • what do different AIs generate?

So I would prefer to build this in steps, i.e. for now only do content-projection and land this quickly. And address the file links in a generic way

[robertwilde]

@dr-itz @kfenner applied review feedback.

[Killusions]

General comment:

I know in the UX specs we call this Activity Trace and in general for the entire thing (multiple ones) it makes sense to call it "activity trace" but individual messages should not be called trace messages IMO. This is not a term used for this and also doesn't really make sense, it should be something more generic, I like tool but maybe we can find a more generic name.

[Killusions]

Tools also can have 3 different things to display:

1. Tool title or name
2. Input parameters (can be code, JSON, raw text, markdown)
3. Output (can be code, JSON, raw text, markdown)

One "trace message" needs to support having all of these 3 at the same time, otherwise every product will need to choose their own Markdown representation which is precisely what we want to avoid.

[robertwilde]

Tools also can have 3 different things to display:

1. Tool title or name
2. Input parameters (can be code, JSON, raw text, markdown)
3. Output (can be code, JSON, raw text, markdown)

One "trace message" needs to support having all of these 3 at the same time, otherwise every product will need to choose their own Markdown representation which is precisely what we want to avoid.

That's more like general feedback for #2339 ?

[robertwilde]

Tools also can have 3 different things to display:

1. Tool title or name
2. Input parameters (can be code, JSON, raw text, markdown)
3. Output (can be code, JSON, raw text, markdown)

One "trace message" needs to support having all of these 3 at the same time, otherwise every product will need to choose their own Markdown representation which is precisely what we want to avoid.

Tool, activity or action message perhaps?

[kfenner]

Tools also can have 3 different things to display:

1. Tool title or name
2. Input parameters (can be code, JSON, raw text, markdown)
3. Output (can be code, JSON, raw text, markdown)

One "trace message" needs to support having all of these 3 at the same time, otherwise every product will need to choose their own Markdown representation which is precisely what we want to avoid.

Tool, activity or action message perhaps?

I like activity-message to indicate that some kind of system activity is taking place/going on right now.

[panch1739]

Tools also can have 3 different things to display:

1. Tool title or name
2. Input parameters (can be code, JSON, raw text, markdown)
3. Output (can be code, JSON, raw text, markdown)

One "trace message" needs to support having all of these 3 at the same time, otherwise every product will need to choose their own Markdown representation which is precisely what we want to avoid.

Tool, activity or action message perhaps?

I like activity-message to indicate that some kind of system activity is taking place/going on right now.

@kfenner @Killusions I think activity message is kind of weird. I have seen the pattern described also as activity history or reasoning history, but never message.

Message" implies a single unit of communication (like a chat bubble), not a time-ordered sequence of steps. Our pattern shows progress, intermediate actions, and a path to an outcome... that's a trace, not a message.

If the rename is coming from how it's implemented (each step rendered as a message-like row), that's a component-level detail, not what the pattern does for the user...so is a bit tricky to then explain.

I would prefer to keep "activity trace." If we want an alternative, "activity history" is the next best fit... though it leans past-tense/archival, weaker for live in-progress use. "Reasoning history" undersells it too, since we cover tool calls and file edits, not just reasoning steps.

What do you guys think? Whatever the desicion, then i need to reflect it and justify it for the AI patterns team.

[panch1739]

Tools also can have 3 different things to display:

1. Tool title or name
2. Input parameters (can be code, JSON, raw text, markdown)
3. Output (can be code, JSON, raw text, markdown)

One "trace message" needs to support having all of these 3 at the same time, otherwise every product will need to choose their own Markdown representation which is precisely what we want to avoid.

@Killusions whenever you have time, lets connect on this so you can explain me a bit better this ;) thank youu

[Killusions]

Tools also can have 3 different things to display:

1. Tool title or name
2. Input parameters (can be code, JSON, raw text, markdown)
3. Output (can be code, JSON, raw text, markdown)

One "trace message" needs to support having all of these 3 at the same time, otherwise every product will need to choose their own Markdown representation which is precisely what we want to avoid.

Tool, activity or action message perhaps?

I like activity-message to indicate that some kind of system activity is taking place/going on right now.

@kfenner @Killusions I think activity message is kind of weird. I have seen the pattern described also as activity history or reasoning history, but never message.

Message" implies a single unit of communication (like a chat bubble), not a time-ordered sequence of steps. Our pattern shows progress, intermediate actions, and a path to an outcome... that's a trace, not a message.

If the rename is coming from how it's implemented (each step rendered as a message-like row), that's a component-level detail, not what the pattern does for the user...so is a bit tricky to then explain.

I would prefer to keep "activity trace." If we want an alternative, "activity history" is the next best fit... though it leans past-tense/archival, weaker for live in-progress use. "Reasoning history" undersells it too, since we cover tool calls and file edits, not just reasoning steps.

What do you guys think? Whatever the desicion, then i need to reflect it and justify it for the AI patterns team.

@panch1739 History is definitely wrong here because it's a singular piece of the history. That's also what I meant above, the whole name makes sense for a "block" of messages, but the component is an individual piece of it, it's kind of like a list vs a list item, you would also not call a list item "list-message" or whatever. I understand that the UX and user facing pattern makes sense named like this (although I never saw it referred to this name anywhere either) but as a singular item it just seems confusing.