ByteChef has released the ninth installment of its Embedded series, introducing a chat-based interface that allows users to generate automation workflows through natural language. Instead of forcing users to navigate a complex drag-and-drop canvas or choose from rigid templates, the new EmbeddedWorkflowChat component lets an AI agent build the workflow in the background while the user describes their needs turn by turn. This approach targets users who discover their automation requirements only as they speak, such as refining conditions from "any deal" to "enterprise deals only."

The Architecture: Source Code, Not a Package

Unlike previous components in the series, the chat feature is not distributed as an npm package. It lives in the sample app under front-end/src/components/embedded-workflow-chat/ and must be copied directly into your project. This design choice ensures that the chat interface can be fully restyled to match your product's aesthetic using standard React and Tailwind CSS, rather than being constrained by a black-box widget. The implementation relies on @ag-ui/client for streaming and zustand for state management, providing a transparent layer for developers to customize.

How the Agent Builds in Real-Time

The process begins when the component mounts, creating a skeleton workflow definition via a POST request to /api/embedded/v1/automation/workflows. This draft is anchored by a UUID that persists throughout the conversation. As the user chats, the agent edits this draft in place, streaming updates over an AG-UI text/event-stream. When the agent needs clarification—such as which Slack channel to use or which timezone to apply—it pauses and renders interactive cards in the chat thread. These cards allow users to pick from searchable lists or connect new integrations without leaving the conversation.

Security and Control Boundaries

Because the chat runs in the browser, ByteChef enforces strict server-side validation. The copilot endpoint ignores client-side state manipulations, rebuilding the agent's context on every turn using the user's JWT and environment headers. The agent is confined to the user's own project and can only access connections the user explicitly owns or has been granted. Furthermore, the system prompt allows developers to inject house rules—such as "never delete CRM records"—which are capped at 4,000 characters and applied as additional instructions that cannot override core safety constraints.

Key Takeaways

  • The EmbeddedWorkflowChat component is source code, not an npm dependency, allowing for deep UI customization.
  • Workflows are built as drafts in real-time, with the agent editing the definition directly during the chat session.
  • Interactive cards handle complex decisions like connection selection and property picking, preventing ambiguous text inputs.
  • The feature requires ByteChef Enterprise Edition and an enabled AI provider configuration.
  • A onWorkflowReady callback fires after the first turn, enabling integration with existing workflow editors for final polishing.

The Bottom Line

This is the most practical implementation of LLMs in automation we've seen: it solves the vocabulary gap without sacrificing the determinism of a structured workflow. By making the chat source-code based, ByteChef respects that your product's UI is your brand, not theirs.