Zuar Portal v 1.18: Multi-Query HTML Blocks for Richer Data Experiences

A great data experience isn’t just a dashboard on a page; it’s an experience that brings the right context together, at the right time, in a way that makes it easy to act.

That’s the thinking behind Zuar’s Data Experience Platform (DXP): helping teams deliver connected, branded, user-friendly experiences on top of their data - without forcing everything into a one-size-fits-all UI.

With Zuar Portal v1.18.0, we’re making one of the most flexible building blocks in Portal significantly more capable: the HTML Block can now support multiple SQL-Based data source queries in a single block.

The headline update: multiple data sources, one experience surface

Historically, if you wanted one custom “experience module” (like an executive summary card, an interactive KPI panel, or a guided workflow) to pull from more than one dataset, you had two common options:

pre-join everything upstream,
split the experience across multiple blocks and stitch it together visually, or
call in additional data or different levels of aggregation through Portal native API functions.

In v1.18.0, you can keep the experience cohesive:

Configure multiple queries on one HTML Block
Render a unified UI that blends results from different sources
Keep your experience logic in one place—faster to build, easier to maintain

This is a big deal for DXP-style delivery, because real user experiences rarely rely on a single system. Sales context, operational signals, targets, forecasts, and “what changed” narratives often live in different places. Now, with one simple to manage multi-query mechanism that sends only the precise queries to each source necessary to construct a block, your Portal experiences can reflect that reality.

The API change that makes it possible: `currentBlock.queryResults`

To support multi-query HTML blocks, Portal exposes query results through:

currentBlock.queryResults — an array of result objects (one per configured query)

Each entry includes:

data — an array of row objects
columns — an array of column names

This allows you to treat your HTML Block like a true “experience component”: assemble multiple inputs and produce a single, intentional output for your users.

Deprecations to know about

If you’ve built HTML Blocks before, you may have used:

currentBlock.data
currentBlock.columns

Those are now deprecated in favor of the multi-query-capable approach:

currentBlock.queryResults[0].data
currentBlock.queryResults[0].columns

(They still work as shortcuts to the first query, but new development should use queryResults so your blocks are ready for multi-query patterns.)

Designing safer extensions: Isolated mode for external libraries

DXP implementations often require more than HTML—custom interactivity, specialized visualizations, or third-party libraries.

The HTML Block includes an Isolated option:

When enabled, the block runs in an iframe
This prevents conflicts between external libraries and Portal’s built-in JavaScript

If you’re bringing in external dependencies, Isolated mode is the recommended approach.

Better load and export behavior for dynamic experiences

As experiences get richer, blocks do more asynchronous work (API calls, delayed rendering, animations). Portal provides helper callbacks so it knows when your block is truly finished:

currentBlock.getOnLoadedCallback() — call when your async loading/rendering is done
currentBlock.getOnAnimatedCallback() — call when animations are complete (for clean exports)

This helps keep the end-user experience smooth and ensures exports capture the final intended state.