@thoughtspot/visual-embed-sdk 1.28.5 → 1.29.0-addfilter.0

package/src/types.ts

@@ -146,7 +146,6 @@ export enum AuthType {
      *      .then((data) => data.token);
      *  }
      * });
-     * });
      * ```
      */
     TrustedAuthToken = 'AuthServer',
@@ -496,7 +495,6 @@ export interface EmbedConfig {
      * @version SDK: 1.12.0 | ThoughtSpot: 8.4.0.cl, 8.4.1.sw*
      */
     suppressSearchEmbedBetaWarning?: boolean;
-
     /**
      * Hide `beta` alert warning message for SageEmbed.
      *
@@ -675,6 +673,7 @@ export interface ViewConfig {
      * object inside your app.  Specify the values in pixels or percentage.
      *
      * @version SDK: 1.1.0 | ThoughtSpot: ts7.may.cl, 7.2.1
+     *
      * @example
      * ```js
      * const embed = new LiveboardEmbed('#embed', {
@@ -714,7 +713,6 @@ export interface ViewConfig {
     disabledActions?: Action[];
     /**
      * The tooltip to display for disabled actions.
-     *
      * @version SDK: 1.6.0 | ThoughtSpot: ts8.nov.cl, 8.4.1.sw
      * @example
      * ```js
@@ -732,6 +730,7 @@ export interface ViewConfig {
      * Use this to hide an action.
      *
      * @version SDK: 1.6.0 | ThoughtSpot: ts8.nov.cl, 8.4.1.sw
+     *
      * @example
      * ```js
      * const embed = new LiveboardEmbed('#embed', {
@@ -752,6 +751,7 @@ export interface ViewConfig {
      *
      * @version SDK: 1.6.0 | ThoughtSpot: ts8.nov.cl, 8.4.1.sw
      * @important
+     *
      * @example
      * ```js
      * const embed = new LiveboardEmbed('#embed', {
@@ -765,6 +765,7 @@ export interface ViewConfig {
      * Show alert messages and toast messages in the embedded view.
      *
      * @version SDK: 1.11.0 | ThoughtSpot: 8.3.0.cl, 8.4.1.sw
+     *
      * @example
      * ```js
      * const embed = new LiveboardEmbed('#embed-container', {
@@ -779,6 +780,7 @@ export interface ViewConfig {
      * visualization, or Liveboard.
      *
      * @version SDK: 1.9.4 | ThoughtSpot 8.1.0.cl, 8.4.1.sw
+     *
      * @example
      * ```js
      * const embed = new LiveboardEmbed('#embed-container', {
@@ -799,6 +801,7 @@ export interface ViewConfig {
      * visualization, or Liveboard.
      *
      * @version SDK : 1.25.0 | Thoughtspot: 9.2.0.cl, 9.5.0.sw
+     *
      * @example
      * ```js
      * const embed = new LiveboardEmbed('#embed-container', {
@@ -833,7 +836,6 @@ export interface ViewConfig {
      * Warning: This option is for advanced use only and is used internally
      * to control embed behavior in non-regular ways. We do not publish the
      * list of supported keys and values associated with each.
-     *
      * @example
      * ```js
      * const embed = new LiveboardEmbed('#embed', {
@@ -860,6 +862,7 @@ export interface ViewConfig {
      * child inside it.
      *
      * @version SDK: 1.2.0 | Thoughtspot: 9.0.0.cl, 9.0.0.sw
+     *
      * @example
      * ```js
      * const embed = new LiveboardEmbed('#embed-container', {
@@ -945,8 +948,6 @@ export interface ViewConfig {
      * Hide the home page modules
      * For example: hiddenHomepageModules = [HomepageModule.MyLibrary]
      *
-     *
-     *
      * **Note**: This option does not apply to the classic homepage.
      * To access the updated modular homepage, set
      * `modularHomeExperience` to `true` (available as Early Access feature in 9.12.5.cl).
@@ -959,13 +960,13 @@ export interface ViewConfig {
      *    hiddenHomepageModules : [HomepageModule.Favorite,HomepageModule.Learning],
      * })
      * ```
+     *
      */
     hiddenHomepageModules?: HomepageModule[];
     /**
      * reordering the home page modules
      * eg: reorderedHomepageModules = [HomepageModule.MyLibrary, HomepageModule.Watchlist]
      *
-     *
      * **Note**: This option does not apply to the classic homepage.
      * To access the updated modular homepage, set
      * `modularHomeExperience` to `true` (available as Early Access feature in 9.12.5.cl).
@@ -988,6 +989,7 @@ export interface ViewConfig {
      * Use either `visibleTabs` or `hiddenTabs`.
      *
      * @version SDK: 1.26.0 | Thoughtspot: 9.7.0.cl
+     *
      * @example
      * ```js
      * const embed = new LiveboardEmbed('#embed-container', {
@@ -1013,8 +1015,6 @@ export interface ViewConfig {
      * })
      * ```
      *
-     *
-     *
      * **Note**: This option does not apply to the classic homepage.
      * To access the updated modular homepage, set
      * `modularHomeExperience` to `true` (available as Early Access feature in 9.12.5.cl).
@@ -1048,6 +1048,7 @@ export interface ViewConfig {
      * @type {boolean}
      * @default false
      * @version SDK: 1.24.0 | ThoughtSpot:9.4.0.cl, 9.4.0.sw
+     *
      * @example
      * ```js
      * // Disable tracking PreRender size in the configuration
@@ -1244,7 +1245,7 @@ export interface RuntimeFilter {
      * a single operand, whereas other operators like BW and IN accept multiple
      * operands.
      */
-    values: (number | boolean | string)[];
+    values: (number | boolean | string | bigint)[];
 }
 /**
  * A filter that can be applied to ThoughtSpot Answers, Liveboards, or
@@ -1479,19 +1480,14 @@ export enum EmbedEvent {
     /**
      * An error has occurred. This event is fired for the following error types:
      *
-     * `API`: API call failure error.
-     *
-     * `FULLSCREEN`: Error when presenting a Liveboard or visualization in full screen mode.
-     *
-     * `SINGLE_VALUE_FILTER`: Error due to multiple values in the single value filter.
+     *  `API` - API call failure error.
+     *  `FULLSCREEN` - Error when presenting a Liveboard or visualization in full screen mode.
+     *  `SINGLE_VALUE_FILTER` - Error due to multiple values in the single value filter.
+     *  `NON_EXIST_FILTER` - Error due to a non-existent filter.
+     *  `INVALID_DATE_VALUE` - Invalid date value error.
+     *  `INVALID_OPERATOR` - Use of invalid operator during filter application.
      *
-     * `NON_EXIST_FILTER`: Error due to a non-existent filter.
-     *
-     * `INVALID_DATE_VALUE`: Invalid date value error.
-     *
-     * `INVALID_OPERATOR`: Use of invalid operator during filter application.
-     *
-     *  For more information, see https://developers.thoughtspot.com/docs/events-app-integration#errorType.
+     *  For more information, see https://developers.thoughtspot.com/docs/events-app-integration#errorType
      *
      * @returns error - An error object or message
      *
@@ -1605,7 +1601,7 @@ export enum EmbedEvent {
     /**
      * Emitted when the embed does not have cookie access. This happens
      * when Safari and other Web browsers block third-party cookies
-     * are blocked by default.
+     * are blocked by default. `NoCookieAccess` can trigger
      *
      * @example
      *```js
@@ -1648,7 +1644,7 @@ export enum EmbedEvent {
     /**
      * Emitted when the Liveboard shell loads.
      * You can use this event as a hook to trigger
-     * actions on the rendered Liveboard.
+     * other events on the rendered Liveboard.
      *
      * @version SDK: 1.9.1 | ThoughtSpot: 8.1.0.cl, 8.4.1.sw
      * @example
@@ -1702,7 +1698,7 @@ export enum EmbedEvent {
     /**
      * Emitted when the download action is triggered on an answer
      *
-     *  **Note**:  This event is deprecated in v1.21.0.
+     * **Note**: This event is deprecated in v1.21.0.
      * To fire an event when a download action is initiated on a chart or table,
      * use `EmbedEvent.DownloadAsPng`, `EmbedEvent.DownloadAsPDF`, `EmbedEvent.DownloadAsCSV`,
      * or `EmbedEvent.DownloadAsXLSX`
@@ -1785,7 +1781,7 @@ export enum EmbedEvent {
      * //emit when action starts
      * appEmbed.on(EmbedEvent.AnswerDelete, payload => {
      *    console.log('delete answer', payload)}, {start: true })
-     * //emit when action is completed
+     * //trigger when action is completed
      * appEmbed.on(EmbedEvent.AnswerDelete, payload => {
      *    console.log('delete answer', payload)})
      *```
@@ -2117,7 +2113,7 @@ export enum EmbedEvent {
      * @version SDK: 1.21.0 | ThoughtSpot: 9.2.0.cl, 9.5.0.sw
      * @example
      *```js
-     * liveboardEmbed.on(EmbedEvent.CrossFilterChanged, {
+     * liveboardEmbed.trigger(HostEvent.CrossFilterChanged, {
      *    vizId: '730496d6-6903-4601-937e-2c691821af3c'})
      *```
      */
@@ -2145,14 +2141,14 @@ export enum EmbedEvent {
      * Returns filter type and name, column name and ID, and runtime
      * filter details.
      *
-     * @version SDK: 1.23.0 | ThoughtSpot: 9.4.0.cl, 9.5.0.sw
      * @example
      *
      *```js
      * LiveboardEmbed.on(EmbedEvent.FilterChanged, (payload) => {
      *    console.log('payload', payload);
      * })
-     *```
+     *
+     * @version SDK: 1.23.0 | ThoughtSpot: 9.4.0.cl, 9.5.0.sw
      */
     FilterChanged = 'filterChanged',
     /**
@@ -2240,6 +2236,24 @@ export enum EmbedEvent {
      * @version SDK : 1.28.0 | ThoughtSpot: 9.10.5.cl
      */
     Rename = 'rename',
+    /**
+     * Emitted when user wants to intercept the search execution
+     *
+     * Make isOnBeforeGetVizDataEnabled : true to use this embed
+     * event
+     *
+     *```js
+     * searchEmbed.on(EmbedEvent.OnBeforeGetVizData, (payload, responder) => {
+     * responder({
+     * data: {
+     * execute: true,
+     * error: {errorText: "My own customised error"}
+     * }})
+     *   })
+     *```
+     * @version SDK : 1.29.0 | Thoughtspot : 10.1.0.cl
+     */
+     OnBeforeGetVizDataIntercept = 'onBeforeGetVizDataIntercept',
 }
 
 /**
@@ -3045,6 +3059,16 @@ export enum HostEvent {
      * @version SDK: 1.29.0 | Thoughtspot: 10.1.0.cl
      */
     ResetLiveboardPersonalisedView = 'ResetLiveboardPersonalisedView',
+    /**
+     * Trigger CreateLiveboard for liveboard list page & Pin Modal
+     *
+     * @example
+     * ```js
+     * liveboardEmbed.trigger(HostEvent.CreateLiveboard);
+     *
+     * @version SDK: 1.29.0 | Thoughtspot: 10.1.0.cl
+     */
+    CreateLiveboard = 'CreateLiveboard',
 }
 
 /**
@@ -3146,13 +3170,15 @@ export enum Param {
     ClientLogLevel = 'clientLogLevel',
     OverrideNativeConsole = 'overrideConsoleLogs',
     enableAskSage = 'enableAskSage',
-    CollapseSearchBarInitially= 'collapseSearchBarInitially',
+    CollapseSearchBarInitially = 'collapseSearchBarInitially',
+    DataPanelCustomGroupsAccordionInitialState = 'dataPanelCustomGroupsAccordionInitialState',
     EnableCustomColumnGroups = 'enableCustomColumnGroups',
     DateFormatLocale = 'dateFormatLocale',
     NumberFormatLocale = 'numberFormatLocale',
     CurrencyFormat = 'currencyFormat',
     Enable2ColumnLayout = 'enable2ColumnLayout',
     IsFullAppEmbed = 'isFullAppEmbed',
+    IsOnBeforeGetVizDataInterceptEnabled = 'isOnBeforeGetVizDataInterceptEnabled',
 }
 
 /**

package/src/utils/authService/authService.spec.ts

@@ -1,11 +1,11 @@
 import {
-    EndPoints,
-    fetchAuthPostService,
-    fetchAuthService,
+    fetchSessionInfoService,
     fetchAuthTokenService,
+    fetchAuthService,
     fetchBasicAuthService,
-    fetchSessionInfoService,
+    fetchAuthPostService,
     verifyTokenService,
+    EndPoints,
 } from '.';
 import { logger } from '../logger';
 

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

@@ -53,6 +53,14 @@ export const addColumns = `
     }
     `;
 
+export const addFilter = `
+    mutation AddUpdateFilter($session: BachSessionIdInput!, $params: AddUpdateFilterInput!) {
+        Answer__addUpdateFilter(session: $session, params: $params) {
+            ${bachSessionId}
+        }
+    }
+`;
+
 export const getAnswerData = `
     query GetTableWithHeadlineData($session: BachSessionIdInput!, $deadline: Int!, $dataPaginationParams: DataPaginationParamsInput!) {
         getAnswer(session: $session) {

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

@@ -1,7 +1,7 @@
 import 'jest-fetch-mock';
-import { AuthType, VizPoint } from '../../../types';
+import { AuthType, RuntimeFilterOp, VizPoint } from '../../../types';
 import { AnswerService } from './answerService';
-import { getAnswerData, removeColumns } from './answer-queries';
+import { getAnswerData, removeColumns, addFilter } from './answer-queries';
 import * as authTokenInstance from '../../../authToken';
 import * as tokenizedFetch from '../../../tokenizedFetch';
 import * as embedConfigInstance from '../../../embed/embedConfig';
@@ -266,4 +266,60 @@ describe('Answer service tests', () => {
         const answerService = createAnswerService({}, null);
         await expect(answerService.getUnderlyingDataForPoint(['col2'])).rejects.toThrow();
     });
+
+    test('addFilter should call the right API', async () => {
+        fetchMock.mockResponses(
+            JSON.stringify({
+                data: {
+                    getSourceDetailById: [{
+                        columns: [{
+                            id: 'id1',
+                            name: 'col1',
+                        }],
+                    }],
+                },
+            }),
+            JSON.stringify({
+                data: {
+                    Answer__addUpdateFilter: {
+                        id: {
+                            genNo: 2,
+                        },
+                    },
+                },
+            }),
+        );
+        const answerService = createAnswerService({
+            sources: [{
+                header: {
+                    guid: 'source1',
+                },
+            }],
+        });
+        const session = await answerService.addFilter('col1', RuntimeFilterOp.IN, [2]);
+        expect(fetchMock).toHaveBeenCalledWith(
+            'https://tshost/prism/?op=AddUpdateFilter',
+            expect.objectContaining({
+                body: JSON.stringify({
+                    operationName: 'AddUpdateFilter',
+                    query: addFilter,
+                    variables: {
+                        session: defaultSession,
+                        params: {
+                            filterContent: [{
+                                filterType: 'IN',
+                                value: [{
+                                    type: 'DOUBLE',
+                                    doubleValue: 2,
+                                }],
+                            }],
+                            filterGroupId: {
+                                logicalColumnId: 'id1',
+                            },
+                        },
+                    },
+                }),
+            }),
+        );
+    });
 });

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

@@ -1,6 +1,8 @@
 import { tokenizedFetch } from '../../../tokenizedFetch';
-import type { ColumnValue, VizPoint } from '../../../types';
-import { deepMerge, removeTypename } from '../../../utils';
+import type {
+    ColumnValue, RuntimeFilter, RuntimeFilterOp, VizPoint,
+} from '../../../types';
+import { deepMerge, getTypeFromValue, removeTypename } from '../../../utils';
 import { graphqlQuery } from '../graphql-request';
 import { getSourceDetail } from '../sourceService';
 import * as queries from './answer-queries';
@@ -37,6 +39,16 @@ export interface UnderlyingDataPoint {
  *     const data = await underlying.fetchData(0, 100);
  *  })
  * ```
+ * @example
+ * ```js
+ * embed.on(EmbedEvent.Data, async (e) => {
+ *     const service = await embed.getAnswerService();
+ *     await service.addColumns([
+ *         "<column guid>"
+ *     ]);
+ *     console.log(await service.fetchData());
+ * });
+ * ```
  * @version SDK: 1.25.0| ThoughtSpot: 9.10.0.cl
  * @group Events
  */
@@ -100,6 +112,63 @@ export class AnswerService {
         );
     }
 
