> ## Documentation Index
> Fetch the complete documentation index at: https://docs.flowx.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# FlowX.AI 5.3.0 Release Notes

> UI Flows for multi-platform app building, UI Events for real-time interactions, enhanced custom component integration, and mobile accessibility improvements.

**What's new?**

<Tabs>
  <Tab title="App builder & reusability">
    Build multi-platform applications faster with UI Flows, enhance real-time interactions with UI Events, and integrate custom components across all platforms.

    📱 [**UI Flows**](#ui-flows) - Build multi-platform applications with reusable UI components across web, iOS, and Android\
    ⚡  [**UI Events**](#ui-events) - Real-time user interaction handling with event-driven UI components\
    🧩 [**Custom Component Enhancements**](#custom-component-enhancements) - Enhanced integration for custom components with standardized data mapping\
    📤 [**File Upload Improvements**](#file-upload-improvements) - Enhanced file upload experience with better loading states and user feedback\
    ♿ [**Mobile Accessibility**](#mobile-accessibility) - WCAG 2.1 accessibility compliance for iOS and Android platforms\
    🏢 [**Cross Workspace Projects**](#cross-workspace-projects) - Share projects across multiple workspaces for flexible environment testing\
    🎯 [**Collection & Table Actions**](#collection-and-table-actions) - Execute actions from collections and tables in UI Flows

    ### **UI flows**

    <Card title="UI flows" icon="diagram-project" iconType="duotone">
      <Tabs>
        <Tab title="Overview">
          FlowX.AI 5.3 introduces UI Flows, a powerful new capability that enables you to build reusable, multi-platform user interfaces that work across web (Angular/React), iOS, and Android applications. UI Flows separate UI definitions from process logic, enabling better reusability and faster application development without the overhead of full BPMN processes.

          <Info>
            UI Flows revolutionize how you build applications by allowing you to create a UI once and deploy it across all platforms, dramatically reducing development time and ensuring consistent user experiences.
          </Info>
        </Tab>

        <Tab title="Problem Solved">
          **Previous Limitations:**

          <CardGroup cols={2}>
            <Card title="Unnecessary process complexity" icon="diagram-sankey">
              Some use cases do not need a mapping of the business case in BPMN and the complexity and overhead that a FlowX process entails
            </Card>

            <Card title="Subprocess overhead" icon="layer-group">
              Unnecessary subprocess layers inside processes added complexity for simple UI scenarios
            </Card>

            <Card title="Tight UI-process coupling" icon="link">
              UI definitions were tightly coupled to process logic, reducing reusability and increasing maintenance
            </Card>

            <Card title="Platform-specific development" icon="code">
              Building the same UI for multiple platforms required separate implementations for each platform
            </Card>
          </CardGroup>
        </Tab>

        <Tab title="Key Features">
          <CardGroup cols={2}>
            <Card title="UI Flows as project resources" icon="folder-tree">
              UI Flows are managed as independent project resources, separate from process definitions
            </Card>

            <Card title="Navigation areas management" icon="map">
              Manage Navigation Areas inside UI Flows Designer for structured navigation and layout
            </Card>

            <Card title="Start process UI action" icon="play">
              Launch FlowX processes directly from UI Flows, bridging UI and process execution
            </Card>

            <Card title="Navigate to UI action" icon="arrow-pointer">
              Setup navigation to Nav areas or Container elements through scroll for seamless UX
            </Card>

            <Card title="Task Manager component" icon="list-check">
              Embed Task Manager as a UI Component in UI Flows for task management capabilities
            </Card>

            <Card title="Multi-platform support" icon="mobile">
              Create UI once and deploy to web (Angular/React), iOS, and Android with platform-specific configurations
            </Card>

            <Card title="Import/export" icon="file-export">
              Export UI Flows as portable packages and import them across environments and applications
            </Card>

            <Card title="Platform selection" icon="sliders">
              Configure platform-specific behaviors and overrides for web, iOS, and Android in the UI Flows designer
            </Card>

            <Card title="Home page support" icon="home">
              Create UI Flows with dedicated home pages and home navigation icons for better UX
            </Card>
          </CardGroup>
        </Tab>

        <Tab title="How It Works">
          <Steps>
            <Step title="Create UI flow">
              Create a UI Flow as a project resource in FlowX Designer, separate from process definitions
            </Step>

            <Step title="Design navigation">
              Manage Navigation Areas inside UI Flows Designer, defining pages and navigation structure
            </Step>

            <Step title="Add components">
              Add UI components including Task Manager, forms, custom components, and other UI elements
            </Step>

            <Step title="Configure actions">
              Setup UI Actions like Start Process (to launch processes) and Navigate To (for Nav areas or container scrolling)
            </Step>

            <Step title="Configure platforms">
              Set platform-specific configurations using the platform selection subheader (Web, iOS, Android)
            </Step>

            <Step title="Set home page">
              Designate a page as the home page with automatic home icon navigation support
            </Step>

            <Step title="Export & reuse">
              Export your UI Flow and import it into other applications or environments for maximum reusability
            </Step>
          </Steps>
        </Tab>

        <Tab title="Benefits">
          <CardGroup cols={2}>
            <Card title="Reduced complexity" icon="wand-magic-sparkles">
              Build UIs without the overhead of BPMN processes for use cases that don't require business process mapping
            </Card>

            <Card title="Faster development" icon="rocket">
              Build UI once instead of creating separate interfaces for each platform
            </Card>

            <Card title="Flexible architecture" icon="diagram-project">
              Eliminate unnecessary subprocess layers - use UI Flows for simple scenarios and processes for complex business logic
            </Card>

            <Card title="Consistent UX" icon="check-double">
              Ensure identical user experiences across web, iOS, and Android applications
            </Card>

            <Card title="Reusability" icon="recycle">
              Share UI Flows across multiple applications and projects
            </Card>

            <Card title="Process integration" icon="gears">
              Launch processes from UI Flows when needed, maintaining clean separation of concerns
            </Card>

            <Card title="Maintainability" icon="wrench">
              Update UI in one place and propagate changes across all platforms
            </Card>

            <Card title="Enhanced navigation" icon="route">
              Rich navigation capabilities with Nav areas, container scrolling, and Task Manager integration
            </Card>
          </CardGroup>
        </Tab>

        <Tab title="Use Cases">
          **When to Use UI Flows vs Processes:**

          **Use UI Flows for:**

          * **Information Display**: Dashboards, reports, and static content that doesn't require process orchestration
          * **Task Management**: Task lists and task management interfaces with embedded Task Manager component
          * **Navigation Shells**: Application navigation structures and home pages
          * **Form Collections**: Data entry forms that start processes but don't need their own process context
          * **Multi-Platform Apps**: Applications that need consistent UI across web and mobile platforms

          **Use Processes for:**

          * **Business Logic**: Complex workflows with business rules, approvals, and integrations
          * **State Management**: Applications requiring process state tracking and persistence
          * **Orchestration**: Multi-step operations with decision points and parallel execution

          **Combine Both:**

          Create UI Flows as the main application shell and use Start Process UI Actions to launch business processes when needed, keeping your architecture clean and maintainable.
        </Tab>
      </Tabs>

      <Card title="UI Flows Documentation" href="/5.9/docs/building-blocks/ui-flows" icon="book-open">
        Complete guide to creating and configuring UI Flows, including navigation management, UI actions, and platform considerations.
      </Card>

      <Badge color="purple" icon="star">Major Feature</Badge>
    </Card>

    ***

    ### **UI events**

    <Card title="UI events" icon="bolt" iconType="duotone">
      <Tabs>
        <Tab title="Overview">
          FlowX.AI 5.3 introduces UI Events, enabling real-time interaction handling directly within Reusable UI Templates. UI Events allow you to capture user interactions like button clicks, form changes, or custom events and respond immediately without process execution, providing responsive and dynamic user experiences.
        </Tab>

        <Tab title="Key Features">
          <CardGroup cols={2}>
            <Card title="Event configuration" icon="gear">
              Configure UI Events in UI Designer with custom event types and handling logic
            </Card>

            <Card title="Cross-platform support" icon="globe">
              UI Events work consistently across Angular, React, iOS, and Android renderers
            </Card>

            <Card title="Runtime mapping" icon="diagram-project">
              UI Event results are mapped automatically in Reusable UI Template instances at runtime
            </Card>

            <Card title="Design-time testing" icon="flask">
              Test UI Events directly in UI Designer before deploying to runtime
            </Card>
          </CardGroup>
        </Tab>

        <Tab title="Use Cases">
          <CardGroup cols={2}>
            <Card title="Form validation" icon="check-circle">
              Validate form inputs in real-time as users type, providing immediate feedback
            </Card>

            <Card title="Dynamic UI updates" icon="wand-magic-sparkles">
              Show/hide fields, update options, or change UI state based on user interactions
            </Card>

            <Card title="Client-side logic" icon="code">
              Execute lightweight client-side logic without triggering backend processes
            </Card>

            <Card title="Responsive interactions" icon="mouse-pointer">
              Create highly responsive UI behaviors like autocomplete, live search, or conditional displays
            </Card>
          </CardGroup>
        </Tab>

        <Tab title="Benefits">
          <Steps>
            <Step title="Performance">
              Handle UI interactions instantly without waiting for backend process execution
            </Step>

            <Step title="User experience">
              Provide immediate visual feedback and responsive interactions
            </Step>

            <Step title="Reduced complexity">
              Simplify process logic by handling UI-specific interactions at the component level
            </Step>
          </Steps>
        </Tab>
      </Tabs>

      <Badge color="orange" icon="sparkles">UX Enhancement</Badge>
    </Card>

    ***

    ### **Custom component enhancements**

    <Card title="Custom component enhancements" icon="puzzle-piece" iconType="duotone">
      <Tabs>
        <Tab title="Overview">
          FlowX.AI 5.3 standardizes custom component integration across all platforms (Angular, React, iOS, Android) with unified data mapping for input keys, data binding, save operations, and action handling. This provides a consistent developer experience when building custom components.
        </Tab>

        <Tab title="Key Features">
          <CardGroup cols={2}>
            <Card title="Unified data mapping" icon="diagram-project">
              Standard data, saveData, and action body mapping across all platforms
            </Card>

            <Card title="Input key mapping" icon="key">
              Consistent input key handling for passing configuration and data to custom components
            </Card>

            <Card title="Platform parity" icon="equals">
              Identical custom component APIs across Angular, React, iOS, and Android
            </Card>

            <Card title="Action integration" icon="bolt">
              Integration with FlowX actions for triggering backend operations
            </Card>
          </CardGroup>
        </Tab>

        <Tab title="Benefits">
          <Steps>
            <Step title="Developer productivity">
              Build custom components once with knowledge that applies across all platforms
            </Step>

            <Step title="Code reusability">
              Share component logic and patterns across web and mobile implementations
            </Step>

            <Step title="Consistency">
              Ensure consistent behavior and data handling across all platforms
            </Step>
          </Steps>
        </Tab>
      </Tabs>

      <Badge color="blue" icon="code">Developer Experience</Badge>
    </Card>

    ***

    ### **File upload improvements**

    <Card title="File upload improvements" icon="file-arrow-up" iconType="duotone">
      <Tabs>
        <Tab title="Overview">
          FlowX.AI 5.3 enhances the file upload experience across all platforms with improved loading states, better user feedback, and more flexible configuration options. These improvements provide clearer status communication during file upload operations.
        </Tab>

        <Tab title="Key Features">
          <CardGroup cols={2}>
            <Card title="Enhanced loading behavior" icon="spinner">
              Configure loading behavior with optional overlay loader and custom loading messages
            </Card>

            <Card title="Toast notifications" icon="bell">
              Success and error messages displayed as toasts with customizable messages
            </Card>

            <Card title="Dynamic messages" icon="message">
              Display dynamic key values in toast and loading messages for context-aware feedback
            </Card>

            <Card title="Generic loader design" icon="palette">
              Updated loader designs across Angular, React, iOS, and Android for consistent theming
            </Card>
          </CardGroup>
        </Tab>

        <Tab title="Configuration">
          **Loading Behavior Options:**

          * **NONE**: No loading overlay displayed during upload
          * **OVERLAY**: Full-screen overlay with spinner and optional loading message

          **Toast Notifications:**

          * **Success Toast**: Toggle to show success message when upload completes (auto-dismiss after 3-5 seconds)
          * **Error Toast**: Toggle to show error message when upload fails (auto-dismiss after 3-5 seconds)
          * **Custom Messages**: Configure success and error messages with dynamic substitutions

          **Theming Support:**

          * Apply custom themes to loaders and toast messages
          * Configure colors, sizes, and styling to match your brand
          * Consistent visual language across platforms
        </Tab>
      </Tabs>

      <Badge color="green" icon="sparkles">UX Enhancement</Badge>
    </Card>

    ***

    ### **Mobile accessibility**

    <Card title="Mobile accessibility" icon="universal-access" iconType="duotone">
      <Tabs>
        <Tab title="Overview">
          FlowX.AI 5.3 extends WCAG 2.1 accessibility compliance to iOS and Android platforms, allowing you to configure accessibility properties directly from UI Designer and ensuring your mobile applications are accessible to all users.
        </Tab>

        <Tab title="Key Features">
          <CardGroup cols={2}>
            <Card title="iOS accessibility" icon="mobile">
              Configure labels, hints, traits, and accessibility properties for iOS components
            </Card>

            <Card title="Android accessibility" icon="mobile-screen">
              Set content descriptions and accessibility properties for Android components
            </Card>

            <Card title="Designer integration" icon="sliders">
              Configure all accessibility properties from UI Designer without code changes
            </Card>

            <Card title="Platform-specific options" icon="gear">
              Set platform-specific accessibility configurations for optimal native experience
            </Card>
          </CardGroup>
        </Tab>

        <Tab title="Benefits">
          <CardGroup cols={2}>
            <Card title="Inclusive mobile apps" icon="users">
              Make your mobile applications accessible to users with disabilities
            </Card>

            <Card title="Regulatory compliance" icon="scale-balanced">
              Meet mobile accessibility requirements for government, healthcare, and financial sectors
            </Card>

            <Card title="Better UX" icon="star">
              Accessibility improvements benefit all users, not just those using assistive technologies
            </Card>

            <Card title="Unified configuration" icon="wrench">
              Configure accessibility for all platforms from a single Designer interface
            </Card>
          </CardGroup>
        </Tab>
      </Tabs>

      <Badge color="purple" icon="universal-access">Accessibility</Badge>
    </Card>

    ***

    ### **Cross workspace projects**

    <Card title="Cross workspace projects" icon="layer-group" iconType="duotone">
      <Tabs>
        <Tab title="Overview">
          FlowX.AI 5.3 removes the restriction that prevented importing the same project into multiple workspaces within the same environment. This enables organizations to use workspaces to represent different upper environments (UAT, Staging) for testing and development.

          <Info>
            A single project (identified by its UUID) can now exist independently across workspaces, each with its own lifecycle: separate active policies, configurations, and access controls.
          </Info>
        </Tab>

        <Tab title="Problem Solved">
          **Previous Limitations:**

          <CardGroup cols={2}>
            <Card title="Environment testing restrictions" icon="ban">
              Organizations could not use workspaces on the same FlowX deployment to represent different upper environments for testing (e.g. UAT, Staging)
            </Card>

            <Card title="Operational costs">
              This feature is intended to allow organizations to use workspace functionality to emulate different environments and reduce operational costs.
            </Card>
          </CardGroup>
        </Tab>

        <Tab title="Solution">
          **What Changed:**

          <Steps>
            <Step title="Restriction removed">
              The system now allows importing the same project (identified by UUID) into multiple workspaces within the same environment
            </Step>

            <Step title="Independent lifecycles">
              Each project instance in different workspaces maintains its own independent lifecycle with separate active policies, configurations, and access controls
            </Step>

            <Step title="Workspace isolation">
              Changes in one workspace do not affect the same project in other workspaces, ensuring proper isolation
            </Step>
          </Steps>
        </Tab>

        <Tab title="How It Works">
          **Import Behavior:**

          | Aspect                    | Behavior                                                                                                                |
          | ------------------------- | ----------------------------------------------------------------------------------------------------------------------- |
          | **Import**                | Import a project build (and optionally a version) into a different workspace on the same environment                    |
          | **Active Policy**         | The imported build is automatically set as the active policy, regardless of what was active in the original workspace   |
          | **User Access**           | Workspace users must be granted appropriate project rights (e.g., project viewer) to interact with the imported project |
          | **Process Instances**     | Workspace-specific; imported projects start with no instances until processes run in the new workspace                  |
          | **Database**              | Projects across workspaces on the same environment share the same database                                              |
          | **No Impact on Original** | Import does not affect the original project's settings, policies, information, or process instances                     |

          <Warning>
            Only the build itself is transferred during cross-workspace import. Configuration and access controls are defined separately in each workspace.
          </Warning>
        </Tab>

        <Tab title="Benefits">
          <CardGroup cols={2}>
            <Card title="Flexible testing environments" icon="flask">
              Use workspaces to represent UAT, Staging, and other test environments on the same deployment
            </Card>

            <Card title="Reduced costs" icon="piggy-bank">
              Eliminate the need for additional deployments and DevOps resources for environment management
            </Card>

            <Card title="Better organization" icon="sitemap">
              Organize projects and environments more efficiently with workspace-based separation
            </Card>

            <Card title="Independent control" icon="sliders">
              Maintain separate policies and configurations for each workspace while using the same project
            </Card>

            <Card title="Simplified operations" icon="gears">
              Streamline deployment and environment management workflows
            </Card>

            <Card title="Faster environment setup" icon="bolt">
              Quickly create new test environments by importing existing projects into new workspaces
            </Card>
          </CardGroup>
        </Tab>

        <Tab title="Use Cases">
          **Example Scenarios:**

          1. **Multi-Environment Testing**: Import the same project into UAT and Staging workspaces, each with different test data and configurations

          2. **Development Lifecycle**: Maintain development, integration, and pre-production environments as separate workspaces with the same project

          3. **Parallel Testing**: Run multiple test scenarios simultaneously by creating separate workspaces for each testing team

          4. **Isolated Training Environments**: Create dedicated workspaces for training and demos while keeping production separate
        </Tab>
      </Tabs>

      <Card title="Workspaces Documentation" href="/5.1/docs/projects/workspaces#cross-workspace-project-import" icon="book-open">
        Complete guide to cross-workspace project import, including import behavior and best practices.
      </Card>

      <Badge color="purple" icon="recycle">Reusability Enhancement</Badge>
    </Card>

    ***

    ### **Collection and table actions**

    <Card title="Collection and table actions" icon="table-list" iconType="duotone">
      FlowX.AI 5.3 enables executing actions directly from collection and table rows within UI Flows across Angular and React platforms, providing contextual user interactions within data-driven UI Flow components.

      <CardGroup cols={2}>
        <Card title="Row-level actions" icon="hand-pointer">
          Configure and trigger actions with row context for edit, delete, or start process operations in UI Flows
        </Card>

        <Card title="Cross-platform support" icon="globe">
          Works in both Angular and React web renderers for UI Flows
        </Card>
      </CardGroup>

      <Badge color="purple" icon="diagram-project">UI Flows</Badge>
    </Card>

    ***
  </Tab>

  <Tab title="Integration & data">
    Enhanced workflow integration, data model management, and backend performance improvements.

    🔄 [**Data mappers for workflow integration**](#data-mappers-for-workflow-integration) - Data mappers for workflow integration\
    🗄️ [**Workflow data model**](#workflow-data-model) - New CRUD endpoints and runtime data model access\
    🤖 [**MCP Integration**](#mcp-integration) - Connect AI agents with external tools and services through Model Context Protocol servers\
    🤖 [**Custom Agent Nodes**](#custom-agent-nodes) - Custom Agent nodes for AI agents to use external tools and services
    📚 [**Knowledge Base**](#knowledge-base) - Create and manage Knowledge Bases for AI agents with document ingestion and semantic search\
    🔧 [**Update process variables**](#update-process-variables) - Operations teams can modify process variables on active instances to resolve production issues\
    🔍 [**Token view improvements**](#token-view-improvements) - Enhanced token hierarchy visibility with horizontal scrolling, frozen columns, and context-aware columns\
    🛡️ [**Access management enhancements**](#access-management-enhancements) - New operations editor role and granular workspace permissions\
    ⚡ [**Performance & stability**](#performance-and-stability) - Backend optimizations, caching improvements, and infrastructure updates\
    🔀 [**Exclusive Gateways**](#exclusive-gateways) - Expression testing and validation improvements

    ### **Data mappers for workflow integration**

    <Card title="Data mappers for workflow integration" icon="diagram-project" iconType="duotone">
      <Tabs>
        <Tab title="Overview">
          FlowX.AI 5.3 introduces data mappers that enable integration between processes and Integration Designer workflows. Similar to Process Definitions, you can now define structured data models at the workflow level with input and output parameters, ensuring consistent data lineage across your integration architecture.

          <Frame title="Workflow Data Model" caption="Define data models at the workflow level with input and output parameters, similar to Process Definitions">
            ![](https://s3.eu-west-1.amazonaws.com/docx.flowx.ai/5.x/Workflow%20-%20Data%20Model.png)
          </Frame>

          <Frame title="Process to Workflow Mapping" caption="Map data bidirectionally between processes and workflows using data mappers">
            ![](https://s3.eu-west-1.amazonaws.com/docx.flowx.ai/5.x/process-workflow.png)
          </Frame>

          <Info>
            Workflow Data Models provide the same structured data management capabilities as Process Data Models, enabling declarative data mapping between workflows and processes with full type safety and validation.
          </Info>
        </Tab>

        <Tab title="Key Features">
          <CardGroup cols={2}>
            <Card title="Workflow data model" icon="database">
              Define data models at the workflow level with input and output parameters, similar to Process Definitions
            </Card>

            <Card title="Input parameter management" icon="arrow-down-to-line">
              Input parameters automatically pre-fill Start Nodes with structured data from the workflow data model
            </Card>

            <Card title="Data parameters" icon="layer-group">
              Use data parameters to define input and output data subsets for workflow operations
            </Card>

            <Card title="Process ↔ workflow mapping" icon="arrows-left-right">
              Create data mappers on nodes to receive outputs from workflows and map data bidirectionally
            </Card>

            <Card title="Generic CRUD endpoints" icon="code">
              Manage data models, entities, attributes, and data parameters programmatically via REST APIs
            </Card>

            <Card title="Unique node validation" icon="shield-check">
              Automatic node name uniqueness validation within workflow definitions to ensure clear data lineage
            </Card>
          </CardGroup>
        </Tab>

        <Tab title="How It Works">
          <Steps>
            <Step title="Define workflow data model">
              Create a data model for your workflow with entities and attributes, similar to Process Data Models. Define which parameters are inputs and outputs
            </Step>

            <Step title="Configure input parameters">
              Input parameters automatically pre-fill the Start Node when you open the workflow diagram or test at runtime. No manual JSON editing required
            </Step>

            <Step title="Map process to workflow">
              When invoking a workflow from a process, create data mappers to map process data to workflow input parameters
            </Step>

            <Step title="Map workflow to process">
              Configure output mappings on nodes to receive workflow results and map them back to process data
            </Step>
          </Steps>
        </Tab>

        <Tab title="Data Model Management">
          **New API Capabilities:**

          * **Data Model CRUD**: Create, read, update, and delete workflow data models
          * **Entity Management**: Add, modify, and remove entities within data models
          * **Attribute Management**: Define and manage attributes with types and validation rules
          * **Data Parameters Operations**: Create input and output data parameters for workflows
          * **Usage Tracking**: Query references and usages for attributes and entities
          * **Import/Export**: Export and import complete data models across environments

          **Technical Implementation:**

          * Centralized data model library for common classes and interfaces
          * Generic endpoints for data model and data parameters manipulation
          * Integration Designer communicates with Admin service for data model operations
          * Automatic input body computation based on data model input parameters
          * Runtime workflow start data endpoint for testing and execution
        </Tab>

        <Tab title="Limitations & Compatibility">
          **Current Limitations:**

          * **Start Subworkflow Node**: Works as-is without data model integration in this release
          * **Endpoint Schemas**: Imported Swagger schemas are not yet integrated with workflow data models (planned for future release)
          * **Database Schemas**: Database operation schemas are not mapped to workflow variables yet (planned for future release)

          **Backwards Compatibility:**

          * Existing workflows continue to work without changes
          * End nodes from existing workflows can be renamed manually to align with output parameters
          * No breaking changes to current workflow execution

          **Node Naming:**

          * Node names must be unique within a workflow definition
          * System automatically validates uniqueness when renaming nodes
          * If duplicate names exist, an index is incremented (e.g., "Transform", "Transform\_2")
        </Tab>

        <Tab title="Benefits">
          <CardGroup cols={2}>
            <Card title="Consistent data lineage" icon="timeline">
              Ensure data consistency across processes and workflows with structured data models
            </Card>

            <Card title="Simplified configuration" icon="wand-magic-sparkles">
              Input parameters automatically pre-fill Start Nodes - no manual JSON editing
            </Card>

            <Card title="Type safety" icon="shield-check">
              Define data types and validation rules at the workflow level for runtime safety
            </Card>

            <Card title="Reusability" icon="recycle">
              Create reusable workflows with clear input/output contracts that can be invoked from multiple processes
            </Card>

            <Card title="Better testing" icon="flask">
              Test workflows with structured input data based on the data model
            </Card>

            <Card title="Clear interfaces" icon="sitemap">
              Workflow data models document the expected inputs and outputs for each workflow
            </Card>
          </CardGroup>
        </Tab>
      </Tabs>

      <Card title="Workflow Data Models Documentation" href="/5.9/docs/platform-deep-dive/integrations/workflow-data-models" icon="book-open">
        Complete guide to creating workflow data models, input/output parameters, process integration, and API reference.
      </Card>

      <Badge color="purple" icon="diagram-project">Integration Designer</Badge>
    </Card>

    ***

    ### **Workflow data model**

    <Card title="Workflow data model" icon="database" iconType="duotone">
      <Tabs>
        <Tab title="Overview">
          FlowX.AI 5.3 adds comprehensive workflow data model management capabilities with new CRUD endpoints and runtime access to data model paths. This enables dynamic data model operations and better runtime introspection.
        </Tab>

        <Tab title="Key Features">
          <CardGroup cols={2}>
            <Card title="CRUD endpoints" icon="code">
              Create, read, update, and delete workflow data models programmatically via REST APIs
            </Card>

            <Card title="Data model paths" icon="route">
              Runtime endpoint for retrieving workflow data model paths and structure information
            </Card>

            <Card title="RUT instance mappings" icon="sitemap">
              Enhanced /status and /details endpoints with mappings per workflow instance
            </Card>

            <Card title="Runtime caching" icon="bolt">
              Improved caching for reusable templates to reduce latency and improve performance
            </Card>
          </CardGroup>
        </Tab>

        <Tab title="Use Cases">
          <CardGroup cols={2}>
            <Card title="Dynamic forms" icon="form">
              Build dynamic forms based on data model structure at runtime
            </Card>

            <Card title="Data migration" icon="database">
              Automate data model synchronization across environments
            </Card>

            <Card title="Documentation" icon="book">
              Generate data model documentation automatically from API responses
            </Card>

            <Card title="Validation" icon="check-circle">
              Implement runtime validation based on data model definitions
            </Card>
          </CardGroup>
        </Tab>
      </Tabs>

      <Badge color="blue" icon="code">API Enhancement</Badge>
    </Card>

    ***

    ### **MCP integration**

    <Card title="MCP integration" icon="robot" iconType="duotone">
      <Tabs>
        <Tab title="Overview">
          FlowX.AI 5.3 introduces Model Context Protocol (MCP) integration, enabling AI agents to connect with external MCP servers and use their tools within Custom Agent nodes. MCP provides a standardized protocol for AI agents to access external tools, databases, APIs, and services.

          <Info>
            MCP integration extends AI agent capabilities by providing access to external tools through a standardized protocol. Configure MCP servers as data sources in Integration Designer and use their tools in workflows.
          </Info>
        </Tab>

        <Tab title="Key Features">
          <CardGroup cols={2}>
            <Card title="MCP data sources" icon="plug">
              Add MCP servers as data sources in Integration Designer with base URL and authentication configuration
            </Card>

            <Card title="Tool management" icon="wrench">
              View, enable, and turn off specific tools exposed by MCP servers directly from Integration Designer
            </Card>

            <Card title="Custom agent integration" icon="robot">
              Select MCP servers in Custom Agent nodes to make their tools available to AI agents during workflow execution
            </Card>

            <Card title="Authentication support" icon="shield-check">
              Support for no authentication and OAuth 2.0 service account authentication methods
            </Card>

            <Card title="Tool discovery" icon="magnifying-glass">
              Automatic tool discovery from MCP servers with schema information for inputs and outputs
            </Card>

            <Card title="Execution monitoring" icon="chart-line">
              Track tool usage and execution details in console logs for debugging and monitoring
            </Card>
          </CardGroup>
        </Tab>

        <Tab title="How It Works">
          <Steps>
            <Step title="Add MCP server">
              Configure an MCP server as a data source in Integration Designer with base URL and authentication details
            </Step>

            <Step title="Authenticate connection">
              Set up authentication using no authentication (for development) or OAuth 2.0 service account (for production)
            </Step>

            <Step title="Discover tools">
              View available tools exposed by the MCP server with their input/output schemas
            </Step>

            <Step title="Enable tools">
              Enable or turn off specific tools based on your workflow requirements
            </Step>

            <Step title="Configure custom agent">
              Add a Custom Agent node to your workflow and select which MCP servers the agent can access
            </Step>

            <Step title="Execute workflow">
              AI agents can now use MCP tools during workflow execution to interact with external systems
            </Step>

            <Step title="Monitor execution">
              View tool usage and execution details in console logs for debugging and performance tracking
            </Step>
          </Steps>
        </Tab>

        <Tab title="Authentication">
          **Supported Authentication Methods:**

          **None**

          * No authentication required
          * Use for public MCP servers or development environments
          * Quick setup for testing and prototyping

          **Service Account (OAuth 2.0)**

          * OAuth 2.0 service account authentication
          * Required configuration:
            * **Client ID**: OAuth client identifier
            * **Client Secret**: OAuth client secret
            * **Identity Provider URL**: Authorization server endpoint
          * Use for production environments
          * Secure access to MCP servers
        </Tab>

        <Tab title="Use Cases">
          <CardGroup cols={2}>
            <Card title="External API integration" icon="globe">
              Connect AI agents to external APIs and services for data retrieval and action execution
            </Card>

            <Card title="Database operations" icon="database">
              Query databases and perform data operations through MCP tools within AI workflows
            </Card>

            <Card title="Custom business logic" icon="code">
              Expose custom business logic as MCP tools for AI agents to execute
            </Card>

            <Card title="Multi-system orchestration" icon="sitemap">
              Use multiple MCP servers in a single Custom Agent node to orchestrate operations across systems
            </Card>
          </CardGroup>
        </Tab>

        <Tab title="Benefits">
          <CardGroup cols={2}>
            <Card title="Standardized integration" icon="plug">
              Use a standardized protocol for AI agent tool integration across different systems
            </Card>

            <Card title="Extended capabilities" icon="wand-magic-sparkles">
              Extend AI agent capabilities with external tools without custom code
            </Card>

            <Card title="Flexible tool management" icon="sliders">
              Enable or turn off specific tools per MCP server based on workflow needs
            </Card>

            <Card title="Secure connections" icon="shield-check">
              Support for OAuth 2.0 authentication ensures secure access to external services
            </Card>

            <Card title="Tool reusability" icon="recycle">
              Configure MCP servers once and use their tools across multiple workflows and Custom Agent nodes
            </Card>

            <Card title="Monitoring & debugging" icon="bug">
              Console logs provide visibility into tool execution for troubleshooting and optimization
            </Card>
          </CardGroup>
        </Tab>
      </Tabs>

      <Card title="MCP Integration Documentation" href="/5.9/docs/platform-deep-dive/integrations/mcp-integration/mcp-integration-overview" icon="book-open">
        Complete guide to MCP integration including data source configuration, tool management, and Custom Agent node usage.
      </Card>

      <Badge color="purple" icon="robot">AI Integration</Badge>
    </Card>

    ***

    ### **Custom Agent nodes**

    <Card title="Custom Agent nodes" icon="robot" iconType="duotone">
      <Tabs>
        <Tab title="Overview">
          FlowX.AI 5.3 introduces Custom Agent nodes, enabling you to create AI agents with custom capabilities powered by Model Context Protocol (MCP) tools. Custom Agent nodes can interact with external systems, databases, and services through MCP servers, allowing them to perform complex, multi-step operations autonomously within your integration workflows.
        </Tab>
      </Tabs>

      <Card title="Custom Agent Node Documentation" href="/5.9/docs/platform-deep-dive/integrations/custom-agent-node" icon="book-open">
        Complete guide to Custom Agent nodes, including configuration, usage, and best practices.
      </Card>

      <Badge color="purple" icon="robot">AI Integration</Badge>
    </Card>

    ***

    ### **Knowledge base**

    <Card title="Knowledge base" icon="book" iconType="duotone">
      <Tabs>
        <Tab title="Overview">
          FlowX.AI 5.3 introduces Knowledge Base integration, enabling you to create and manage centralized repositories of information that AI agents can query when preparing responses. Upload static documents or ingest dynamic data from workflows into Knowledge Bases that use vector embeddings and semantic search for intelligent information retrieval.

          <Info>
            Knowledge Bases enable AI agents to provide contextual, accurate responses based on your organization's documentation, policies, and dynamic data.
          </Info>
        </Tab>

        <Tab title="Key Features">
          <CardGroup cols={2}>
            <Card title="Document upload" icon="file-arrow-up">
              Upload PDF documents directly into Knowledge Bases for AI agent access
            </Card>

            <Card title="Workflow ingestion" icon="diagram-project">
              Ingest data dynamically from workflows using Knowledge Base operations (Append, Replace, Delete)
            </Card>

            <Card title="Semantic search" icon="magnifying-glass">
              AI agents find relevant information using natural language queries with vector embeddings
            </Card>

            <Card title="Content sources" icon="folder-tree">
              Organize content across multiple sources within a Knowledge Base for better management
            </Card>

            <Card title="Relevance scoring" icon="star">
              Configure minimum relevance thresholds (0-100%) to control response quality
            </Card>

            <Card title="Testing capabilities" icon="flask">
              Test queries and operations in isolation before adding them to production workflows
            </Card>

            <Card title="Custom agent integration" icon="robot">
              Enable Knowledge Base queries in Custom Agent nodes with configurable parameters
            </Card>

            <Card title="Content versioning" icon="clock-rotate-left">
              Append, replace, or delete content sources with full traceability and state management
            </Card>
          </CardGroup>
        </Tab>

        <Tab title="How It Works">
          <Steps>
            <Step title="Create Knowledge Base">
              Add a new Knowledge Base data source in Integration Designer
            </Step>

            <Step title="Ingest content">
              Upload PDF documents or ingest data from workflows into content sources
            </Step>

            <Step title="Automatic chunking">
              Content is automatically split into chunks and indexed in the vector database
            </Step>

            <Step title="Configure Custom Agent">
              Enable Knowledge Base in Custom Agent nodes and configure query parameters
            </Step>

            <Step title="Query execution">
              AI agents query the Knowledge Base using semantic search and receive relevant chunks
            </Step>

            <Step title="Response generation">
              Agents use retrieved chunks as context to generate accurate, informed responses
            </Step>
          </Steps>
        </Tab>

        <Tab title="Workflow Operations">
          **Knowledge Base operations available in workflows:**

          | Operation   | Description                                                                  |
          | ----------- | ---------------------------------------------------------------------------- |
          | **Append**  | Add new content to an existing content source without removing existing data |
          | **Replace** | Delete all existing content and replace with new content                     |
          | **Delete**  | Remove all content from a content source                                     |

          **Configuration Options:**

          * **Knowledge Base**: Select from local project libraries or dependencies
          * **Content Source**: Use existing sources, create new ones, or use workflow variables
          * **Content**: Static text, workflow variables, or configuration parameters
        </Tab>

        <Tab title="Use Cases">
          <CardGroup cols={2}>
            <Card title="Product documentation assistant" icon="book-open">
              Create Knowledge Bases with product documentation for AI agents to answer customer questions
            </Card>

            <Card title="Policy compliance" icon="scale-balanced">
              Upload company policies so AI agents can reference them when processing requests
            </Card>

            <Card title="Dynamic knowledge updates" icon="rotate">
              Ingest data from external systems through workflows to keep AI knowledge current
            </Card>

            <Card title="Multi-source synthesis" icon="layer-group">
              Organize information across sources and let AI agents synthesize comprehensive answers
            </Card>
          </CardGroup>
        </Tab>

        <Tab title="Benefits">
          <CardGroup cols={2}>
            <Card title="Contextual AI responses" icon="brain">
              AI agents provide accurate responses based on your organization's actual documentation
            </Card>

            <Card title="Dynamic updates" icon="bolt">
              Keep AI knowledge current by ingesting data from workflows automatically
            </Card>

            <Card title="Quality control" icon="gauge-high">
              Relevance scoring ensures only high-quality, relevant information is used
            </Card>

            <Card title="Centralized management" icon="sitemap">
              Manage all AI knowledge sources from a single location in Integration Designer
            </Card>

            <Card title="No code integration" icon="wand-magic-sparkles">
              Configure Knowledge Base queries directly in Custom Agent nodes without code
            </Card>

            <Card title="Testable" icon="flask">
              Test queries and see relevance scores before deploying to production
            </Card>
          </CardGroup>
        </Tab>

        <Tab title="Limitations">
          **Current Limitations:**

          <Warning>
            * Only PDF documents are supported for manual upload (images, PPT, DOC, XLS support coming in future releases)
            * Custom metadata cannot be defined (only system metadata is available)
            * AI agents can only use one Knowledge Base per Custom Agent node
            * Documents received from integrations cannot be directly ingested (Document Plugin links are treated as strings)
          </Warning>
        </Tab>
      </Tabs>

      <Card title="Knowledge Base Documentation" href="/5.9/docs/platform-deep-dive/integrations/knowledge-base-integration/knowledge-base-overview" icon="book-open">
        Complete guide to creating Knowledge Bases, ingesting content, and using them in Custom Agent workflows.
      </Card>

      <Badge color="purple" icon="robot">AI Integration</Badge>
    </Card>

    ***

    ### **Update process variables**

    <Card title="Update process variables" icon="pen-to-square" iconType="duotone">
      <Tabs>
        <Tab title="Overview">
          FlowX.AI 5.3 introduces the ability for operations teams to modify process variables on active (Started or On Hold) process instances, providing critical tools to resolve production issues without process restarts. Edit, add, or delete attributes and objects directly using an editor with JSON validation.

          <Frame title="Update Process Variables" caption="Edit, add, or delete attributes and objects directly using an editor with JSON validation">
            ![](https://s3.eu-west-1.amazonaws.com/docx.flowx.ai/5.x/Formatting%20_%20Custom%20Date%20Format.png)
          </Frame>

          <Frame title="Update Process Variables" caption="Edit, add, or delete attributes and objects directly using an editor with JSON validation">
            ![](https://s3.eu-west-1.amazonaws.com/docx.flowx.ai/5.x/Tokens%20table.png)
          </Frame>

          <Info>
            Updated values automatically sync to Task Manager and Elasticsearch, ensuring consistency across all systems. Previous values are saved in a snapshot table, and all modifications are tracked in the audit log for complete traceability.
          </Info>
        </Tab>

        <Tab title="Problem Solved">
          **Previous Limitations:**

          <CardGroup cols={2}>
            <Card title="Limited correction tools" icon="toolbox">
              Operations teams had minimal tools to correct production issues at the process-instance level
            </Card>

            <Card title="Blocked instances" icon="ban">
              No way to unblock stuck process instances without backend intervention or process restarts
            </Card>

            <Card title="Data correction challenges" icon="exclamation-triangle">
              Incorrect process data required complex workarounds or manual database modifications
            </Card>

            <Card title="Operational delays" icon="clock">
              Production issues required developer intervention, increasing resolution time
            </Card>
          </CardGroup>
        </Tab>

        <Tab title="Key Features">
          <CardGroup cols={2}>
            <Card title="Editor" icon="code">
              Edit process variables in a JSON editor with syntax validation and formatting
            </Card>

            <Card title="Multiple entry points" icon="arrow-pointer">
              Access from Process Instances page contextual menu or Process Instance page secondary navigation
            </Card>

            <Card title="Dual view modes" icon="toggle-on">
              Switch between Tree View (existing) and JSON View for variable visualization and editing
            </Card>

            <Card title="Full CRUD operations" icon="pen-to-square">
              Edit existing attribute values, add new attributes/objects, or delete existing attributes/objects
            </Card>

            <Card title="JSON validation" icon="shield-check">
              Automatic JSON format validation before saving to ensure data integrity
            </Card>

            <Card title="Snapshot history" icon="camera">
              Previous process variables are saved in a new snapshot table before changes are applied
            </Card>

            <Card title="Auto-sync to Task Manager" icon="list-check">
              Updated variables automatically sync to Task Manager using existing mechanism
            </Card>

            <Card title="Elasticsearch integration" icon="magnifying-glass">
              Process variables configured for data search are automatically updated in Elasticsearch
            </Card>

            <Card title="Permission-based access" icon="user-lock">
              Role-based access control with process\_variables\_edit permission ensures only authorized users can modify variables
            </Card>

            <Card title="Export functionality" icon="download">
              Export button available near the view dropdown for downloading process variables
            </Card>
          </CardGroup>

          **Iteration 2 - Enhanced Review:**

          <Card title="Compare feature" icon="code-compare">
            Ability to review updated process variables through a compare feature, showing before/after values for better visibility and validation
          </Card>
        </Tab>

        <Tab title="How It Works">
          **Accessing the Feature:**

          You can access the edit functionality from two entry points:

          1. **Process Instances Page**: Use contextual menu on a process instance row → navigates to Process Instance page and opens Variables tab in edit mode
          2. **Process Instance Page**: Use contextual menu in secondary navigation → opens Variables tab in edit mode

          **Editing Process Variables:**

          <Steps>
            <Step title="Select active instance">
              Choose an active process instance (Started or On Hold status) that requires variable modification
            </Step>

            <Step title="Switch to JSON view">
              In the Variables tab, switch from Tree View to JSON View using the view dropdown
            </Step>

            <Step title="Click edit">
              Click the Edit button (visible only if you have process\_variables\_edit permission)
            </Step>

            <Step title="Modify in editor">
              Edit process variables in the JSON editor - you can edit existing values, add new attributes/objects, or delete existing ones
            </Step>

            <Step title="Validate JSON">
              Ensure your JSON format is valid before saving - the editor will highlight syntax errors
            </Step>

            <Step title="Save changes">
              Click Save to apply changes - a snapshot of previous values is automatically created
            </Step>

            <Step title="Auto-sync">
              System automatically syncs updated variables to Task Manager and Elasticsearch (for variables configured for data search)
            </Step>

            <Step title="Review audit log">
              Check the Audit Log tab to confirm the modification was recorded with all details
            </Step>
          </Steps>
        </Tab>

        <Tab title="Permissions & Security">
          **Permission Requirements:**

          * **New Permission**: `process_variables_edit` available at workspace level
          * **Default Roles**: Added to `org_admin`, `workspace_admin`, `workspace_user`, `workspace_runtime_editor`, and `workspace_operations_editor` roles
          * **New Role**: `workspace_operations_editor` - A dedicated workspace role for operations management including process variable editing and operations (migration & move token)

          **Access Control:**

          * Edit option in UI is only visible to users with `process_variables_edit` permission
          * Save functionality is restricted to users with the required permission
          * Unauthorized users can view process variables but cannot modify them

          **Audit Logging:**

          Every process variable modification creates an audit log entry with:

          * Workspace ID
          * Feature: Process variables
          * Section: Process Instance
          * Application UUID and name
          * Subject: Process variables
          * Event: Edit
          * Subject Identifier: Process instance UUID
          * Body: JSON with new version of process parameters

          Audit logs are displayed in the Audit Log tab within the process instance for easy tracking.
        </Tab>

        <Tab title="Data Synchronization">
          **What Gets Updated:**

          <CardGroup cols={2}>
            <Card title="Task Manager" icon="check">
              Variables are automatically updated in Task Manager using existing mechanisms - ensures task keywords and data remain consistent
            </Card>

            <Card title="Elasticsearch" icon="check">
              Variables configured for data search are automatically updated in Elasticsearch - maintains search accuracy
            </Card>

            <Card title="Process instance params" icon="check">
              Primary process instance parameters are updated immediately in the database
            </Card>

            <Card title="Snapshot table" icon="check">
              Previous values are saved in a new snapshot table before changes are applied
            </Card>
          </CardGroup>

          **What Does NOT Get Updated:**

          <CardGroup cols={2}>
            <Card title="Process snapshots" icon="x">
              Process instance snapshots (used for back navigation/reset) are not updated - maintains historical integrity
            </Card>

            <Card title="Debug table" icon="x">
              Process instance debug records remain unchanged - preserves execution history
            </Card>

            <Card title="Existing audit logs" icon="x">
              Previously recorded audit logs (manual actions, integrations) are not modified - maintains compliance trail
            </Card>

            <Card title="Subprocess variables" icon="x">
              Child subprocess variables are not automatically updated - parent changes don't cascade to children
            </Card>
          </CardGroup>
        </Tab>

        <Tab title="Important Considerations">
          **Limitations & Best Practices:**

          <Warning>
            **Subprocess Impact**: When modifying parent process variables after subprocesses have started, child processes retain their original values. Variables are not propagated to existing subprocesses.
          </Warning>

          <Warning>
            **Back Navigation**: Process snapshots used for "Allow back to this action" with "Reset process data" are not updated. Users navigating back will see original values, not modified ones.
          </Warning>

          <Warning>
            **Integration Messages**: If a token is waiting for an integration message, the integration was called with original values. Modifying variables after integration calls does not re-trigger integrations.
          </Warning>

          **Best Practices:**

          * **Verify JSON Format**: Always ensure valid JSON before saving to prevent data corruption
          * **Document Changes**: Use audit logs to track all modifications and maintain operational documentation
          * **Test in Lower Environments**: When possible, test variable modifications in staging before production
          * **Understand Dependencies**: Review process flow and subprocess relationships before modifying variables
          * **Consider Timing**: Best used for stuck processes or data corrections, not for regular operational changes
          * **Check Search Data**: If variables are used in data search, verify Elasticsearch sync completed successfully
        </Tab>

        <Tab title="Benefits">
          <CardGroup cols={2}>
            <Card title="Faster issue resolution" icon="gauge-high">
              Operations teams can resolve production issues immediately without developer intervention
            </Card>

            <Card title="Reduced downtime" icon="arrow-down">
              Unblock stuck instances quickly, minimizing impact on end users and business processes
            </Card>

            <Card title="Operational independence" icon="user-shield">
              Empower ops teams with self-service tools for process-instance management
            </Card>

            <Card title="Data consistency" icon="check-double">
              Automatic sync ensures Task Manager and Elasticsearch reflect updated values
            </Card>

            <Card title="Full traceability" icon="timeline">
              Snapshots and audit logs provide complete history of all modifications for compliance
            </Card>

            <Card title="Reduced risk" icon="shield">
              Permission-based access and comprehensive audit trail reduce risk of unauthorized changes
            </Card>

            <Card title="Flexible editing" icon="code">
              The JSON editor provides powerful JSON editing capabilities with validation
            </Card>

            <Card title="Historical preservation" icon="archive">
              Original values preserved in snapshot table for rollback scenarios
            </Card>
          </CardGroup>
        </Tab>

        <Tab title="Use Cases">
          **Common Scenarios:**

          **1. Correct User Input Errors**

          * Customer submitted incorrect data in a loan application (wrong income, invalid address)
          * Operations team edits the variables to correct the information
          * Process continues without requiring customer to restart the application

          **2. Unblock Stuck Process Instances**

          * Process is waiting for external data that will never arrive (integration timeout, external system down)
          * Ops team updates the variable to provide expected data or skip the condition
          * Instance is unblocked and continues execution

          **3. Fix Integration Data Issues**

          * External system returned incorrect or incomplete data
          * Operations team corrects process variables to match expected values
          * Process continues with accurate data without re-calling the integration

          **4. Emergency Data Updates**

          * Critical business information changed after process started (regulatory update, pricing change)
          * Ops team modifies variables to reflect current information
          * Process continues with updated data without restart

          **5. Add Missing Attributes**

          * Process needs additional data that wasn't collected at start
          * Operations team adds new attributes or objects to process variables
          * Process can now access the required information

          **6. Remove Invalid Data**

          * Process contains incorrect or test data that shouldn't be there
          * Ops team deletes the problematic attributes or objects
          * Process continues with clean, valid data only

          **7. Update Task Manager Keywords**

          * Task search keywords need updating based on corrected data
          * Variables are modified and automatically synced to Task Manager
          * Tasks become searchable with correct keywords

          **8. Fix Elasticsearch Search Data**

          * Process data indexed for search contains errors
          * Operations team corrects variables configured for data search
          * Elasticsearch automatically updates, ensuring accurate search results

          <Info>
            This capability, combined with the upcoming Move Token feature, provides comprehensive process-instance management tools for operations teams.
          </Info>
        </Tab>
      </Tabs>

      <Card title="Update Process Variables Documentation" href="/5.9/docs/projects/runtime/active-process/update-process-variables" icon="book-open">
        Complete guide including step-by-step instructions, permissions, data synchronization, best practices, and troubleshooting.
      </Card>

      <Badge color="orange" icon="wrench">Operations Enhancement</Badge>
    </Card>

    ***

    ### **Token view improvements**

    <Card title="Token view improvements" icon="table-columns" iconType="duotone">
      <Tabs>
        <Tab title="Overview">
          FlowX.AI 5.3 enhances the **Tokens tab** in the **Process Instance View** with improved visibility and comprehension of token hierarchy and context. The enhanced token view introduces horizontal scrolling, frozen columns, hierarchical nesting, and new context-related columns to provide better insights into process execution.

          <Info>
            These improvements make it easier to understand complex process flows with parallel gateways, embedded subprocesses, and boundary events by clearly displaying token relationships and execution context.
          </Info>
        </Tab>

        <Tab title="Key Features">
          <CardGroup cols={2}>
            <Card title="Horizontal scrolling" icon="arrows-left-right">
              The table supports horizontal scrolling to accommodate all columns, ensuring all token information remains accessible
            </Card>

            <Card title="Frozen columns" icon="grip-vertical">
              Token UUID and Actions columns remain fixed during horizontal scroll for constant visibility of key identifiers and actions
            </Card>

            <Card title="Hierarchical nesting" icon="sitemap">
              Tokens display in a tree structure with nested child tokens under parent tokens, showing clear parent-child relationships
            </Card>

            <Card title="Auto-expanded rows" icon="chevron-down">
              All token rows are expanded by default, providing immediate visibility into the complete token hierarchy
            </Card>

            <Card title="Dynamic indentation" icon="indent">
              Indentation dynamically adjusts based on nesting depth, visually representing token relationships
            </Card>

            <Card title="Context column" icon="layer-group">
              New Context column displays subprocess names for tokens running within embedded subprocesses, or main process name for main process tokens
            </Card>

            <Card title="Initiator node column" icon="play">
              New Initiator Node column shows the node name that generated the token (e.g., Parallel Gateway, Non-interrupting boundary event)
            </Card>

            <Card title="First executed node column" icon="location-dot">
              New First Executed Node column displays the first node executed after token generation
            </Card>

            <Card title="UUID copy functionality" icon="copy">
              Token UUID displays first 6 characters with a copy icon; clicking copies the full UUID to clipboard with success notification
            </Card>

            <Card title="Color-coded status tags" icon="tags">
              Token Status column uses color-coded tags for quick visual identification of token lifecycle states
            </Card>

            <Card title="Tooltip support" icon="info">
              Long node names are truncated with tooltips showing full text on hover for better readability
            </Card>

            <Card title="Timezone-aware timestamps" icon="clock">
              Last Updated column displays full datetime in browser timezone for accurate local time representation
            </Card>
          </CardGroup>
        </Tab>

        <Tab title="Table Columns">
          The enhanced token view includes the following columns:

          | Column                  | Description                                             | Special Behavior                                                                                                                                                                                                                       |
          | ----------------------- | ------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
          | **Token UUID**          | Unique identifier of the token                          | Only first 6 characters displayed. Copy icon appears beside UUID. Clicking copies full UUID to clipboard with success toast: "Full Token UUID copied to clipboard." **Frozen column** (stays visible during horizontal scroll)         |
          | **Context**             | Displays contextual data for token                      | Shows main process name for tokens in main process. Shows embedded subprocess name for tokens in embedded subprocesses (any nesting level)                                                                                             |
          | **Initiator Node**      | Shows the node name that generated the token            | Applies to child tokens only. For parent tokens, displays "-". Examples: Parallel Gateway name, Non-interrupting boundary event name                                                                                                   |
          | **First Executed Node** | Displays the first node executed after token generation | For parallel gateway tokens: first executed node on that parallel branch. For boundary event tokens: first executed node on branch started from boundary node. If first node is embedded subprocess, displays embedded subprocess name |
          | **Current Node**        | Displays the last node executed within the token branch | For parallel gateway tokens: last node on branch. For boundary event tokens: last node executed on branch triggered by boundary. For tokens in embedded subprocess: displays current node from subprocess                              |
          | **Current Node Status** | Shows the current execution status                      | Examples: WAITING\_TIMER\_EVENT, ARRIVED, EXECUTING, EXECUTED\_COMPLETE, EXECUTED\_PARTIAL. Sortable column                                                                                                                            |
          | **Token Status**        | Indicates lifecycle state                               | Values: ACTIVE, INACTIVE, ABORTED, ON HOLD, DISMISSED, EXPIRED, TERMINATED. **Color-coded tags** for visual identification                                                                                                             |
          | **Last Updated**        | Timestamp of latest token state change                  | Displays full datetime in browser timezone                                                                                                                                                                                             |
          | **Actions**             | Available actions for the token                         | Includes Retry token and View (eye icon) actions. **Frozen column** (stays visible during horizontal scroll). Retry button only visible for ACTIVE tokens                                                                              |
        </Tab>

        <Tab title="Nesting Behavior">
          **Token Hierarchy Display:**

          <Steps>
            <Step title="Parent-child relationships">
              Tokens created by parallel gateways or embedded subprocesses are displayed as nested child tokens under their parent tokens
            </Step>

            <Step title="Default expansion">
              All token rows are expanded by default, showing the complete token hierarchy immediately
            </Step>

            <Step title="Dynamic indentation">
              Indentation adjusts automatically based on nesting depth, with columns expanding accordingly to maintain alignment
            </Step>

            <Step title="Visual hierarchy">
              The tree structure makes it easy to identify which tokens belong to which parallel branch or subprocess
            </Step>
          </Steps>

          **Initiator Node Logic:**

          * **Parent tokens**: Display "-" in Initiator Node column
          * **Child tokens from parallel gateway**: Display the parallel gateway node name
          * **Child tokens from boundary event**: Display the boundary event node name
          * **Child tokens from back in steps**: Display appropriate initiator information
        </Tab>

        <Tab title="Benefits">
          <CardGroup cols={2}>
            <Card title="Better visibility" icon="eye">
              Horizontal scrolling and frozen columns ensure all token information remains accessible regardless of table width
            </Card>

            <Card title="Clear hierarchy" icon="sitemap">
              Hierarchical nesting with dynamic indentation makes parent-child token relationships immediately clear
            </Card>

            <Card title="Context awareness" icon="layer-group">
              Context column provides immediate visibility into which subprocess a token is executing within
            </Card>

            <Card title="Execution tracking" icon="route">
              Initiator Node and First Executed Node columns help track token origin and execution path
            </Card>

            <Card title="Quick actions" icon="bolt">
              Frozen Actions column ensures retry and view actions are always accessible without scrolling
            </Card>

            <Card title="Easy UUID access" icon="copy">
              Quick copy functionality for full UUIDs without needing to view token details
            </Card>

            <Card title="Visual status identification" icon="tags">
              Color-coded status tags enable quick identification of token states at a glance
            </Card>

            <Card title="Improved readability" icon="book-open">
              Tooltips for truncated names and timezone-aware timestamps improve overall readability
            </Card>
          </CardGroup>
        </Tab>

        <Tab title="Use Cases">
          **Common Scenarios:**

          **1. Parallel Gateway Debugging**

          * View all parallel branches simultaneously with clear parent-child relationships
          * Identify which branch each token belongs to through hierarchical nesting
          * Track execution progress across multiple parallel paths

          **2. Embedded Subprocess Analysis**

          * Context column immediately shows which subprocess tokens are executing within
          * Understand nested subprocess relationships through indentation
          * Track token flow across multiple subprocess levels

          **3. Boundary Event Monitoring**

          * Initiator Node column shows which boundary event triggered each token
          * First Executed Node shows the execution path started by boundary events
          * Monitor non-interrupting boundary event token execution

          **4. Process Instance Troubleshooting**

          * Frozen UUID column ensures token identification is always visible
          * Copy UUID functionality enables quick token reference in support tickets
          * Color-coded status tags help identify problematic tokens quickly

          **5. Multi-Level Process Analysis**

          * Hierarchical view supports complex processes with multiple nesting levels
          * Dynamic indentation adapts to any nesting depth
          * All tokens visible by default without manual expansion
        </Tab>
      </Tabs>

      <Card title="Token Documentation" href="/5.1/docs/building-blocks/token" icon="book-open">
        Complete guide to tokens, including token status values, current node status, and detailed token status view.
      </Card>

      <Badge color="green" icon="sparkles">UX Enhancement</Badge>
    </Card>

    ***

    ### **Access management enhancements**

    <Card title="Access management enhancements" icon="shield-check" iconType="duotone">
      <Tabs>
        <Tab title="Overview">
          FlowX.AI 5.3 introduces new workspace-level permissions and a dedicated operations editor role, providing more granular control over process instance management and operations.

          <Info>
            These enhancements enable organizations to delegate operational tasks to dedicated teams without granting full runtime or admin access.
          </Info>
        </Tab>

        <Tab title="New Role">
          **workspace\_operations\_editor**

          A new predefined workspace role designed for operations teams who need to manage process instances without requiring full runtime or admin capabilities.

          <CardGroup cols={2}>
            <Card title="Operations management" icon="rotate">
              Full CRUD access for process instance operations including migration and move token functionality
            </Card>

            <Card title="Process variables" icon="code">
              Edit permission for process variables on active instances across the workspace
            </Card>

            <Card title="Process instances" icon="list">
              Read and edit access to all process instances in the workspace
            </Card>

            <Card title="Workspace user inheritance" icon="layer-group">
              Inherits all base permissions from workspace\_user role including project creation
            </Card>
          </CardGroup>

          **Role Constraints:**

          * Cannot be edited or deleted (predefined role)
          * Extends workspace\_user with operations-specific permissions
          * Does not include broader runtime capabilities (builds, policies, scheduled processes)

          **Use Cases:**

          * Support engineers managing process migrations
          * Operations teams handling token movements
          * Technical support staff editing process variables
        </Tab>

        <Tab title="New Permissions">
          **Workspace-Level Permissions:**

          | Permission                               | Description                                                           | Roles with Access                                                                                           |
          | ---------------------------------------- | --------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------- |
          | **Operations** (Read/Edit/Create/Delete) | Manage process instance operations including migration and move token | `org_admin`, `workspace_admin`, `workspace_runtime_editor`, `workspace_operations_editor`                   |
          | **Operations** (Read/Create only)        | Create operations and view all operations                             | `workspace_user`                                                                                            |
          | **Process Variables** (Edit)             | Edit process variables on active instances                            | `org_admin`, `workspace_admin`, `workspace_user`, `workspace_runtime_editor`, `workspace_operations_editor` |
          | **Process Instances** (Edit)             | Edit process instance data                                            | `org_admin`, `workspace_admin`, `workspace_user`, `workspace_runtime_editor`, `workspace_operations_editor` |

          **Project-Level Permissions:**

          | Permission                             | Description                               | Roles with Access                 |
          | -------------------------------------- | ----------------------------------------- | --------------------------------- |
          | **UI Flows** (Read/Edit/Create/Delete) | Full access to create and manage UI Flows | `project_owner`, `project_editor` |
          | **UI Flows** (Read only)               | View UI Flows definitions                 | `project_viewer`                  |
        </Tab>

        <Tab title="Benefits">
          <CardGroup cols={2}>
            <Card title="Principle of least privilege" icon="shield-check">
              Grant only the permissions needed for specific operational tasks
            </Card>

            <Card title="Dedicated operations teams" icon="users">
              Enable operations teams to work independently without full admin access
            </Card>

            <Card title="Clear separation of concerns" icon="diagram-project">
              Distinguish between runtime management (builds, policies) and operations management (migrations, variables)
            </Card>

            <Card title="Flexible role combinations" icon="puzzle-piece">
              Combine with other workspace roles for customized access patterns
            </Card>
          </CardGroup>
        </Tab>
      </Tabs>

      <Card title="Access Management Documentation" href="/5.1/setup-guides/access-management/roles-permissions-matrix" icon="book-open">
        Complete permissions matrix and role specifications for all FlowX roles.
      </Card>

      <Badge color="blue" icon="shield-check">Access Management</Badge>
    </Card>

    ***

    ### **Performance and stability**

    <Card title="Performance and stability" icon="gauge-high" iconType="duotone">
      FlowX.AI 5.3 includes platform improvements focused on performance, reliability, and operational excellence.

      ## Backend optimizations

      <CardGroup cols={2}>
        <Card title="Optimistic lock improvements" icon="lock">
          Replace retry pattern with capped exponential backoff and infinite retries for better concurrency handling
        </Card>

        <Card title="Events gateway optimization" icon="bolt">
          Update Redis read mode to XREAD BLOCK for more efficient event streaming
        </Card>

        <Card title="Database performance" icon="database">
          Remove unnecessary index on token\_instance.current\_node\_id to improve update performance
        </Card>

        <Card title="Template caching" icon="memory">
          Enhanced caching for reusable templates at runtime reduces latency and improves throughput
        </Card>
      </CardGroup>

      ## Infrastructure updates

      <CardGroup cols={2}>
        <Card title="Connector Topic Pattern" icon="message">
          Added dedicated KAFKA\_CONNECTORS\_TOPIC\_PATTERN variable for connectors, allowing custom topic patterns without breaking other components like document-plugin, data-search, and cms-core
        </Card>

        <Card title="SpiceDB backup" icon="file-shield">
          Documented backup and restore procedures for SpiceDB for disaster recovery
        </Card>

        <Card title="Observability" icon="chart-line">
          Publish Prometheus and OpenTelemetry Helm charts and container images to Harbor
        </Card>

        <Card title="Security updates" icon="shield-check">
          Fix HIGH vulnerabilities in Designer 5.1.x and main branch
        </Card>

        <Card title="Renderer improvements" icon="code">
          Enhanced Angular renderer with action form submit functionality and substitution tag support
        </Card>
      </CardGroup>

      <Badge color="gray" icon="gear">Platform Updates</Badge>
    </Card>

    ***

    ### **Exclusive gateways**

    <Card title="Exclusive gateways" icon="code-branch" iconType="duotone">
      FlowX.AI 5.3 enhances Exclusive Gateway configuration with expression testing capabilities and improved validation.

      <CardGroup cols={2}>
        <Card title="Expression testing" icon="flask">
          Test gateway expressions directly from the configuration panel with real-time validation
        </Card>

        <Card title="Committed version testing" icon="check-circle">
          Test business rules and gateway expressions in committed versions
        </Card>

        <Card title="Code editor integration" icon="code">
          Enhanced code editor with syntax highlighting for complex expressions
        </Card>

        <Card title="Payload synchronization" icon="rotate">
          Test payloads automatically update when rules are saved
        </Card>
      </CardGroup>

      <Badge color="blue" icon="code-branch">Process Logic</Badge>
    </Card>

    ***
  </Tab>

  <Tab title="Bug fixes & stability">
    Comprehensive bug fixes and stability improvements across Designer, renderers, backend services, and data management.

    🎨 [**Designer Fixes**](#designer-fixes) - UI Designer and Integration Designer stability improvements\
    🖥️ [**Renderer Fixes**](#renderer-fixes) - Cross-platform renderer bug fixes for web, iOS, and Android\
    ⚙️ [**Backend Fixes**](#backend-fixes) - Backend stability and performance improvements\
    🗄️ [**Data & Integration Fixes**](#data-and-integration-fixes) - Data mapper and workflow integration fixes

    ### **Designer fixes**

    <Card title="Designer fixes" icon="palette" iconType="duotone">
      FlowX.AI 5.3 resolves numerous Designer issues to improve stability and user experience.

      ## UI designer improvements

      <Accordion title="Configuration & styling">
        * **Fixed styles not applied after undo/redo** in Reusable UI Template config panel
        * **Fixed UI blocking** when slider min value exceeds max value
        * **Fixed warning icon display** in config panel
        * **Fixed expression test modal styles** when opened in resized screen
        * **Fixed UI action section refresh** when selecting different UI template
        * **Fixed UI action section rendering** after clicking 'Add new ui action'
      </Accordion>

      <Accordion title="File upload component">
        * **Fixed loading spinner toggle** not available for Overlay loading behavior
        * **Fixed incomplete loading behavior dropdown**
        * **Fixed default messages** not displayed after undo
        * **Fixed forms in collections handling** for patch actions requests
      </Accordion>

      <Accordion title="UI Flows designer">
        * **Fixed task management error state** when view is selected
        * **Fixed tab content preview** showing content from 2 tabs when adding new tab
      </Accordion>

      <Accordion title="Output parameters">
        * **Fixed currency key management** - can now add/remove currency key in output params
      </Accordion>

      <Accordion title="Exclusive Gateways">
        * **Fixed gateway decisions** can now be modified after initial save
        * **Fixed test payload** updates when rules are saved
        * **Fixed expression propagation** to test modal
      </Accordion>

      ## Frontend runtime fixes

      <Accordion title="Process management">
        * **Fixed context column** showing empty value for tokens in embedded subprocesses
        * **Fixed process params update** from running process instance modal
        * **Fixed long node names** overlapping adjacent columns in Tokens table
        * **Fixed workspace redirect** on page refresh
      </Accordion>

      <Accordion title="Audit & logging">
        * **Fixed audit log subject value** not displayed for process params updates
        * **Fixed toast error messages** to use text from backend request
        * **Added documentation link** to Modify Variables modal info text
      </Accordion>

      <Badge color="purple" icon="palette">Designer Stability</Badge>
    </Card>

    ***

    ### **Renderer fixes**

    <Card title="Renderer fixes" icon="code" iconType="duotone">
      FlowX.AI 5.3 includes comprehensive renderer fixes across all platforms.

      ## Web renderers (Angular & React)

      <Accordion title="File upload component">
        * **Fixed theming** not applied to general loader
        * **Fixed theming** not applied to toast messages
        * **Fixed dynamic key values** not displayed in toast/loading messages
        * **Fixed success toast** displayed when flag is false
      </Accordion>

      <Accordion title="Card & navigation">
        * **Fixed card not expandable** after finishing subprocess started from it (Angular & React)
        * **Fixed card collapse** when next nav area is modal (Angular & React)
        * **Fixed subprocess navigation** closing parent process navigation with multiple hierarchies
      </Accordion>

      <Accordion title="UI events">
        * **Fixed UI event triggering** without user interaction (Angular)
      </Accordion>

      <Accordion title="Call activity">
        * **Fixed call activity UT rendering** when started from embedded process
      </Accordion>

      <Accordion title="Collections & forms">
        * **Fixed button with forms to submit** no longer disabled until template edited (Angular & React)
        * **Fixed multi-select search** filtering (React)
        * **Fixed JSON generation** with special characters in CollectionsV2
      </Accordion>

      ## Mobile renderers

      <Accordion title="Android">
        * **Fixed SSE Event & UI Event** - UI event value displayed instead of SSE value
      </Accordion>

      <Badge color="blue" icon="code">Renderer Stability</Badge>
    </Card>

    ***

    ### **Backend fixes**

    <Card title="Backend fixes" icon="server" iconType="duotone">
      Backend stability and performance improvements across core services.

      ## Process management

      <Accordion title="Process & build issues">
        * **Fixed processes not displayed** in container app list for imported builds
        * **Fixed token state** changing from Aborted to Active during back navigation
        * **Fixed audit logs** for override operations after merge
      </Accordion>

      <Accordion title="Performance">
        * **Fixed /details endpoint** returning cache error for processes with many components
      </Accordion>

      <Accordion title="Process engine">
        * **Fixed token stuck** in receive node when message received after advancing
        * **Fixed action params** copied correctly for child actions when copying node
        * **Fixed metadata preservation** when importing process
      </Accordion>

      ## Security & configuration

      <Accordion title="Authentication">
        * **Fixed service account client secret** configuration parameter in Authorization service
      </Accordion>

      ## Data management

      <Accordion title="Runtime issues">
        * **Fixed FlowxProps.events** mapping at runtime for array of objects
      </Accordion>

      ## Infrastructure

      <Accordion title="Database & events">
        * **Fixed advancing errors** in partition event table
        * **Fixed Liquibase logging** when crashing due to lock
      </Accordion>

      <Badge color="green" icon="server">Backend Stability</Badge>
    </Card>

    ***

    ### **Data and integration fixes**

    <Card title="Data and integration fixes" icon="diagram-project" iconType="duotone">
      Fixes for data mappers and workflow integration features.

      ## Data mapper issues

      <Accordion title="Mapping operations">
        * **Fixed 400 error** when saving mappings
        * **Fixed error** when saving mapping with empty parameters
        * **Fixed unsaved mapping modal** displayed when saving action
        * **Fixed array mapping** - arrays in mapper functions now work correctly
        * **Fixed slice deletion** when updating PDM objects
      </Accordion>

      <Accordion title="Data streams & workflows">
        * **Fixed data stream availability** for older exports during import
        * **Fixed workflow data stream** data appending issue
        * **Fixed legacy mapping** toggle now triggers correctly for call activity
      </Accordion>

      <Accordion title="UI updates">
        * **Fixed start node** not updated in UI after parameters update until refresh
        * **Fixed manifest resource** not found after switching versions
      </Accordion>

      <Info>
        Data mapper fixes ensure reliable workflow integration and process-to-workflow data synchronization.
      </Info>

      <Badge color="blue" icon="diagram-project">Integration Stability</Badge>
    </Card>

    ***
  </Tab>

  <Tab title="Info">
    ## Additional information

    ### Deployment information

    <Info>
      For detailed deployment guidelines, component versions, and upgrade instructions, see the [Deployment Guidelines v5.3.0](./deployment-guidelines-v5.3).
    </Info>

    ### Environment variable updates

    <Info>
      For detailed information on environment variable changes, see the [Update environment variables](./update-environment-variables-5.3) section.
    </Info>

    ### Breaking changes

    <Warning>
      **FlowX Engine Configuration**: v5.3.0 includes a breaking change to the partitioning and archiving configuration structure. If you have enabled data partitioning, you must update your configuration files.
    </Warning>

    <Card title="Migration guide" href="./migrating-from-v5.2-to-v5.3/migration-overview" icon="map">
      Complete migration guide with step-by-step instructions, configuration examples, and troubleshooting
    </Card>

    ### Compatibility

    <CardGroup cols={2}>
      <Card title="Upgrade path" icon="arrow-up-right-dots">
        Upgrade from v5.2.0 requires configuration changes for FlowX Engine partitioning/archiving
      </Card>

      <Card title="Component compatibility" icon="circle-check">
        Compatible with FlowX.AI SDKs (Angular/React/iOS/Android), Designer, and Database 5.3
      </Card>
    </CardGroup>
  </Tab>
</Tabs>
