@thoughtspot/visual-embed-sdk 1.47.1 → 1.47.3

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@thoughtspot/visual-embed-sdk",
-    "version": "1.47.1",
+    "version": "1.47.3",
     "description": "ThoughtSpot Embed SDK",
     "module": "lib/src/index.js",
     "main": "dist/tsembed.js",
@@ -70,7 +70,7 @@
     "dependencies": {
         "classnames": "^2.3.1",
         "eventemitter3": "^4.0.7",
-        "lodash": "^4.17.23",
+        "lodash": "^4.18.1",
         "mixpanel-browser": "2.47.0",
         "ts-deepmerge": "^6.0.2",
         "tslib": "^2.5.3",
@@ -126,7 +126,7 @@
         "jest-environment-jsdom": "^29.7.0",
         "jest-fetch-mock": "^3.0.3",
         "jsdom": "^17.0.0",
-        "prettier": "2.1.2",
+        "prettier": "3.8.1",
         "react": "^16.14.0",
         "react-dom": "^16.14.0",
         "react-resizable": "^1.11.0",

package/src/embed/app.spec.ts

@@ -21,6 +21,8 @@ import {
     defaultParamsForPinboardEmbed,
     defaultParamsWithoutHiddenActions,
     expectUrlMatchesWithParams,
+    postMessageToParent,
+    testVisualOverridesInEmbed,
 } from '../test/test-utils';
 import { version } from '../../package.json';
 import * as config from '../config';
@@ -805,6 +807,53 @@ describe('App embed tests', () => {
         });
     });
 
