@thoughtspot/visual-embed-sdk 1.35.5-hostEvent.6 → 1.35.5-hostEvent.8

package/src/embed/ts-embed.ts

@@ -12,9 +12,11 @@ import isObject from 'lodash/isObject';
 import {
     HostEventRequest,
     HostEventResponse,
-    UiPassthroughArrayResponse,
-    UiPassthroughEvent,
-    UiPassthroughRequest,
+    TriggerPayload,
+    TriggerResponse,
+    UIPassthroughArrayResponse,
+    UIPassthroughEvent,
+    UIPassthroughRequest,
 } from './hostEventClient/contracts';
 import { logger } from '../utils/logger';
 import { getAuthenticationToken } from '../authToken';
@@ -85,7 +87,7 @@ const TS_EMBED_ID = '_thoughtspot-embed';
  * We cannot rename v1 event types to maintain backward compatibility
  * @internal
  */
-const V1EventMap = {};
+const V1EventMap: Record<string, any> = {};
 
 /**
  * Base class for embedding v2 experience
@@ -119,6 +121,15 @@ export class TsEmbed {
      */
     protected iFrame: HTMLIFrameElement;
 
+    /**
+     * Setter for the iframe element
+     * @param {HTMLIFrameElement} iFrame HTMLIFrameElement
+     */
+    protected setIframeElement(iFrame: HTMLIFrameElement): void {
+        this.iFrame = iFrame;
+        this.hostEventClient.setIframeElement(iFrame);
+    }
+
     protected viewConfig: ViewConfig;
 
     protected embedConfig: EmbedConfig;
@@ -190,7 +201,7 @@ export class TsEmbed {
         uploadMixpanelEvent(MIXPANEL_EVENT.VISUAL_SDK_EMBED_CREATE, {
             ...viewConfig,
         });
-        this.hostEventClient = new HostEventClient(this.embedConfig.thoughtSpotHost);
+        this.hostEventClient = new HostEventClient(this.iFrame);
     }
 
     /**
@@ -252,7 +263,7 @@ export class TsEmbed {
         return eventData;
     }
 
-    private subscribedListeners = {};
+    private subscribedListeners: Record<string, any> = {};
 
     /**
      * Adds a global event listener to window for "message" events.
@@ -620,7 +631,7 @@ export class TsEmbed {
             this.insertIntoDOM(child);
         }
         if (this.insertedDomEl instanceof Node) {
-            this.insertedDomEl[this.embedNodeKey] = this;
+            (this.insertedDomEl as any)[this.embedNodeKey] = this;
         }
     }
 
@@ -658,7 +669,7 @@ export class TsEmbed {
                         return;
                     }
 
-                    this.iFrame = this.iFrame || this.createIframeEl(url);
+                    this.setIframeElement(this.iFrame || this.createIframeEl(url));
                     this.iFrame.addEventListener('load', () => {
                         nextInQueue();
                         const loadTimestamp = Date.now();
@@ -728,7 +739,7 @@ export class TsEmbed {
         if (this.preRenderWrapper && this.preRenderChild) {
             this.isPreRendered = true;
             if (this.preRenderChild instanceof HTMLIFrameElement) {
-                this.iFrame = this.preRenderChild;
+                this.setIframeElement(this.preRenderChild);
             }
             this.insertedDomEl = this.preRenderWrapper;
             this.isRendered = true;
@@ -777,7 +788,7 @@ export class TsEmbed {
         this.preRenderWrapper = preRenderWrapper;
 
         if (preRenderChild instanceof HTMLIFrameElement) {
-            this.iFrame = preRenderChild;
+            this.setIframeElement(preRenderChild);
         }
         this.insertedDomEl = preRenderWrapper;
 
@@ -994,14 +1005,14 @@ export class TsEmbed {
 
     /**
      * Triggers an event to the embedded app
-     * @param messageType The event type
-     * @param data The payload to send with the message
+     * @param {HostEvent} messageType The event type
+     * @param {any} data The payload to send with the message
      * @returns A promise that resolves with the response from the embedded app
      */
