Skip to content

Commit d7f4c3d

Browse files
bloveclaude
andauthored
chore(deployments): resync ag-ui-dev after json-render guide/docstring update (#664)
Phase 3 (#663) updated the cockpit json-render graph docstring and guide; the Railway drift guard requires the generated bundle to match. Co-authored-by: Claude Fable 5 <noreply@anthropic.com>
1 parent 3fd150f commit d7f4c3d

2 files changed

Lines changed: 12 additions & 7 deletions

File tree

deployments/ag-ui-dev/deps/json_render/docs/guide.md

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -10,18 +10,19 @@ as the backend updates the data.
1010
</Summary>
1111

1212
<Prompt>
13-
Render a backend-authored dashboard with `@threadplane/chat` over the AG-UI adapter. Register your view components in the `views` map and pass it to `<chat>`. Have the agent emit a json-render spec (with `$state` bindings) as the assistant message content, and put the data the spec binds to in the LangGraph graph state so `ag-ui-langgraph` emits it as a `STATE_SNAPSHOT`. The chat composition resolves the bindings automatically.
13+
Render a backend-authored dashboard with `@threadplane/chat` over the AG-UI adapter. Register your view components in the `views` map and pass it to `<chat>`, along with an explicit `[store]` — the composition syncs incoming agent state into that store, and the spec's `$state` bindings resolve against it. Have the agent emit a json-render spec (with `$state` bindings) as the assistant message content, and put the data the spec binds to in the LangGraph graph state so `ag-ui-langgraph` emits it as a `STATE_SNAPSHOT`.
1414
</Prompt>
1515

1616
<Steps>
1717
<Step title="Register the view components">
1818

19-
Build a `views` registry keyed by the component types your spec will reference, and pass it to `<chat>`:
19+
Build a `views` registry keyed by the component types your spec will reference, and pass it to `<chat>` together with an explicit store. Without a `[store]`, each render surface seeds its own isolated store from the spec — the explicit store is what lets backend state (`STATE_SNAPSHOT`) reach the dashboard bindings:
2020

2121
```typescript
2222
// json-render.component.ts
2323
import { ChatComponent, views } from '@threadplane/chat';
2424
import { injectAgent } from '@threadplane/ag-ui';
25+
import { signalStateStore } from '@threadplane/render';
2526
import { StatCardComponent } from './views/stat-card.component';
2627
import { DashboardGridComponent } from './views/dashboard-grid.component';
2728
// …line-chart, bar-chart, data-grid, container
@@ -31,10 +32,13 @@ const dashboardViews = views({
3132
dashboard_grid: DashboardGridComponent,
3233
//
3334
});
35+
36+
// In the component class:
37+
readonly dashStore = signalStateStore({});
3438
```
3539

3640
```html
37-
<chat main [agent]="agent" [views]="dashboardViews" />
41+
<chat main [agent]="agent" [views]="dashboardViews" [store]="dashStore" />
3842
```
3943

4044
</Step>
@@ -76,8 +80,8 @@ data prop uses a `$state` binding rather than a literal:
7680
This is the AG-UI-native part. Instead of pushing data through a side channel,
7781
put it in the **graph state**`ag-ui-langgraph` emits the state object as a
7882
`STATE_SNAPSHOT`, the adapter writes it to the agent's `state` signal, and the
79-
chat composition syncs it into the render store where the `$state` bindings
80-
resolve:
83+
chat composition syncs it into the explicit `[store]` you passed, where the
84+
`$state` bindings resolve:
8185

8286
```python
8387
# graph.py — emit_state returns the accumulated tool data into state

deployments/ag-ui-dev/deps/json_render/src/graph.py

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,8 +17,9 @@
1717
1818
emit_state walks the message history for this turn and returns the tool
1919
results as top-level state fields — ag-ui-langgraph emits them as
20-
STATE_SNAPSHOT; the Angular chat-lib effect syncs them into the render
21-
store, where the spec's $state bindings resolve them.
20+
STATE_SNAPSHOT; the Angular chat-lib effect syncs them into the explicit
21+
[store] the app passes to <chat>, where the spec's $state bindings
22+
resolve them.
2223
"""
2324

2425
import json

0 commit comments

Comments
 (0)