@thoughtspot/visual-embed-sdk 1.51.2 → 1.52.1

package/src/contracts/ui-passthrough-contracts.ts

@@ -0,0 +1,301 @@
+import { HostEvent, RuntimeFilter } from '../types';
+import { SessionInterface } from '../utils/graphql/answerService/answerService';
+
+export interface LiveboardTab {
+  id: string;
+  name: string;
+  [key: string]: any;
+}
+
+export interface LiveboardGroup {
+  id: string;
+  name: string;
+  [key: string]: any;
+}
+
+/**
+ * Levels at which a filter or parameter can be applied.
+ */
+export enum ApplicabilityLevel {
+  Liveboard = 'LIVEBOARD',
+  Tab = 'TAB',
+  Group = 'GROUP',
+}
+
+/**
+ * Scopes a filter or parameter to a specific target.
+ * At `LIVEBOARD` level the filter applies to the whole Liveboard, so `targetId`
+ * is not required. `level` accepts the enum or its string value, e.g. `'TAB'`.
+ */
+export interface Applicability {
+  level: ApplicabilityLevel | `${ApplicabilityLevel}`;
+  targetId?: string;
+}
+
+export interface FilterUpdate {
+  column: string;
+  oper: string;
+  values: string[];
+  type?: string;
+  applicability?: Applicability;
+}
+
+export interface LiveboardFilter {
+  applicability?: Applicability;
+  [key: string]: any;
+}
+
+export interface LiveboardParameter {
+  applicability?: Applicability;
+  [key: string]: any;
+}
+
+export enum UIPassthroughEvent {
+  PinAnswerToLiveboard = 'addVizToPinboard',
+  SaveAnswer = 'saveAnswer',
+  GetDiscoverabilityStatus = 'getDiscoverabilityStatus',
+  GetAvailableUIPassthroughs = 'getAvailableUiPassthroughs',
+  GetAnswerConfig = 'getAnswerPageConfig',
+  GetLiveboardConfig = 'getPinboardPageConfig',
+  GetUnsavedAnswerTML = 'getUnsavedAnswerTML',
+  UpdateFilters = 'updateFilters',
+  Drilldown = 'drillDown',
+  GetAnswerSession = 'getAnswerSession',
+  GetFilters = 'getFilters',
+  GetIframeUrl = 'getIframeUrl',
+  GetParameters = 'getParameters',
+  GetTML = 'getTML',
+  GetTabs = 'getTabs',
+  GetGroups = 'getGroups',
+  GetExportRequestForCurrentPinboard = 'getExportRequestForCurrentPinboard',
+}
+
+/**
+ * UI passthrough contract. Each event's request/response is a named interface so it
+ * documents and imports cleanly; `UIPassthroughContractBase` maps events to the pairs.
+ */
+
+/** Request for {@link UIPassthroughEvent.PinAnswerToLiveboard}. */
+export interface PinAnswerToLiveboardRequest {
+  vizId?: string;
+  newVizName: string;
+  newVizDescription?: string;
+  liveboardId?: string;
+  tabId?: string;
+  newLiveboardName?: string;
+  newTabName?: string;
+}
+/** Response for {@link UIPassthroughEvent.PinAnswerToLiveboard}. */
+export interface PinAnswerToLiveboardResponse {
+  liveboardId: string;
+  tabId: string;
+  vizId: string;
+}
+/** Request for {@link UIPassthroughEvent.SaveAnswer}. */
+export interface SaveAnswerRequest {
+  name: string;
+  description: string;
+  vizId?: string;
+  isDiscoverable?: boolean;
+}
+/** Response for {@link UIPassthroughEvent.SaveAnswer}. */
+export interface SaveAnswerResponse {
+  answerId: string;
+  saveResponse?: any;
+  shareResponse?: any;
+}
+/** Response for {@link UIPassthroughEvent.GetDiscoverabilityStatus}. */
+export interface GetDiscoverabilityStatusResponse {
+  shouldShowDiscoverability: boolean;
+  isDiscoverabilityCheckboxUnselectedPerOrg: boolean;
+}
+/** Response for {@link UIPassthroughEvent.GetAvailableUIPassthroughs}. */
+export interface GetAvailableUIPassthroughsResponse {
+  keys: string[];
+}
+/** Request for {@link UIPassthroughEvent.GetAnswerConfig}. */
+export interface GetAnswerConfigRequest {
+  vizId?: string;
+}
+/** Request for {@link UIPassthroughEvent.GetUnsavedAnswerTML}. */
+export interface GetUnsavedAnswerTMLRequest {
+  sessionId?: string;
+  vizId?: string;
+}
+/** Response for {@link UIPassthroughEvent.GetUnsavedAnswerTML}. */
+export interface GetUnsavedAnswerTMLResponse {
+  tml: string;
+}
+/** Request for {@link UIPassthroughEvent.GetAnswerSession}. */
+export interface GetAnswerSessionRequest {
+  vizId?: string;
+}
+/** Response for {@link UIPassthroughEvent.GetAnswerSession}. */
+export interface GetAnswerSessionResponse {
+  session: SessionInterface;
+  embedAnswerData?: Record<string, any>;
+}
+/** Request for {@link UIPassthroughEvent.GetFilters}. */
+export interface GetFiltersRequest {
+  vizId?: string;
+}
+/** Response for {@link UIPassthroughEvent.GetFilters}. */
+export interface GetFiltersResponse {
+  liveboardFilters: LiveboardFilter[];
+  runtimeFilters: RuntimeFilter[];
+}
+/** Response for {@link UIPassthroughEvent.GetIframeUrl}. */
+export interface GetIframeUrlResponse {
+  iframeUrl: string;
+}
+/** Response for {@link UIPassthroughEvent.GetParameters}. */
+export interface GetParametersResponse {
+  parameters: LiveboardParameter[];
+}
+/** Request for {@link UIPassthroughEvent.GetTML}. */
+export interface GetTMLRequest {
+  vizId?: string;
+  includeNonExecutedSearchTokens?: boolean;
+}
+/** Response for {@link UIPassthroughEvent.GetTabs}. */
+export interface GetTabsResponse {
+  orderedTabIds: string[];
+  numberOfTabs: number;
+  Tabs: LiveboardTab[];
+}
+/** Response for {@link UIPassthroughEvent.GetGroups}. */
+export interface GetGroupsResponse {
+  orderedGroupIds: string[];
+  numberOfGroups: number;
+  Groups: LiveboardGroup[];
+}
+/** Response for {@link UIPassthroughEvent.GetExportRequestForCurrentPinboard}. */
+export interface GetExportRequestForCurrentPinboardResponse {
+  data: { v2Content: string };
+  type: UIPassthroughEvent.GetExportRequestForCurrentPinboard;
+}
+/**
+ * Request for {@link UIPassthroughEvent.UpdateFilters}. Not the host-event
+ * `UpdateFiltersRequest` (host-event-contracts.ts), which has a different shape.
+ */
+export interface UpdateFiltersPassthroughRequest {
+  filter?: FilterUpdate;
+  filters?: FilterUpdate[];
+}
+/** Request for {@link UIPassthroughEvent.Drilldown}. */
+export interface DrilldownRequest {
+  points: {
+    selectedPoints?: string[];
+    clickedPoint?: string;
+  };
+  columnGuid?: string;
+  autoDrillDown?: boolean;
+  vizId?: string;
+}
+
+/** Maps each UI passthrough event to its request/response pair. */
+export type UIPassthroughContractBase = {
+  [UIPassthroughEvent.PinAnswerToLiveboard]: {
+    request: PinAnswerToLiveboardRequest;
+    response: PinAnswerToLiveboardResponse;
+  };
+  [UIPassthroughEvent.SaveAnswer]: {
+    request: SaveAnswerRequest;
+    response: SaveAnswerResponse;
+  };
+  [UIPassthroughEvent.GetDiscoverabilityStatus]: {
+    request: any;
+    response: GetDiscoverabilityStatusResponse;
+  };
+  [UIPassthroughEvent.GetAvailableUIPassthroughs]: {
+    request: any;
+    response: GetAvailableUIPassthroughsResponse;
+  };
+  [UIPassthroughEvent.GetAnswerConfig]: {
+    request: GetAnswerConfigRequest;
+    response: any;
+  };
+  [UIPassthroughEvent.GetLiveboardConfig]: {
+    request: any;
+    response: any;
+  };
+  [UIPassthroughEvent.GetUnsavedAnswerTML]: {
+    request: GetUnsavedAnswerTMLRequest;
+    response: GetUnsavedAnswerTMLResponse;
+  };
+  [UIPassthroughEvent.GetAnswerSession]: {
+    request: GetAnswerSessionRequest;
+    response: GetAnswerSessionResponse;
+  };
+  [UIPassthroughEvent.GetFilters]: {
+    request: GetFiltersRequest;
+    response: GetFiltersResponse;
+  };
+  [UIPassthroughEvent.GetIframeUrl]: {
+    request: Record<string, never>;
+    response: GetIframeUrlResponse;
+  };
+  [UIPassthroughEvent.GetParameters]: {
+    request: Record<string, never>;
+    response: GetParametersResponse;
+  };
+  [UIPassthroughEvent.GetTML]: {
+    request: GetTMLRequest;
+    response: Record<string, any>;
+  };
+  [UIPassthroughEvent.GetTabs]: {
+    request: Record<string, never>;
+    response: GetTabsResponse;
+  };
+  [UIPassthroughEvent.GetGroups]: {
+    request: Record<string, never>;
+    response: GetGroupsResponse;
+  };
+  [UIPassthroughEvent.GetExportRequestForCurrentPinboard]: {
+    request: Record<string, never>;
+    response: GetExportRequestForCurrentPinboardResponse;
+  };
+  [UIPassthroughEvent.UpdateFilters]: {
+    request: UpdateFiltersPassthroughRequest;
+    response: unknown;
+  };
+  [UIPassthroughEvent.Drilldown]: {
+    request: DrilldownRequest;
+    response: unknown;
+  };
+};
+
+// UI Passthrough Request and Response
+export type UIPassthroughRequest<T
+  extends keyof UIPassthroughContractBase
+> = UIPassthroughContractBase[T]['request'];
+
+export type UIPassthroughResponse<
+  T extends keyof UIPassthroughContractBase
+> = UIPassthroughContractBase[T]['response'];
+
+export type UIPassthroughArrayResponse<ApiName extends keyof UIPassthroughContractBase> =
+  Array<{
+    refId?: string;
+    value?: UIPassthroughResponse<ApiName>;
+    error?: any;
+  }>
+
+// Host event and UI Passthrough Event Mapping
+export type EmbedApiHostEventMapping = {
+  [HostEvent.Pin]: UIPassthroughEvent.PinAnswerToLiveboard;
+  [HostEvent.SaveAnswer]: UIPassthroughEvent.SaveAnswer;
+  [HostEvent.GetAnswerSession]: UIPassthroughEvent.GetAnswerSession;
+  [HostEvent.GetFilters]: UIPassthroughEvent.GetFilters;
+  [HostEvent.GetIframeUrl]: UIPassthroughEvent.GetIframeUrl;
+  [HostEvent.GetParameters]: UIPassthroughEvent.GetParameters;
+  [HostEvent.GetTML]: UIPassthroughEvent.GetTML;
+  [HostEvent.GetTabs]: UIPassthroughEvent.GetTabs;
+  [HostEvent.GetGroups]: UIPassthroughEvent.GetGroups;
+  [HostEvent.getExportRequestForCurrentPinboard]: UIPassthroughEvent.GetExportRequestForCurrentPinboard;
+}
+
+// NOTE: HostEventRequest / HostEventResponse / TriggerPayload / TriggerResponse
+// live in the sibling ./host-event-contracts, which layers the
+// HostEventRequestMap on top of the UI-passthrough mapping above.
+// The former 2-tier definitions that lived here were superseded and removed.

