@thoughtspot/visual-embed-sdk 1.24.0 → 1.24.1

package/src/embed/sage.ts

@@ -100,6 +100,8 @@ export class SageEmbed extends V1Embed {
      */
     protected viewConfig: SageViewConfig;
 
+    protected embedComponentType = 'SageEmbed';
+
     // eslint-disable-next-line no-useless-constructor
     constructor(domSelector: DOMSelector, viewConfig: SageViewConfig) {
         super(domSelector, viewConfig);

package/src/embed/search-bar.tsx

@@ -45,6 +45,8 @@ export class SearchBarEmbed extends TsEmbed {
      */
     protected viewConfig: SearchBarViewConfig;
 
+    protected embedComponentType = 'SearchBarEmbed';
+
     constructor(domSelector: string, viewConfig: SearchBarViewConfig) {
         super(domSelector);
         this.viewConfig = viewConfig;

package/src/embed/search.ts

@@ -153,6 +153,8 @@ export class SearchEmbed extends TsEmbed {
      */
     protected viewConfig: SearchViewConfig;
 
+    protected embedComponentType = 'SearchEmbed';
+
     constructor(domSelector: DOMSelector, viewConfig: SearchViewConfig) {
         super(domSelector);
         this.viewConfig = viewConfig;

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

@@ -113,6 +113,8 @@ describe('Unit test case for ts embed', () => {
                     runtimeFilterParams: null,
                     hiddenHomeLeftNavItems: [],
                     hiddenHomepageModules: [],
+                    hostConfig: undefined,
+                    reorderedHomepageModules: [],
                 },
             });
         });
@@ -142,6 +144,8 @@ describe('Unit test case for ts embed', () => {
                     runtimeFilterParams: null,
                     hiddenHomeLeftNavItems: [],
                     hiddenHomepageModules: [],
+                    hostConfig: undefined,
+                    reorderedHomepageModules: [],
                 },
             });
             expect(getIFrameSrc()).toContain(
@@ -181,6 +185,44 @@ describe('Unit test case for ts embed', () => {
                     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],
                 },
             });
         });
@@ -219,6 +261,8 @@ describe('Unit test case for ts embed', () => {
                     runtimeFilterParams: 'col1=color&op1=EQ&val1=blue',
                     hiddenHomeLeftNavItems: [],
                     hiddenHomepageModules: [],
+                    hostConfig: undefined,
+                    reorderedHomepageModules: [],
                 },
             });
         });
@@ -257,6 +301,8 @@ describe('Unit test case for ts embed', () => {
                     runtimeFilterParams: null,
                     hiddenHomeLeftNavItems: [],
                     hiddenHomepageModules: [],
+                    hostConfig: undefined,
+                    reorderedHomepageModules: [],
                 },
             });
         });
@@ -293,6 +339,7 @@ describe('Unit test case for ts embed', () => {
                     hiddenHomeLeftNavItems: [HomeLeftNavItem.Home,
                         HomeLeftNavItem.Documentation],
                     hiddenHomepageModules: [],
+                    reorderedHomepageModules: [],
                 },
             });
         });
@@ -448,6 +495,8 @@ describe('Unit test case for ts embed', () => {
                         runtimeFilterParams: null,
                         hiddenHomeLeftNavItems: [],
                         hiddenHomepageModules: [],
+                        hostConfig: undefined,
+                        reorderedHomepageModules: [],
                     },
                 });
             });

package/src/embed/ts-embed.ts

@@ -115,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
@@ -159,6 +161,7 @@ export class TsEmbed {
         this.registerAppInit();
         uploadMixpanelEvent(MIXPANEL_EVENT.VISUAL_SDK_EMBED_CREATE, {
             ...viewConfig,
+            embedComponentType: this.embedComponentType,
         });
     }
 
