You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: docs/realtime/backend/metadata.mdx
+7-3Lines changed: 7 additions & 3 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -27,7 +27,9 @@ This makes metadata perfect for:
27
27
28
28
## Updating metadata from tasks
29
29
30
-
Use the metadata API within your task to update metadata in real-time:
30
+
Use the metadata API within your task to update metadata in real-time. In this basic example task, we're updating the progress of a task as it processes items:
These hooks allow you to consume real-time streams from your tasks. Streams are useful for displaying AI/LLM outputs as they're generated, or any other real-time data from your tasks.
10
8
11
9
<Note>
@@ -221,5 +219,3 @@ export function MyComponent({
221
219
```
222
220
223
221
All other options (accessToken, baseURL, enabled, id) work the same as the other realtime hooks. See our [realtime hooks documentation](/realtime/react-hooks/realtime#common-options) for more details.
These hooks allow you to subscribe to runs, batches, and streams using [Trigger.dev realtime](/realtime). They automatically include real-time updates for run status, metadata, output, and other properties. Before reading this guide:
10
-
11
-
- Read our [Realtime documentation](/realtime) to understand how the Trigger.dev realtime API works.
12
-
- Read how to [setup and authenticate](/realtime/react-hooks) using the `@trigger.dev/react-hooks` package.
7
+
These hooks allow you to subscribe to runs, batches, and streams using [Trigger.dev realtime](/realtime). They automatically include real-time updates for run status, metadata, output, and other properties.
13
8
14
9
## Hooks
15
10
@@ -206,12 +201,14 @@ See our [Realtime documentation](/realtime) for more information.
206
201
All realtime hooks automatically include metadata updates. Whenever your task updates metadata using `metadata.set()`, `metadata.append()`, or other metadata methods, your component will re-render with the updated data.
207
202
208
203
<Note>
209
-
To learn how to write tasks that use metadata, see our [writing tasks using
204
+
To learn how to write tasks with metadata updates, see our [writing tasks using
210
205
metadata](/runs/metadata) guide.
211
206
</Note>
212
207
213
208
### Progress monitoring
214
209
210
+
This example demonstrates how to create a progress monitor component that can be used to display the progress of a run:
211
+
215
212
```tsx
216
213
"use client"; // This is needed for Next.js App Router or other RSC frameworks
217
214
@@ -272,6 +269,8 @@ export function ProgressMonitor({
272
269
273
270
### Reusable progress bar
274
271
272
+
This example demonstrates how to create a reusable progress bar component that can be used to display the percentage progress of a run:
273
+
275
274
```tsx
276
275
"use client";
277
276
@@ -333,6 +332,8 @@ export function ProgressBar({ runId, publicAccessToken, title }: ProgressBarProp
333
332
334
333
### Status indicator with logs
335
334
335
+
This example demonstrates how to create a status indicator component that can be used to display the status of a run, and also logs that are emitted by the task:
This example demonstrates how to create a multi-stage deployment monitor component that can be used to display the progress of a deployment:
397
+
395
398
```tsx
396
399
"use client";
397
400
@@ -626,5 +629,3 @@ export function MyComponent({
626
629
```
627
630
628
631
This allows you to change the ID of the subscription based on some state. Passing in a different ID will unsubscribe from the current subscription and subscribe to the new one (and remove any cached data).
0 commit comments