Skip to content

Draft: Integration for a Vue 3 island flow_builder

What does this MR do and why?

The MR introduces the Vue 3 integration point for the Flow Builder

This merge request introduces a new Vue 3 integration point that runs alongside the existing monolith. The changes create a separate, scoped Vue 3 application in a new vue3-apps folder with its own build system, then integrate it into the main application as a custom web component called <flow-builder>.

The integration is protected with the flow_builder feature flag.

The implementation includes all the necessary build configuration to compile the Vue 3 app into a JavaScript file that gets loaded into the main application. The existing chat interface remains unchanged and continues to work when the feature flag is disabled, making this a safe, gradual migration approach.

References

References #576901 and &19586

Screenshots or screen recordings

Screenshot_2025-10-17_at_10.01.23

How to set up and validate locally

  1. Enable the feature flags for the global_ai_catalog and ai_catalog_flows (Product decisions) and flow_builder.
  2. Run ./scripts/build_frontend_islands
  3. Visit the Flow Creation Form
  4. Scroll down to the Flow nodes

MR acceptance checklist

Evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.

Edited by Vanessa Otto

Merge request reports

Loading