-    public trigger<HostEventT extends HostEvent>(
+    public async trigger<HostEventT extends HostEvent, PayloadT>(
         messageType: HostEventT,
-        data?: HostEventRequest<HostEventT>,
-    ): Promise<HostEventResponse<HostEventT>> {
+        data?: TriggerPayload<PayloadT, HostEventT>,
+    ): Promise<TriggerResponse<PayloadT, HostEventT>> {
         uploadMixpanelEvent(`${MIXPANEL_EVENT.VISUAL_SDK_TRIGGER}-${messageType}`);
 
         if (!this.isRendered) {
@@ -1014,22 +1025,22 @@ export class TsEmbed {
             return null;
         }
 
-        return this.hostEventClient.executeHostEvent(this.iFrame, messageType, data);
+        return this.hostEventClient.triggerHostEvent(messageType, data);
     }
 
     /**
      * Triggers an event to the embedded app, skipping the UI flow.
-     * @param {UiPassthroughEvent} apiName - The name of the API to be triggered.
-     * @param {UiPassthroughRequest} parameters - The parameters to be passed to the API.
-     * @returns {Promise<UiPassthroughRequest>} - A promise that resolves with the response
+     * @param {UIPassthroughEvent} apiName - The name of the API to be triggered.
+     * @param {UIPassthroughRequest} parameters - The parameters to be passed to the API.
+     * @returns {Promise<UIPassthroughRequest>} - A promise that resolves with the response
      * from the embedded app.
      */
-    // eslint-disable-next-line arrow-body-style
-    public triggerUiPassThrough<UiPassthroughEventT extends UiPassthroughEvent>(
-        apiName: UiPassthroughEventT,
-        parameters: UiPassthroughRequest<UiPassthroughEventT>,
-    ): UiPassthroughArrayResponse<UiPassthroughEventT> {
-        return this.hostEventClient.executeUiPassthroughApi(this.iFrame, apiName, parameters);
+    public async triggerUIPassThrough<UIPassthroughEventT extends UIPassthroughEvent>(
+        apiName: UIPassthroughEventT,
+        parameters: UIPassthroughRequest<UIPassthroughEventT>,
+    ): Promise<UIPassthroughArrayResponse<UIPassthroughEventT>> {
+        const response = this.hostEventClient.triggerUIPassthroughApi(apiName, parameters);
+        return response;
     }
 
     /**
@@ -1135,14 +1146,14 @@ export class TsEmbed {
 
     private validatePreRenderViewConfig = (viewConfig: ViewConfig) => {
         const preRenderAllowedKeys = ['preRenderId', 'vizId', 'liveboardId'];
-        const preRenderedObject = this.insertedDomEl?.[this.embedNodeKey] as TsEmbed;
+        const preRenderedObject = (this.insertedDomEl as any)?.[this.embedNodeKey] as TsEmbed;
         if (!preRenderedObject) return;
         if (viewConfig.preRenderId) {
             const allOtherKeys = Object.keys(viewConfig).filter(
                 (key) => !preRenderAllowedKeys.includes(key) && !key.startsWith('on'),
             );
 
-            allOtherKeys.forEach((key) => {
+            allOtherKeys.forEach((key: keyof ViewConfig) => {
                 if (
                     !isUndefined(viewConfig[key])
                     && !isEqual(viewConfig[key], preRenderedObject.viewConfig[key])
@@ -1271,7 +1282,7 @@ export class TsEmbed {
     /**
      * Returns the answerService which can be used to make arbitrary graphql calls on top
      * session.
-     * @param vizId [Optional] to get for a specific viz in case of a liveboard.
+     * @param vizId [Optional] to get for a specific viz in case of a Liveboard.
      * @version SDK: 1.25.0 / ThoughtSpot 9.10.0
      */
     public async getAnswerService(vizId?: string): Promise<AnswerService> {

package/src/index.ts

@@ -61,7 +61,7 @@ import { uploadMixpanelEvent, MIXPANEL_EVENT } from './mixpanel-service';
 import { tokenizedFetch } from './tokenizedFetch';
 import { getAnswerFromQuery } from './utils/graphql/nlsService/nls-answer-service';
 import { createLiveboardWithAnswers } from './utils/liveboardService/liveboardService';
-import { UiPassthroughEvent } from './embed/hostEventClient/contracts';
+import { UIPassthroughEvent } from './embed/hostEventClient/contracts';
 
 export {
     init,
@@ -128,7 +128,7 @@ export {
     HomePageSearchBarMode,
     VizPoint,
     CustomActionPayload,
-    UiPassthroughEvent,
+    UIPassthroughEvent,
 };
 
 export { resetCachedAuthToken } from './authToken';

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

@@ -51,5 +51,5 @@ export {
     CustomCssVariables,
     RuntimeParameter,
     resetCachedAuthToken,
-    UiPassthroughEvent,
+    UIPassthroughEvent,
 } from '../index';

package/src/types.ts

@@ -1088,8 +1088,12 @@ export interface ViewConfig {
      */
     enableCustomColumnGroups?: boolean;
     /**
-     * View content for another org directly without having to use the org switcher
-     * This flag is honoured if orgPerUrl feature is enabled for the ThoughtSpot cluster
+     * Overrides an Org context for embedding application users.
+     * This parameter allows a user authenticated to one Org to view the
+     * objects from another Org.
+     * The `overrideOrgId` setting is honoured only if the
+     * Per Org URL feature is enabled on your ThoughtSpot instance.
+     *
      * @example
      * ```js
      * const embed = new LiveboardEmbed('#embed', {
@@ -2365,7 +2369,7 @@ export enum HostEvent {
      * @param - autoDrillDown - Optional. If true, the drill down will be
      * done automatically on the most popular column.
      * @param - vizId [TS >= 9.8.0] - Optional. The GUID of the visualization to drill
-     * in case of a liveboard.
+     * in case of a Liveboard.
      * @example
      * ```js
      * searchEmbed.on(EmbedEvent.VizPointDoubleClick, (payload) => {
@@ -2452,26 +2456,26 @@ export enum HostEvent {
      */
     SetActiveTab = 'SetActiveTab',
     /**
-     * Update runtime filters applied on a Saved Answer or Liveboard. The
-     * runtime filters passed here are appended to the existing runtime
-     * filters.
+     * Updates the runtime filters applied on a Liveboard. The filter
+     * attributes passed with this event are appended to the existing runtime
+     * filters applied on a Liveboard.
+     *
      * Pass an array of runtime filters with the following attributes:
      *
-     * `columnName`
-     * _String_. The name of the column to filter on.
+     * `columnName` - _String_. The name of the column to filter on.
      *
-     * `operator`
-     * Runtime filter operator to apply. For information,
+     * `operator` - Runtime filter operator to apply. For more information,
      * see link:https://developers.thoughtspot.com/docs/?pageid=runtime-filters#rtOperator[Developer Documentation].
      *
-     * `values`
-     * List of operands. Some operators such as EQ, LE allow a single value, whereas
-     * operators such as BW and IN accept multiple operands.
+     * `values` - List of operands. Some operators such as EQ and LE allow a
+     * single value, whereas BW and IN accept multiple values.
+     *
+     * **Note**: `HostEvent.UpdateRuntimeFilters` is supported in `LiveboardEmbed`
+     * and `AppEmbed` only. In full application embedding, this event updates
+     * the runtime filters applied on the Liveboard and saved Answer objects.
      *
-     * **Note**: `HostEvent.UpdateRuntimeFilters` is not supported in
-     * Search embedding (SearchEmbed) and Natural Language Search
-     * embedding (SageEmbed).
      * @param - {@link RuntimeFilter}[] an array of {@link RuntimeFilter} Types.
+     *
      * @example
      * ```js
      * liveboardEmbed.trigger(HostEvent.UpdateRuntimeFilters, [
@@ -3170,7 +3174,7 @@ export enum HostEvent {
      */
     ResetLiveboardPersonalisedView = 'ResetLiveboardPersonalisedView',
     /**
-     * Triggers Update RuntimeParameters for answers and liveboard
+     * Triggers an event to Update Parameter values for Answers and Liveboard
      * @example
      * ```js
      * liveboardEmbed.trigger(HostEvent.UpdateParameters, [{
@@ -3192,7 +3196,7 @@ export enum HostEvent {
      */
     GetParameters = 'GetParameters',
     /**
-     * Triggers update of persoanlised view for a liveboard
+     * Triggers an event to update a persoanlised view of a Liveboard
      * ```js
      * liveboardEmbed.trigger(HostEvent.UpdatePersonalisedView, {viewId: '1234'})
      * ```
@@ -3208,7 +3212,7 @@ export enum HostEvent {
      * EmbedApi
      * @hidden
      */
-    UiPassthrough = 'UiPassthrough',
+    UIPassthrough = 'UiPassthrough',
 }
 
 /**
@@ -4189,7 +4193,7 @@ export enum Action {
      */
     ModifySageAnswer = 'modifySageAnswer',
     /**
-     * The **Move to Tab** menu action on visualizations in liveboard edit mode.
+     * The **Move to Tab** menu action on visualizations in Liveboard edit mode.
      * Allows moving a visualization to a different tab.
      * @example
      * ```js
@@ -4244,7 +4248,8 @@ export enum Action {
     TML = 'tml',
 
     /**
-     * Action Id for CreateLiveboard for liveboard list page & Pin Modal
+     * Action ID for the create Liveboard option on the Liveboard list page
+     * and Pin modal
      * @example
      * ```js
      * hiddenAction: [Action.CreateLiveboard]