@thoughtspot/visual-embed-sdk 1.21.0-alpha.1 → 1.21.0-alpha.2

package/src/auth.spec.ts

@@ -1,6 +1,7 @@
 import * as authInstance from './auth';
 import * as authService from './utils/authService';
 import * as checkReleaseVersionInBetaInstance from './utils';
+import * as mixPanelService from './mixpanel-service';
 import { AuthType, EmbedEvent } from './types';
 import { executeAfterWait } from './test/test-utils';
 
@@ -91,6 +92,9 @@ export const embedConfig: any = {
 
 const originalWindow = window;
 export const mockSessionInfo = {
+    userGUID: '1234',
+    mixpanelToken: 'abc123',
+    isPublicUser: false,
     sessionId: '6588e7d9-710c-453e-a7b4-535fb3a8cbb2',
     genNo: 3,
     acSession: {
@@ -110,6 +114,7 @@ describe('Unit test for auth', () => {
     });
 
     test('when session info giving response', async () => {
+        jest.spyOn(mixPanelService, 'initMixpanel').mockImplementation(() => Promise.resolve());
         authInstance.initSession(mockSessionInfo);
         const sessionInfo = await authInstance.getSessionInfo();
         expect(sessionInfo).toStrictEqual(mockSessionInfo);
@@ -138,11 +143,17 @@ describe('Unit test for auth', () => {
     });
 
     test('doTokenAuth: when user is loggedIn', async () => {
-        jest.spyOn(authService, 'fetchSessionInfoService').mockImplementation(async () => ({
-            json: () => mockSessionInfo,
-            status: 200,
-        }));
-        await authInstance.doTokenAuth(embedConfig.doTokenAuthSuccess('authToken'));
+        jest.spyOn(authService, 'fetchSessionInfoService').mockImplementation(
+            async () => ({
+                json: () => mockSessionInfo,
+                status: 200,
+            }),
+        );
+        jest.spyOn(authInstance, 'getSessionDetails').mockReturnValue(mockSessionInfo);
+        jest.spyOn(authInstance, 'initSession').mockReturnValue(null);
+        await authInstance.doTokenAuth(
+            embedConfig.doTokenAuthSuccess('authToken'),
+        );
         expect(authService.fetchSessionInfoService).toBeCalled();
         expect(authInstance.loggedInStatus).toBe(true);
     });
@@ -260,14 +271,24 @@ describe('Unit test for auth', () => {
         });
 
         it('when user is loggedIn', async () => {
-            spyOn(checkReleaseVersionInBetaInstance, 'checkReleaseVersionInBeta');
-            jest.spyOn(authService, 'fetchSessionInfoService').mockImplementation(async () => ({
+            spyOn(
+                checkReleaseVersionInBetaInstance,
+                'checkReleaseVersionInBeta',
+            );
+            jest.spyOn(authInstance, 'getSessionDetails').mockReturnValue(mockSessionInfo);
+            jest.spyOn(authInstance, 'initSession').mockReturnValue(null);
+            jest.spyOn(
+                authService,
+                'fetchSessionInfoService',
+            ).mockImplementation(async () => ({
                 json: () => mockSessionInfo,
                 status: 200,
             }));
             await authInstance.doBasicAuth(embedConfig.doBasicAuth);
             expect(authService.fetchSessionInfoService).toBeCalled();
             expect(authInstance.loggedInStatus).toBe(true);
+            expect(authInstance.getSessionDetails).toBeCalled();
+            expect(authInstance.initSession).toBeCalled();
         });
 
         it('when user is not loggedIn', async () => {
@@ -304,6 +325,8 @@ describe('Unit test for auth', () => {
                 json: () => mockSessionInfo,
                 status: 200,
             }));
+            jest.spyOn(authInstance, 'getSessionDetails').mockReturnValue(mockSessionInfo);
+            jest.spyOn(authInstance, 'initSession').mockReturnValue(null);
             await authInstance.doSamlAuth(embedConfig.doSamlAuth);
             expect(authService.fetchSessionInfoService).toBeCalled();
             expect(window.location.hash).toBe('');
@@ -340,7 +363,14 @@ describe('Unit test for auth', () => {
             });
             spyOn(authInstance, 'samlCompletionPromise');
             global.window.open = jest.fn();
-            jest.spyOn(authService, 'fetchSessionInfoService').mockImplementation(() => Promise.reject());
+            jest.spyOn(authService, 'fetchSessionInfoService')
+                .mockImplementationOnce(() => Promise.reject())
+                .mockImplementationOnce(async () => ({
+                    json: () => mockSessionInfo,
+                    status: 200,
+                }));
+            jest.spyOn(authInstance, 'getSessionDetails').mockReturnValue(mockSessionInfo);
+            jest.spyOn(authInstance, 'initSession').mockReturnValue(null);
             expect(await authInstance.samlCompletionPromise).not.toBe(null);
             expect(
                 await authInstance.doSamlAuth({
@@ -351,6 +381,8 @@ describe('Unit test for auth', () => {
             window.postMessage({ type: EmbedEvent.SAMLComplete }, '*');
             await authInstance.samlCompletionPromise;
             expect(authService.fetchSessionInfoService).toBeCalled();
+            expect(authInstance.getSessionDetails).toBeCalled();
+            expect(authInstance.initSession).toBeCalled();
         });
     });
 

package/src/auth.ts

@@ -1,4 +1,5 @@
 import EventEmitter from 'eventemitter3';
+import _ from 'lodash';
 import { initMixpanel } from './mixpanel-service';
 import {
     AuthType, DOMSelector, EmbedConfig, EmbedEvent, Param,
@@ -20,9 +21,9 @@ export let loggedInStatus = false;
 export let samlAuthWindow: Window = null;
 // eslint-disable-next-line import/no-mutable-exports
 export let samlCompletionPromise: Promise<void> = null;
-let sessionInfo: any = null;
-let sessionInfoResolver: (value: any) => void = null;
-const sessionInfoPromise = new Promise((resolve) => {
+let sessionInfo: sessionInfoInterface = null;
+let sessionInfoResolver: (value: sessionInfoInterface) => void = null;
+const sessionInfoPromise = new Promise((resolve:(value: sessionInfoInterface) => void) => {
     sessionInfoResolver = resolve;
 });
 let releaseVersion = '';
@@ -38,6 +39,13 @@ export const EndPoints = {
     LOGOUT: '/callosum/v1/session/logout',
 };
 
+interface sessionInfoInterface {
+    userGUID: any;
+    isPublicUser: any;
+    mixpanelToken: any;
+    [key:string]:any;
+}
+
 /**
  * Enum for auth failure types. This is the parameter passed to the listner
  * of {@link AuthStatus.FAILURE}.
@@ -196,6 +204,28 @@ export function notifyLogout(): void {
     authEE.emit(AuthStatus.LOGOUT);
 }
 
+export const initSession = (sessionDetails: sessionInfoInterface) => {
+    if (_.isNull(sessionInfo)) {
+        sessionInfo = sessionDetails;
+        initMixpanel(sessionInfo);
+        sessionInfoResolver(sessionInfo);
+    }
+};
+
+export const getSessionDetails = (sessionInfoResp: any):sessionInfoInterface => {
+    const devMixpanelToken = sessionInfoResp.configInfo.mixpanelConfig.devSdkKey;
+    const prodMixpanelToken = sessionInfoResp.configInfo.mixpanelConfig.prodSdkKey;
+    const mixpanelToken = sessionInfoResp.configInfo.mixpanelConfig.production
+        ? prodMixpanelToken
+        : devMixpanelToken;
+    return {
+        userGUID: sessionInfoResp.userGUID,
+        mixpanelToken,
+        isPublicUser: sessionInfoResp.configInfo.isPublicUser,
+        ...sessionInfoResp,
+    };
+};
+
 /**
  * Check if we are logged into the ThoughtSpot cluster
  *
@@ -207,6 +237,9 @@ async function isLoggedIn(thoughtSpotHost: string): Promise<boolean> {
     try {
         response = await fetchSessionInfoService(authVerificationUrl);
         const sessionInfoResp = await response.json();
+        const sessionDetails = getSessionDetails(sessionInfoResp);
+        // Store user session details from session info
+        initSession(sessionDetails);
         releaseVersion = sessionInfoResp.releaseVersion;
     } catch (e) {
         return false;
@@ -227,20 +260,10 @@ export function getReleaseVersion() {
  *
  * @group Global methods
  */
-export function getSessionInfo(): Promise<any> {
+export function getSessionInfo(): Promise<sessionInfoInterface> {
     return sessionInfoPromise;
 }
 
-/**
- *
- * @param sessionDetails
- */
-export function initSession(sessionDetails: any) {
-    sessionInfo = sessionDetails;
-    initMixpanel(sessionInfo);
-    sessionInfoResolver(sessionInfo);
-}
-
 const DUPLICATE_TOKEN_ERR = 'Duplicate token, please issue a new token every time getAuthToken callback is called.'
     + 'See https://developers.thoughtspot.com/docs/?pageid=embed-auth#trusted-auth-embed for more details.';
 let prevAuthToken: string = null;
@@ -425,8 +448,12 @@ const doSSOAuth = async (embedConfig: EmbedConfig, ssoEndPoint: string): Promise
 
     const ssoURL = `${thoughtSpotHost}${ssoEndPoint}`;
     if (embedConfig.inPopup) {
-        await samlPopupFlow(ssoURL, embedConfig.authTriggerContainer, embedConfig.authTriggerText);
-        loggedInStatus = true;
+        await samlPopupFlow(
+            ssoURL,
+            embedConfig.authTriggerContainer,
+            embedConfig.authTriggerText,
+        );
+        loggedInStatus = await isLoggedIn(thoughtSpotHost);
         return;
     }
 

package/src/embed/base.ts

@@ -142,7 +142,9 @@ function backwardCompat(embedConfig: EmbedConfig): EmbedConfig {
 
 /**
  * Initializes the Visual Embed SDK globally and perform
- * authentication if applicable.
+ * authentication if applicable. This function needs to be called before any ThoughtSpot
+ * component like liveboard etc can be embedded. But need not wait for AuthEvent.SUCCESS
+ * to actually embed. That is handled internally.
  *
  * @param embedConfig The configuration object containing ThoughtSpot host,
  * authentication mechanism and so on.
@@ -232,7 +234,7 @@ export const renderInQueue = (fn: (next?: (val?: any) => void) => Promise<any>):
         return renderQueue;
     }
     // Sending an empty function to keep it consistent with the above usage.
-    return fn(() => {}); // eslint-disable-line @typescript-eslint/no-empty-function
+    return fn(() => { }); // eslint-disable-line @typescript-eslint/no-empty-function
 };
 
 // For testing purposes only

package/src/embed/liveboard.ts

@@ -102,8 +102,18 @@ export interface LiveboardViewConfig extends ViewConfig {
 }
 
 /**
- * Embed a ThoughtSpot Liveboard or visualization
+ * Embed a ThoughtSpot Liveboard or a Thoughtspot visualization. When rendered it already
+ * waits for the authentication to complete, so no need to wait for AuthStatus.SUCCESS.
  *
+ * @example
+ * ```js
+ * import { .. } from '@thoughtspot/visual-embed-sdk';
+ * init({ ... });
+ * const embed = new LiveboardEmbed("#container", {
+ *   liveboardId: <your-id-here>,
+ * // .. other params here.
+ * })
+ * ```
  * @group Embed components
  */
 export class LiveboardEmbed extends V1Embed {

package/src/types.ts

@@ -44,8 +44,23 @@ export enum AuthType {
     SAML = 'SSO_SAML',
     /**
      * SSO using SAML
-     * Will make the host application redirect to the SAML Idp.
+     * Will make the host application redirect to the SAML Idp. Use this
+     * when the idp does not allow itself to be embedded.
      *
+     * This redirects the host application to the SAML Idp. The host application
+     * will be redirected back to the ThoughtSpot app after authentication.
+     *
+     * @example
+     * ```js
+     * init({
+     *   // ...
+     *   authType: AuthType.SAMLRedirect,
+     *  });
+     * ```
+     *
+     * This opens the SAML Idp in a popup window. The popup is triggered
+     * when the user clicks the trigger button. The popup window will be
+     * closed automatically after authentication.
      * @example
      * ```js
      * init({
@@ -53,7 +68,23 @@ export enum AuthType {
      *   authType: AuthType.SAMLRedirect,
      *   authTriggerText: 'Login with SAML',
      *   authTriggerContainer: '#embed-container',
-     *  });
+     *   inPopup: true,
+     * });
+     * ```
+     *
+     * Can also use event to trigger the popup flow. Works the same
+     * as above example.
+     * @example
+     * ```js
+     * const authEE = init({
+     *  // ...
+     *  authType: AuthType.SAMLRedirect,
+     *  inPopup: true,
+     * });
+     *
+     * someButtonOnYourPage.addEventListener('click', () => {
+     *  authEE.emit(AuthEvent.TRIGGER_SSO_POPUP);
+     * });
      * ```
      */
     SAMLRedirect = 'SSO_SAML',
@@ -67,6 +98,7 @@ export enum AuthType {
     /**
      * SSO using OIDC
      * Will make the host application redirect to the OIDC Idp.
+     * See code samples in {@link SAMLRedirect}.
      */
     OIDCRedirect = 'SSO_OIDC',
     /**
@@ -677,18 +709,17 @@ export enum EmbedEvent {
     Load = 'load',
     /**
      * Data pertaining to answer or Liveboard is received
-     *
-     * @returns data - The answer or Liveboard data
+     * @return data - The answer or Liveboard data
+     * @important
      */
     Data = 'data',
     /**
-     * Search/answer/Liveboard filters have been applied/updated
-     *
+     * Search/answer/Liveboard filters have been applied/updated by the user.
      * @hidden
      */
     FiltersChanged = 'filtersChanged',
     /**
-     * Search query has been updated
+     * Search query has been updated by the user.
      */
     QueryChanged = 'queryChanged',
     /**
@@ -720,17 +751,29 @@ export enum EmbedEvent {
      */
     CustomAction = 'customAction',
     /**
-     * A double click has been triggered on table/chart
-     *
-     * @returns ContextMenuInputPoints - data point that is double clicked
+     * Listen to double clicks on a visualization
+     * @return ContextMenuInputPoints - data point that is double clicked
      * @version SDK: 1.5.0 | ThoughtSpot: ts7.oct.cl, 7.2.1
      */
     VizPointDoubleClick = 'vizPointDoubleClick',
     /**
-     * A click has been triggered on table/chart
+     * Listen to clicks on a visualization in a liveboard or Search result.
      *
-     * @returns ContextMenuInputPoints - data point that is clicked
+     * @example
+     * ```js
+     * embed.on(ThoughtSpotEmbed.Event.VizPointClick, (data) => {
+     *   console.log(
+     *    data.vizId, // viz id
+     *    data.clickedPoint.selectedAttributes[0].value,
+     *    data.clickedPoint.selectedAttributes[0].column.name,
+     *    data.clickedPoint.selectedMeasures[0].value,
+     *    data.clickedPoint.selectedMeasures[0].column.name,
+     *   )
+     * });
+     * ```
+     * @return {vizId, clickedPoint} - metadata about point that is clicked
      * @version SDK: 1.11.0 | ThoughtSpot: 8.3.0.cl, 8.4.1-sw
+     * @important
      */
     VizPointClick = 'vizPointClick',
     /**
@@ -850,7 +893,7 @@ export enum EmbedEvent {
      *
      * @version SDK: 1.21.0 | ThoughtSpot: 9.2.0.cl, 9.4.0-sw
      */
-    DownloadAsPng='downloadAsPng',
+    DownloadAsPng = 'downloadAsPng',
     /**
      * Emitted when the Download as PDF action is triggered on an answer
      *
@@ -1034,8 +1077,7 @@ export enum EmbedEvent {
      */
     CrossFilterChanged = 'cross-filter-changed',
     /**
-     * Emitted when a user right clicks on chart or table
-     *
+     * Emitted when a user right clicks on a visualization (chart or table)
      * @version SDK: 1.21.0 | ThoughtSpot: 9.2.0.cl
      */
     VizPointRightClick = 'vizPointRightClick',
@@ -1126,10 +1168,11 @@ export enum HostEvent {
      * @param - {@link RuntimeFilter}[] an array of {@link RuntimeFilter} Types.
      * @example
      * liveboardEmbed.trigger(HostEvent.UpdateRuntimeFilters, [
-     * {columnName: "state",operator: RuntimeFilterOp.EQ,values: ["michigan"]},
-     * {columnName: "item type",operator: RuntimeFilterOp.EQ,values:
-     * ["Jackets"]} ])
+     *   {columnName: "state",operator: RuntimeFilterOp.EQ,values: ["michigan"]},
+     *   {columnName: "item type",operator: RuntimeFilterOp.EQ,values: ["Jackets"]}
+     * ])
      * @version SDK: 1.9.0 | ThoughtSpot: 8.1.0.cl, 8.4.1-sw
+     * @important
      */
     UpdateRuntimeFilters = 'UpdateRuntimeFilters',
     /**
@@ -1381,9 +1424,14 @@ export enum HostEvent {
      *
      * @example
      * ```js
-     * searchEmbed.trigger(HostEvent.GetTML)
+     * searchEmbed.trigger(HostEvent.GetTML).then((tml) => {
+     *   console.log(
+     *      tml.search_query // TML representation of the search query
+     *   );
+     * })
      * ```
-     * @version SDK: 1.18.0 | ThoughtSpot: 8.10.0.cl
+     * @version SDK: 1.18.0 | ThoughtSpot: 8.10.0.cl, 9.0.1-sw
+     * @important
      */
     GetTML = 'getTML',
     /**
@@ -1659,7 +1707,7 @@ export enum Action {
     ReplaySearch = 'replaySearch',
     ShowUnderlyingData = 'showUnderlyingData',
     Download = 'download',
-    DownloadAsPng='downloadAsPng',
+    DownloadAsPng = 'downloadAsPng',
     DownloadAsPdf = 'downloadAsPdf',
     DownloadAsCsv = 'downloadAsCSV',
     DownloadAsXlsx = 'downloadAsXLSX',