@thoughtspot/visual-embed-sdk 1.33.0-alpha.2 → 1.33.0

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@thoughtspot/visual-embed-sdk",
-    "version": "1.33.0-alpha.2",
+    "version": "1.33.0",
     "description": "ThoughtSpot Embed SDK",
     "module": "lib/src/index.js",
     "main": "dist/tsembed.js",
@@ -38,18 +38,13 @@
     "size-limit": [
         {
             "path": "dist/tsembed.js",
-            "limit": "48 kB"
+            "limit": "49 kB"
         }
     ],
     "scripts": {
         "lint": "eslint 'src/**'",
         "lint:fix": "eslint 'src/**/*.*' --fix",
         "tsc": "tsc -p . --incremental false; tsc -p . --incremental false --module commonjs --outDir cjs",
-        "start": "gatsby develop",
-        "build:gatsby": "npm run clean:gatsby && gatsby build --prefix-paths",
-        "build:gatsby:noprefix": "npm run clean:gatsby && gatsby build",
-        "serve:gatsby": "gatsby serve",
-        "clean:gatsby": "gatsby clean",
         "build-and-publish": "npm run build:gatsby && npm run publish",
         "bundle-dts-file": "dts-bundle --name @thoughtspot/visual-embed-sdk --out visual-embed-sdk.d.ts --main lib/src/index.d.ts",
         "bundle-dts": "dts-bundle --name ../../dist/visual-embed-sdk --main lib/src/index.d.ts --outputAsModuleFolder=true",
@@ -57,11 +52,9 @@
         "bundle-dts-react-full": "dts-bundle --name ../../../dist/visual-embed-sdk-react-full --main lib/src/react/all-types-export.d.ts --outputAsModuleFolder=true",
         "build": "rollup -c",
         "watch": "rollup -cw",
-        "docs-cmd": "node scripts/gatsby-commands.js",
-        "docgen": "typedoc --tsconfig tsconfig.json --theme typedoc-theme",
+        "docgen": "typedoc --tsconfig tsconfig.json --theme typedoc-theme --json static/typedoc/typedoc.json --disableOutputCheck",
         "test-sdk": "jest -c jest.config.sdk.js --runInBand",
-        "test-docs": "jest -c jest.config.docs.js",
-        "test": "npm run test-sdk && npm run test-docs",
+        "test": "npm run test-sdk",
         "posttest": "cat ./coverage/sdk/lcov.info | coveralls",
         "is-publish-allowed": "node scripts/is-publish-allowed.js",
         "prepublishOnly": "npm run is-publish-allowed && npm run test && npm run tsc && npm run bundle-dts-file && npm run bundle-dts && npm run bundle-dts-react && npm run bundle-dts-react-full && npm run build",
@@ -84,7 +77,7 @@
         "gatsby-plugin-vercel": "^1.0.3",
         "html-react-parser": "^1.4.12",
         "lodash": "^4.17.21",
-        "mixpanel-browser": "^2.45.0",
+        "mixpanel-browser": "2.47.0",
         "ts-deepmerge": "^6.0.2",
         "tslib": "^2.5.3",
         "use-deep-compare-effect": "^1.8.1"
@@ -104,6 +97,7 @@
         "@testing-library/user-event": "^13.1.8",
         "@types/jest": "^22.2.3",
         "@types/mixpanel-browser": "^2.35.6",
+        "@types/lodash": "^4.17.0",
         "@types/react-test-renderer": "^17.0.1",
         "@typescript-eslint/eslint-plugin": "^4.6.0",
         "@typescript-eslint/parser": "^4.6.0",
@@ -122,18 +116,6 @@
         "eslint-plugin-prettier": "^3.1.4",
         "eslint-plugin-react-hooks": "^4.2.0",
         "fs-extra": "^10.0.0",
-        "gatsby": "3.13.1",
-        "gatsby-plugin-algolia": "^0.22.2",
-        "gatsby-plugin-catch-links": "^3.1.0",
-        "gatsby-plugin-env-variables": "^2.1.0",
-        "gatsby-plugin-intl": "^0.3.3",
-        "gatsby-plugin-manifest": "^3.2.0",
-        "gatsby-plugin-output": "^0.1.3",
-        "gatsby-plugin-sass": "6.7.0",
-        "gatsby-plugin-sitemap": "^4.10.0",
-        "gatsby-source-filesystem": "3.1.0",
-        "gatsby-transformer-asciidoc": "2.1.0",
-        "gatsby-transformer-rehype": "2.0.0",
         "gh-pages": "^3.1.0",
         "highlight.js": "^10.6.0",
         "html-to-text": "^8.0.0",

package/src/css-variables.ts

@@ -24,9 +24,12 @@ export interface CustomCssVariables {
     '--ts-var-root-text-transform'?: string;
 
     /**
-     * application color, it replaces #2770EF which is rd-color(blue,base) and
-     * its similar colors like rd-color(blue,60), rd-color(accent, base) and
-     * rd-color(text, accent) in the app.
+     * Font color of the text on toggle buttons such as
+     * **All**, **Answers**, and **Liveboards** on the Home page (Classic experience),
+     * the text color of the chart and table tiles on Home page (New modular Homepage experience),
+     * and title text on the AI-generated charts and tables.
+     * The default color code is #2770EF.
+     *
      */
     '--ts-var-application-color'?: string;
 
@@ -163,6 +166,11 @@ export interface CustomCssVariables {
      */
     '--ts-var-button--primary--hover-background'?: string;
 
+    /**
+     * Backgroud color of the primary buttons when active.
+     */
+    '--ts-var-button--primary--active-background'?: string;
+
     /**
      * Font color of the text on the secondary buttons.
      */
@@ -183,6 +191,11 @@ export interface CustomCssVariables {
      */
     '--ts-var-button--secondary--hover-background'?: string;
 
+    /**
+     * Backgroud color of the secondary buttons when active.
+     */
+    '--ts-var-button--secondary--active-background'?: string;
+
     /**
      * Font color of the tertiary button. For example, the *Undo*, *Redo*, and *Reset*
      * buttons on the *Search* page.
@@ -199,6 +212,11 @@ export interface CustomCssVariables {
      */
     '--ts-var-button--tertiary--hover-background'?: string;
 
+    /**
+     * Backgroud color of the tertiary buttons when active.
+     */
+    '--ts-var-button--tertiary--active-background'?: string;
+
     /**
      * Font color of the title text of a visualization or Answer.
      */
@@ -416,4 +434,32 @@ export interface CustomCssVariables {
      * Background for favorite carousel find your favorites card in modular home.
      */
     '--ts-var-home-favorite-suggestion-card-background'?: string;
+    /**
+     * Border color of checkbox in error state.
+     */
+    '--ts-var-checkbox-error-border'?: string;
+    /**
+     * Border color of checkbox.
+     */
+    '--ts-var-checkbox-border-color'?: string;
+    /**
+     * Border color of checkbox in hover state.
+     */
+    '--ts-var-checkbox-hover-border'?: string;
+    /**
+     * Border and font color of checkbox in active state.
+     */
+    '--ts-var-checkbox-active-color'?: string;
+    /**
+     * Border color and font color of checkbox in checked state.
+     */
+    '--ts-var-checkbox-checked-color'?: string;
+    /**
+     * Border and font color of checkbox in disabled state.
+     */
+    '--ts-var-checkbox-checked-disabled'?: string;
+    /**
+     * Background color of checkbox.
+     */
+    '--ts-var-checkbox-background-color'?: string;
   }

package/src/embed/app.spec.ts

@@ -138,6 +138,7 @@ describe('App embed tests', () => {
             [Page.Data]: 'data/tables',
             [Page.Home]: 'home',
             [Page.SpotIQ]: 'insights/results',
+            [Page.Monitor]: 'insights/monitor-alerts',
         };
 
         const pageIds = Object.keys(pageRouteMap);
@@ -170,6 +171,7 @@ describe('App embed tests', () => {
             [Page.Data]: 'data/tables',
             [Page.Home]: 'home',
             [Page.SpotIQ]: 'home/spotiq-analysis',
+            [Page.Monitor]: 'home/monitor-alerts',
         };
 
         const pageIdsForModularHomes = Object.keys(pageRouteMapForModularHome);
@@ -373,6 +375,51 @@ describe('App embed tests', () => {
         });
     });
 
+    test('Should add isLiveboardCompactHeaderEnabled flag to the iframe src', async () => {
+        const appEmbed = new AppEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            isLiveboardCompactHeaderEnabled: false,
+        } as AppViewConfig);
+
+        appEmbed.render();
+        await executeAfterWait(() => {
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
+                `http://${thoughtSpotHost}/?embedApp=true&primaryNavHidden=true&profileAndHelpInNavBarHidden=false&isLiveboardHeaderV2Enabled=false${defaultParams}${defaultParamsPost}#/home`,
+            );
+        });
+    });
+
+    test('Should add showLiveboardReverifyBanner flag to the iframe src', async () => {
+        const appEmbed = new AppEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            showLiveboardReverifyBanner: false,
+        } as AppViewConfig);
+
+        appEmbed.render();
+        await executeAfterWait(() => {
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
+                `http://${thoughtSpotHost}/?embedApp=true&primaryNavHidden=true&profileAndHelpInNavBarHidden=false&showLiveboardReverifyBanner=false${defaultParams}${defaultParamsPost}#/home`,
+            );
+        });
+    });
+
+    test('Should add showLiveboardVerifiedBadge flag to the iframe src', async () => {
+        const appEmbed = new AppEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            showLiveboardVerifiedBadge: false,
+        } as AppViewConfig);
+
+        appEmbed.render();
+        await executeAfterWait(() => {
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
+                `http://${thoughtSpotHost}/?embedApp=true&primaryNavHidden=true&profileAndHelpInNavBarHidden=false&showLiveboardVerifiedBadge=false${defaultParams}${defaultParamsPost}#/home`,
+            );
+        });
+    });
+
     test('Should add default values of flags to the iframe src', async () => {
         const appEmbed = new AppEmbed(getRootEl(), {
             ...defaultViewConfig,

package/src/embed/app.ts

@@ -53,6 +53,10 @@ export enum Page {
      * SpotIQ listing page
      */
     SpotIQ = 'insights',
+    /**
+     *  Monitor Alerts Page
+     */
+    Monitor = 'monitor'
 }
 
 /**
@@ -265,19 +269,6 @@ export interface AppViewConfig extends Omit<ViewConfig, 'visibleTabs'> {
      * ```
      */
     fullHeight?: boolean;
-    /**
-     * Flag to control Data panel experience
-     * @default true
-     * @version SDK: 1.26.0 | Thoughtspot: 9.7.0.cl
-     * @example
-     * ```js
-     * const embed = new AppEmbed('#tsEmbed', {
-     *    ... // other options
-     *    dataPanelV2: true,
-     * })
-     * ```
-     */
-    dataPanelV2?: boolean;
     /**
      * Show or hide Liveboard header
      * @version SDK: 1.26.0 | Thoughtspot: 9.7.0.cl
@@ -355,19 +346,6 @@ export interface AppViewConfig extends Omit<ViewConfig, 'visibleTabs'> {
      * @deprecated Use {@link collapseSearchBar} instead
      */
     collapseSearchBarInitially?: boolean;
-    /**
-     * To enable custom column groups in data panel v2.
-     * @version SDK: 1.32.0 | Thoughtspot: 10.0.0.cl
-     * @default false
-     * @example
-     * ```js
-     * const embed = new AppEmbed('#embed', {
-     *   ... // other app view config
-     *   enableCustomColumnGroups: true,
-     * });
-     * ```
-     */
-    enableCustomColumnGroups?: boolean;
     /**
      * This controls the initial behaviour of custom column groups accordion.
      * It takes DataPanelCustomColumnGroupsAccordionState enum values as input.
@@ -411,6 +389,48 @@ export interface AppViewConfig extends Omit<ViewConfig, 'visibleTabs'> {
      * @version SDK : 1.33.0 | Thoughtspot : 10.2.0.cl
      */
     homePageSearchBarMode?: HomePageSearchBarMode;
+    /**
+     * This flag is used to enable the compact header in liveboard
+     * @type {boolean}
+     * @default false
+     * @version SDK: 1.35.0 | ThoughtSpot:10.3.0.cl
+     * @example
+     * ```js
+     * const embed = new AppEmbed('#embed-container', {
+     *    ... // other options
+     *    isLiveboardCompactHeaderEnabled: true,
+     * })
+     * ```
+     */
+    isLiveboardCompactHeaderEnabled?: boolean;
+    /**
+     * This flag is used to show/hide verified Icon in liveboard compact header
+     * @type {boolean}
+     * @default true
+     * @version SDK: 1.35.0 | ThoughtSpot:10.4.0.cl
+     * @example
+     * ```js
+     * const embed = new AppEmbed('#embed-container', {
+     *    ... // other options
+     *    showLiveboardVerifiedBadge: true,
+     * })
+     * ```
+     */
+    showLiveboardVerifiedBadge?: boolean;
+    /**
+     * This flag is used to show/hide re-verify banner in liveboard compact header
+     * @type {boolean}
+     * @default true
+     * @version SDK: 1.35.0 | ThoughtSpot:10.4.0.cl
+     * @example
+     * ```js
+     * const embed = new AppEmbed('#embed-container', {
+     *    ... // other options
+     *    showLiveboardReverifyBanner: true,
+     * })
+     * ```
+     */
+    showLiveboardReverifyBanner?: boolean;
 }
 
 /**
@@ -463,6 +483,9 @@ export class AppEmbed extends V1Embed {
             /* eslint-disable-next-line max-len */
             dataPanelCustomGroupsAccordionInitialState = DataPanelCustomColumnGroupsAccordionState.EXPAND_ALL,
             collapseSearchBar = true,
+            isLiveboardCompactHeaderEnabled = false,
+            showLiveboardVerifiedBadge = true,
+            showLiveboardReverifyBanner = true,
             homePageSearchBarMode,
         } = this.viewConfig;
 
@@ -477,6 +500,9 @@ export class AppEmbed extends V1Embed {
         params[Param.ShowLiveboardDescription] = !!showLiveboardDescription;
         params[Param.LiveboardHeaderSticky] = isLiveboardHeaderSticky;
         params[Param.IsFullAppEmbed] = true;
+        params[Param.LiveboardHeaderV2] = isLiveboardCompactHeaderEnabled;
+        params[Param.ShowLiveboardVerifiedBadge] = showLiveboardVerifiedBadge;
+        params[Param.ShowLiveboardReverifyBanner] = showLiveboardReverifyBanner;
 
         params = this.getBaseQueryParams(params);
 
@@ -595,6 +621,8 @@ export class AppEmbed extends V1Embed {
                 return 'data/tables';
             case Page.SpotIQ:
                 return modularHomeExperience ? 'home/spotiq-analysis' : 'insights/results';
+            case Page.Monitor:
+                return modularHomeExperience ? 'home/monitor-alerts' : 'insights/monitor-alerts';
             case Page.Home:
             default:
                 return 'home';

package/src/embed/base.ts

@@ -260,22 +260,23 @@ export const renderInQueue = (fn: (next?: (val?: any) => void) => Promise<any>):
 /**
  * Imports TML representation of the metadata objects into ThoughtSpot.
  * @param data
+ * @returns imports TML data into ThoughtSpot
  * @example
  * ```js
- *   executeTML({
- * //Array of metadata Tmls
-    metadata_tmls: [
-      "'\''{\"guid\":\"9bd202f5-d431-44bf-9a07-b4f7be372125\",
-      \"liveboard\":{\"name\":\"Parameters Liveboard\"}}'\''"
-    ],
-    import_policy: 'PARTIAL', // Specifies the import policy for the TML import.
-    create_new: false, // If selected, creates TML objects with new GUIDs.
-  }).then(result => {
-    console.log(result);
-  }).catch(error => {
-    console.error(error);
-  });
- *
+ *  executeTML({
+ * //Array of metadata Tmls in string format
+ *      metadata_tmls: [
+ *          "'\''{\"guid\":\"9bd202f5-d431-44bf-9a07-b4f7be372125\",
+ *          \"liveboard\":{\"name\":\"Parameters Liveboard\"}}'\''"
+ *      ],
+ *      import_policy: 'PARTIAL', // Specifies the import policy for the TML import.
+ *      create_new: false, // If selected, creates TML objects with new GUIDs.
+ *  }).then(result => {
+ *      console.log(result);
+ *  }).catch(error => {
+ *      console.error(error);
+ *  });
+ *```
  * @version SDK: 1.23.0 | ThoughtSpot: 9.4.0.cl
  * @group Global methods
  */
@@ -320,27 +321,28 @@ export const executeTML = async (data: executeTMLInput): Promise<any> => {
  * Exports TML representation of the metadata objects from ThoughtSpot in JSON or YAML
  * format.
  * @param data
+ * @returns exports TML data
  * @example
  * ```js
-  exportTML({
-    metadata: [
-      {
-        type: "LIVEBOARD", //Metadata Type
-        identifier: "9bd202f5-d431-44bf-9a07-b4f7be372125" //Metadata Id
-      }
-    ],
-    export_associated: false,//indicates whether to export associated metadata objects
-    export_fqn: false, //Adds FQNs of the referenced objects.For example, if you are
-                       //exporting a Liveboard and its associated objects, the API
-                       //returns the Liveboard TML data with the FQNs of the referenced
-                       //worksheet. If the exported TML data includes FQNs, you don't need
-                       //to manually add FQNs of the referenced objects during TML import.
-    edoc_format: "JSON" //It takes JSON or YAML value
-  }).then(result => {
-    console.log(result);
-  }).catch(error => {
-    console.error(error);
-  });
+ * exportTML({
+ *   metadata: [
+ *     {
+ *       type: "LIVEBOARD", //Metadata Type
+ *       identifier: "9bd202f5-d431-44bf-9a07-b4f7be372125" //Metadata Id
+ *     }
+ *   ],
+ *   export_associated: false,//indicates whether to export associated metadata objects
+ *   export_fqn: false, //Adds FQNs of the referenced objects.For example, if you are
+ *                      //exporting a Liveboard and its associated objects, the API
+ *                      //returns the Liveboard TML data with the FQNs of the referenced
+ *                      //worksheet. If the exported TML data includes FQNs, you don't need
+ *                      //to manually add FQNs of the referenced objects during TML import.
+ *   edoc_format: "JSON" //It takes JSON or YAML value
+ * }).then(result => {
+ *   console.log(result);
+ * }).catch(error => {
+ *   console.error(error);
+ * });
  * ```
  * @version SDK: 1.23.0 | ThoughtSpot: 9.4.0.cl
  * @group Global methods

package/src/embed/embed.spec.ts

@@ -53,25 +53,3 @@ describe('test view config', () => {
         });
     });
 });
-
-describe('Custom CSS Url', () => {
-    beforeEach(() => {
-        document.body.innerHTML = getDocumentBody();
-    });
-
-    test('passing customCssUrl should set the correct query params on the iframe', async (done) => {
-        init({
-            thoughtSpotHost,
-            authType: AuthType.None,
-            customCssUrl: 'bla.com/foo.css',
-        });
-
-        const embed = new SearchEmbed(getRootEl(), defaultViewConfig);
-        embed.render();
-        executeAfterWait(() => {
-            const iframe = getIFrameEl();
-            expect(iframe.src.includes('customCssUrl=bla.com/foo.css')).toBe(true);
-            done();
-        });
-    });
-});

package/src/embed/liveboard.spec.ts

@@ -67,6 +67,20 @@ describe('Liveboard/viz embed tests', () => {
         });
     });
 