+    test('Should add newChartsLibrary true to the iframe src', async () => {
+        const appEmbed = new AppEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            showPrimaryNavbar: false,
+            newChartsLibrary: true,
+        } as AppViewConfig);
+
+        appEmbed.render();
+        await executeAfterWait(() => {
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
+                `http://${thoughtSpotHost}/?embedApp=true&primaryNavHidden=true&profileAndHelpInNavBarHidden=false&muzeChartPhase1EnabledGA=true${defaultParams}${defaultParamsPost}#/home`,
+            );
+        });
+    });
+
+    test('Should add newChartsLibrary false to the iframe src', async () => {
+        const appEmbed = new AppEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            showPrimaryNavbar: false,
+            newChartsLibrary: false,
+        } as AppViewConfig);
+
+        appEmbed.render();
+        await executeAfterWait(() => {
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
+                `http://${thoughtSpotHost}/?embedApp=true&primaryNavHidden=true&profileAndHelpInNavBarHidden=false&muzeChartPhase1EnabledGA=false${defaultParams}${defaultParamsPost}#/home`,
+            );
+        });
+    });
+
+    test('Should not add newChartsLibrary to the iframe src when not specified', async () => {
+        const appEmbed = new AppEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            showPrimaryNavbar: false,
+        } as AppViewConfig);
+
+        appEmbed.render();
+        await executeAfterWait(() => {
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
+                `http://${thoughtSpotHost}/?embedApp=true&primaryNavHidden=true&profileAndHelpInNavBarHidden=false${defaultParams}${defaultParamsPost}#/home`,
+            );
+        });
+    });
+
     test('Should add enableSearchAssist flagto the iframe src', async () => {
         const appEmbed = new AppEmbed(getRootEl(), {
             ...defaultViewConfig,
@@ -1208,6 +1257,44 @@ describe('App embed tests', () => {
         });
     });
 
+    test('should set enableLiveboardDataCache to true in url', async () => {
+        const appEmbed = new AppEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            enableLiveboardDataCache: true,
+        } as AppViewConfig);
+        appEmbed.render();
+        await executeAfterWait(() => {
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
+                `http://${thoughtSpotHost}/?embedApp=true&profileAndHelpInNavBarHidden=false&enableLiveboardDataCache=true${defaultParamsPost}#/home`,
+            );
+        });
+    });
+
+    test('should set enableLiveboardDataCache to false in url', async () => {
+        const appEmbed = new AppEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            enableLiveboardDataCache: false,
+        } as AppViewConfig);
+        appEmbed.render();
+        await executeAfterWait(() => {
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
+                `http://${thoughtSpotHost}/?embedApp=true&profileAndHelpInNavBarHidden=false&enableLiveboardDataCache=false${defaultParamsPost}#/home`,
+            );
+        });
+    });
+
+    test('should not set enableLiveboardDataCache in url when not provided', async () => {
+        const appEmbed = new AppEmbed(getRootEl(), {
+            ...defaultViewConfig,
+        } as AppViewConfig);
+        appEmbed.render();
+        await executeAfterWait(() => {
+            expect(getIFrameSrc()).not.toContain('enableLiveboardDataCache');
+        });
+    });
+
     test('Should add HomePageSearchBarMode flag with object search to the iframe src', async () => {
         const appEmbed = new AppEmbed(getRootEl(), {
             ...defaultViewConfig,
@@ -1774,4 +1861,96 @@ describe('App Embed Default Height and Minimum Height Handling', () => {
     });
 });
 
+describe('AppEmbed visualOverrides tests', () => {
+    test('should include visualOverridesParams in APP_INIT when visualOverrides config is provided', async () => {
+        const visualOverrides = {
+            chart: {
+                legend: {
+                    show: true,
+                    position: 'bottom' as const,
+                },
+            },
+        };
+        const appEmbed = new AppEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            visualOverrides,
+        } as AppViewConfig);
+
+        mockMessageChannel();
+        await testVisualOverridesInEmbed(appEmbed, visualOverrides);
+    });
+
+    test('should not include visualOverridesParams when visualOverrides is not provided', async () => {
+        const appEmbed = new AppEmbed(getRootEl(), {
+            ...defaultViewConfig,
+        } as AppViewConfig);
+
+        const mockEmbedEventPayload = {
+            type: EmbedEvent.APP_INIT,
+            data: {},
+        };
+
+        mockMessageChannel();
+        appEmbed.render();
+
+        const mockPort: any = {
+            postMessage: jest.fn(),
+        };
+
+        await executeAfterWait(() => {
+            const iframe = getIFrameEl();
+            postMessageToParent(iframe.contentWindow, mockEmbedEventPayload, mockPort);
+        });
+
+        await executeAfterWait(() => {
+            const callArgs = mockPort.postMessage.mock.calls[0][0];
+            expect(callArgs.type).toBe(EmbedEvent.APP_INIT);
+            if (callArgs.data.embedParams) {
+                expect(callArgs.data.embedParams.visualOverridesParams).toBeUndefined();
+            }
+        });
+    });
+
+    test('should pass visualOverrides with table config in AppEmbed', async () => {
+        const visualOverrides = {
+            table: {
+                display: {
+                    tableTheme: 'ZEBRA',
+                    tableContentDensity: 'COMPACT',
+                },
+            },
+        };
+        const appEmbed = new AppEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            visualOverrides,
+        } as AppViewConfig);
+
+        mockMessageChannel();
+        await testVisualOverridesInEmbed(appEmbed, visualOverrides);
+    });
+
+    test('should pass visualOverrides with both chart and table configs', async () => {
+        const visualOverrides = {
+            chart: {
+                legend: {
+                    show: true,
+                    position: 'right' as const,
+                },
+            },
+            table: {
+                display: {
+                    tableTheme: 'STRIPED',
+                },
+            },
+        };
+        const appEmbed = new AppEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            visualOverrides,
+        } as AppViewConfig);
+
+        mockMessageChannel();
+        await testVisualOverridesInEmbed(appEmbed, visualOverrides);
+    });
+});
+
 

package/src/embed/app.ts

@@ -18,6 +18,7 @@ import {
     MessagePayload,
     AllEmbedViewConfig,
     DefaultAppInitData,
+    VisualizationOverrides,
 } from '../types';
 import { V1Embed } from './ts-embed';
 import { SpotterChatViewConfig, SpotterSidebarViewConfig } from './conversation';