+    /**
+     * Add columns by names and return updated answer session.
+     *
+     * @param columnNames
+     * @returns
+     * @example
+     * ```js
+     * embed.on(EmbedEvent.Data, async (e) => {
+     *    const service = await embed.getAnswerService();
+     *    await service.addColumnsByNames([
+     *      "col name 1",
+     *      "col name 2"
+     *    ]);
+     *    console.log(await service.fetchData());
+     * });
+     */
+    public async addColumnsByNames(columnNames: string[]) {
+        const sourceDetail = await this.getSourceDetail();
+        const columnGuids = getGuidsFromColumnNames(sourceDetail, columnNames);
+        return this.addColumns([...columnGuids]);
+    }
+
+    /**
+     * Add a filter to the answer.
+     *
+     * @param columnName
+     * @param operator
+     * @param values
+     * @returns
+     */
+    public async addFilter(columnName: string, operator: RuntimeFilterOp, values: RuntimeFilter['values']) {
+        const sourceDetail = await this.getSourceDetail();
+        const columnGuids = getGuidsFromColumnNames(sourceDetail, [columnName]);
+        return this.executeQuery(
+            queries.addFilter,
+            {
+                params: {
+                    filterContent: [{
+                        filterType: operator,
+                        value: values.map(
+                            (v) => {
+                                const type = getTypeFromValue(v);
+                                return {
+                                    type: type.toUpperCase(),
+                                    [`${type}Value`]: v,
+                                };
+                            },
+                        ),
+                    }],
+                    filterGroupId: {
+                        logicalColumnId: columnGuids.values().next().value,
+                    },
+                },
+            },
+        );
+    }
+
     /**
      * Fetch data from the answer.
      *

package/src/utils.ts

@@ -26,14 +26,19 @@ import {
  *
  * @param runtimeFilters
  */