+    test('should render liveboard with data panel v2 flag set to true by default', async () => {
+        const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            liveboardId,
+        } as LiveboardViewConfig);
+        liveboardEmbed.render();
+        await executeAfterWait(() => {
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
+                `http://${thoughtSpotHost}/?embedApp=true${defaultParams}${prefixParams}&enableDataPanelV2=true#/embed/viz/${liveboardId}`,
+            );
+        });
+    });
+
     test('should set disabled actions', async () => {
         const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
             disabledActions: [Action.DownloadAsCsv, Action.DownloadAsPdf, Action.DownloadAsXlsx],
@@ -227,6 +241,54 @@ describe('Liveboard/viz embed tests', () => {
         });
     });
 
+    test('Should add isLiveboardCompactHeaderEnabled flag to the iframe src', async () => {
+        const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            liveboardId,
+            isLiveboardCompactHeaderEnabled: false,
+        } as LiveboardViewConfig);
+
+        liveboardEmbed.render();
+        await executeAfterWait(() => {
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
+                `http://${thoughtSpotHost}/?embedApp=true${defaultParams}&isLiveboardHeaderV2Enabled=false${prefixParams}#/embed/viz/${liveboardId}`,
+            );
+        });
+    });
+
+    test('Should add showLiveboardReverifyBanner flag to the iframe src', async () => {
+        const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            liveboardId,
+            showLiveboardReverifyBanner: false,
+        } as LiveboardViewConfig);
+
+        liveboardEmbed.render();
+        await executeAfterWait(() => {
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
+                `http://${thoughtSpotHost}/?embedApp=true${defaultParams}&showLiveboardReverifyBanner=false${prefixParams}#/embed/viz/${liveboardId}`,
+            );
+        });
+    });
+
+    test('Should add showLiveboardVerifiedBadge flag to the iframe src', async () => {
+        const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            liveboardId,
+            showLiveboardVerifiedBadge: false,
+        } as LiveboardViewConfig);
+
+        liveboardEmbed.render();
+        await executeAfterWait(() => {
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
+                `http://${thoughtSpotHost}/?embedApp=true${defaultParams}&showLiveboardVerifiedBadge=false${prefixParams}#/embed/viz/${liveboardId}`,
+            );
+        });
+    });
+
     test('should not append runtime filters in URL if excludeRuntimeFiltersfromURL is true', async () => {
         const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
             ...defaultViewConfig,

package/src/embed/liveboard.ts

@@ -284,6 +284,48 @@ export interface LiveboardViewConfig
      * @version SDK: 1.32.0 | ThoughtSpot: 10.0.0.cl
      */
     showPreviewLoader?: boolean;
+    /**
+     * This flag is used to enable the compact header in liveboard
+     * @type {boolean}
+     * @default false
+     * @version SDK: 1.35.0 | ThoughtSpot:10.3.0.cl
+     * @example
+     * ```js
+     * const embed = new LiveboardEmbed('#embed-container', {
+     *    ... // other options
+     *    isLiveboardCompactHeaderEnabled: true,
+     * })
+     * ```
+     */
+    isLiveboardCompactHeaderEnabled?: boolean;
+    /**
+     * This flag is used to show/hide verified Icon in liveboard compact header
+     * @type {boolean}
+     * @default true
+     * @version SDK: 1.35.0 | ThoughtSpot:10.4.0.cl
+     * @example
+     * ```js
+     * const embed = new LiveboardEmbed('#embed-container', {
+     *    ... // other options
+     *    showLiveboardVerifiedBadge: true,
+     * })
+     * ```
+     */
+    showLiveboardVerifiedBadge?: boolean;
+    /**
+     * This flag is used to show/hide re-verify banner in liveboard compact header
+     * @type {boolean}
+     * @default true
+     * @version SDK: 1.35.0 | ThoughtSpot:10.4.0.cl
+     * @example
+     * ```js
+     * const embed = new LiveboardEmbed('#embed-container', {
+     *    ... // other options
+     *    showLiveboardReverifyBanner: true,
+     * })
+     * ```
+     */
+    showLiveboardReverifyBanner?: boolean;
 }
 
 /**
@@ -338,8 +380,13 @@ export class LiveboardEmbed extends V1Embed {
             showLiveboardDescription,
             showLiveboardTitle,
             isLiveboardHeaderSticky = true,
+            isLiveboardCompactHeaderEnabled = false,
+            showLiveboardVerifiedBadge = true,
+            showLiveboardReverifyBanner = true,
             enableAskSage,
             enable2ColumnLayout,
+            dataPanelV2 = true,
+            enableCustomColumnGroups = false,
         } = this.viewConfig;
 
         const preventLiveboardFilterRemoval = this.viewConfig.preventLiveboardFilterRemoval
@@ -387,7 +434,12 @@ export class LiveboardEmbed extends V1Embed {
         }
 
         params[Param.LiveboardHeaderSticky] = isLiveboardHeaderSticky;
+        params[Param.LiveboardHeaderV2] = isLiveboardCompactHeaderEnabled;
+        params[Param.ShowLiveboardVerifiedBadge] = showLiveboardVerifiedBadge;
+        params[Param.ShowLiveboardReverifyBanner] = showLiveboardReverifyBanner;
 
+        params[Param.DataPanelV2Enabled] = dataPanelV2;
+        params[Param.EnableCustomColumnGroups] = enableCustomColumnGroups;
         const queryParams = getQueryParamString(params, true);
 
         return queryParams;

package/src/embed/search.ts

@@ -227,19 +227,6 @@ export interface SearchViewConfig
      * ```
      */
     hideSearchBar?: boolean;
-    /**
-     * Flag to control Data panel experience
-     * @default true
-     * @version SDK: 1.26.0 | Thoughtspot: 9.7.0.cl
-     * @example
-     * ```js
-     * const embed = new SearchEmbed('#tsEmbed', {
-     *    ... // other options
-     *    dataPanelV2:false,
-     * })
-     * ```
-     */
-    dataPanelV2?: boolean;
     /**
      * Flag to set if last selected dataSource should be used
      * @version: SDK: 1.24.0
@@ -252,19 +239,6 @@ export interface SearchViewConfig
      * @deprecated Use {@link collapseSearchBar} instead
      */
     collapseSearchBarInitially?: boolean;
-    /**
-     * To enable custom column groups in data panel v2
-     * @version SDK: 1.32.0 | Thoughtspot: 10.0.0.cl
-     * @default false
-     * @example
-     * ```js
-     * const embed = new SearchEmbed('#tsEmbed', {
-     *   ... // other options
-     *   enableCustomColumnGroups: true,
-     * });
-     * ```
-     */
-    enableCustomColumnGroups?: boolean;
     /**
      * Flag to enable onBeforeSearchExecute Embed Event
      * @version: SDK: 1.29.0 | Thoughtspot: 10.1.0.cl