@@ -785,6 +786,25 @@ export interface AppViewConfig extends AllEmbedViewConfig {
      * @version SDK: 1.48.0 | ThoughtSpot: 26.5.0.cl
      */
     enableHomepageAnnouncement?: boolean;
+    /**
+     * If set to true, enables visualization data caching on the Liveboard.
+     * @type {boolean}
+     * @version SDK: 1.49.0 | ThoughtSpot: 26.6.0.cl
+     * @example
+     * ```js
+     * const embed = new AppEmbed('#tsEmbed', {
+     *    ... // other options
+     *    enableLiveboardDataCache: true,
+     * })
+     * ```
+     */
+    enableLiveboardDataCache?: boolean;
+
+    /**
+     * Visual overrides to customize the chart or table properties.
+     * @version SDK: 1.49.0 | ThoughtSpot: 26.6.0.cl
+     */
+    visualOverrides?: VisualizationOverrides;
 }
 
 /**
@@ -862,6 +882,7 @@ export class AppEmbed extends V1Embed {
             showLiveboardDescription = true,
             showMaskedFilterChip = false,
             isLiveboardMasterpiecesEnabled = false,
+            newChartsLibrary,
             hideHomepageLeftNav = false,
             modularHomeExperience = false,
             isLiveboardHeaderSticky = true,
@@ -894,6 +915,7 @@ export class AppEmbed extends V1Embed {
             isThisPeriodInDateFiltersEnabled,
             enableHomepageAnnouncement = false,
             isContinuousLiveboardPDFEnabled,
+            enableLiveboardDataCache,
         } = this.viewConfig;
 
         let params: any = {};
@@ -906,6 +928,9 @@ export class AppEmbed extends V1Embed {
         params[Param.ShowLiveboardDescription] = !!showLiveboardDescription;
         params[Param.ShowMaskedFilterChip] = showMaskedFilterChip;
         params[Param.IsLiveboardMasterpiecesEnabled] = isLiveboardMasterpiecesEnabled;
+        if (newChartsLibrary !== undefined) {
+            params[Param.EnableNewChartLibrary] = newChartsLibrary;
+        }
         params[Param.LiveboardHeaderSticky] = isLiveboardHeaderSticky;
         params[Param.IsFullAppEmbed] = true;
         params[Param.LiveboardHeaderV2] = isLiveboardCompactHeaderEnabled;
@@ -1036,6 +1061,10 @@ export class AppEmbed extends V1Embed {
 
         this.defaultHeight = minimumHeight || this.defaultHeight;
 
+        if (enableLiveboardDataCache !== undefined) {
+            params[Param.EnableLiveboardDataCache] = enableLiveboardDataCache;
+        }
+
         params[Param.DataPanelV2Enabled] = dataPanelV2;
         params[Param.HideHomepageLeftNav] = hideHomepageLeftNav;
         params[Param.ModularHomeExperienceEnabled] = modularHomeExperience;

package/src/embed/conversation.ts

@@ -1,6 +1,6 @@
 import isUndefined from 'lodash/isUndefined';
 import { ERROR_MESSAGE } from '../errors';
-import { Param, BaseViewConfig, RuntimeFilter, RuntimeParameter, ErrorDetailsTypes, EmbedErrorCodes, DefaultAppInitData } from '../types';
+import { Param, BaseViewConfig, RuntimeFilter, RuntimeParameter, ErrorDetailsTypes, EmbedErrorCodes, DefaultAppInitData, VisualizationOverrides } from '../types';
 import { TsEmbed } from './ts-embed';
 import { buildSpotterSidebarAppInitData } from './spotter-utils';
 import { getQueryParamString, getFilterQuery, getRuntimeParameters, setParamIfDefined } from '../utils';
@@ -360,6 +360,7 @@ export interface ConversationViewConfig extends SpotterEmbedViewConfig {}
 export interface SpotterAppInitData extends DefaultAppInitData {
     embedParams?: {
         spotterSidebarConfig?: SpotterSidebarViewConfig;
+        visualOverridesParams?: VisualizationOverrides | null;
     };
 }
 

package/src/embed/hostEventClient/contracts.ts

@@ -137,7 +137,8 @@ export type UIPassthroughContractBase = {
   [UIPassthroughEvent.GetExportRequestForCurrentPinboard]: {
     request: Record<string, never>;
     response: {
-      v2Content: string;
+      data: { v2Content: string };
+      type: UIPassthroughEvent.GetExportRequestForCurrentPinboard;
     };
   };
   [UIPassthroughEvent.UpdateFilters]: {

package/src/embed/hostEventClient/host-event-client.spec.ts

@@ -494,11 +494,11 @@ describe('HostEventClient', () => {
             const { client } = createHostEventClient();
             mockProcessTrigger
                 .mockResolvedValueOnce(mockGetAvailablePassthroughs())
-                .mockResolvedValueOnce([{ value: { v2Content: 'exportData' } }]);
+                .mockResolvedValueOnce([{ value: { data: { v2Content: 'exportData' }, type: 'getExportRequestForCurrentPinboard' } }]);
 
             const result = await client.triggerHostEvent(HostEvent.getExportRequestForCurrentPinboard, {});
 
-            expect(result).toEqual({ v2Content: 'exportData' });
+            expect(result).toEqual({ data: { v2Content: 'exportData' }, type: 'getExportRequestForCurrentPinboard' });
         });
 
         it('should fall back to legacy for GetFilters when passthrough returns null', async () => {

package/src/embed/liveboard.spec.ts

@@ -427,6 +427,47 @@ describe('Liveboard/viz embed tests', () => {
         });
     });
 
+    test('should set enableLiveboardDataCache to true in url', async () => {
+        const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+            enableLiveboardDataCache: true,
+            ...defaultViewConfig,
+            liveboardId,
+        } as LiveboardViewConfig);
+        liveboardEmbed.render();
+        await executeAfterWait(() => {
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
+                `http://${thoughtSpotHost}/?embedApp=true${defaultParams}&enableLiveboardDataCache=true${prefixParams}#/embed/viz/${liveboardId}`,
+            );
+        });
+    });
+
+    test('should set enableLiveboardDataCache to false in url', async () => {
+        const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+            enableLiveboardDataCache: false,
+            ...defaultViewConfig,
+            liveboardId,
+        } as LiveboardViewConfig);
+        liveboardEmbed.render();
+        await executeAfterWait(() => {
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
+                `http://${thoughtSpotHost}/?embedApp=true${defaultParams}&enableLiveboardDataCache=false${prefixParams}#/embed/viz/${liveboardId}`,
+            );
+        });
+    });
+
+    test('should not set enableLiveboardDataCache in url when not provided', async () => {
+        const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            liveboardId,
+        } as LiveboardViewConfig);
+        liveboardEmbed.render();
+        await executeAfterWait(() => {
+            expect(getIFrameSrc()).not.toContain('enableLiveboardDataCache');
+        });
+    });
+
     test('should render viz', async () => {
         const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
             ...defaultViewConfig,
@@ -593,6 +634,38 @@ describe('Liveboard/viz embed tests', () => {
         });
     });
 
+    test('Should add newChartsLibrary flag set to true to the iframe src', async () => {
+        const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            liveboardId,
+            newChartsLibrary: true,
+        } as LiveboardViewConfig);
+
+        liveboardEmbed.render();
+        await executeAfterWait(() => {
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
+                `http://${thoughtSpotHost}/?embedApp=true${defaultParams}&muzeChartPhase1EnabledGA=true${prefixParams}#/embed/viz/${liveboardId}`,
+            );
+        });
+    });
+
+    test('Should add newChartsLibrary flag set to false to the iframe src', async () => {
+        const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            liveboardId,
+            newChartsLibrary: false,
+        } as LiveboardViewConfig);
+
+        liveboardEmbed.render();
+        await executeAfterWait(() => {
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
+                `http://${thoughtSpotHost}/?embedApp=true${defaultParams}&muzeChartPhase1EnabledGA=false${prefixParams}#/embed/viz/${liveboardId}`,
+            );
+        });
+    });
+
     test('Should add hideIrrelevantFiltersAtTabLevel flag to the iframe src', async () => {
         const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
             ...defaultViewConfig,

package/src/embed/liveboard.ts

@@ -534,6 +534,19 @@ export interface LiveboardViewConfig extends BaseViewConfig, LiveboardOtherViewC
      * ```
      */
     spotterChatConfig?: SpotterChatViewConfig;