-export const getFilterQuery = (runtimeFilters: RuntimeFilter[]): string => {
+export const getFilterQuery = (runtimeFilters: RuntimeFilter[]): string | null => {
     if (runtimeFilters && runtimeFilters.length) {
         const filters = runtimeFilters.map((filter, valueIndex) => {
             const index = valueIndex + 1;
             const filterExpr = [];
             filterExpr.push(`col${index}=${encodeURIComponent(filter.columnName)}`);
             filterExpr.push(`op${index}=${filter.operator}`);
-            filterExpr.push(filter.values.map((value) => `val${index}=${encodeURIComponent(value)}`).join('&'));
+            filterExpr.push(
+                filter.values.map((value) => {
+                    const encodedValue = typeof value === 'bigint' ? value.toString() : value;
+                    return `val${index}=${encodeURIComponent(String(encodedValue))}`;
+                }).join('&'),
+            );
 
             return filterExpr.join('&');
         });
@@ -317,3 +322,17 @@ export const removeStyleProperties = (element: HTMLElement, styleProperties: str
 };
 
 export const isUndefined = (value: any): boolean => value === undefined;
+
+// Return if the value is a string, double or boolean.
+export const getTypeFromValue = (value: any): string => {
+    if (typeof value === 'string') {
+        return 'string';
+    }
+    if (typeof value === 'number') {
+        return 'double';
+    }
+    if (typeof value === 'boolean') {
+        return 'boolean';
+    }
+    return '';
+};