- Introduced a new 'Page Wrapper' node type to allow multiple components (forms, HTML, tables) to be rendered as a single page, enhancing the flexibility of the process builder.
- Implemented child node management within the Page Wrapper, including adding, updating, and removing child nodes through the process store.
- Enhanced the ProcessFlowCanvas to support the new Page Wrapper node, including event handling for child node interactions and configuration.
- Updated the workflow page to handle submissions and interactions for Page Wrapper nodes, ensuring seamless integration with existing process flows.
- Improved documentation in CLAUDE.md to provide guidance on the new Page Wrapper architecture and its components.
- Refactored related components and store logic to accommodate the new functionality, ensuring a cohesive user experience across the application.
- Introduced a comprehensive node validation system in the process flow builder, enhancing the user experience by providing real-time feedback on node configurations and process integrity.
- Added `useNodeValidation` composable to manage validation logic, including checks for required nodes, configuration completeness, and flow logic.
- Integrated validation indicators in node components (ApiNode, FormNode, GatewayNode, ScriptNode) to visually represent validation issues.
- Created `ValidationIndicator` and `ValidationTooltip` components for displaying validation statuses and detailed messages.
- Updated `ProcessFlowCanvas.vue` to trigger validation on node and edge changes, ensuring immediate feedback during process design.
- Enhanced `processBuilder` store to manage validation results and summary statistics, allowing for a centralized validation state.
- Documented the validation system implementation plan to guide future enhancements and user training.
- Updated HexagonShape.vue, RectangleShape.vue, SwimlaneHorizontal.vue, SwimlaneVertical.vue, and TrapezoidShape.vue to remove label text from shape components, enhancing visual clarity.
- Modified index.vue to clarify node label and description input visibility, ensuring they only appear for process nodes and text annotations.
- Adjusted processBuilder.js to set default label values to an empty string for new nodes, improving consistency in node creation.
- Added configuration options for repeating groups, including minimum and maximum item limits, button text settings, and dynamic field management.
- Implemented functionality to add and remove fields within the repeating group, improving user experience for form customization.
- Updated component type and description mappings to include the new repeating group feature, ensuring consistency across the application.
- Introduced a preview modal for process templates, allowing users to view detailed information and flow before selection.
- Updated the template card styles for improved visual appeal and user interaction, including hover effects and background gradients.
- Enhanced the layout and structure of the template display, ensuring better organization of template details and action buttons.
- Added computed properties for dynamic node styling based on template definitions, improving the visual representation of nodes in the preview.
- Implemented responsive design adjustments to ensure usability across different screen sizes.
- Added a computed property for dynamic shape classes in custom node components (ApiNode, BusinessRuleNode, FormNode, GatewayNode, HtmlNode, NotificationNode, ScriptNode, SubprocessNode) to support various shapes.
- Updated the class bindings in the template to include the new shape classes, improving visual representation of nodes based on their defined shapes.
- Adjusted styles in `nodeStyles.js` to accommodate new shape types (hexagon, trapezoid) and ensure proper rendering without conflicting base styles.
- Enhanced the process builder interface by refining node styles and ensuring consistent behavior across different node types.
- Introduced new HTML and Subprocess nodes in ProcessBuilderComponents.vue, allowing users to add custom HTML content and execute subprocesses within the process flow.
- Updated ProcessFlowNodes.js to include HtmlNode and SubprocessNode components with appropriate properties and rendering logic.
- Enhanced ProcessFlowCanvas.vue to manage the new node types effectively, ensuring proper integration with existing flow functionalities.
- Improved index.vue to support configuration modals for HTML and Subprocess nodes, enhancing user interaction and customization options.
- Refactored process management logic to accommodate new node types, ensuring seamless integration and consistent user experience across the process builder.
- Implemented mobile responsive states for the process builder, allowing for better usability on smaller screens by auto-hiding panels and providing toggle functionality.
- Added node highlighting capabilities to improve user interaction, enabling users to easily identify and navigate to specific nodes within the process flow.
- Updated the ProcessFlowCanvas component to support centering on highlighted nodes, enhancing the visual experience during node selection.
- Improved overall layout and interaction design for mobile and tablet devices, ensuring a seamless user experience across different screen sizes.
- Updated BusinessRuleNodeConfiguration.vue to utilize props for available variables, improving data handling and consistency.
- Enhanced VariableManager.vue to group variables by type, providing a clearer organization and improved user experience.
- Introduced dynamic UI elements for variable usage indication and current value previews, enhancing interactivity.
- Implemented functionality to check variable usage across nodes, ensuring better management and awareness of variable dependencies.
- Added computed properties to force reactivity on variable updates, ensuring configuration modals reflect the latest data.
- Improved overall code clarity and maintainability through refactoring and enhanced comments.
- Introduced a new ScriptNodeConfiguration component for configuring JavaScript tasks within the process builder.
- Added ScriptNodeConfigurationModal for user-friendly script task setup, including input and output variable management.
- Updated process management logic to handle script variables directly within the process store, improving variable management and accessibility.
- Enhanced existing components to support the new script task feature, ensuring seamless integration with the process flow.
- Improved overall user experience with intuitive UI elements and clear documentation for the new functionality.
- Added functionality to handle node additions from drag & drop in ProcessFlowCanvas, ensuring immediate visual feedback and persistence in application state.
- Implemented logic in the process store to prevent duplicate nodes when adding new nodes from the canvas.
- Enhanced server-side logging to track process updates, including node and edge counts for better debugging.
- Improved node extraction logic in the process builder store to create placeholder nodes from edge references when no nodes are present.
- Added debug logging for saving process data to facilitate better tracking of changes in the application state.
- Introduced FormHistoryModal and ProcessHistoryModal components for viewing and restoring previous versions of forms and processes.
- Implemented version tracking in the backend with new API endpoints for fetching and restoring historical data.
- Added database migrations for form and process history tables to support versioning functionality.
- Enhanced form and process update logic to save previous versions before modifications.
- Updated documentation to include details on the new history system and its benefits for data management.
- Improved user experience with intuitive modals for accessing historical data and restoring previous versions.
- Introduced intelligent synchronization for nodes and edges in ProcessFlowCanvas, preventing unnecessary re-renders and improving performance.
- Added state management flags to prevent recursive updates during node and edge changes.
- Implemented explicit sync method for manual canvas updates, enhancing control over the rendering process.
- Updated ProcessSettingsModal to change the label for JSON export to "Source" for better clarity.
- Enhanced VariableManager with improved styling and default value handling, including validation for JSON objects.
- Updated navigation to remove unused icons and improve overall UI consistency.
- Added support for restoring deleted processes in the API, allowing for better data management and recovery options.
- Enhanced process management with new filters and improved loading states in the manage process view.
- Implemented complete API system with REST endpoints for all process operations, including CRUD functionality.
- Added support for direct process linking via URL parameters, improving navigation and usability.
- Enhanced save functionality with success/error notifications and improved state management.
- Fixed navigation issues, including unsaved changes detection and automatic URL synchronization.
- Resolved Vue Flow interference, allowing for seamless connector dragging between nodes.
- Ensured backward compatibility for legacy process definitions, automatically upgrading them.
- Introduced comprehensive toast notifications for user feedback on all operations.
- Optimized performance by reducing re-renders and improving memory management.
- Enhanced error handling with robust validation and graceful recovery throughout the system.
- Updated UI consistency across form builder and process builder management interfaces.
- Added a new ProcessTemplatesModal component for selecting process flow templates, improving user experience in template management.
- Introduced a ProcessSettingsModal component for comprehensive process configuration, including process info, execution settings, and permissions management.
- Updated BusinessRuleNodeConfiguration and FormNodeConfiguration components to enhance user interaction and streamline configuration processes.
- Implemented new API endpoints for managing form fields and settings, allowing for better integration and data handling.
- Enhanced existing components with improved styling and functionality, including dynamic field conditions and bidirectional data mapping.
- Updated nuxt.config.js to include security settings for API routes, ensuring better protection against XSS and request size limitations.
- Removed the deprecated TaskNodeConfiguration component to streamline the process builder interface.
- Improved documentation to reflect recent changes and enhancements in the process builder features.
- Improved drag-and-drop support in the Process Builder by setting drag data to 'text/plain' for better compatibility, especially on Mac.
- Added visual feedback during drag operations by applying a 'dragging' class to the event target.
- Updated the drop event handler to parse the dragged data correctly and prevent event propagation.
- Introduced a computed property for gateway available variables to enhance node configuration options.
- Adjusted the layout of the properties panel to accommodate a new VariableManager component for better variable management.
- Introduced new components for form selection and gateway condition management within the process builder.
- Implemented a `FormSelector` component for selecting and managing forms, including search functionality and loading states.
- Developed a `GatewayConditionManager` component to manage conditions for gateways, allowing users to define and edit conditions visually.
- Created a `ProcessBuilderComponents` component to facilitate the addition of core components in the process builder.
- Enhanced the `ProcessFlowCanvas` to support new features, including edge selection and improved node management.
- Updated the backend API to handle CRUD operations for forms and processes, including error handling for associated tasks.
- Integrated new database models for forms and processes in Prisma, ensuring proper relationships and data integrity.
- Improved state management in the form builder store to accommodate new features and enhance user experience.
- Introduced a new process builder feature with a dedicated page for managing processes.
- Implemented a `ProcessFlowCanvas` component utilizing Vue Flow for visual process management.
- Created custom node types for the process flow, including Start, Task, Form, Gateway, Script, and End nodes.
- Developed a Pinia store for managing process data, including actions for creating, updating, and deleting processes and nodes.
- Added a search functionality for filtering processes and a confirmation dialog for process deletion.
- Integrated responsive design adjustments for better usability across devices.
- Included styles for custom nodes and flow components to enhance visual representation.
- Updated navigation to include links to the new process builder and management features.