Floogos Update — Week 21, May 2026 (May 18–24)

Summary

Week 21 focuses on the workflow editor, which gains three productivity improvements: visual node grouping in draggable containers with custom color and title, a node search button now accessible from the toolbar, and a one-click export of the full diagram as a PNG image. In the engine, two critical bugs were resolved in the SQL query nodes: special characters in string values breaking the query, and batch-mode execution traces not appearing in the history panel.

New Features

Visual Node Grouping in the Editor

Canvas nodes can now be grouped inside visual containers with a custom color and title. Groups move as a single block and are purely visual — the execution engine ignores the containers and processes only the inner nodes.

• Create a group — Select two or more nodes, right-click, and choose “Group selection”. A semi-transparent container wraps the selected nodes with 48 px of padding on each side.
• Editable title — Click the group title to edit it inline. The change is persisted when the workflow is saved.
• Description — An optional description field below the title is also editable inline.
• Custom color — A color palette button on the group lets you choose from 8 preset colors to visually identify different functional blocks.
• Resize — Drag the container corners or edges to adjust its size. Minimum size is 200×100 px.
• Ungroup — Right-click on the group → “Ungroup”. Nodes return to their absolute positions and the container is removed.
• Persistence — Groups, along with their children, colors, titles, and dimensions, are correctly saved and restored when reloading the workflow.
• No execution impact — The canvas-to-engine converter automatically filters out nodes of type group, so they are never executed.

Node Search in the Toolbar

The node search, previously accessible only via the Ctrl+B shortcut, now has a dedicated button in the editor toolbar in both toolbar modes.

• The search button (SearchIcon) is visually highlighted when the panel is open, indicating its active state.
• In the compact toolbar, the “Search node (Ctrl+B)” item appears in the Edit dropdown menu.
• The panel filters up to 12 nodes by name or type, supports ↑ ↓ and Enter keyboard navigation, and closes with Esc.
• Selecting a result animates the canvas and centers the selected node with a smooth fit-view transition.

Download Workflow as PNG Image

A new Download image button in the toolbar exports the complete workflow diagram as a 1920×1080 px PNG file.

• Shortcut — Ctrl+Shift+E.
• File name — workflow-<workflow-name>.png.
• The image includes all visible canvas nodes and edges with the active theme background color (dark or light).
• In the compact toolbar, the option appears in the File menu with the shortcut displayed next to the item.
• No server request is made — the PNG is generated entirely in the browser using the html-to-image library.

Improvements

Dynamic Version in the User Menu

The version number shown in the user dropdown menu (top-right corner) now reads directly from package.json at build time via the __APP_VERSION__ variable injected by Vite. Previously it showed a hardcoded value that became stale between releases. Starting with version 2.6.6 the number is always correct without manual intervention.

Bug Fixes

SQL: Apostrophes and Special Characters in Values Break the Query

The sqlQuery (MySQL) and sqlQueryMSSQL (SQL Server) nodes were failing with ER_PARSE_ERROR or an equivalent syntax error when a data value contained an apostrophe or other special character — for example, Mont Sant'Angelo-CC Gargano.

Root cause: resolveConfigVariables in the execution engine was processing the query config field and substituting {{field}} variables directly into the query text before the SQL module could convert them into driver parameters. Values containing apostrophes were already embedded in the SQL string, producing malformed queries.

Fix: The engine now injects the original query template into a _rawQuery_ field before the variable resolution phase, marking it as a protected field (skipKeys). SQL modules read _rawQuery_ to build the parameterized query — ? placeholders in MySQL and named parameters @field in SQL Server — letting the client driver handle escaping and type conversion internally. No data value ever reaches the SQL text as a raw string.

SQL: Execution Traces Were Not Appearing in the History for Batch Nodes

The sqlQuery and sqlQueryMSSQL nodes running inside an Iterator in batch mode were writing entries to the workflow_traces database table, but they were not visible in the execution history view in the editor.

Root cause: The processIteratorBatch function in the engine was building each iteration’s config without including the workflowName and origenid fields. The trace logger stored workflow_name = null in the database. The /api/traces/workflow/:workflowName endpoint queries by that field, so it returned empty results.

Fix: processIteratorBatch now correctly propagates workflowName and origenid to the config of each batch iteration, ensuring traces are findable from the history panel.

Technical Notes

• The sqlQuery and sqlQueryMSSQL modules were bumped to version 2.1.3.
• The _rawQuery_ field was added to the skipKeys list in resolveConfigVariables to ensure it is never modified by the variable resolution cycle.
• buildParameterizedQuery uses the regular expression /'?\{\{\s*([^}@#$\n]+?)\s*\}\}'?/g to capture both {{field}} and '{{field}}' (with SQL apostrophes wrapping the variable).
• GroupNode uses the NodeResizer component from @xyflow/react for native resizing and zIndex: -1 to remain visually behind its child nodes.
• The convertReactFlowToWorkflow.js converter filters out nodes of type group before building the engine payload.
• Image download uses getNodesBounds and getViewportForBounds from @xyflow/react to calculate the optimal viewport, then calls toPng from html-to-image at 1920×1080 resolution.
• The dynamic version is managed in src/version.ts via declare const __APP_VERSION__: string, resolved at build time by the define entry in vite.config.ts.