Builder Interface

This page is the reference map of the Builder interface. For each surface (sidebar, header bar, editor toolbar, overview tab, automation tab, page tab, imports tab, files tab, activity tab, observability tab, settings tab, deploy modal) it lists every visible control and the action it performs. Use it as a lookup when a button does not behave the way you expect, or when you need to know what a click actually persists.

Layout

The Builder is built around three persistent surfaces and one main pane that changes with the current route.

The AI assistant panel slides in from the right when toggled from the header bar.

Header bar

The header is always visible.

Control	Action
Back arrow / “All Workspaces”	Returns to the Builder home (workspace list).
Workspace name and icon	Display only. Edit them from Settings → General or by clicking Edit YAML.
Workspace description	Truncated to ~200px. Full text in Settings → General.
Edit YAML button (file-code icon)	Opens a Monaco editor on the raw workspace `index.yml` (name, slug, description, config, secret schema, repositories). Saving writes through the workspaces API.
AI toggle (sparkles icon)	Opens and closes the right-side AI assistant panel.
Version dropdown (visible when a deploy exists)	Switches the main pane to a read-only preview of a previously deployed bundle.
Deploy button (rocket icon, primary)	Opens the Deploy modal.
Presence avatars	One avatar per other editor currently looking at the workspace.

The sidebar is the workspace navigation tree.

Entry	Opens	Notes
Overview	Workspace Overview tab	Default landing tab.
Activity	Activity tab	Event feed + filters + correlation IDs. See Activity.
Observability	Observability tab	Aggregated health, metrics, errors, usage, and dependencies. See Observability.
Pages	The page editor. The `+` action creates a new page; existing pages are listed below.	Each page shows a sublabel: `SPA` for editable source, `Read-only` for the version currently being viewed in the version dropdown, `Deployed` for an immutable deploy snapshot.
Automations	The automation editor. The `+` action creates a new automation; existing automations are listed below.	Automations whose `name` contains `/` characters are rendered as folders (`finance/invoices/process` → finance → invoices → process).
Imports	The imports tab. The `+` action opens the App Store.	Each installed app shows a `Disabled` badge if its config has it turned off.
Files	The Files tab	List of uploaded workspace assets.
Settings	The Settings tab	Workspace configuration.

A search box at the top filters all sidebar entries (pages, automations, imports) by name or slug. The toolbar above the main pane changes depending on what is being edited.

Control	Visible for	Action
Item name (inline-editable)	pages, automations	Click to rename. The new value is persisted on `Enter` or blur.
… menu	pages, automations	Exposes Rename, Duplicate, Delete. Delete requires confirmation.
Code / Preview toggle	pages	Switches between the source editor and the rendered preview.
Desktop / Tablet / Mobile sizing	pages (preview mode)	Changes the preview viewport.
Unsaved indicator (red dot)	pages, automations	Shown whenever there are local changes.
Save	pages, automations	Disabled until there are local changes. Persists via the workspaces API.
Execute	automations	Opens the Execute modal where you set inputs and run the automation once. Disabled when there are unsaved changes (save first).

Overview tab

The first thing you see when opening a workspace.

Section	Content
Alerts	Cards surfacing setup problems or recent failures. Each card has an action link that jumps to the relevant section.
Usage stats (7 days)	Three cards (Users, Requests, Errors) with trend arrows, plus a sparkline of requests per day.
Top errors	Ranked list of the most frequent error events of the last week. Each row has a “View trace” link that opens Activity filtered on the correlation ID.
Recent changes	Last few workspace edits with user, action, file, and timestamp. The “View history” link opens Activity filtered on `workspaces.*` events.
Quick actions	One-click shortcuts: Push on Git (Settings → Versioning) and Publish as App (Settings → Packaging).

A refresh button next to the title re-fetches the stats.

Automation tab

The automation tab is the most feature-rich. Its header strip exposes:

Control	Action
Back arrow	Returns to the automation list.
Name	Click to rename. Hover to reveal Copy slug.
Slug	The unique identifier used in URLs and events. Not editable; derived from `slug:` in the YAML.
Execute	Opens the Execute modal. Disabled if the automation is new or has unsaved changes.
Delete	Two-click confirmation; deletes the automation.
Save	Disabled until there are changes. Writes the YAML to the workspace.

Below the header, you can switch between Visual graph and Code (YAML). The two views are fully equivalent; see Visual Editor and YAML Mapping.

Page tab

A page is a React source tree. The tab exposes:

Code view: a file explorer on the left and a Monaco editor on the right. Supports folder creation, file creation, rename, and delete.
Preview view: Builder compiles the source and renders the React app inside the preview pane, with the runtime AppProps injected (sdk, user, workspace, backends).

Save persists the entire source tree to the workspace as page files. Deploy bundles the tree into a JavaScript bundle (see Deploy modal).