+    /**
+     * If set to true, enables visualization data caching on the Liveboard.
+     * @type {boolean}
+     * @version SDK: 1.49.0 | ThoughtSpot: 26.6.0.cl
+     * @example
+     * ```js
+     * const embed = new LiveboardEmbed('#embed-container', {
+     *    ... // other options
+     *    enableLiveboardDataCache: true,
+     * })
+     * ```
+     */
+    enableLiveboardDataCache?: boolean;
 }
 
 /**
@@ -606,6 +619,7 @@ export class LiveboardEmbed extends V1Embed {
             hideIrrelevantChipsInLiveboardTabs = false,
             showMaskedFilterChip = false,
             isLiveboardMasterpiecesEnabled = false,
+            newChartsLibrary,
             isEnhancedFilterInteractivityEnabled = false,
             enableAskSage,
             enable2ColumnLayout,
@@ -627,6 +641,7 @@ export class LiveboardEmbed extends V1Embed {
             spotterChatConfig,
             isThisPeriodInDateFiltersEnabled,
             isContinuousLiveboardPDFEnabled,
+            enableLiveboardDataCache,
         } = this.viewConfig;
 
         const preventLiveboardFilterRemoval = this.viewConfig.preventLiveboardFilterRemoval
@@ -744,6 +759,14 @@ export class LiveboardEmbed extends V1Embed {
             params[Param.IsWYSIWYGLiveboardPDFEnabled] = isContinuousLiveboardPDFEnabled;
         }
 
+        if (enableLiveboardDataCache !== undefined) {
+            params[Param.EnableLiveboardDataCache] = enableLiveboardDataCache;
+        }
+
+        if (newChartsLibrary !== undefined) {
+            params[Param.EnableNewChartLibrary] = newChartsLibrary;
+        }
+
         params[Param.LiveboardHeaderSticky] = isLiveboardHeaderSticky;
         params[Param.LiveboardHeaderV2] = isLiveboardCompactHeaderEnabled;
         params[Param.ShowLiveboardVerifiedBadge] = showLiveboardVerifiedBadge;

package/src/embed/search.spec.ts

@@ -17,6 +17,7 @@ import {
     expectUrlMatchesWithParams,
     getIFrameEl,
     postMessageToParent,
+    testVisualOverridesInEmbed,
 } from '../test/test-utils';
 import { version } from '../../package.json';
 import { SearchBarEmbed } from './search-bar';
@@ -524,6 +525,34 @@ describe('Search embed tests', () => {
         });
     });
 
+    test('Should add newChartsLibrary flag set to true to the iframe src', async () => {
+        const searchEmbed = new SearchEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            newChartsLibrary: true,
+        });
+        searchEmbed.render();
+        await executeAfterWait(() => {
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
+                `http://${thoughtSpotHost}/v2/?${defaultParamsWithHiddenActions}&enableDataPanelV2=true&muzeChartPhase1EnabledGA=true&dataSourceMode=expand&useLastSelectedSources=false${prefixParams}#/embed/answer`,
+            );
+        });
+    });
+
+    test('Should add newChartsLibrary flag set to false to the iframe src', async () => {
+        const searchEmbed = new SearchEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            newChartsLibrary: false,
+        });
+        searchEmbed.render();
+        await executeAfterWait(() => {
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
+                `http://${thoughtSpotHost}/v2/?${defaultParamsWithHiddenActions}&enableDataPanelV2=true&muzeChartPhase1EnabledGA=false&dataSourceMode=expand&useLastSelectedSources=false${prefixParams}#/embed/answer`,
+            );
+        });
+    });
+
     test('should set dataPanelCustomGroupsAccordionInitialState to EXPAND_FIRST when passed', async () => {
         const searchEmbed = new SearchBarEmbed(getRootEl() as any, {
             ...defaultViewConfig,
@@ -811,3 +840,92 @@ describe('SearchBarEmbed tests', () => {
         });
     });
 });
+
+describe('SearchEmbed visualOverrides tests', () => {
+    test('should pass visualOverrides in embedParams when visualOverrides config is provided', async () => {
+        const visualOverrides = {
+            chart: {
+                legend: {
+                    show: true,
+                    position: 'bottom' as const,
+                },
+            },
+        };
+        const searchEmbed = new SearchEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            visualOverrides,
+        });
+
+        await testVisualOverridesInEmbed(searchEmbed, visualOverrides);
+    });
+
+    test('should not include visualOverridesParams when visualOverrides is not provided', async () => {
+        const searchEmbed = new SearchEmbed(getRootEl(), {
+            ...defaultViewConfig,
+        });
+        const mockEmbedEventPayload = {
+            type: EmbedEvent.APP_INIT,
+            data: {},
+        };
+
+        searchEmbed.render();
+
+        const mockPort: any = {
+            postMessage: jest.fn(),
+        };
+
+        await executeAfterWait(() => {
+            const iframe = getIFrameEl();
+            postMessageToParent(iframe.contentWindow, mockEmbedEventPayload, mockPort);
+        });
+
+        await executeAfterWait(() => {
+            const callArgs = mockPort.postMessage.mock.calls[0][0];
+            expect(callArgs.type).toBe(EmbedEvent.APP_INIT);
+            expect(callArgs.data.embedParams?.visualOverridesParams).toBeUndefined();
+        });
+    });
+
+    test('should pass visualOverrides with complex chart config', async () => {
+        const visualOverrides = {
+            chart: {
+                legend: {
+                    show: true,
+                    position: 'right' as const,
+                    colorPalette: {
+                        colors: ['#ff0000', '#00ff00', '#0000ff'],
+                    },
+                },
+                columns: [
+                    {
+                        name: 'Revenue',
+                        color: '#1f77b4',
+                    },
+                ],
+            },
+        };
+        const searchEmbed = new SearchEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            visualOverrides,
+        });
+
+        await testVisualOverridesInEmbed(searchEmbed, visualOverrides);
+    });
+
+    test('should pass visualOverrides with table config', async () => {
+        const visualOverrides = {
+            table: {
+                display: {
+                    tableTheme: 'ZEBRA',
+                    tableContentDensity: 'COMPACT',
+                },
+            },
+        };
+        const searchEmbed = new SearchEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            visualOverrides,
+        });
+
+        await testVisualOverridesInEmbed(searchEmbed, visualOverrides);
+    });
+});