@@ -277,6 +280,7 @@ export class TsEmbed {
                     ? getRuntimeFilters(this.viewConfig.runtimeFilters)
                     : null,
                 hiddenHomepageModules: this.viewConfig.hiddenHomepageModules || [],
+                reorderedHomepageModules: this.viewConfig.reorderedHomepageModules || [],
                 hostConfig: this.embedConfig.hostConfig,
                 hiddenHomeLeftNavItems: this.viewConfig?.hiddenHomeLeftNavItems
                     ? this.viewConfig?.hiddenHomeLeftNavItems

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';
@@ -41,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,
@@ -48,6 +50,8 @@ export {
     prefetch,
     executeTML,
     exportTML,
+    executeTMLInput,
+    exportTMLInput,
     getEmbedConfig as getInitConfig,
     getSessionInfo,
     SearchEmbed,
@@ -60,6 +64,7 @@ export {
     AuthStatus,
     AuthEvent,
     AuthEventEmitter,
+    AnswerService,
     // types
     Page,
     AuthType,

package/src/mixpanel-service.spec.ts

@@ -57,6 +57,7 @@ describe('Unit test for mixpanel', () => {
             clusterId: sessionInfo.clusterId,
             clusterName: sessionInfo.clusterName,
             releaseVersion: sessionInfo.releaseVersion,
+            hostAppUrl: 'localhost',
         });
         expect(mixpanel.identify).not.toHaveBeenCalledWith(sessionInfo.userGUID);
     });

package/src/mixpanel-service.ts

@@ -71,6 +71,7 @@ export function initMixpanel(sessionInfo: any): void {
                 clusterId: sessionInfo.clusterId,
                 clusterName: sessionInfo.clusterName,
                 releaseVersion: sessionInfo.releaseVersion,
+                hostAppUrl: window?.location?.host || '',
             });
             isMixpanelInitialized = true;
             emptyQueue();

package/src/types.ts

@@ -8,6 +8,7 @@
  */
 
 import { CustomCssVariables } from './css-variables';
+import type { SessionInterface } from './utils/graphql/answerService/answerService';
 
 /**
  * The authentication mechanism for allowing access to the
@@ -533,7 +534,7 @@ export interface EmbedConfig {
 }
 
 // eslint-disable-next-line @typescript-eslint/no-empty-interface
-export interface LayoutConfig {}
+export interface LayoutConfig { }
 
 /**
  * Embedded iFrame configuration
@@ -757,6 +758,12 @@ export interface ViewConfig {
      * @version SDK: 1.27.0 | Thoughtspot: 9.8.0.cl
      */
     hiddenHomepageModules?: HomepageModule[];
+    /**
+     * reordering the home page modules
+     * eg: reorderedHomepageModules = [HomepageModule.MyLibrary, HomepageModule.Watchlist]
+     * @version SDK: 1.28.0 | Thoughtspot: 9.9.0.cl
+     */
+    reorderedHomepageModules?: HomepageModule[];
     /**
      * The list of tab IDs to show in the embedded.
      * Only this Tabs will be shown in their respective LBs.
@@ -917,27 +924,27 @@ export enum HomepageModule {
     /**
      * Search bar
      */
-    Search = 'search',
+    Search = 'SEARCH',
     /**
      * kPI watchlist module
      */
-    Watchlist = 'watchlist',
+    Watchlist = 'WATCHLIST',
     /**
      * favorite objects
      */
-    Favorite = 'favorite',
+    Favorite = 'FAVORITE',
     /**
      * List of answers and liveboards
      */
-    MyLibrary = 'mylibrary',
+    MyLibrary = 'MY_LIBRARY',
     /**
      * Trending list
      */
-    Trending = 'trending',
+    Trending = 'TRENDING',
     /**
      * Learning videos
      */
