@thoughtspot/visual-embed-sdk 1.52.2-beta.2 → 1.53.1

package/src/embed/ts-embed.ts

@@ -46,6 +46,7 @@ import {
     getValueFromWindow,
     deserializeParam,
     getScrollableAncestors,
+    setParamIfDefined,
 } from '../utils';
 import { getCustomActions } from '../utils/custom-actions';
 import {
@@ -80,6 +81,7 @@ import {
     BaseViewConfig,
 } from '../types';
 import { uploadMixpanelEvent, MIXPANEL_EVENT } from '../mixpanel-service';
+import { summarizeRuntimeDataForTelemetry } from '../utils/runtimeTelemetry';
 import { processEventData, processAuthFailure } from '../utils/processData';
 import { version } from '../utils/sdk-version';
 import {
@@ -129,6 +131,98 @@ const UPDATE_EMBED_PARAMS_SETTLE_MS = 200;
 // truthy and parses to {}.
 const NO_RUNTIME_PARAMS = '&';
 
+/**
+ * Params kept on the iframe `src` when `excludeConfigFromURL` is set. The rest
+ * are sent in the APP_INIT payload.
+ * @internal
+ */
+export const BOOTSTRAP_URL_PARAMS: ReadonlySet<string> = new Set<string>([
+    // Marks the app as embedded.
+    Param.EmbedApp,
+    // The host page URL, used to validate the postMessage origin.
+    Param.HostAppUrl,
+    // The SDK version.
+    Param.Version,
+    // The authentication type set in init.
+    Param.AuthType,
+    // Whether the app signs the user in automatically.
+    Param.AutoLogin,
+    // Stops the app from redirecting to its login page.
+    Param.DisableLoginRedirect,
+    // Forces the SAML redirect for EmbeddedSSO.
+    Param.ForceSAMLAutoRedirect,
+    // Set for cookieless trusted authentication.
+    Param.cookieless,
+    // Lets the app use the pre-fetched auth info.
+    Param.preAuthCache,
+    // Blocks access to the full app outside the embed.
+    Param.blockNonEmbedFullAppAccess,
+    // The org to load, which the auth info depends on.
+    Param.OverrideOrgId,
+    // The host window height when the iframe loads.
+    Param.ViewPortHeight,
+    // The host window width when the iframe loads.
+    Param.ViewPortWidth,
+    // The app's client log level.
+    Param.ClientLogLevel,
+    // Lets the app override the native console.
+    Param.OverrideNativeConsole,
+    // An extra Pendo tracking key.
+    Param.PendoTrackingKey,
+    // The locale for number formatting.
+    Param.NumberFormatLocale,
+    // The locale for date formatting.
+    Param.DateFormatLocale,
+    // The currency format.
+    Param.CurrencyFormat,
+    // The UI language.
+    Param.Locale,
+    // Turns on dark mode.
+    Param.IsDarkMode,
+    // Turns on the radiant theme that dark mode needs.
+    Param.RadiantThemeEnabled,
+    // Marks a SearchEmbed or SearchBarEmbed.
+    Param.searchEmbed,
+    // Marks a LiveboardEmbed.
+    Param.livedBoardEmbed,
+    // Marks a SpotterAgentEmbed.
+    Param.isSpotterAgentEmbed,
+    // Marks a SpotterEmbed.
+    Param.SpotterEnabled,
+    // Marks an AppEmbed.
+    Param.IsFullAppEmbed,
+    // Legacy flag for the onBeforeGetVizData API intercept.
+    Param.IsOnBeforeGetVizDataInterceptEnabled,
+    // Lets the host override links in the app.
+    Param.LinkOverride,
+    // Turns on version 2 of the link overrides.
+    Param.EnableLinkOverridesV2,
+    // Stops links from opening in a new tab.
+    Param.DisableRedirectionLinksInNewTab,
+    // Uses replaceState instead of pushState for app navigation.
+    Param.OverrideHistoryState,
+    // Shows search results as a table.
+    Param.ForceTable,
+    // The URL of the custom string IDs file.
+    Param.StringIDsUrl,
+    // The data sources that search opens with.
+    Param.DataSources,
+    // Exposes translation IDs in the app.
+    Param.ExposeTranslationIDs,
+    // The URL of the custom icon sprite.
+    Param.IconSpriteUrl,
+    // The tag that filters the metadata lists in an AppEmbed.
+    Param.Tag,
+    // Set when a Liveboard embed shows a single visualization (vizId).
+    Param.vizEmbed,
+    // Whether search opens with the last-selected data sources.
+    Param.UseLastSelectedDataSource,
+    // The query mode Spotter opens in.
+    Param.DefaultQueryMode,
+    // The initial search query. Omitted with excludeSearchTokenStringFromURL.
+    Param.searchTokenString,
+]);
+
 /**
  * The event id map from v2 event names to v1 event id
  * v1 events are the classic embed events implemented in Blink v1
@@ -165,6 +259,8 @@ export class TsEmbed {
 
     protected isAppInitialized = false;
 
+    private initDataParams: Partial<Record<Param, any>> & Record<string, any> = {};
+
     /**
      * A reference to the iframe within which the ThoughtSpot app
      * will be rendered.
@@ -255,9 +351,10 @@ export class TsEmbed {
             ...viewConfig,
         };
         this.registerAppInit();
-        uploadMixpanelEvent(MIXPANEL_EVENT.VISUAL_SDK_EMBED_CREATE, {
-            ...viewConfig,
-        });
+        uploadMixpanelEvent(
+            MIXPANEL_EVENT.VISUAL_SDK_EMBED_CREATE,
+            summarizeRuntimeDataForTelemetry(viewConfig),
+        );
         const embedConfig = getEmbedConfig();
         if (embedConfig) {
             this.embedConfig = embedConfig;
@@ -585,6 +682,19 @@ export class TsEmbed {
         return this.getDefaultAppInitData();
     }
 
+    private withInitDataParams(appInitData: Record<string, any>): Record<string, any> {
+        if (isEmpty(this.initDataParams)) {
+            return appInitData;
+        }
+        return {
+            ...appInitData,
+            embedParams: {
+                ...this.initDataParams,
+                ...(appInitData.embedParams || {}),
+            },
+        };
+    }
+
     /**
      * Send Custom style as part of payload of APP_INIT
      * @param _
@@ -592,7 +702,7 @@ export class TsEmbed {
      */
     private appInitCb = async (_: any, responder: any) => {
         try {
-            const appInitData = await this.getAppInitData();
+            const appInitData = this.withInitDataParams(await this.getAppInitData());
             this.isAppInitialized = true;
             responder({
                 type: EmbedEvent.APP_INIT,
@@ -798,6 +908,15 @@ export class TsEmbed {
         if (this.embedConfig.currencyFormat) {
             queryParams[Param.CurrencyFormat] = this.embedConfig.currencyFormat;
         }
+        // The view config wins over init, so an embed can opt out of a dark
+        // mode set in `init`. `??` and not `||`, so that an explicit `false`
+        // overrides an init-level `true`.
+        const isDarkMode = this.viewConfig.isDarkMode ?? this.embedConfig.isDarkMode;
+        setParamIfDefined(queryParams, Param.IsDarkMode, isDarkMode, true);
+        // The app's dark mode lives in its radiant theme, so turn that on too.
+        if (isDarkMode) {
+            queryParams[Param.RadiantThemeEnabled] = true;
+        }
 
         const {
             disabledActions,
@@ -953,7 +1072,7 @@ export class TsEmbed {
     }
 
     protected getEmbedParams() {
-        const queryParams = this.getEmbedParamsObject();
+        const queryParams = this.getUrlQueryParamsObject();
         return getQueryParamString(queryParams);
     }
 
@@ -962,6 +1081,25 @@ export class TsEmbed {
         return params;
     }
 
+    protected getUrlQueryParamsObject(): Record<any, any> {
+        const queryParams = this.getEmbedParamsObject();
+        if (!this.isConfigExcludedFromUrl()) {
+            this.initDataParams = {};
+            return queryParams;
+        }
+        const urlParams: Record<any, any> = {};
+        const excludedParams: Partial<Record<Param, any>> & Record<string, any> = {};
+        Object.entries(queryParams).forEach(([key, value]) => {
+            if (BOOTSTRAP_URL_PARAMS.has(key)) {
+                urlParams[key] = value;
+            } else {
+                excludedParams[key] = deserializeParam(value);
+            }
+        });
+        this.initDataParams = excludedParams;
+        return urlParams;
+    }
+
     protected getRootIframeSrc() {
         const query = this.getEmbedParams();
         return this.getEmbedBasePath(query);
@@ -1236,26 +1374,12 @@ export class TsEmbed {
     }
 
     /**
-     * Resolves the configured preRenderContainer to a live element. A string
-     * selector is re-queried on every call so a remounted container (E.g.: React
-     * replacing the node) resolves to the fresh element; an element passed
-     * directly cannot be re-resolved.
-     *
-     * With nothing configured the frame goes into the host element's nearest
-     * scrolling ancestor, falling back to `document.body`.
-     *
-     * The wrapper is absolutely positioned, so it follows the page for free —
-     * but only while it sits inside whatever scrolls. `document.body` is right
-     * only when the document itself is the scroller; an app that scrolls an
-     * inner element instead left the frame pinned to the viewport while the page
-     * moved under it (SCAL-338563). Being inside the scroller also lets wheel
-     * events chain out of the frame into it, which they cannot do from
-     * `document.body`.
-     *
-     * A scrolling ancestor is layout chrome rather than route content, so it
-     * outlives the embed in practice; and if it does go, the host element goes
-     * with it and this instance is remounting anyway.
-     * `reconcilePreRenderContainer` re-runs this on a detached container.
+     * Resolves the configured preRenderContainer, or defaults to the host's
+     * nearest scrolling ancestor (document.body if none). The absolutely
+     * positioned wrapper only follows the page while it sits inside what
+     * scrolls, so body is right only when the document itself scrolls — an inner
+     * scroller left the frame pinned to the viewport (SCAL-338563). A string
+     * selector is re-queried each call so a remounted container resolves fresh.
      */
     private resolvePreRenderContainerTarget(): HTMLElement {
         const containerConfig = this.getPreRenderConfig().containerSelector;
@@ -1821,6 +1945,12 @@ export class TsEmbed {
         uploadMixpanelEvent(MIXPANEL_EVENT.VISUAL_SDK_RENDER_CALLED, {
             embedComponentType: this.viewConfig.embedComponentType,
         });
+        uploadMixpanelEvent(MIXPANEL_EVENT.VISUAL_SDK_INIT_ACTIONS, {
+            embedComponentType: this.viewConfig.embedComponentType,
+            hiddenActions: this.viewConfig.hiddenActions ?? [],
+            visibleActions: this.viewConfig.visibleActions ?? [],
+            disabledActions: this.viewConfig.disabledActions ?? [],
+        });
         if (!getIsInitCalled()) {
             logger.error(ERROR_MESSAGE.RENDER_CALLED_BEFORE_INIT);
         }
@@ -2079,6 +2209,28 @@ export class TsEmbed {
     // blocked.
     protected preRenderParamsApplied: Promise<void> = Promise.resolve();
 
+    protected isConfigExcludedFromUrl(): boolean {
+        const flag =
+            this.viewConfig.additionalFlags?.excludeConfigFromURL ??
+            this.embedConfig.additionalFlags?.excludeConfigFromURL;
+        return flag === true || flag === 'true';
+    }
+
+    protected async triggerUpdateEmbedParams(): Promise<void> {
+        try {
+            const params = await this.getUpdateEmbedParamsObject();
+            this.trigger(HostEvent.UpdateEmbedParams, params);
+        } catch (error) {
+            logger.error(ERROR_MESSAGE.UPDATE_PARAMS_FAILED, error);
+            this.handleError({
+                errorType: ErrorDetailsTypes.API,
+                message: error?.message || ERROR_MESSAGE.UPDATE_PARAMS_FAILED,
+                code: EmbedErrorCodes.UPDATE_PARAMS_FAILED,
+                error: error?.message || error,
+            });
+        }
+    }
+
     protected beforePrerenderVisible(): void {
         // We can ignore this as its a bit expensive and the newer customers
         // have moved on to UpdateEmbedParams supported clusters
@@ -2089,16 +2241,7 @@ export class TsEmbed {
         this.preRenderParamsApplied = new Promise<void>((resolve) => {
             this.executeAfterEmbedContainerLoaded(async () => {
                 try {
-                    const params = await this.getUpdateEmbedParamsObject();
-                    this.trigger(HostEvent.UpdateEmbedParams, params);
-                } catch (error) {
-                    logger.error(ERROR_MESSAGE.UPDATE_PARAMS_FAILED, error);
-                    this.handleError({
-                        errorType: ErrorDetailsTypes.API,
-                        message: error?.message || ERROR_MESSAGE.UPDATE_PARAMS_FAILED,
-                        code: EmbedErrorCodes.UPDATE_PARAMS_FAILED,
-                        error: error?.message || error,
-                    });
+                    await this.triggerUpdateEmbedParams();
                 } finally {
                     setTimeout(resolve, UPDATE_EMBED_PARAMS_SETTLE_MS);
                 }
@@ -2247,19 +2390,21 @@ export class TsEmbed {
             return;
         }
         const { zIndex } = this.getPreRenderConfig();
+        // A hidden pre-render frame must add no scroll space to the host page.
         const preRenderHideStyles = {
             opacity: '0',
             pointerEvents: 'none',
             zIndex: zIndex !== undefined ? String(zIndex) : '-1000',
-            position: 'absolute',
+            // Resolves to the viewport, so the hidden frame belongs to no
+            // scroll container's overflow; syncPreRenderStyle restores absolute
+            // on show.
+            position: 'fixed',
             top: '0',
             left: '0',
             overflow: 'hidden',
-            // Keeps the measured size — so the next show needs no resize, which
-            // is the point of pre-rendering — while lifting the box out of
-            // the container's scrollable area. Overflow only extends
-            // downwards, so a hidden frame parked above the top edge adds
-            // none, where one left at full height shows as blank scroll space.
+            // The one exception: a transformed or contained ancestor captures
+            // `fixed`; parking above the top edge keeps it out of that
+            // overflow.
             transform: PRERENDER_PARKED_TRANSFORM,
         };
         setStyleProperties(this.preRenderWrapper, preRenderHideStyles);

package/src/index.ts

@@ -34,6 +34,13 @@ import { SearchBarEmbed, SearchBarViewConfig } from './embed/search-bar';
 import { SpotterAgentEmbed, SpotterAgentEmbedViewConfig, BodylessConversation, BodylessConversationViewConfig} from './embed/bodyless-conversation';
 import { SpotterEmbed, SpotterEmbedViewConfig, SpotterChatViewConfig, SpotterSidebarViewConfig, SpotterAnalystConfig, SpotterQueryMode, SpotterShareConversationConfig, StarterPromptsConfig, StarterPromptCategory, StarterPreviewDataCategory, StarterPromptQuestion, ConversationEmbed, ConversationViewConfig } from './embed/conversation';
 import { SpotterVizConfig, SpotterVizStarterPrompt, SpotterVizLoaderTip } from './embed/spotter-viz-utils';
+import { SpotterExperienceVersion } from './embed/spotter-utils';
+import {
+    LiveboardOverride,
+    LiveboardDataSourceOverride,
+    LiveboardFilterQuery,
+    LiveboardParameterQuery,
+} from './embed/liveboard-override-utils';
 import {
     AuthFailureType, AuthStatus, AuthEvent, AuthEventEmitter,
 } from './auth';
@@ -84,7 +91,9 @@ import {
     VisualizationOverrides,
 } from './types';
 import { CustomCssVariables } from './css-variables';
-import { AnswerService, SessionInterface, UnderlyingDataPoint } from './utils/graphql/answerService/answerService';
+import {
+    AnswerService, SessionInterface, UnderlyingDataPoint, SortOptions,
+} from './utils/graphql/answerService/answerService';
 import { getEmbedConfig } from './embed/embedConfig';
 import { uploadMixpanelEvent, MIXPANEL_EVENT } from './mixpanel-service';
 import { tokenizedFetch } from './tokenizedFetch';
@@ -150,6 +159,7 @@ import {
     ScheduleEmailRequest,
     NavigateRequest,
     SetActiveTabRequest,
+    UpdateThemeRequest,
 } from './contracts/host-event-contracts';
 import {
     convertFilterChangedToUpdateFiltersPayload,
@@ -202,6 +212,7 @@ export {
     // types
     SessionInterface,
     UnderlyingDataPoint,
+    SortOptions,
     Page,
     AuthType,
     RuntimeFilter,
@@ -216,9 +227,14 @@ export {
     SearchViewConfig,
     SearchBarViewConfig,
     LiveboardViewConfig,
+    LiveboardOverride,
+    LiveboardDataSourceOverride,
+    LiveboardFilterQuery,
+    LiveboardParameterQuery,
     SpotterVizConfig,
     SpotterVizStarterPrompt,
     SpotterVizLoaderTip,
+    SpotterExperienceVersion,
     AppViewConfig,
     PrefetchFeatures,
     FrameParams,
@@ -277,6 +293,7 @@ export {
     ScheduleEmailRequest,
     NavigateRequest,
     SetActiveTabRequest,
+    UpdateThemeRequest,
     LiveboardTab,
     LiveboardGroup,
     ApplicabilityLevel,

package/src/mixpanel-service.ts

@@ -19,6 +19,7 @@ let mixpanelInstance: mixpanel.Mixpanel;
 export const MIXPANEL_EVENT = {
     VISUAL_SDK_RENDER_START: 'visual-sdk-render-start',
     VISUAL_SDK_CALLED_INIT: 'visual-sdk-called-init',
+    VISUAL_SDK_INIT_ACTIONS: 'visual-sdk-init-actions',
     VISUAL_SDK_RENDER_COMPLETE: 'visual-sdk-render-complete',
     VISUAL_SDK_RENDER_FAILED: 'visual-sdk-render-failed',
     VISUAL_SDK_TRIGGER: 'visual-sdk-trigger',

package/src/react/all-types-export.ts

@@ -34,6 +34,7 @@ export {
     AuthType,
     RuntimeFilter,
     RuntimeFilterOp,
+    SortOptions,
     EmbedEvent,
     HostEvent,
     DataSourceVisualMode,
@@ -42,6 +43,10 @@ export {
     SearchViewConfig,
     SearchBarViewConfig,
     LiveboardViewConfig,
+    LiveboardOverride,
+    LiveboardDataSourceOverride,
+    LiveboardFilterQuery,
+    LiveboardParameterQuery,
     AppViewConfig,
     PrefetchFeatures,
     FrameParams,
@@ -87,6 +92,7 @@ export {
     ScheduleEmailRequest,
     NavigateRequest,
     SetActiveTabRequest,
+    UpdateThemeRequest,
     LiveboardTab,
     LiveboardGroup,
     ApplicabilityLevel,
@@ -124,6 +130,7 @@ export {
     CustomActionsPosition,
     CustomActionTarget,
     SpotterAnalystConfig,
+    SpotterExperienceVersion,
     StarterPromptsConfig,
     StarterPromptCategory,
     StarterPreviewDataCategory,