workflow

package
v0.13.2 Latest Latest
Warning

This package is not in the latest version of its module.

 Go to latest Published: May 20, 2026 License: MIT Imports: 17 Imported by: 0

Documentation

Overview

templ: version: v0.3.1020

templ: version: v0.3.1020

templ: version: v0.3.1020

templ: version: v0.3.1020

templ: version: v0.3.1020

templ: version: v0.3.1020

templ: version: v0.3.1020

templ: version: v0.3.1020

templ: version: v0.3.1020

templ: version: v0.3.1020

templ: version: v0.3.1020

templ: version: v0.3.1020

templ: version: v0.3.1020

templ: version: v0.3.1020

templ: version: v0.3.1020

Package workflow holds the templ components for the Workflows tab under /tools/agents/workflows. Layout is split per section so each file maps 1:1 to a chunk of the mockup at internal/docs/workflow/mockup.html §3 (Canvas editor — live demo).

templ: version: v0.3.1020

templ: version: v0.3.1020

templ: version: v0.3.1020

templ: version: v0.3.1020

Index

Constants

This section is empty.

Variables

This section is empty.

Functions

func ArgField 

func ArgField(row entity.Config) templ.Component

ArgField is the workflow-side wrapper for one arg row. It calls the existing admin widget (fieldtype.Text / Dropdown / Secret / …) but adds workflow-specific chrome around it:

  • Label + required asterisk
  • Fixed | Expression toggle pill (default = Fixed)
  • Live-template preview slot (filled by JS when mode = Expression)
  • Description text

Widget HTML stays untouched — admin keeps its w-72 / w-96 / w-40 intentional widths. The .wf-arg-field parent scopes a CSS override in editor.css to stretch every widget to full width in the inspector without modifying the widget itself.

Add a new widget type = add a `case` to the switch below. The fieldtype package owns the widget HTML; this template owns the workflow chrome.

func ArgForm 

func ArgForm(rows []entity.Config) templ.Component

ArgForm renders the full args block for one connector op or channel action — one ArgField per row.Type. Returns no-op when rows is empty so the inspector shows its own "No args required" empty state.

func Editor 

func Editor(vm EditorVM) templ.Component

Editor is the main canvas page — toolbar + 3-column flex (palette / canvas / inspector) + bottom tabs. Mirrors mockup §3 with the agents tab's theme palette (white/navy/black/green).

func EditorBottom 

func EditorBottom(vm EditorVM) templ.Component

EditorBottom — tabbed pane under canvas with a collapse toggle so the bottom area doesn't eat the canvas vertical space. Default state: collapsed (just tab bar visible); user clicks any tab to expand. Theme palette matches agents.

Convention: every tab lives in `editor_bottom_tab_<name>.templ` (markup) + `js/workflow/bottom_tab_<name>.js` (behaviour, when the tab has any). This file only owns the tab-bar shell — adding a new tab is one button below + one @bottomTab<Name>(...) call inside the body wrapper.

func EditorCanvas 

func EditorCanvas(vm EditorVM) templ.Component

EditorCanvas is the centre column — Drawflow drop target + zoom controls. Background grid lives in editor.css; theme tokens applied via the wrap div.

func EditorInspector 

func EditorInspector(vm EditorVM) templ.Component

EditorInspector — full-screen overlay modal that pops on top of the editor when a node is selected. Mirrors n8n's debug experience: three columns (Input | Parameters | Output) so the operator can iterate on node params while seeing live input + last output side by side. ESC or the close button hides it; the canvas underneath stays editable.

Theme-aware: every utility uses `text-black-900 dark:text-white-100` style pairs so the modal follows the page's light/dark toggle. The wf-inspector-* CSS classes carry their own light/dark variants too.

func EditorPalette 

func EditorPalette(sections []PaletteSection) templ.Component

EditorPalette renders the palette as a right slide-in drawer with two levels: level-1 lists sections (Triggers, AI, Action, Logic) with generic node types plus drillable rows for each registered channel and connector; level-2 lists per-integration operations. The user clicks a drillable row to dive into its ops, drags any op onto the canvas to spawn a pre-configured node, and clicks "←" to come back. Mirrors n8n's two-step "Slack → Send message" pattern so the level-1 list stays short regardless of how many integrations are registered.

func EditorToolbar 

func EditorToolbar(vm EditorVM) templ.Component

EditorToolbar is the header strip — workflow identity + action buttons. Layout mirrors n8n: identity + status badges on the left, run/save controls + publish-with-dropdown + history + 3-dot menu on the right. Destructive items (Delete, Rollback) live inside the 3-dot menu so they don't sit one click away from a misclick.

func ExecutionDetail 

func ExecutionDetail(base, id string, vm ExecutionDetailVM) templ.Component

ExecutionDetail is the right-pane content for one run. Also returned as a raw fragment by GET /executions/{runID}.

func ExecutionsPanel 

func ExecutionsPanel(vm ExecutionsVM) templ.Component

── ExecutionsPanel ────────────────────────────────────────────────────

func List 

func List(vm ListVM) templ.Component

List renders the workflow index page — every workflow + scaffold form. Theme tokens match the agents tab: white/navy surfaces, black text, green primary action. No slate-* — only the design system palette.

func NodeModuleScripts 

func NodeModuleScripts(base string) templ.Component

NodeModuleScripts emits <script> tags for every per-node module that declares an InspectorScript path. Called from editor.templ next to the main editor.js load so the per-node modules attach before the user opens the inspector.

func Run 

func Run(vm RunVM) templ.Component

Run renders the run-detail page — state header + events.jsonl timeline. Reached from the bottom-pane Runs tab in the editor.

