@thoughtspot/visual-embed-sdk 1.24.0-sage.3 → 1.24.1

package/src/embed/search.ts

@@ -14,8 +14,14 @@ import {
     Action,
     ViewConfig,
     RuntimeFilter,
+    RuntimeParameter,
 } from '../types';
-import { getQueryParamString, checkReleaseVersionInBeta, getFilterQuery } from '../utils';
+import {
+    getQueryParamString,
+    checkReleaseVersionInBeta,
+    getFilterQuery,
+    getRuntimeParameters,
+} from '../utils';
 import { TsEmbed } from './ts-embed';
 import { version } from '../../package.json';
 import { ERROR_MESSAGE } from '../errors';
@@ -60,6 +66,10 @@ export interface SearchViewConfig extends ViewConfig {
      * using raw answer data.
      */
     hideResults?: boolean;
+    /**
+     * If set to true, expands all the data sources panel.
+     */
+    expandAllDataSource?: boolean;
     /**
      * If set to true, the Search Assist feature is enabled.
      *
@@ -110,9 +120,18 @@ export interface SearchViewConfig extends ViewConfig {
      *
      * @default false
      * @version SDK: 1.26.0 | Thoughtspot: 9.7.0.cl
-     * @hidden
      */
     dataPanelV2?: boolean;
+    /**
+     * Flag to set if last selected dataSource should be used
+     *
+     * @version: SDK: 1.24.0
+     */
+    useLastSelectedSources?: boolean;
+    /**
+     * The list of parameter override to apply to a search answer.
+     */
+    runtimeParameters?: RuntimeParameter[];
 }
 
 export const HiddenActionItemByDefaultForSearchEmbed = [
@@ -134,6 +153,8 @@ export class SearchEmbed extends TsEmbed {
      */
     protected viewConfig: SearchViewConfig;
 
+    protected embedComponentType = 'SearchEmbed';
+
     constructor(domSelector: DOMSelector, viewConfig: SearchViewConfig) {
         super(domSelector);
         this.viewConfig = viewConfig;
@@ -158,6 +179,7 @@ export class SearchEmbed extends TsEmbed {
     protected getEmbedParams(): string {
         const {
             hideResults,
+            expandAllDataSource,
             enableSearchAssist,
             forceTable,
             searchOptions,
@@ -166,6 +188,8 @@ export class SearchEmbed extends TsEmbed {
             dataSources,
             excludeRuntimeFiltersfromURL,
             dataPanelV2 = false,
+            useLastSelectedSources = false,
+            runtimeParameters,
         } = this.viewConfig;
         const queryParams = this.getBaseQueryParams();
 
@@ -201,13 +225,22 @@ export class SearchEmbed extends TsEmbed {
 
         queryParams[Param.DataPanelV2Enabled] = dataPanelV2;
         queryParams[Param.DataSourceMode] = this.getDataSourceMode();
-        queryParams[Param.UseLastSelectedDataSource] = false;
+
+        queryParams[Param.UseLastSelectedDataSource] = useLastSelectedSources;
+        if (dataSource || dataSources) {
+            queryParams[Param.UseLastSelectedDataSource] = false;
+        }
+
         queryParams[Param.searchEmbed] = true;
         let query = '';
         const queryParamsString = getQueryParamString(queryParams, true);
         if (queryParamsString) {
             query = `?${queryParamsString}`;
         }
+
+        const parameterQuery = getRuntimeParameters(runtimeParameters || []);
+        if (parameterQuery) query += `&${parameterQuery}`;
+
         const filterQuery = getFilterQuery(runtimeFilters || []);
         if (filterQuery && !excludeRuntimeFiltersfromURL) {
             query += `&${filterQuery}`;

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

@@ -9,7 +9,13 @@ import {
     AppEmbed,
     LiveboardEmbed,
 } from '../index';
-import { Action, RuntimeFilter, RuntimeFilterOp } from '../types';
+import {
+    Action,
+    HomeLeftNavItem,
+    RuntimeFilter,
+    RuntimeFilterOp,
+    HomepageModule,
+} from '../types';
 import {
     executeAfterWait,
     getDocumentBody,
@@ -101,7 +107,15 @@ describe('Unit test case for ts embed', () => {
             });
             expect(mockPort.postMessage).toHaveBeenCalledWith({
                 type: EmbedEvent.APP_INIT,
-                data: { customisations, authToken: '', runtimeFilterParams: null },
+                data: {
+                    customisations,
+                    authToken: '',
+                    runtimeFilterParams: null,
+                    hiddenHomeLeftNavItems: [],
+                    hiddenHomepageModules: [],
+                    hostConfig: undefined,
+                    reorderedHomepageModules: [],
+                },
             });
         });
 
@@ -128,6 +142,10 @@ describe('Unit test case for ts embed', () => {
                     customisations: customisationsView,
                     authToken: '',
                     runtimeFilterParams: null,
+                    hiddenHomeLeftNavItems: [],
+                    hiddenHomepageModules: [],
+                    hostConfig: undefined,
+                    reorderedHomepageModules: [],
                 },
             });
             expect(getIFrameSrc()).toContain(
@@ -135,7 +153,81 @@ describe('Unit test case for ts embed', () => {
             );
         });
 
-        test('Runtime filters from view Config should be part of app_init payload', async () => {
+        test('hide home page modules from view Config should be part of app_init payload', async () => {
+            const mockEmbedEventPayload = {
+                type: EmbedEvent.APP_INIT,
+                data: {},
+            };
+            const mockedHiddenHomepageModules: HomepageModule[] = [
+                HomepageModule.MyLibrary,
+                HomepageModule.Learning,
+            ];
+
+            const searchEmbed = new SearchEmbed(getRootEl(), {
+                ...defaultViewConfig,
+                hiddenHomepageModules: mockedHiddenHomepageModules,
+            });
+            searchEmbed.render();
+            const mockPort: any = {
+                postMessage: jest.fn(),
+            };
+            await executeAfterWait(() => {
+                const iframe = getIFrameEl();
+                postMessageToParent(iframe.contentWindow, mockEmbedEventPayload, mockPort);
+            });
+            expect(mockPort.postMessage).toHaveBeenCalledWith({
+                type: EmbedEvent.APP_INIT,
+                data: {
+                    customisations,
+                    authToken: '',
+                    hostConfig: undefined,
+                    runtimeFilterParams: null,
+                    hiddenHomeLeftNavItems: [],
+                    hiddenHomepageModules: [HomepageModule.MyLibrary,
+                        HomepageModule.Learning],
+                    reorderedHomepageModules: [],
+                },
+            });
+        });
+
+        test('Reordering the home page modules from view Config should be part of app_init payload', async () => {
+            const mockEmbedEventPayload = {
+                type: EmbedEvent.APP_INIT,
+                data: {},
+            };
+            const mockedReorderedHomepageModules: HomepageModule[] = [
+                HomepageModule.MyLibrary,
+                HomepageModule.Watchlist,
+            ];
+
+            const searchEmbed = new SearchEmbed(getRootEl(), {
+                ...defaultViewConfig,
+                reorderedHomepageModules: mockedReorderedHomepageModules,
+            });
+            searchEmbed.render();
+            const mockPort: any = {
+                postMessage: jest.fn(),
+            };
+            await executeAfterWait(() => {
+                const iframe = getIFrameEl();
+                postMessageToParent(iframe.contentWindow, mockEmbedEventPayload, mockPort);
+            });
+            expect(mockPort.postMessage).toHaveBeenCalledWith({
+                type: EmbedEvent.APP_INIT,
+                data: {
+                    customisations,
+                    authToken: '',
+                    hostConfig: undefined,
+                    runtimeFilterParams: null,
+                    hiddenHomeLeftNavItems: [],
+                    hiddenHomepageModules: [],
+                    reorderedHomepageModules: [HomepageModule.MyLibrary,
+                        HomepageModule.Watchlist],
+                },
+            });
+        });
+
+        test('Runtime filters from view Config should be part of app_init payload when excludeRuntimeFiltersfromURL is true', async () => {
             const mockEmbedEventPayload = {
                 type: EmbedEvent.APP_INIT,
                 data: {},
@@ -150,6 +242,7 @@ describe('Unit test case for ts embed', () => {
 
             const searchEmbed = new SearchEmbed(getRootEl(), {
                 ...defaultViewConfig,
+                excludeRuntimeFiltersfromURL: true,
                 runtimeFilters: mockRuntimeFilters,
             });
             searchEmbed.render();
@@ -166,6 +259,87 @@ describe('Unit test case for ts embed', () => {
                     customisations,
                     authToken: '',
                     runtimeFilterParams: 'col1=color&op1=EQ&val1=blue',
+                    hiddenHomeLeftNavItems: [],
+                    hiddenHomepageModules: [],
+                    hostConfig: undefined,
+                    reorderedHomepageModules: [],
+                },
+            });
+        });
+
+        test('Runtime filters from view Config should not be part of app_init payload when excludeRuntimeFiltersfromURL is false', async () => {
+            const mockEmbedEventPayload = {
+                type: EmbedEvent.APP_INIT,
+                data: {},
+            };
+            const mockRuntimeFilters: RuntimeFilter[] = [
+                {
+                    columnName: 'color',
+                    operator: RuntimeFilterOp.EQ,
+                    values: ['blue'],
+                },
+            ];
+
+            const searchEmbed = new SearchEmbed(getRootEl(), {
+                ...defaultViewConfig,
+                excludeRuntimeFiltersfromURL: false,
+                runtimeFilters: mockRuntimeFilters,
+            });
+            searchEmbed.render();
+            const mockPort: any = {
+                postMessage: jest.fn(),
+            };
+            await executeAfterWait(() => {
+                const iframe = getIFrameEl();
+                postMessageToParent(iframe.contentWindow, mockEmbedEventPayload, mockPort);
+            });
+            expect(mockPort.postMessage).toHaveBeenCalledWith({
+                type: EmbedEvent.APP_INIT,
+                data: {
+                    customisations,
+                    authToken: '',
+                    runtimeFilterParams: null,
+                    hiddenHomeLeftNavItems: [],
+                    hiddenHomepageModules: [],
+                    hostConfig: undefined,
+                    reorderedHomepageModules: [],
+                },
+            });
+        });
+
+        test('homeLeftNav from view Config should be part of app_init payload', async () => {
+            const mockEmbedEventPayload = {
+                type: EmbedEvent.APP_INIT,
+                data: {},
+            };
+            const mockedHiddenHomeLeftNavItems: HomeLeftNavItem[] = [
+                HomeLeftNavItem.Home,
+                HomeLeftNavItem.Documentation,
+            ];
+
+            const searchEmbed = new SearchEmbed(getRootEl(), {
+                ...defaultViewConfig,
+                hiddenHomeLeftNavItems: mockedHiddenHomeLeftNavItems,
+            });
+            searchEmbed.render();
+            const mockPort: any = {
+                postMessage: jest.fn(),
+            };
+            await executeAfterWait(() => {
+                const iframe = getIFrameEl();
+                postMessageToParent(iframe.contentWindow, mockEmbedEventPayload, mockPort);
+            });
+            expect(mockPort.postMessage).toHaveBeenCalledWith({
+                type: EmbedEvent.APP_INIT,
+                data: {
+                    customisations,
+                    authToken: '',
+                    hostConfig: undefined,
+                    runtimeFilterParams: null,
+                    hiddenHomeLeftNavItems: [HomeLeftNavItem.Home,
+                        HomeLeftNavItem.Documentation],
+                    hiddenHomepageModules: [],
+                    reorderedHomepageModules: [],
                 },
             });
         });
@@ -319,6 +493,10 @@ describe('Unit test case for ts embed', () => {
                         customisations,
                         authToken: 'test_auth_token1',
                         runtimeFilterParams: null,
+                        hiddenHomeLeftNavItems: [],
+                        hiddenHomepageModules: [],
+                        hostConfig: undefined,
+                        reorderedHomepageModules: [],
                     },
                 });
             });
@@ -463,7 +641,13 @@ describe('Unit test case for ts embed', () => {
         test('mixpanel should call with VISUAL_SDK_RENDER_COMPLETE', async () => {
             await setup(true);
             expect(mockMixPanelEvent).toBeCalledWith(MIXPANEL_EVENT.VISUAL_SDK_RENDER_START);
-            expect(mockMixPanelEvent).toBeCalledWith(MIXPANEL_EVENT.VISUAL_SDK_RENDER_COMPLETE);
+            expect(mockMixPanelEvent).toBeCalledWith(
+                MIXPANEL_EVENT.VISUAL_SDK_RENDER_COMPLETE,
+                expect.objectContaining({
+                    elWidth: 0,
+                    elHeight: 0,
+                }),
+            );
         });
 
         test('Should remove prefetch iframe', async () => {
@@ -840,7 +1024,7 @@ describe('Unit test case for ts embed', () => {
             expectUrlMatchesWithParams(
                 getIFrameSrc(),
                 `http://${thoughtSpotHost}/?embedApp=true&primaryNavHidden=true&profileAndHelpInNavBarHidden=false&${defaultParamsForPinboardEmbed}`
-                    + `&foo=bar&baz=1&bool=true${defaultParamsPost}#/home`,
+                + `&foo=bar&baz=1&bool=true${defaultParamsPost}#/home`,
             );
         });
 
@@ -856,7 +1040,7 @@ describe('Unit test case for ts embed', () => {
             expectUrlMatchesWithParams(
                 getIFrameSrc(),
                 `http://${thoughtSpotHost}/?embedApp=true&primaryNavHidden=true&profileAndHelpInNavBarHidden=false&${defaultParamsForPinboardEmbed}`
-                    + `&showAlerts=true${defaultParamsPost}#/home`,
+                + `&showAlerts=true${defaultParamsPost}#/home`,
             );
         });
         it('Sets the locale param', async () => {
@@ -871,7 +1055,7 @@ describe('Unit test case for ts embed', () => {
             expectUrlMatchesWithParams(
                 getIFrameSrc(),
                 `http://${thoughtSpotHost}/?embedApp=true&primaryNavHidden=true&profileAndHelpInNavBarHidden=false&${defaultParamsForPinboardEmbed}`
-                    + `&locale=ja-JP${defaultParamsPost}#/home`,
+                + `&locale=ja-JP${defaultParamsPost}#/home`,
             );
         });
         it('Sets the iconSprite url', async () => {
@@ -888,7 +1072,7 @@ describe('Unit test case for ts embed', () => {
             expectUrlMatchesWithParams(
                 getIFrameSrc(),
                 `http://${thoughtSpotHost}/?embedApp=true&primaryNavHidden=true&profileAndHelpInNavBarHidden=false&${defaultParamsForPinboardEmbed}`
-                    + `&iconSprite=iconSprite.com${defaultParamsPost}#/home`,
+                + `&iconSprite=iconSprite.com${defaultParamsPost}#/home`,
             );
         });
 
@@ -916,6 +1100,25 @@ describe('Unit test case for ts embed', () => {
             await appEmbed.render();
             expect(getRootEl().nextSibling.nextSibling).not.toBe(getIFrameEl());
         });
+        it('Should set the pendo tracking key when specified', async () => {
+            jest.spyOn(baseInstance, 'getAuthPromise').mockResolvedValue(true);
+            init({
+                thoughtSpotHost: 'tshost',
+                authType: AuthType.None,
+                pendoTrackingKey: '1234',
+            });
+            const appEmbed = new AppEmbed(getRootEl(), {
+                frameParams: {
+                    width: '100%',
+                    height: '100%',
+                },
+            });
+            await appEmbed.render();
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
+                `http://${thoughtSpotHost}/?embedApp=true&primaryNavHidden=true&profileAndHelpInNavBarHidden=false&additionalPendoKey=1234${defaultParamsPost}#/home`,
+            );
+        });
         xit('Sets the forceSAMLAutoRedirect param', async (done) => {
             jest.spyOn(baseInstance, 'getAuthPromise').mockResolvedValue(true);
             init({

package/src/embed/ts-embed.ts

@@ -18,6 +18,7 @@ import {
     getDOMNode,
     getFilterQuery,
     getQueryParamString,
+    getRuntimeParameters,
 } from '../utils';
 import {
     getThoughtSpotHost,
@@ -114,6 +115,8 @@ export class TsEmbed {
      */
     protected thoughtSpotV2Base: string;
 
+    protected embedComponentType = 'TsEmbed';
+
     /**
      * A map of event handlers for particular message types triggered
      * by the embedded app; multiple event handlers can be registered
@@ -156,6 +159,10 @@ export class TsEmbed {
         this.viewConfig = viewConfig;
         this.shouldEncodeUrlQueryParams = this.embedConfig.shouldEncodeUrlQueryParams;
         this.registerAppInit();
+        uploadMixpanelEvent(MIXPANEL_EVENT.VISUAL_SDK_EMBED_CREATE, {
+            ...viewConfig,
+            embedComponentType: this.embedComponentType,
+        });
     }
 
     /**
@@ -269,8 +276,15 @@ export class TsEmbed {
             data: {
                 customisations: getCustomisations(this.embedConfig, this.viewConfig),
                 authToken,
-                runtimeFilterParams: getRuntimeFilters(this.viewConfig.runtimeFilters),
+                runtimeFilterParams: this.viewConfig.excludeRuntimeFiltersfromURL
+                    ? getRuntimeFilters(this.viewConfig.runtimeFilters)
+                    : null,
+                hiddenHomepageModules: this.viewConfig.hiddenHomepageModules || [],
+                reorderedHomepageModules: this.viewConfig.reorderedHomepageModules || [],
                 hostConfig: this.embedConfig.hostConfig,
+                hiddenHomeLeftNavItems: this.viewConfig?.hiddenHomeLeftNavItems
+                    ? this.viewConfig?.hiddenHomeLeftNavItems
+                    : [],
             },
         });
     };
@@ -299,8 +313,8 @@ export class TsEmbed {
      * Register APP_INIT event and sendback init payload
      */
     private registerAppInit = () => {
-        this.on(EmbedEvent.APP_INIT, this.appInitCb);
-        this.on(EmbedEvent.AuthExpire, this.updateAuthToken);
+        this.on(EmbedEvent.APP_INIT, this.appInitCb, { start: false }, true);
+        this.on(EmbedEvent.AuthExpire, this.updateAuthToken, { start: false }, true);
     };
 
     /**
@@ -352,6 +366,9 @@ export class TsEmbed {
         if (this.embedConfig.authType === AuthType.TrustedAuthTokenCookieless) {
             queryParams[Param.cookieless] = true;
         }
+        if (this.embedConfig.pendoTrackingKey) {
+            queryParams[Param.PendoTrackingKey] = this.embedConfig.pendoTrackingKey;
+        }
 
         const {
             disabledActions,
@@ -497,8 +514,7 @@ export class TsEmbed {
         iFrame.allow = 'clipboard-read; clipboard-write';
 
         const {
-            height: frameHeight,
-            width: frameWidth, ...restParams
+            height: frameHeight, width: frameWidth, ...restParams
         } = this.viewConfig.frameParams || {};
         const width = getCssDimension(frameWidth || DEFAULT_EMBED_WIDTH);
         const height = getCssDimension(frameHeight || DEFAULT_EMBED_HEIGHT);
@@ -547,7 +563,6 @@ export class TsEmbed {
                         return;
                     }
 
-                    uploadMixpanelEvent(MIXPANEL_EVENT.VISUAL_SDK_RENDER_COMPLETE);
                     this.iFrame = this.iFrame || this.createIframeEl(url);
                     this.iFrame.addEventListener('load', () => {
                         nextInQueue();
@@ -558,7 +573,9 @@ export class TsEmbed {
                             },
                             type: EmbedEvent.Load,
                         });
-                        uploadMixpanelEvent(MIXPANEL_EVENT.VISUAL_SDK_IFRAME_LOAD_PERFORMANCE, {
+                        uploadMixpanelEvent(MIXPANEL_EVENT.VISUAL_SDK_RENDER_COMPLETE, {
+                            elWidth: this.iFrame.clientWidth,
+                            elHeight: this.iFrame.clientHeight,
                             timeTookToLoad: loadTimestamp - initTimestamp,
                         });
                     });
@@ -711,6 +728,8 @@ export class TsEmbed {
      * @param messageType The message type
      * @param callback A callback as a function
      * @param options The message options
+     * @param isSelf
+     * @param isRegisteredBySDK
      * @example
      * ```js
      * tsEmbed.on(EmbedEvent.Error, (data) => {
@@ -730,7 +749,11 @@ export class TsEmbed {
         messageType: EmbedEvent,
         callback: MessageCallback,
         options: MessageOptions = { start: false },
+        isRegisteredBySDK = false,
     ): typeof TsEmbed.prototype {
+        uploadMixpanelEvent(`${MIXPANEL_EVENT.VISUAL_SDK_ON}-${messageType}`, {
+            isRegisteredBySDK,
+        });
         if (this.isRendered) {
             this.handleError('Please register event handlers before calling render');
         }
@@ -900,8 +923,11 @@ export class V1Embed extends TsEmbed {
         let queryString = queryParams;
         if (!this.viewConfig.excludeRuntimeFiltersfromURL) {
             const runtimeFilters = this.viewConfig.runtimeFilters;
+            const runtimeParameters = this.viewConfig.runtimeParameters;
+
+            const parameterQuery = getRuntimeParameters(runtimeParameters || []);
             const filterQuery = getFilterQuery(runtimeFilters || []);
-            queryString = [filterQuery, queryParams].filter(Boolean).join('&');
+            queryString = [parameterQuery, filterQuery, queryParams].filter(Boolean).join('&');
         }
         return this.getV1EmbedBasePath(queryString);
     }
@@ -929,7 +955,6 @@ export class V1Embed extends TsEmbed {
         options: MessageOptions = { start: false },
     ): typeof TsEmbed.prototype {
         const eventType = this.getCompatibleEventType(messageType);
-        uploadMixpanelEvent(`${MIXPANEL_EVENT.VISUAL_SDK_ON}-${messageType}`);
         return super.on(eventType, callback, options);
     }
 }

package/src/index.ts

@@ -10,6 +10,7 @@
 import { AppEmbed, Page, AppViewConfig } from './embed/app';
 import {
     init, prefetch, logout, getEmbedConfig, executeTML, exportTML,
+    executeTMLInput, exportTMLInput,
 } from './embed/base';
 import { PinboardEmbed, LiveboardViewConfig, LiveboardEmbed } from './embed/liveboard';
 import { SearchEmbed, SearchViewConfig } from './embed/search';
@@ -29,6 +30,8 @@ import {
     PrefetchFeatures,
     FrameParams,
     DOMSelector,
+    HomeLeftNavItem,
+    HomepageModule,
     MessageOptions,
     MessageCallback,
     MessagePayload,
@@ -39,6 +42,7 @@ import {
 } from './types';
 import { CustomCssVariables } from './css-variables';
 import { SageEmbed, SageViewConfig } from './embed/sage';
+import { AnswerService } from './utils/graphql/answerService/answerService';
 
 export {
     init,
@@ -46,6 +50,8 @@ export {
     prefetch,
     executeTML,
     exportTML,
+    executeTMLInput,
+    exportTMLInput,
     getEmbedConfig as getInitConfig,
     getSessionInfo,
     SearchEmbed,
@@ -58,6 +64,7 @@ export {
     AuthStatus,
     AuthEvent,
     AuthEventEmitter,
+    AnswerService,
     // types
     Page,
     AuthType,
@@ -76,6 +83,8 @@ export {
     AppViewConfig,
     PrefetchFeatures,
     FrameParams,
+    HomeLeftNavItem,
+    HomepageModule,
     DOMSelector,
     MessageOptions,
     MessageCallback,

package/src/mixpanel-service.spec.ts

@@ -14,9 +14,10 @@ const config = {
 
 jest.mock('mixpanel-browser', () => ({
     __esModule: true,
-    init: jest.fn(),
+    init: jest.fn().mockReturnThis(),
     identify: jest.fn(),
     track: jest.fn(),
+    register_once: jest.fn(),
 }));
 
 describe('Unit test for mixpanel', () => {
@@ -30,7 +31,7 @@ describe('Unit test for mixpanel', () => {
             isPublicUser: false,
         };
         initMixpanel(sessionInfo);
-        expect(mixpanel.init).toHaveBeenCalledWith(sessionInfo.mixpanelToken);
+        expect(mixpanel.init).toHaveBeenCalledWith(sessionInfo.mixpanelToken, undefined, 'tsEmbed');
         expect(mixpanel.identify).toHaveBeenCalledWith(sessionInfo.userGUID);
 
         uploadMixpanelEvent(MIXPANEL_EVENT.VISUAL_SDK_CALLED_INIT, {
@@ -45,10 +46,19 @@ describe('Unit test for mixpanel', () => {
             mixpanelToken: 'newToken',
             isPublicUser: true,
             userGUID: 'newUser',
+            clusterId: 'newClusterId',
+            clusterName: 'newClusterName',
+            releaseVersion: 'newReleaseVersion',
         };
         initMixpanel(sessionInfo);
 
-        expect(mixpanel.init).toHaveBeenCalledWith(sessionInfo.mixpanelToken);
+        expect(mixpanel.init).toHaveBeenCalledWith(sessionInfo.mixpanelToken, undefined, 'tsEmbed');
+        expect(mixpanel.register_once).toHaveBeenCalledWith({
+            clusterId: sessionInfo.clusterId,
+            clusterName: sessionInfo.clusterName,
+            releaseVersion: sessionInfo.releaseVersion,
+            hostAppUrl: 'localhost',
+        });
         expect(mixpanel.identify).not.toHaveBeenCalledWith(sessionInfo.userGUID);
     });
 

package/src/mixpanel-service.ts

@@ -6,6 +6,7 @@ export const EndPoints = {
 
 // Needed to avoid error in CJS builds on some bundlers.
 const mixpanelLib = mixpanel.default || mixpanel;
+let mixpanelInstance: mixpanel.Mixpanel;
 
 export const MIXPANEL_EVENT = {
     VISUAL_SDK_RENDER_START: 'visual-sdk-render-start',
@@ -15,6 +16,7 @@ export const MIXPANEL_EVENT = {
     VISUAL_SDK_TRIGGER: 'visual-sdk-trigger',
     VISUAL_SDK_ON: 'visual-sdk-on',
     VISUAL_SDK_IFRAME_LOAD_PERFORMANCE: 'visual-sdk-iframe-load-performance',
+    VISUAL_SDK_EMBED_CREATE: 'visual-sdk-embed-create',
 };
 
 let isMixpanelInitialized = false;
@@ -31,7 +33,7 @@ export function uploadMixpanelEvent(eventId: string, eventProps = {}): void {
         eventQueue.push({ eventId, eventProps });
         return;
     }
-    mixpanelLib.track(eventId, eventProps);
+    mixpanelInstance.track(eventId, eventProps);
 }
 
 /**
@@ -61,10 +63,16 @@ export function initMixpanel(sessionInfo: any): void {
     const token = sessionInfo.mixpanelToken;
     try {
         if (token) {
-            mixpanelLib.init(token);
+            mixpanelInstance = mixpanelLib.init(token, undefined, 'tsEmbed');
             if (!isPublicCluster) {
-                mixpanelLib.identify(sessionInfo.userGUID);
+                mixpanelInstance.identify(sessionInfo.userGUID);
             }
+            mixpanelInstance.register_once({
+                clusterId: sessionInfo.clusterId,
+                clusterName: sessionInfo.clusterName,
+                releaseVersion: sessionInfo.releaseVersion,
+                hostAppUrl: window?.location?.host || '',
+            });
             isMixpanelInitialized = true;
             emptyQueue();
         }