Anirudh Vitala - Hi all πŸ‘‹We embed ThoughtSpo...
# dev-help
a
Hi all πŸ‘‹ We embed ThoughtSpot Liveboards inside our SaaS application (Visual Embed SDK, trusted-auth, viewer-level end users) and are evaluating whether embedded Liveboards can match the usability of our natively built dashboard views. We put together a small interactive prototype showing the 10 UX behaviors we need β€” attached as a self-contained HTML file (just download and open in any browser, no server or network needed; all data is fictional). Section numbers in the file match the list below. For each item we'd love to know: supported today (and how β€” Liveboard config / TML / Embed SDK / custom actions / CSS customization), on the roadmap, or a recommended workaround: 1. Per-visualization filters β€” each table on a tab gets its own viewer-facing filters, instead of one global filter affecting every viz 2. In-table drill-down β€” rows expand in place with a chevron (Category β†’ Collection β†’ Product), instead of right-click drill replacing the whole visualization 3. Inline filter dropdowns β€” filter chips open a searchable checkbox dropdown anchored to the chip, instead of a modal popup with a select-then-Done flow 4. Row/cell left-click β†’ detail popup β€” full row payload delivered to the host app on a plain left-click (not via the right-click context menu) 5. Thumbnails in table cells β€” image-URL columns rendered as inline images 6. Image tile on a Liveboard β€” static or driven by a data column 7. Fluid resizing β€” the embed reflows smoothly when the host app's side nav collapses/expands (no clipped tiles or reload) 8. Table tiles auto-fit height to their row count β€” a 3-row table shouldn't render a large empty area 9. Suppress {Null} buckets by default β€” without adding an explicit IS NOT NULL filter to every Answer 10. Viewer-facing metric selector on one chart β€” chips/tabs that switch the plotted measure, instead of one Answer per metric Happy to expand on any of these β€” thanks! πŸ™ https://cdn.discordapp.com/attachments/1143209464875462756/1526999011335340302/embedded-liveboard-ux-prototype-public.html?ex=6a591026&is=6a57bea6&hm=17c48a989d5369c6d652e6644663af66c1e10e9943cd97bb3eb2662f35780298&
a
message has been deleted
s
Solution: Great evaluation set. Based on current ThoughtSpot embed docs, here’s the status for each requirement: 1. Per-visualization filters (viewer-facing) - **Partially supported**: Liveboard UI filters are global at Liveboard level. - **Workaround**: embed each visualization separately (
LiveboardEmbed
+
vizId
) and assign per-viz
runtimeFilters
in SDK (host-controlled, not native per-viz filter chips). - Docs show filter layers and that Liveboard filters apply across visualizations. Also runtime filters can be set via SDK. 2. In-table drill-down via expandable row chevrons - Not documented as supported in Liveboard table UX. - Current documented drill is contextual menu drill actions (e.g.,
Action.DrillDown
), not inline row expansion UI. 3. Inline filter dropdown anchored to chip (no modal) - Not documented as supported. - Docs describe Liveboard filters opening filter UI; no documented SDK option to switch to chip-anchored inline dropdown behavior. 4. Left-click row/cell β†’ full payload to host app - **Supported pattern (with caveat)**: - You can use embed events for viz interactions. - Since 9.2.0.cl, contextual menu trigger can be set to left-click (
contextMenuTrigger
), and docs explicitly warn interaction with
EmbedEvent.VizPointClick
. - **Recommended workaround for deterministic behavior**: use Custom Actions +
EmbedEvent.CustomAction
to deliver payload in a controlled way (menu-driven). 5. Thumbnails rendered in table cells from image URL columns - I could not find this in the official ThoughtSpot documentation as a table-cell rendering mode. 6. Image tile on a Liveboard (static or data-driven) - **Partially supported**: - Docs mention Note tiles (Early Access) with custom text/images/links in new Liveboard experience. - Availability may require admin enablement/support. 7. Fluid resizing when host nav collapses/expands
- **Supported/expected via embed sizing controls**: - Use responsive container sizing (
frameParams
). - For Liveboards, docs list Full Height behavior (auto-adjust height to Liveboard content). - If width changes from host layout, ensure container CSS recalculates width without hard pixel locks. 8. Table tiles auto-fit height to row count - Not documented as a per-tile auto-height-to-row-count feature. - **Workaround**: host-controlled layout sizing or separate visualization embeds where container height can be adjusted in app logic. 9. Suppress
{Null}
buckets by default globally
- Not a documented global display toggle. - **Workaround**: enforce in data model/search query filters (or per-object logic), since docs describe filter layering (model/search/runtime/liveboard). 10. Viewer-facing metric selector chips/tabs on one chart - Not clearly documented as a native β€œmetric switcher chip” in embedded Liveboard viewer mode. - **Workarounds**: - Multiple visualizations (one per metric) + tab layout. - Host-side controls that trigger runtime parameter/filter changes or swap embedded viz. --- Suggestions: - For your parity goal with native dashboards, a common hybrid pattern is: 1) Use Liveboard for core analytics UX, 2) Hide/limit actions (
hiddenActions
/
disabledActions
), 3) Add host-native controls (metric selector, row-detail drawer) wired through SDK events + runtime overrides/custom actions. - For #4 specifically, custom actions are the safest enterprise pattern for passing structured context to your app. - For roadmap certainty on #2/#3/#5/#8/#10, escalate through ThoughtSpot support/account team; public docs don’t provide committed roadmap timelines. --- Docs: - Liveboard embed + customization: https://developers.thoughtspot.com/docs/embed-liveboard
- Action IDs / contextual menu actions: https://developers.thoughtspot.com/docs/actions#_contextual_menu - Filters overview and layers: https://developers.thoughtspot.com/docs/filters-overview#_overview - What’s new (context menu left-click, note tiles mention): https://developers.thoughtspot.com/docs/whats-new-prev-releases#_contextual_menu_behavior - Visual Embed Playground (Liveboard options incl. Full Height/custom styles/events): https://developers.thoughtspot.com/docs/dev-playground#_liveboard
a
A quick follow-up, @spotter-code , do all the embedding approaches use iframe or is there a non-iframe way of embedding dashboards or visualizations?
s
Yes β€” the standard embedding approaches are iframe-based. - Visual Embed SDK still renders ThoughtSpot content in an iframe; the SDK adds a JavaScript layer for config, events, actions, auth flows, and customization. - Direct embed without the SDK is also iframe-based via a generated embed URL. If you want a non-iframe approach, the docs only point to pulling data via the Liveboard REST API and rendering it yourself in your app with your own charting/UI layer, rather than embedding a native ThoughtSpot dashboard or visualization. So the practical answer is: - Native ThoughtSpot dashboard / visualization embed: iframe - Non-iframe: only by fetching data and building the UI yourself, not by embedding the ThoughtSpot visual component itself. You are interacting with an AI system. Responses should be reviewed.
a
@spotter-code , does https://developers.thoughtspot.com/docs/react-app-embed also use iframes?
s
Yes β€”
react-app-embed
still uses iframes. That page is the React wrapper around the same Visual Embed components like
AppEmbed
,
LiveboardEmbed
, and `SearchEmbed`; it changes the developer experience, not the rendering model. The docs describe embedding ThoughtSpot components in a React application using those embed components, and the examples pass
frameParams
, which is part of the iframe-based embed model. If you want a non-iframe approach, that would mean using APIs and building the UI/visualizations yourself rather than using `AppEmbed`/`LiveboardEmbed`. https://developers.thoughtspot.com/docs/react-app-embed https://github.com/thoughtspot/developer-examples/blob/main/visual-embed/spotter/spotter-embed/README.md You are interacting with an AI system. Responses should be reviewed.