func Shell 

func Shell(base string) templ.Component

Shell loads the Drawflow CSS+JS + editor.css+editor.js. Mounted by every workflow page so the agents sidebar stays consistent.

func TestCaseRow 

func TestCaseRow(vm TestCaseRowVM) templ.Component

TestCaseRow renders one test case row. Used standalone for per-case run result injection.

func TestManager 

func TestManager(vm TestManagerVM) templ.Component

TestManager renders the test case list panel (injected into #wf-test-results). The modal lives in EditorBottom so it's present in the DOM at page load.

func TestResultsPanel 

func TestResultsPanel(vm TestResultsVM) templ.Component

TestResultsPanel renders the HTMX-swappable test result fragment loaded into the bottom panel's Tests tab.

Types

type EditorVM 

type EditorVM struct {
	Layout         view.AgentsLayoutVM
	Base           string
	ID             string
	Workflow       wf.Workflow
	HasDraft       bool
	YAML           string
	GraphJSON      string // serialized for Drawflow editor.import()
	ValidationJSON string // serialized validation report for initial paint
	Approved       bool
	GuardReport    *guard.Report
	NodeTypes      []mcp.NodeTypeInfo
	Palette        []PaletteSection // level-1 palette built from live registry
	Runs           []mcp.RunSummary
	RunsPage       int  // current 1-based page rendered in the Runs panel
	RunsHasMore    bool // older pages still exist
}

EditorVM carries the editor page payload — full workflow body serialized for both the Drawflow canvas and the YAML preview pane.

type ExecutionDetailVM 

type ExecutionDetailVM struct {
	RunID  string
	State  wf.RunState
	Events []wf.RunEvent
}

ExecutionDetailVM carries one run's detail for the right pane.

type ExecutionsVM 

type ExecutionsVM struct {
	Base        string
	ID          string
	Runs        []mcp.RunSummary
	RunsHasMore bool
	ActiveRun   *ExecutionDetailVM
}

ExecutionsVM is the view model for the Executions panel.

type ListVM 

type ListVM struct {
	Layout    view.AgentsLayoutVM
	Base      string
	Workflows []mcp.Summary
}

ListVM carries the workflow list page payload.

type PaletteItem 

type PaletteItem struct {
	Type     string      // node type id (classify, agent, shell, ...)
	Label    string      // display label
	Dot      string      // tailwind bg-* color class for the leading dot
	Hint     string      // optional right-aligned hint
	Group    string      // drill-key (e.g. "channel-slack") — set when Subitems != nil
	Subitems []PaletteOp // level-2 operations
}

PaletteItem is one row in the level-1 palette. Most items are a direct drag-source for a node type (e.g. http, classify). Items with Subitems populated are drill-targets — clicking them swaps the palette to a level-2 view listing the per-integration operations (Slack's on_message / send_message, Linear's create_issue, …). This matches n8n's two-level palette where the user picks "Slack" then "Send message" — keeps the level-1 list short while still surfacing every integration's full op catalog.

type PaletteOp 

type PaletteOp struct {
	NodeType string         // engine node kind: channel | connector | trigger | …
	Label    string         // display label (e.g. "Send message")
	Desc     string         // one-line hint shown under label
	Kind     string         // "trigger" | "action" — drives icon + grouping in L2
	Defaults map[string]any // node.data seed merged into the new node
}

PaletteOp is one operation under a drillable PaletteItem. The combo (NodeType + Defaults) is what gets attached to the new node when the user drags this row onto the canvas: NodeType selects the executor (channel / connector / trigger), Defaults pre-fills the data block (channel+op, module+op, channelName+event, …) so the inspector opens with the integration already wired.

type PaletteSection 

type PaletteSection struct {
	Title string
	Items []PaletteItem
}

PaletteSection groups palette items per category for left sidebar.

func BuildPalette 

func BuildPalette(channels []wfchannel.Info, connectors []wfconnector.Info) []PaletteSection

BuildPalette returns the level-1 palette with per-channel and per-connector drill-in rows woven in. Generic node types (cron, webhook, agent, http, …) stay as flat rows; integrations show up as drillable items.

Sections:

  • Triggers: cron / webhook / error / manual + per-channel triggers
  • AI: classify / agent
  • Action: shell / http / db_query / transform + per-channel actions + per-connector ops
  • Logic: branch / parallel / end

type RunVM 

type RunVM struct {
	Layout view.AgentsLayoutVM
	Base   string
	ID     string
	RunID  string
	State  wf.RunState
	Events []wf.RunEvent
}

RunVM carries the run-detail page payload.

type TestCaseItem 

type TestCaseItem struct {
	Name   string         // slug-safe name (no path, no .json)
	Case   wftest.Case    // parsed fixture
	Result *wftest.Result // nil = not yet run
}

TestCaseItem is one row in the manager list.

type TestCaseRowVM 

type TestCaseRowVM struct {
	ID   string
	Base string
	Item TestCaseItem
}

TestCaseRowVM is the view model for a single result row (returned after running one case).

type TestManagerVM 

type TestManagerVM struct {
	ID    string
	Base  string
	Items []TestCaseItem
}

TestManagerVM is the view model for the full tests tab panel.

type TestResultsVM 

type TestResultsVM struct {
	ID       string
	Results  []wftest.Result
	Coverage wftest.Coverage
}

TestResultsVM carries the data for the test results panel.

Source Files

View all Source files

Jump to

Keyboard shortcuts

? : This menu
/ : Search site
f or F : Jump to
y or Y : Canonical URL
go.dev uses cookies from Google to deliver and enhance the quality of its services and to analyze traffic. Learn more.