Imports tab

The imports tab is where installed apps live.

Control	Action
Install (sidebar `+` button)	Opens the App Store modal.
App card	Shows the app slug and a `Disabled` badge if it is turned off.
View docs (external-link icon)	Opens the app’s documentation URL.
Configure (gear icon)	Opens the per-app config form. Fields are generated from the app’s config schema.
Uninstall (trash icon, double-click confirmation)	Removes the app from the workspace.

A search box filters apps by name.
A category filter narrows the catalog.
Each app card shows its name, description, photo, and last update date.
Install adds the app to the workspace and creates a default config you can then edit.

Files tab

The Files tab is documented on its own page; see Files.

Activity tab

Activity is the workspace event feed. It is documented on its own page; see Activity, which covers full-text search, date and field filters, filter presets, toggleable columns, the correlation-ID trace views (Table, Timeline, Graph, Distribution), and JSON export.

Observability tab

Observability is the aggregated per-workspace dashboard: health, metrics, errors, usage, and dependencies for a chosen period. It is documented on its own page; see Observability. Its charts deep-link back to the Activity feed.

Settings tab

Settings is a multi-tab pane. The sections below describe each sub-tab.

General

Field	Persists to
Name	Workspace name shown in the sidebar, app store, and breadcrumbs.
Description	Long description shown in the overview and (if published) in the app store.
Slug	URL-safe identifier used in `/apps/<slug>` and webhook routes. Changing it breaks existing public URLs.
Save	Writes the three fields via the workspaces API.

Versioning

Documented on the Versioning page; it covers the Push, Pull, Export, Import, and Import (Prune) buttons and the differences between them.

Secrets

Documented on the Secrets module page; it covers the schema-defined secrets and the Additional Secrets form.

Security (RBAC)

A Monaco YAML editor on the workspace security document.

Control	Action
Monaco editor	Edits the YAML defining roles, abilities, and per-resource grants.
Reset	Reverts to the last saved version.
Save	Persists via `PUT /workspaces/{id}/security`.

The role grammar itself is documented in RBAC.

Control	Action
Member row	Shows the user, their current role, and a role dropdown. Changing the dropdown calls `PATCH /workspaces/{id}/members/{userId}`.
Delete member	Removes the member from the workspace.
Add member form (email + role)	Calls `POST /workspaces/{id}/members`; sends an invite if the email is unknown, adds the user immediately otherwise.

Packaging

The Packaging tab lets you publish the workspace as a reusable app in the platform’s app store.

Field	Notes
Photo	Image upload. Limited to 2 MB and must be an image MIME type.
Slug	The app slug under which the workspace will appear in the store. Once the workspace has been published once, the slug is read-only; it becomes the immutable identifier of the app.
Description	Optional short description shown in the app store.
Version name	Optional human-readable version label (the version is created regardless).
Publish	Uploads the photo (if changed), updates the workspace, then creates an app store entry pointing at the new version.

Opened from the Deploy button in the header bar. Documented in Deployment; it covers the Publish tab (bundle build, version assignment) and the Share tab (Platform URL, four embed modes, <script> snippet). Opened from the Edit YAML button in the header bar. A Monaco editor on the workspace index.yml. This file contains:

name, slug, description
config: non-sensitive parameters ({{config.*}})
secrets: the schema of expected secrets (values live in Settings → Secrets)
repositories: Git repository configuration (see Versioning)
labels: group labels used for bulk operations
imports: installed app references

Save writes through to the workspaces API and triggers a workspaces.updated event.

Next steps

Files

Manage uploaded workspace assets.

Versioning

Push, pull, export, import with Git or archives.

Deployment

Build a bundle and share an embeddable script.

Overview

Chat

Agent Creator

Knowledges

Collections

Builder

Governe

Engage

Insights

Layout

Header bar

Sidebar

Overview tab

Automation tab

Page tab

Imports tab

Files tab

Activity tab

Observability tab

Settings tab

General

Versioning

Secrets

Security (RBAC)

Packaging

Next steps

Files

Versioning

Deployment

​Layout

​Header bar

​Sidebar

​Editor toolbar

​Overview tab

​Automation tab

​Page tab

​Imports tab

​App Store modal

​Files tab

​Activity tab

​Observability tab

​Settings tab

​General

​Versioning

​Secrets

​Security (RBAC)

​Sharing

​Packaging

​Deploy modal

​Workspace YAML modal

​Next steps

Files

Versioning

Deployment

Layout

Header bar

Sidebar

Editor toolbar

Overview tab

Automation tab

Page tab

Imports tab

App Store modal

Files tab

Activity tab

Observability tab

Settings tab

General

Versioning

Secrets

Security (RBAC)

Sharing

Packaging

Deploy modal

Workspace YAML modal

Next steps