@thoughtspot/visual-embed-sdk 1.5.0 → 1.6.0-alpha.3

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

@@ -5,8 +5,9 @@ import {
     EmbedEvent,
     SearchEmbed,
     PinboardEmbed,
-    PinboardViewConfig,
+    LiveboardViewConfig,
     AppEmbed,
+    LiveboardEmbed,
 } from '../index';
 import { Action } from '../types';
 import { getDocumentBody, getIFrameSrc, getRootEl } from '../test/test-utils';
@@ -24,6 +25,7 @@ const defaultViewConfig = {
     },
 };
 const pinboardId = 'eca215d4-0d2c-4a55-90e3-d81ef6848ae0';
+const liveboardId = 'eca215d4-0d2c-4a55-90e3-d81ef6848ae0';
 const thoughtSpotHost = 'tshost';
 const defaultParamsForPinboardEmbed = `hostAppUrl=local-host&viewPortHeight=768&viewPortWidth=1024&sdkVersion=${version}`;
 
@@ -119,29 +121,78 @@ describe('Unit test case for ts embed', () => {
     });
 
     describe('when visible actions are set', () => {
-        test('should throw error when there are both visible and hidden actions', async () => {
+        test('should throw error when there are both visible and hidden actions - pinboard', async () => {
             spyOn(console, 'log');
             const pinboardEmbed = new PinboardEmbed(getRootEl(), {
                 hiddenActions: [Action.DownloadAsCsv],
                 visibleActions: [Action.DownloadAsCsv],
                 ...defaultViewConfig,
                 pinboardId,
-            } as PinboardViewConfig);
+            } as LiveboardViewConfig);
             await pinboardEmbed.render();
             expect(pinboardEmbed['isError']).toBe(true);
             expect(console.log).toHaveBeenCalledWith(
                 'You cannot have both hidden actions and visible actions',
             );
         });
-        test('should not throw error when there are only visible or hidden actions', async () => {
+        test('should not throw error when there are only visible or hidden actions - pinboard', async () => {
             const pinboardEmbed = new PinboardEmbed(getRootEl(), {
                 hiddenActions: [Action.DownloadAsCsv],
                 ...defaultViewConfig,
                 pinboardId,
-            } as PinboardViewConfig);
+            } as LiveboardViewConfig);
             pinboardEmbed.render();
             expect(pinboardEmbed['isError']).toBe(false);
         });
+
+        async function testActionsForLiveboards(
+            hiddenActions: Array<Action>,
+            visibleActions: Array<Action>,
+        ) {
+            spyOn(console, 'log');
+            const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+                hiddenActions,
+                visibleActions,
+                ...defaultViewConfig,
+                liveboardId,
+            } as LiveboardViewConfig);
+            await liveboardEmbed.render();
+            expect(liveboardEmbed['isError']).toBe(true);
+            expect(console.log).toHaveBeenCalledWith(
+                'You cannot have both hidden actions and visible actions',
+            );
+        }
+        test('should throw error when there are both visible and hidden action arrays', async () => {
+            await testActionsForLiveboards(
+                [Action.DownloadAsCsv],
+                [Action.DownloadAsCsv],
+            );
+        });
+        test('should throw error when there are both visible and hidden actions arrays as empty', async () => {
+            await testActionsForLiveboards([], []);
+        });
+        test('should throw error when there are both visible and hidden actions - one of them is an empty array', async () => {
+            await testActionsForLiveboards([], [Action.DownloadAsCsv]);
+        });
+
+        test('should not throw error when there are only visible or hidden actions', async () => {
+            const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+                hiddenActions: [Action.DownloadAsCsv],
+                ...defaultViewConfig,
+                liveboardId,
+            } as LiveboardViewConfig);
+            liveboardEmbed.render();
+            expect(liveboardEmbed['isError']).toBe(false);
+        });
+        test('should not throw error when there are only visible or hidden actions', async () => {
+            const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+                visibleActions: [Action.DownloadAsCsv],
+                ...defaultViewConfig,
+                liveboardId,
+            } as LiveboardViewConfig);
+            liveboardEmbed.render();
+            expect(liveboardEmbed['isError']).toBe(false);
+        });
     });
 
     describe('when thoughtSpotHost is empty', () => {
@@ -180,7 +231,7 @@ describe('Unit test case for ts embed', () => {
     });
 
     describe('Naviage to Page API', () => {
-        const path = 'pinboard/e0836cad-4fdf-42d4-bd97-567a6b2a6058';
+        const path = 'viz/e0836cad-4fdf-42d4-bd97-567a6b2a6058';
         beforeEach(() => {
             jest.spyOn(config, 'getThoughtSpotHost').mockImplementation(
                 () => 'http://tshost',
@@ -189,10 +240,10 @@ describe('Unit test case for ts embed', () => {
 
         test('when app is PinboardEmbed after navigateToPage function call, new path should be set to iframe', async () => {
             const pinboardEmbed = new PinboardEmbed(getRootEl(), {
-                pinboardId: '123',
+                pinboardId: 'e0836cad-4fdf-42d4-bd97-567a6b2a6058',
             });
             await pinboardEmbed.render();
-            pinboardEmbed.navigateToPage(path);
+            // pinboardEmbed.navigateToPage(path);
             expect(getIFrameSrc()).toBe(
                 `http://${thoughtSpotHost}/?embedApp=true&${defaultParamsForPinboardEmbed}&isLiveboardEmbed=true#/embed/${path}`,
             );
@@ -227,4 +278,26 @@ describe('Unit test case for ts embed', () => {
             );
         });
     });
+    describe('Naviage to Page API - Pinboard', () => {
+        const path = 'pinboard/e0836cad-4fdf-42d4-bd97-567a6b2a6058';
+        beforeEach(() => {
+            jest.spyOn(config, 'getThoughtSpotHost').mockImplementation(
+                () => 'http://tshost',
+            );
+        });
+
+        test('when app is AppEmbed after navigateToPage function call, new path should be set to iframe', async () => {
+            const appEmbed = new AppEmbed(getRootEl(), {
+                frameParams: {
+                    width: '100%',
+                    height: '100%',
+                },
+            });
+            await appEmbed.render();
+            appEmbed.navigateToPage(path);
+            expect(getIFrameSrc()).toBe(
+                `http://${thoughtSpotHost}/?embedApp=true&primaryNavHidden=true&profileAndHelpInNavBarHidden=false&${defaultParamsForPinboardEmbed}#/${path}`,
+            );
+        });
+    });
 });

package/src/embed/ts-embed.ts

@@ -105,7 +105,7 @@ export interface ViewConfig {
     visibleActions?: Action[];
     /**
      * The list of runtime filters to apply to a search answer,
-     * visualization, or pinboard.
+     * visualization, or Liveboard.
      */
     runtimeFilters?: RuntimeFilter[];
 }
@@ -327,7 +327,7 @@ export class TsEmbed {
             visibleActions,
         } = this.viewConfig;
 
-        if (visibleActions?.length && hiddenActions?.length) {
+        if (Array.isArray(visibleActions) && Array.isArray(hiddenActions)) {
             this.handleError(
                 'You cannot have both hidden actions and visible actions',
             );
@@ -351,7 +351,7 @@ export class TsEmbed {
 
     /**
      * Constructs the base URL string to load v1 of the ThoughtSpot app.
-     * This is used for embedding pinboards, visualizations, and full application.
+     * This is used for embedding Liveboards, visualizations, and full application.
      * @param queryString The query string to append to the URL.
      * @param isAppEmbed A Boolean parameter to specify if you are embedding
      * the full application.
@@ -587,27 +587,6 @@ export class TsEmbed {
         return this;
     }
 
-    /**
-     * Navigates users to the specified application page.
-     * Use this method to navigate users from the embedded
-     * ThoughtSpot context to a specific page in your app.
-     * @param path The page path string.
-     * For example, to navigate users to a pinboard page,
-     * define the method as navigateToPage('pinboard/<pinboardId>').
-     */
-    public navigateToPage(path: string): void {
-        const iframeSrc = this.iFrame?.src;
-        if (iframeSrc) {
-            const embedPath = '#/embed';
-            const currentPath = iframeSrc.includes(embedPath) ? embedPath : '#';
-            this.iFrame.src = `${
-                iframeSrc.split(currentPath)[0]
-            }${currentPath}/${path.replace(/^\/?#?\//, '')}`;
-        } else {
-            console.log('Please call render before invoking this method');
-        }
-    }
-
     /**
      * Triggers an event on specific Port registered against
      * for the EmbedEvent

package/src/errors.ts

@@ -1,6 +1,6 @@
 export const ERROR_MESSAGE = {
     INVALID_THOUGHTSPOT_HOST:
         'Error parsing ThoughtSpot host. Please provide a valid URL.',
-    PINBOARD_VIZ_ID_VALIDATION:
-        'Please provide either pinboardId or both pinboardId and vizId',
+    LIVEBOARD_VIZ_ID_VALIDATION:
+        'Please provide either liveboardId or pinboardId',
 };

package/src/index.ts

@@ -10,7 +10,11 @@
 
 import { AppEmbed, Page, AppViewConfig } from './embed/app';
 import { init, prefetch } from './embed/base';
-import { PinboardEmbed, PinboardViewConfig } from './embed/pinboard';
+import {
+    PinboardEmbed,
+    LiveboardViewConfig,
+    LiveboardEmbed,
+} from './embed/liveboard';
 import { SearchEmbed, SearchViewConfig } from './embed/search';
 import {
     AuthType,
@@ -28,6 +32,7 @@ export {
     prefetch,
     SearchEmbed,
     PinboardEmbed,
+    LiveboardEmbed,
     AppEmbed,
     // types
     Page,
@@ -40,6 +45,6 @@ export {
     Action,
     EmbedConfig,
     SearchViewConfig,
-    PinboardViewConfig,
+    LiveboardViewConfig,
     AppViewConfig,
 };

package/src/react/index.tsx

@@ -2,9 +2,9 @@ import React from 'react';
 import { SearchEmbed as _SearchEmbed, SearchViewConfig } from '../embed/search';
 import { AppEmbed as _AppEmbed, AppViewConfig } from '../embed/app';
 import {
-    PinboardEmbed as _PinboardEmbed,
-    PinboardViewConfig,
-} from '../embed/pinboard';
+    LiveboardEmbed as _LiveboardEmbed,
+    LiveboardViewConfig,
+} from '../embed/liveboard';
 import { TsEmbed, ViewConfig } from '../embed/ts-embed';
 
 import { EmbedEvent, MessageCallback } from '../types';
@@ -55,10 +55,16 @@ export const AppEmbed = componentFactory<
     AppViewConfig
 >(_AppEmbed);
 
-interface PinboardProps extends EmbedProps, PinboardViewConfig {}
+interface LiveboardProps extends EmbedProps, LiveboardViewConfig {}
+
+export const LiveboardEmbed = componentFactory<
+    typeof _LiveboardEmbed,
+    LiveboardProps,
+    LiveboardViewConfig
+>(_LiveboardEmbed);
 
 export const PinboardEmbed = componentFactory<
-    typeof _PinboardEmbed,
-    PinboardProps,
-    PinboardViewConfig
->(_PinboardEmbed);
+    typeof _LiveboardEmbed,
+    LiveboardProps,
+    LiveboardViewConfig
+>(_LiveboardEmbed);

package/src/types.ts

@@ -124,13 +124,14 @@ export interface EmbedConfig {
      * When there are multiple embeds, queue the render of embed to start
      *  after the previous embed's render is complete. This helps in the load performance
      *  by decreasing the load on the browser.
+     * * _Version 1.5.0 or later _
      * @default false
      */
     queueMultiRenders?: boolean;
 
     /**
      * Dynamic CSS Url to be injected in the loaded application.
-     * _Since: 1.6.0_
+     * * _Version 1.6.0 or later _
      * @default ''
      */
     customCssUrl?: string;
@@ -212,7 +213,7 @@ export enum RuntimeFilterOp {
 }
 
 /**
- * A filter that can be applied to ThoughtSpot answers, pinboards, or
+ * A filter that can be applied to ThoughtSpot answers, Liveboards, or
  * visualizations at runtime.
  */
 export interface RuntimeFilter {
@@ -252,12 +253,12 @@ export enum EmbedEvent {
      */
     Load = 'load',
     /**
-     * Data pertaining to answer or pinboard is received
-     * @return data - The answer or pinboard data
+     * Data pertaining to answer or Liveboard is received
+     * @return data - The answer or Liveboard data
      */
     Data = 'data',
     /**
-     * Search/answer/pinboard filters have been applied/updated
+     * Search/answer/Liveboard filters have been applied/updated
      * @hidden
      */
     FiltersChanged = 'filtersChanged',
@@ -280,13 +281,13 @@ export enum EmbedEvent {
     /**
      * A custom action has been triggered
      * @return actionId - The id of the custom action
-     * @return data - The answer or pinboard data
+     * @return data - The answer or Liveboard data
      */
     CustomAction = 'customAction',
     /**
      * A double click has been triggered on table/chart
      * @return ContextMenuInputPoints - data point that is double clicked
-     * * _since: 1.5.0_
+     * * _Version 1.5.0 or later _
      */
     VizPointDoubleClick = 'vizPointDoubleClick',
     /**
@@ -304,8 +305,8 @@ export enum EmbedEvent {
      */
     AuthExpire = 'ThoughtspotAuthExpired',
     /**
-     * The height of the embedded pinboard or visualization has been computed.
-     * @return data - The height of the embedded pinboard or visualization
+     * The height of the embedded Liveboard or visualization has been computed.
+     * @return data - The height of the embedded Liveboard or visualization
      * @hidden
      */
     EmbedHeight = 'EMBED_HEIGHT',
@@ -317,7 +318,6 @@ export enum EmbedEvent {
     EmbedIframeCenter = 'EmbedIframeCenter',
     /**
      * Detects the route change.
-     * @hidden
      */
     RouteChange = 'ROUTE_CHANGE',
     /**
@@ -340,12 +340,12 @@ export enum EmbedEvent {
     SAMLComplete = 'samlComplete',
     /**
      * Emitted when any modal is opened in the app
-     * * _since: 1.6.0_
+     * * _Version 1.6.0 or later _
      */
     DialogOpen = 'dialog-open',
     /**
      * Emitted when any modal is closed in the app
-     * * _since: 1.6.0_
+     * * _Version 1.6.0 or later _
      */
     DialogClose = 'dialog-close',
 }
@@ -368,7 +368,7 @@ export enum HostEvent {
      *              eg. { selectedPoints: []}
      * @param columnGuid - a string guid of the column to drill by. This is optional,
      *                     if not provided it will auto drill by the configured column. \
-     * * _since: 1.5.0_
+     * * _Version 1.5.0 or later _
      */
     DrillDown = 'triggerDrillDown',
     /**
@@ -382,10 +382,10 @@ export enum HostEvent {
      */
     Reload = 'reload',
     /**
-     * Set the visible Vizs on a pinboard/liveboard.
-     * @param - an array of ids of vizs to show, the ids not passed
+     * Set the visible visualizations on a Liveboard.
+     * @param - an array of ids of visualizations to show, the ids not passed
      *          will be hidden.
-     * _since: 1.6.0_
+     * * _Version 1.6.0 or later _
      */
     SetVisibleVizs = 'SetPinboardVisibleVizs',
 }
@@ -418,11 +418,10 @@ export enum DataSourceVisualMode {
 export enum Param {
     DataSources = 'dataSources',
     DataSourceMode = 'dataSourceMode',
-    ExpandAllDataSource = 'expandAllDataSource',
     DisableActions = 'disableAction',
     DisableActionReason = 'disableHint',
     ForceTable = 'forceTable',
-    preventPinboardFilterRemoval = 'preventPinboardFilterRemoval',
+    preventLiveboardFilterRemoval = 'preventPinboardFilterRemoval', // update-TSCB
     SearchQuery = 'searchQuery',
     HideActions = 'hideAction',
     HideObjects = 'hideObjects',
@@ -445,7 +444,7 @@ export enum Param {
 
 /**
  * The list of actions that can be performed on visual ThoughtSpot
- * entities, such as answers and pinboards.
+ * entities, such as answers and Liveboards.
  */
 // eslint-disable-next-line no-shadow
 export enum Action {
@@ -456,7 +455,6 @@ export enum Action {
     MakeACopy = 'makeACopy',
     EditACopy = 'editACopy',
     CopyLink = 'embedDocument',
-    PinboardSnapshot = 'pinboardSnapshot',
     ResetLayout = 'resetLayout',
     Schedule = 'schedule',
     SchedulesList = 'schedule-list',
@@ -489,7 +487,11 @@ export enum Action {
     Describe = 'describe',
     Relate = 'relate',
     CustomizeHeadlines = 'customizeHeadlines',
+    /**
+     * @hidden
+     */
     PinboardInfo = 'pinboardInfo',
+    LiveboardInfo = 'pinboardInfo',
     SendAnswerFeedback = 'sendFeedback',
     /**
      * @deprecated Will be removed in next version