{error ?
);
}
```
Loop summary:
1. Action starts async work and returns `mynthTaskId`.
2. UI subscribes by that ID.
3. Webhook updates rows (success or failure per image, or whole-task failure).
4. Convex pushes the latest state into the UI.
## Map webhook results to rows
### Option 1: Match by `mynthTaskId` and array order
Used above. Create pending rows when the task starts, look them up with `getByMynthTaskId`, and match `payload.result.images[index]` to `rows[index]`.
Best for prototypes and one task with a known image count.
### Option 2: Put Convex row IDs in `metadata`
Create rows first, send their IDs in `metadata`, attach `mynthTaskId` after the API call, then update by ID in the webhook from `payload.request.metadata`:
```ts theme={"theme":"kanagawa-dragon"}
const imageRowIds = await ctx.runMutation(internal.images.createPendingImages, {
images: Array.from({ length: count }, () => ({
userId: identity.subject,
requestedModel: args.model,
})),
});
const task = await mynth.image.generateAsync({
prompt: args.prompt,
model: args.model as MynthSDKTypes.ImageGenerationModelId,
count,
metadata: {
imageRowIds,
},
});
await ctx.runMutation(internal.images.attachMynthTaskId, {
ids: imageRowIds,
mynthTaskId: task.id,
});
```
In the completed handler, read `payload.request.metadata.imageRowIds` and patch each ID directly instead of looking up by task and index.
Use this when you need deterministic row-level mapping. If `generateAsync` fails after rows were created, clean up or mark those rows failed yourself.
Metadata is returned on the task and in webhook payloads. Max size: 2 KB — see [Use Metadata](/guides/use-metadata).
## Request-level custom webhooks
Dashboard-managed webhooks are the default for this Convex pattern.
Use request-level custom webhooks only when you need a different destination per request, a tenant-specific URL, or a temporary endpoint:
```ts theme={"theme":"kanagawa-dragon"}
webhook: {
custom: [{ url: "https://example.com/api/mynth-webhook?token=abc123" }],
}
```
{error}
: null}
{images?.map((image) =>
image.status === "success" ? (
) : image.status === "failed" ? (
Failed{image.error ? `: ${image.error}` : ""}
) : (Pending…
), )}