@thoughtspot/visual-embed-sdk 1.35.10 → 1.35.12

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@thoughtspot/visual-embed-sdk",
-    "version": "1.35.10",
+    "version": "1.35.12",
     "description": "ThoughtSpot Embed SDK",
     "module": "lib/src/index.js",
     "main": "dist/tsembed.js",

package/src/embed/app.ts

@@ -257,8 +257,17 @@ export interface AppViewConfig extends Omit<ViewConfig, 'visibleTabs'> {
      */
     enableSearchAssist?: boolean;
     /**
-     * If set to true, the embedded object container dynamically resizes
-     * according to the height of the pages which support fullHeight mode.
+     * If set to true, the Liveboard container dynamically resizes
+     * according to the height of the Liveboard.
+     *
+     * **Note**: Using fullHeight loads all visualizations
+     * on the Liveboard simultaneously, which results in
+     * multiple warehouse queries and potentially a
+     * longer wait for the topmost visualizations to
+     * display on the screen. Setting fullHeight to
+     * `false` fetches visualizations incrementally as
+     * users scroll the page to view the charts and tables.
+     *
      * @version SDK: 1.21.0 | ThoughtSpot: 9.4.0.cl, 9.4.0-sw
      * @example
      * ```js

package/src/embed/hostEventClient/contracts.ts

@@ -4,7 +4,7 @@ export enum UIPassthroughEvent {
   PinAnswerToLiveboard = 'addVizToPinboard',
   SaveAnswer = 'saveAnswer',
   GetDiscoverabilityStatus = 'getDiscoverabilityStatus',
-  GetAvailableUIPassthroughs = 'getAvailableUIPassthroughs',
+  GetAvailableUIPassthroughs = 'getAvailableUiPassthroughs',
   GetAnswerConfig = 'getAnswerPageConfig',
   GetLiveboardConfig = 'getPinboardPageConfig',
 }

package/src/embed/liveboard.spec.ts

@@ -1,5 +1,5 @@
 import { LiveboardViewConfig, LiveboardEmbed } from './liveboard';
-import { init } from '../index';
+import { init, UIPassthroughEvent } from '../index';
 import {
     Action,
     AuthType,
@@ -532,7 +532,7 @@ describe('Liveboard/viz embed tests', () => {
         await executeAfterWait(() => {
             expectUrlMatchesWithParams(
                 getIFrameSrc(),
-                `http://${thoughtSpotHost}/?embedApp=true${defaultParams}&isContextMenuEnabledOnLeftClick=true&isLiveboardEmbed=true&isPinboardV2Enabled=true#/embed/viz/${liveboardId}/tab/${activeTabId}`,
+                `http://${thoughtSpotHost}/?embedApp=true${defaultParams}&contextMenuEnabledOnWhichClick=left&isLiveboardEmbed=true&isPinboardV2Enabled=true#/embed/viz/${liveboardId}/tab/${activeTabId}`,
             );
         });
     });
@@ -767,4 +767,25 @@ describe('Liveboard/viz embed tests', () => {
             });
         });
     });
+
+    describe('Host events for liveborad', () => {
+        test('Host event with empty param', async () => {
+            const mockProcessTrigger = jest.spyOn(tsEmbed.TsEmbed.prototype, 'trigger');
+            const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+                liveboardId: '123',
+                ...defaultViewConfig,
+                vizId: 'testViz',
+            });
+            liveboardEmbed.render();
+            mockProcessTrigger.mockResolvedValue({ session: 'test' });
+            await executeAfterWait(async () => {
+                await liveboardEmbed.trigger(
+                    HostEvent.Save,
+                );
+                expect(mockProcessTrigger).toHaveBeenCalledWith(
+                    HostEvent.Save, { vizId: 'testViz' },
+                );
+            });
+        });
+    });
 });

package/src/embed/liveboard.ts

@@ -23,7 +23,7 @@ import { getQueryParamString, isUndefined } from '../utils';
 import { getAuthPromise } from './base';
 import { V1Embed } from './ts-embed';
 import { addPreviewStylesIfNotPresent } from '../utils/global-styles';
-import { HostEventRequest, HostEventResponse } from './hostEventClient/contracts';
+import { TriggerPayload, TriggerResponse } from './hostEventClient/contracts';
 
 /**
  * The configuration for the embedded Liveboard or visualization page view.
@@ -37,12 +37,14 @@ export interface LiveboardViewConfig
     /**
      * If set to true, the embedded object container dynamically resizes
      * according to the height of the Liveboard.
+     *
      * **Note**:  Using fullHeight loads all visualizations on the
      * Liveboard simultaneously, which results in multiple warehouse
      * queries and potentially a longer wait for the topmost
      * visualizations to display on the screen.
      * Setting `fullHeight` to `false` fetches visualizations
      * incrementally as users scroll the page to view the charts and tables.
+     *
      * @version SDK: 1.1.0 | ThoughtSpot: ts7.may.cl, 7.2.1
      * @example
      * ```js
@@ -635,16 +637,17 @@ export class LiveboardEmbed extends V1Embed {
 
     /**
      * 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 trigger<HostEventT extends HostEvent, PayloadT>(
         messageType: HostEventT,
-        data?: HostEventRequest<HostEventT>,
-    ): Promise<HostEventResponse<HostEventT>> {
-        const dataWithVizId = data;
+        data: TriggerPayload<PayloadT, HostEventT> = ({} as any),
+    ): Promise<TriggerResponse<PayloadT, HostEventT>> {
+        const dataWithVizId: any = data;
         if (messageType === HostEvent.SetActiveTab) {
-            this.setActiveTab(data);
+            this.setActiveTab(data as { tabId: string });
             return Promise.resolve(null);
         }
         if (typeof dataWithVizId === 'object' && this.viewConfig.vizId) {

package/src/embed/ts-embed.spec.ts

@@ -18,9 +18,15 @@ import {
     AnswerService,
 } from '../index';
 import {
-    Action, HomeLeftNavItem, RuntimeFilter, RuntimeFilterOp, HomepageModule, HostEvent,
+    Action,
+    HomeLeftNavItem,
+    RuntimeFilter,
+    RuntimeFilterOp,
+    HomepageModule,
+    HostEvent,
     RuntimeParameter,
     Param,
+    ContextMenuTriggerOptions,
 } from '../types';
 import {
     executeAfterWait,
@@ -1430,6 +1436,7 @@ describe('Unit test case for ts embed', () => {
                 expect(getIFrameSrc()).toContain('?base64UrlEncodedFlags');
             });
         });
+
         it('should return the correct encoded query params string when app is embeded', async () => {
             const appEmbed = new AppEmbed(getRootEl(), {
                 frameParams: {
@@ -1720,6 +1727,158 @@ describe('Unit test case for ts embed', () => {
             });
         });
 
+        it('Should not add contextMenuEnabledOnWhichClick flag to the iframe src when it is not passed', async () => {
+            const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+                ...defaultViewConfig,
+                liveboardId,
+            } as LiveboardViewConfig);
+
+            liveboardEmbed.render();
+            await executeAfterWait(() => {
+                expectUrlMatchesWithParams(
+                    getIFrameSrc(),
+                    `http://${thoughtSpotHost}/?embedApp=true${defaultParams}#/embed/viz/${liveboardId}`,
+                );
+            });
+
+            const defaultConfig: SageViewConfig = {
+                disableWorksheetChange: false,
+                hideWorksheetSelector: false,
+                hideSageAnswerHeader: false,
+                hideAutocompleteSuggestions: false,
+                hideSampleQuestions: false,
+                isProductTour: false,
+                dataPanelV2: false,
+            };
+
+            const sageEmbed = new SageEmbed(getRootEl(), {
+                ...defaultConfig,
+            } as SageViewConfig);
+
+            sageEmbed.render();
+            await executeAfterWait(() => {
+                expectUrlMatch(
+                    getIFrameSrc(),
+                    `http://${thoughtSpotHost}/?embedApp=true&enableDataPanelV2=false&isSageEmbed=true&disableWorksheetChange=false&hideWorksheetSelector=false&hideEurekaSuggestions=false&isProductTour=false&hideSageAnswerHeader=false&hideAction=%5B%22reportError%22%5D#/embed/eureka`,
+                );
+            });
+        });
+
+        it('Should add contextMenuEnabledOnWhichClick flag to the iframe with left value', async () => {
+            const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+                ...defaultViewConfig,
+                liveboardId,
+                contextMenuTrigger: ContextMenuTriggerOptions.LEFT_CLICK,
+            } as LiveboardViewConfig);
+
+            liveboardEmbed.render();
+            await executeAfterWait(() => {
+                expectUrlMatchesWithParams(
+                    getIFrameSrc(),
+                    `http://${thoughtSpotHost}/?embedApp=true${defaultParams}&contextMenuEnabledOnWhichClick=left#/embed/viz/${liveboardId}`,
+                );
+            });
+
+            const defaultConfig: SageViewConfig = {
+                disableWorksheetChange: false,
+                hideWorksheetSelector: false,
+                hideSageAnswerHeader: false,
+                hideAutocompleteSuggestions: false,
+                hideSampleQuestions: false,
+                isProductTour: false,
+                dataPanelV2: false,
+            };
+
+            const sageEmbed = new SageEmbed(getRootEl(), {
+                ...defaultConfig,
+                contextMenuTrigger: ContextMenuTriggerOptions.LEFT_CLICK,
+            } as SageViewConfig);
+
+            sageEmbed.render();
+            await executeAfterWait(() => {
+                expectUrlMatch(
+                    getIFrameSrc(),
+                    `http://${thoughtSpotHost}/?embedApp=true&enableDataPanelV2=false&contextMenuEnabledOnWhichClick=left&isSageEmbed=true&disableWorksheetChange=false&hideWorksheetSelector=false&hideEurekaSuggestions=false&isProductTour=false&hideSageAnswerHeader=false&hideAction=%5B%22reportError%22%5D#/embed/eureka`,
+                );
+            });
+        });
+
+        it('Should add contextMenuEnabledOnWhichClick flag to the iframe with right value', async () => {
+            const livebaordEmbed = new LiveboardEmbed(getRootEl(), {
+                ...defaultViewConfig,
+                liveboardId,
+                contextMenuTrigger: ContextMenuTriggerOptions.RIGHT_CLICK,
+            } as LiveboardViewConfig);
+
+            livebaordEmbed.render();
+            await executeAfterWait(() => {
+                expectUrlMatchesWithParams(
+                    getIFrameSrc(),
+                    `http://${thoughtSpotHost}/?embedApp=true${defaultParams}&contextMenuEnabledOnWhichClick=right#/embed/viz/${liveboardId}`,
+                );
+            });
+            const defaultConfig: SageViewConfig = {
+                disableWorksheetChange: false,
+                hideWorksheetSelector: false,
+                hideSageAnswerHeader: false,
+                hideAutocompleteSuggestions: false,
+                hideSampleQuestions: false,
+                isProductTour: false,
+                dataPanelV2: false,
+            };
+
+            const sageEmbed = new SageEmbed(getRootEl(), {
+                ...defaultConfig,
+                contextMenuTrigger: ContextMenuTriggerOptions.RIGHT_CLICK,
+            } as SageViewConfig);
+
+            sageEmbed.render();
+            await executeAfterWait(() => {
+                expectUrlMatch(
+                    getIFrameSrc(),
+                    `http://${thoughtSpotHost}/?embedApp=true&enableDataPanelV2=false&contextMenuEnabledOnWhichClick=right&isSageEmbed=true&disableWorksheetChange=false&hideWorksheetSelector=false&hideEurekaSuggestions=false&isProductTour=false&hideSageAnswerHeader=false&hideAction=%5B%22reportError%22%5D#/embed/eureka`,
+                );
+            });
+        });
+
+        it('Should add contextMenuEnabledOnWhichClick flag to the iframe with both value', async () => {
+            const livebaordEmbed = new LiveboardEmbed(getRootEl(), {
+                ...defaultViewConfig,
+                liveboardId,
+                contextMenuTrigger: ContextMenuTriggerOptions.BOTH_CLICKS,
+            } as LiveboardViewConfig);
+
+            livebaordEmbed.render();
+            await executeAfterWait(() => {
+                expectUrlMatchesWithParams(
+                    getIFrameSrc(),
+                    `http://${thoughtSpotHost}/?embedApp=true${defaultParams}&contextMenuEnabledOnWhichClick=both#/embed/viz/${liveboardId}`,
+                );
+            });
+            const defaultConfig: SageViewConfig = {
+                disableWorksheetChange: false,
+                hideWorksheetSelector: false,
+                hideSageAnswerHeader: false,
+                hideAutocompleteSuggestions: false,
+                hideSampleQuestions: false,
+                isProductTour: false,
+                dataPanelV2: false,
+            };
+
+            const sageEmbed = new SageEmbed(getRootEl(), {
+                ...defaultConfig,
+                contextMenuTrigger: ContextMenuTriggerOptions.BOTH_CLICKS,
+            } as SageViewConfig);
+
+            sageEmbed.render();
+            await executeAfterWait(() => {
+                expectUrlMatch(
+                    getIFrameSrc(),
+                    `http://${thoughtSpotHost}/?embedApp=true&enableDataPanelV2=false&contextMenuEnabledOnWhichClick=both&isSageEmbed=true&disableWorksheetChange=false&hideWorksheetSelector=false&hideEurekaSuggestions=false&isProductTour=false&hideSageAnswerHeader=false&hideAction=%5B%22reportError%22%5D#/embed/eureka`,
+                );
+            });
+        });
+
         it('SageViewConfig: Should add flipTooltipToContextMenuEnabled flag to the iframe src', async () => {
             const defaultConfig: SageViewConfig = {
                 disableWorksheetChange: false,

package/src/embed/ts-embed.ts

@@ -10,8 +10,6 @@ import isEqual from 'lodash/isEqual';
 import isEmpty from 'lodash/isEmpty';
 import isObject from 'lodash/isObject';
 import {
-    HostEventRequest,
-    HostEventResponse,
     TriggerPayload,
     TriggerResponse,
     UIPassthroughArrayResponse,
@@ -536,9 +534,11 @@ export class TsEmbed {
          *  menu click
          */
         if (contextMenuTrigger === ContextMenuTriggerOptions.LEFT_CLICK) {
-            queryParams[Param.ContextMenuTrigger] = true;
+            queryParams[Param.ContextMenuTrigger] = 'left';
         } else if (contextMenuTrigger === ContextMenuTriggerOptions.RIGHT_CLICK) {
-            queryParams[Param.ContextMenuTrigger] = false;
+            queryParams[Param.ContextMenuTrigger] = 'right';
+        } else if (contextMenuTrigger === ContextMenuTriggerOptions.BOTH_CLICKS) {
+            queryParams[Param.ContextMenuTrigger] = 'both';
         }
 
         const spriteUrl = customizations?.iconSpriteUrl