package/src/css-variables.ts

@@ -538,7 +538,7 @@ export interface CustomCssVariables {
      * Left and right margin of the header and the tab/filter section of an
      * embedded Liveboard. Use alongside the `liveboardGutter` view config to
      * keep the header aligned with a custom tile-grid gutter.
-     * @version SDK: 1.53.0 | ThoughtSpot Cloud: 26.10.0.cl
+     * @version SDK: 1.51.1 | ThoughtSpot Cloud: 26.8.0.cl
      */
     '--ts-var-liveboard-header-horizontal-margin'?: string;
 

package/src/embed/app.spec.ts

@@ -55,7 +55,7 @@ const testUrlParams = async (viewConfig: AppViewConfig, expectedUrl: string) =>
     });
 };
 
-// Helper function to test setIframeHeightForNonEmbedLiveboard behavior
+// Helper function to test the full-height route-change behavior
 const testSetIframeHeightBehavior = (
     currentPath: string,
     shouldBeCalled: boolean
@@ -70,7 +70,7 @@ const testSetIframeHeightBehavior = (
         : jest.spyOn(appEmbed, 'setIFrameHeight');
 
     appEmbed.render();
-    appEmbed.setIframeHeightForNonEmbedLiveboard({
+    appEmbed.fullHeightController.handleRouteChange({
         data: { currentPath },
         type: 'Route',
     });
@@ -1851,6 +1851,7 @@ describe('App embed tests', () => {
 
     test('should register event handlers to adjust iframe height', async () => {
         let embedHeightCallback: any = () => { };
+        let embedIframeCenterCallback: any = () => { };
         const onSpy = jest.spyOn(AppEmbed.prototype, 'on').mockImplementation((event, callback) => {
             if (event === EmbedEvent.RouteChange) {
                 callback({ type: EmbedEvent.RouteChange, data: { currentPath: '/answers' } } as any, jest.fn());
@@ -1859,11 +1860,10 @@ describe('App embed tests', () => {
                 embedHeightCallback = callback;
             }
             if (event === EmbedEvent.EmbedIframeCenter) {
-                callback({ type: EmbedEvent.EmbedIframeCenter, data: {} } as any, jest.fn());
+                embedIframeCenterCallback = callback;
             }
             return null;
         });
-        jest.spyOn(TsEmbed.prototype as any, 'getIframeCenter').mockReturnValue({});
         jest.spyOn(TsEmbed.prototype as any, 'setIFrameHeight').mockReturnValue({});
         const appEmbed = new AppEmbed(getRootEl(), {
             ...defaultViewConfig,
@@ -1879,13 +1879,27 @@ describe('App embed tests', () => {
         await appEmbed.render();
         embedHeightCallback({ data: '100%' });
 
+        // The app only asks for the iframe center once the iframe exists.
+        const centerResponder = jest.fn();
+        embedIframeCenterCallback(
+            { type: EmbedEvent.EmbedIframeCenter, data: {} } as any,
+            centerResponder,
+        );
+
         // Verify event handlers were registered
         await executeAfterWait(() => {
             expect(onSpy).toHaveBeenCalledWith(EmbedEvent.EmbedHeight, expect.anything());
             expect(onSpy).toHaveBeenCalledWith(EmbedEvent.RouteChange, expect.anything());
             expect(onSpy).toHaveBeenCalledWith(EmbedEvent.EmbedIframeCenter, expect.anything());
             expect(onSpy).toHaveBeenCalledWith(EmbedEvent.RequestVisibleEmbedCoordinates, expect.anything());
+            expect(centerResponder).toHaveBeenCalledWith(
+                expect.objectContaining({ type: EmbedEvent.EmbedIframeCenter }),
+            );
         }, 100);
+
+        // This test replaces AppEmbed.prototype.on; restore it so the mock does
+        // not leak into the tests that follow.
+        jest.restoreAllMocks();
     });
 
     describe('Navigate to Page API', () => {
@@ -2130,7 +2144,6 @@ describe('App embed tests', () => {
             const onSpy = jest.spyOn(AppEmbed.prototype, 'on').mockImplementation((event, callback) => {
                 return null;
             });
-            jest.spyOn(TsEmbed.prototype as any, 'getIframeCenter').mockReturnValue({});
             jest.spyOn(TsEmbed.prototype as any, 'setIFrameHeight').mockReturnValue({});
 
             // Create the AppEmbed instance
@@ -2165,10 +2178,6 @@ describe('App embed tests', () => {
                 fullHeight: true,
             } as AppViewConfig);
 
-            expect((appEmbed as any).viewConfig.lazyLoadingForFullHeight).toBe(true);
-            expect((appEmbed as any).viewConfig.enableScrollableContainerLazyLoading).toBe(true);
-            expect((appEmbed as any).viewConfig.lazyLoadingMargin).toBe('500px 0px');
-
             await appEmbed.render();
 
             await executeAfterWait(() => {
@@ -2184,11 +2193,14 @@ describe('App embed tests', () => {
                 ...defaultViewConfig,
             } as AppViewConfig);
 
-            expect((appEmbed as any).viewConfig.lazyLoadingForFullHeight).toBeUndefined();
-            expect(
-                (appEmbed as any).viewConfig.enableScrollableContainerLazyLoading,
-            ).toBeUndefined();
-            expect((appEmbed as any).viewConfig.lazyLoadingMargin).toBeUndefined();
+            await appEmbed.render();
+
+            await executeAfterWait(() => {
+                const iframeSrc = getIFrameSrc();
+                expect(iframeSrc).not.toContain('isFullHeightPinboard');
+                expect(iframeSrc).not.toContain('isLazyLoadingForEmbedEnabled');
+                expect(iframeSrc).not.toContain('rootMarginForLazyLoad');
+            }, 100);
         });
 
         test('should not write the defaults back onto the caller view config', async () => {
@@ -2210,11 +2222,14 @@ describe('App embed tests', () => {
                 fullHeight: false,
             } as AppViewConfig);
 
-            expect((appEmbed as any).viewConfig.lazyLoadingForFullHeight).toBeUndefined();
-            expect(
-                (appEmbed as any).viewConfig.enableScrollableContainerLazyLoading,
-            ).toBeUndefined();
-            expect((appEmbed as any).viewConfig.lazyLoadingMargin).toBeUndefined();
+            await appEmbed.render();
+
+            await executeAfterWait(() => {
+                const iframeSrc = getIFrameSrc();
+                expect(iframeSrc).not.toContain('isFullHeightPinboard');
+                expect(iframeSrc).not.toContain('isLazyLoadingForEmbedEnabled');
+                expect(iframeSrc).not.toContain('rootMarginForLazyLoad');
+            }, 100);
         });
 
         test('should default lazyLoadingMargin when lazyLoadingForFullHeight is set explicitly', async () => {
@@ -2224,14 +2239,14 @@ describe('App embed tests', () => {
                 lazyLoadingForFullHeight: true,
             } as AppViewConfig);
 
-            expect((appEmbed as any).viewConfig.lazyLoadingMargin).toBe(
-                config.DEFAULT_LAZY_LOADING_MARGIN,
-            );
-
             await appEmbed.render();
 
             await executeAfterWait(() => {
-                expect(getIFrameSrc()).toContain('rootMarginForLazyLoad=500px%200px');
+                expect(getIFrameSrc()).toContain(
+                    `rootMarginForLazyLoad=${encodeURIComponent(
+                        config.DEFAULT_LAZY_LOADING_MARGIN,
+                    )}`,
+                );
             }, 100);
         });
 
@@ -2455,7 +2470,7 @@ describe('App embed tests', () => {
             await appEmbed.render();
 
             // Trigger the lazy load data calculation
-            (appEmbed as any).sendFullHeightLazyLoadData();
+            (appEmbed as any).fullHeightController.sendVisibleCoordinates();
 
             expect(mockTrigger).toHaveBeenCalledWith(HostEvent.VisibleEmbedCoordinates, {
                 top: 0,
@@ -2477,7 +2492,7 @@ describe('App embed tests', () => {
             await appEmbed.render();
 
             // Trigger the lazy load data calculation
-            (appEmbed as any).sendFullHeightLazyLoadData();
+            (appEmbed as any).fullHeightController.sendVisibleCoordinates();
 
             expect(mockTrigger).not.toHaveBeenCalledWith(HostEvent.VisibleEmbedCoordinates, {
                 top: 0,
@@ -2510,7 +2525,7 @@ describe('App embed tests', () => {
             await appEmbed.render();
 
             // Trigger the lazy load data calculation
-            (appEmbed as any).sendFullHeightLazyLoadData();
+            (appEmbed as any).fullHeightController.sendVisibleCoordinates();
 
             expect(mockTrigger).toHaveBeenCalledWith(HostEvent.VisibleEmbedCoordinates, {
                 top: 50,   // 50px clipped from top
@@ -2618,7 +2633,7 @@ describe('App embed tests', () => {
             const mockResponder = jest.fn();
 
             // Trigger the handler directly
-            (appEmbed as any).requestVisibleEmbedCoordinatesHandler({}, mockResponder);
+            (appEmbed as any).fullHeightController.handleRequestVisibleCoordinates({}, mockResponder);
 
             // Verify the responder was called with the correct data
             expect(mockResponder).toHaveBeenCalledWith({
@@ -2676,7 +2691,7 @@ describe('App embed tests', () => {
                 data: 600,
                 type: EmbedEvent.EmbedHeight,
             };
-            appEmbed.updateIFrameHeight(mockEvent);
+            appEmbed.fullHeightController.handleEmbedHeight(mockEvent);
 
             // Check if the iframe style was updated
             expect(mockIFrame.style.height).toBe('600px');
@@ -2697,7 +2712,7 @@ describe('App embed tests', () => {
                 data: 0, // This will make it use the default height
                 type: EmbedEvent.EmbedHeight,
             };
-            appEmbed.updateIFrameHeight(mockEvent);
+            appEmbed.fullHeightController.handleEmbedHeight(mockEvent);
 
             // Should use the default height
             expect(mockIFrame.style.height).toBe('500px');
@@ -2712,7 +2727,7 @@ describe('App Embed Default Height and Minimum Height Handling', () => {
             fullHeight: true,
         } as AppViewConfig);
         await appEmbed.render();
-        expect(appEmbed['defaultHeight']).toBe(500);
+        expect(appEmbed['fullHeightController'].minimumHeight).toBe(500);
     });
     test('should set default height to 700 when default height is provided', async () => {
         const appEmbed = new AppEmbed(getRootEl(), {
@@ -2721,7 +2736,7 @@ describe('App Embed Default Height and Minimum Height Handling', () => {
             minimumHeight: 700,
         } as AppViewConfig);
         await appEmbed.render();
-        expect(appEmbed['defaultHeight']).toBe(700);
+        expect(appEmbed['fullHeightController'].minimumHeight).toBe(700);
     });
 });
 
@@ -2756,6 +2771,43 @@ describe('AppEmbed uncovered branch tests', () => {
         });
     });
 
+    test('should set showAnswerEditPanel=false when hideAnswerEditPanel is true', async () => {
+        const appEmbed = new AppEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            hideAnswerEditPanel: true,
+        } as AppViewConfig);
+        appEmbed.render();
+        await executeAfterWait(() => {
+            expectUrlToHaveParamsWithValues(getIFrameSrc(), {
+                showAnswerEditPanel: 'false',
+            });
+        });
+    });
+
+    test('should set showAnswerEditPanel=true when hideAnswerEditPanel is false', async () => {
+        const appEmbed = new AppEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            hideAnswerEditPanel: false,
+        } as AppViewConfig);
+        appEmbed.render();
+        await executeAfterWait(() => {
+            expectUrlToHaveParamsWithValues(getIFrameSrc(), {
+                showAnswerEditPanel: 'true',
+            });
+        });
+    });
+
+    test('should not set showAnswerEditPanel param when hideAnswerEditPanel is not provided', async () => {
+        const appEmbed = new AppEmbed(getRootEl(), {
+            ...defaultViewConfig,
+        } as AppViewConfig);
+        appEmbed.render();
+        await executeAfterWait(() => {
+            const url = new URL(getIFrameSrc());
+            expect(url.searchParams.has('showAnswerEditPanel')).toBe(false);
+        });
+    });
+
     test('should set hideObjects param when non-empty array is provided', async () => {
         const appEmbed = new AppEmbed(getRootEl(), {
             ...defaultViewConfig,
@@ -2807,7 +2859,7 @@ describe('AppEmbed uncovered branch tests', () => {
         });
     });
 
-    test('registerLazyLoadEvents should return early when iFrame is not set', () => {
+    test('lazy load registration should return early when iFrame is not set', () => {
         const appEmbed = new AppEmbed(getRootEl(), {
             ...defaultViewConfig,
             fullHeight: true,
@@ -2815,7 +2867,7 @@ describe('AppEmbed uncovered branch tests', () => {
         } as AppViewConfig);
         // iFrame is not set (render not called), should not throw
         expect(() => {
-            (appEmbed as any).registerLazyLoadEvents();
+            (appEmbed as any).fullHeightController.onRender();
         }).not.toThrow();
     });
 });