-    Learning = 'learning',
+    Learning = 'LEARNING',
 }
 
 /**
@@ -3122,18 +3129,6 @@ export enum Action {
     PersonalisedViewsDropdown = 'personalisedViewsDropdown',
 }
 
-export interface SessionInterface {
-    sessionId: string;
-    genNo: number;
-    acSession: { sessionId: string; genNo: number };
-}
-
-// eslint-disable-next-line no-shadow
-export enum OperationType {
-    GetChartWithData = 'GetChartWithData',
-    GetTableWithHeadlineData = 'GetTableWithHeadlineData',
-}
-
 export interface AnswerServiceType {
     getAnswer?: (offset: number, batchSize: number) => any;
 }
@@ -3152,3 +3147,39 @@ export enum ContextMenuTriggerOptions {
     LEFT_CLICK = 'left-click',
     RIGHT_CLICK = 'right-click',
 }
+
+export interface ColumnValue {
+    column: {
+        id: string,
+        name: string,
+        dataType: string,
+        [key: string]: any
+    },
+    value: string | number | boolean;
+}
+
+export interface VizPoint {
+    selectedAttributes: ColumnValue[],
+    selectedMeasures: ColumnValue[]
+}
+
+export interface CustomActionPayload {
+    contextMenuPoints?: {
+        clickedPoint: VizPoint
+        selectedPoints: VizPoint[]
+    };
+    embedAnswerData: {
+        name: string,
+        id: string,
+        sources: {
+            header: {
+                guid: string
+            }
+        },
+        columns: any[],
+        data: any[],
+        [key: string]: any
+    };
+    session: SessionInterface;
+    vizId?: string;
+}

package/src/utils/graphql/answerService/answer-queries.ts

@@ -0,0 +1,80 @@
+const bachSessionId = `
+id {
+    sessionId
+    genNo
+    acSession {
+        sessionId
+        genNo
+    }
+}
+`;
+
+export const getUnaggregatedAnswerSession = `
+mutation GetUnAggregatedAnswerSession($session: BachSessionIdInput!, $columns: [UserPointSelectionInput!]!) {
+    Answer__getUnaggregatedAnswer(session: $session, columns: $columns) {
+        ${bachSessionId}
+        answer {
+            visualizations {
+                ... on TableViz {
+                    columns {
+                        column {
+                            id
+                            name
+                            referencedColumns {
+                                guid
+                                displayName
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    }
+}  
+`;
+
+export const removeColumns = `
+mutation RemoveColumns($session: BachSessionIdInput!, $logicalColumnIds: [GUID!], $columnIds: [GUID!]) {
+    Answer__removeColumns(
+        session: $session
+        logicalColumnIds: $logicalColumnIds
+        columnIds: $columnIds
+        ) {
+            ${bachSessionId}
+    }
+}
+    `;
+
+export const addColumns = `
+    mutation AddColumns($session: BachSessionIdInput!, $columns: [AnswerColumnInfo!]!) {
+        Answer__addColumn(session: $session, columns: $columns) {
+            ${bachSessionId}
+        }
+    }
+    `;
+
+export const getAnswerData = `
+    query GetTableWithHeadlineData($session: BachSessionIdInput!, $deadline: Int!, $dataPaginationParams: DataPaginationParamsInput!) {
+        getAnswer(session: $session) {
+            ${bachSessionId}
+            answer {
+                id
+                visualizations {
+                    id
+                    ... on TableViz {
+                        columns {
+                            column {
+                                id
+                                name
+                                type
+                                aggregationType
+                                dataType
+                            }
+                        }
+                        data(deadline: $deadline, pagination: $dataPaginationParams)
+                    }          
+                }
+            }
+        }
+    }
+`;

package/src/utils/graphql/answerService/answerService.spec.ts

@@ -0,0 +1,231 @@
+import 'jest-fetch-mock';
+import { VizPoint } from 'src/types';
+import { AnswerService } from './answerService';
+import { getAnswerData, removeColumns } from './answer-queries';
+
+const defaultSession = {
+    sessionId: 'id',
+    genNo: 1,
+    acSession: {
+        sessionId: 'ac',
+        genNo: 0,
+    },
+};
+/**
+ *
+ * @param answer
+ * @param point
+ */
+function createAnswerService(answer = {}, point?: VizPoint[]) {
+    return new AnswerService(
+        defaultSession,
+        answer,
+        'https://tshost',
+        point,
+    );
+}
+
+describe('Answer service tests', () => {
+    beforeEach(() => {
+        fetchMock.resetMocks();
+    });
+    test('Execute query should execute the supplied graphql on the session', async () => {
+        fetchMock.mockResponseOnce(JSON.stringify({
+            data: {
+                Bla: {
+                    id: {},
+                },
+            },
+        }));
+        const answerService = createAnswerService();
+        answerService.executeQuery(
+            'query Bla {}',
+            { a: 1 },
+        );
+        expect(fetchMock).toBeCalledWith('https://tshost/prism/?op=Bla', expect.objectContaining({
+            body: JSON.stringify({
+                operationName: 'Bla',
+                query: 'query Bla {}',
+                variables: {
+                    session: defaultSession,
+                    a: 1,
+                },
+            }),
+        }));
+    });
+
+    test('Should return error when failure', async () => {
+        fetchMock.mockRejectOnce(new Error('testError'));
+        const answerService = createAnswerService();
+        const data = await answerService.executeQuery(
+            'query Bla {}',
+            { a: 1 },
+        );
+        expect(data.message).toBe('testError');
+    });
+
+    test('fetchData should call the right graphql, and return data', async () => {
+        fetchMock.mockResponseOnce(JSON.stringify({
+            data: {
+                getAnswer: {
+                    id: {},
+                    answer: {
+                        visualizations: [{
+                            columns: [{
+                                column: {
+                                    id: 'id1',
+                                },
+                            }],
+                            data: {
+                                foo: 1,
+                            },
+                        }],
+                    },
+                },
+            },
+        }));
+        const answerService = createAnswerService();
+        const data = await answerService.fetchData(20, 10);
+        expect(fetchMock).toHaveBeenCalledWith(
+            'https://tshost/prism/?op=GetTableWithHeadlineData',
+            expect.objectContaining({
+                body: JSON.stringify({
+                    operationName: 'GetTableWithHeadlineData',
+                    query: getAnswerData,
+                    variables: {
+                        session: defaultSession,
+                        deadline: 0,
+                        dataPaginationParams: {
+                            isClientPaginated: true,
+                            offset: 20,
+                            size: 10,
+                        },
+                    },
+                }),
+            }),
+        );
+        expect(data.columns[0].column.id).toBe('id1');
+        expect(data.data.foo).toBe(1);
+    });
+
+    test('fetchCSVBlob should call the right API', async () => {
+        fetchMock.once('Bla');
+        const answerService = createAnswerService();
+        answerService.fetchCSVBlob(undefined, true);
+        expect(fetchMock).toHaveBeenCalledWith(
+            `https://tshost/prism/download/answer/csv?sessionId=${defaultSession.sessionId}&genNo=${defaultSession.genNo}&userLocale=en-us&exportFileName=data&omitInfo=true`,
+            expect.objectContaining({}),
+        );
+    });
+
+    test('getUnderlyingDataForPoint should call the right APIs', async () => {
+        fetchMock.mockResponses(
+            JSON.stringify({
+                data: {
+                    getSourceDetailById: [{
+                        columns: [{
+                            id: 'id1',
+                            name: 'col1',
+                        }, {
+                            id: 'id2',
+                            name: 'col2',
+                        }, {
+                            id: 'id3',
+                            name: 'col3',
+                        }],
+                    }],
+                },
+            }),
+            JSON.stringify({
+                data: {
+                    Answer__getUnaggregatedAnswer: {
+                        id: {
+                            ...defaultSession,
+                        },
+                        answer: {
+                            visualizations: [{
+                                columns: [{
+                                    column: {
+                                        id: 'oid1',
+                                        name: 'col1',
+                                        referencedColumns: [{
+                                            guid: 'id1',
+                                        }],
+                                    },
+                                }],
+                            }],
+                        },
+                    },
+                },
+            }),
+            JSON.stringify({
+                data: {
+                    Answer__addColumn: {
+                        id: {
+                            genNo: 2,
+                        },
+                    },
+                },
+            }),
+            JSON.stringify({
+                data: {
+                    Answer__removeColumns: {
+                        id: {
+                            genNo: 3,
+                        },
+                    },
+                },
+            }),
+        );
+        const answerService = createAnswerService({
+            sources: [{
+                header: {
+                    guid: 'source1',
+                },
+            }],
+        }, [{
+            selectedAttributes: [{
+                column: {
+                    id: 'oid1', // output column id
+                    name: 'col1',
+                    dataType: 'CHAR',
+                },
+                value: '1',
+            }, {
+                column: {
+                    id: 'oid3',
+                    name: 'col3',
+                    dataType: 'DATE',
+                },
+                value: 12345,
+            }],
+            selectedMeasures: [],
+        }]);
+        const underlying = await answerService.getUnderlyingDataForPoint(['col2']);
+        expect(fetchMock).toHaveBeenCalledTimes(4);
+        expect(underlying.getSession().genNo).toBe(3);
+        expect(fetchMock).toHaveBeenCalledWith(
+            'https://tshost/prism/?op=RemoveColumns',
+            expect.objectContaining({
+                body: JSON.stringify({
+                    operationName: 'RemoveColumns',
+                    query: removeColumns,
+                    variables: {
+                        session: {
+                            ...defaultSession,
+                            genNo: 2,
+                        },
+                        logicalColumnIds: [
+                            'id1',
+                        ],
+                    },
+                }),
+            }),
+        );
+    });
+
+    test('getUnderlyingDataForPoint should throw when no point is selected', async () => {
+        const answerService = createAnswerService({}, null);
+        await expect(answerService.getUnderlyingDataForPoint(['col2'])).rejects.toThrow();
+    });
+});