Start, stop and pause flows, and show what their nodes print
Flows can now be taken off the engine and put back. Stopped state lives in a runtime.json beside the flow, not in the flow document: the canvas autosaves that document, so a stopped flow would otherwise start itself again on the next edit. A stopped flow gets no subscriptions, schedules or webhooks, its nodes are skipped by the scheduler, and running it answers 409. Pausing holds a flow's nodes while its values keep arriving, so the canvas still shows what is coming in. Node code is user code and print is how it says things, so stdout is teed through a contextvar sink active only during a node execution — one event per execution, capped, so a chatty node cannot outrun the stream. A node that fails sends its traceback the same way, trimmed to the author's own frames. The dock gains a logs panel and a pause control; the dashboard replaces its placeholder with what is running, stopped or failing; the edge inspector can send the last message again. Single-stepping is deferred and noted: the scheduler keeps no progress between calls, so a step button would re-run the same node rather than advance. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Fable 5
parent
606ab3c423
commit
7344eac262
@@ -1,10 +1,13 @@
|
||||
import { ArrowRight, Trash2 } from "lucide-react"
|
||||
import { useMutation } from "@tanstack/react-query"
|
||||
import { ArrowRight, RotateCcw, Trash2 } from "lucide-react"
|
||||
import { motion } from "motion/react"
|
||||
import { useEffect, useRef, useState } from "react"
|
||||
|
||||
import { FlowsService } from "@/client"
|
||||
import { Button } from "@/components/ui/button"
|
||||
import { Popover, PopoverAnchor, PopoverContent } from "@/components/ui/popover"
|
||||
import { ScrollArea } from "@/components/ui/scroll-area"
|
||||
import useCustomToast from "@/hooks/useCustomToast"
|
||||
import { cn } from "@/lib/utils"
|
||||
import { displayName } from "./deriveEdges"
|
||||
import { useLiveValue } from "./liveStore"
|
||||
@@ -77,6 +80,8 @@ export type InspectedEdge = {
|
||||
/** Node titles, so the popover names the two ends in the user's own words. */
|
||||
from: string
|
||||
to: string
|
||||
/** The producing node's id, which is what replaying the message goes through. */
|
||||
sourceId: string
|
||||
x: number
|
||||
y: number
|
||||
}
|
||||
@@ -96,6 +101,19 @@ export function EdgeInspector({
|
||||
onUnbind: (message: string) => void
|
||||
}) {
|
||||
const live = useLiveValue(edge?.message)
|
||||
const { showErrorToast } = useCustomToast()
|
||||
// Publishing the value again from the node that produced it runs everything
|
||||
// downstream exactly as the original did.
|
||||
const replay = useMutation({
|
||||
mutationFn: (value: unknown) =>
|
||||
FlowsService.triggerNode({
|
||||
name: flow,
|
||||
nodeId: edge?.sourceId ?? "",
|
||||
requestBody: { values: { [edge?.message ?? ""]: value } },
|
||||
}),
|
||||
onError: () => showErrorToast("The message could not be sent again."),
|
||||
})
|
||||
|
||||
if (!edge) return null
|
||||
|
||||
const scalar = live === undefined ? null : formatScalar(live.value)
|
||||
@@ -115,6 +133,20 @@ export function EdgeInspector({
|
||||
<Marquee text={edge.from} className="flex-1 font-medium" />
|
||||
<ArrowRight className="size-3.5 shrink-0 text-muted-foreground" />
|
||||
<Marquee text={edge.to} className="flex-1 text-right font-medium" />
|
||||
{live === undefined ? null : (
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon-sm"
|
||||
className="-my-1 shrink-0 text-muted-foreground"
|
||||
onClick={() => replay.mutate(live.value)}
|
||||
disabled={replay.isPending}
|
||||
aria-label="Send this message again"
|
||||
title="Send this message again"
|
||||
data-testid="replay-message"
|
||||
>
|
||||
<RotateCcw />
|
||||
</Button>
|
||||
)}
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon-sm"
|
||||
|
||||
Reference in New Issue
Block a user