@thoughtspot/visual-embed-sdk 1.24.0-sage.3 → 1.24.1

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();
+    });
+});

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

@@ -0,0 +1,234 @@
+import type { ColumnValue, VizPoint } from '../../../types';
+import { deepMerge, removeTypename } from '../../../utils';
+import { graphqlQuery } from '../graphql-request';
+import { getSourceDetail } from '../sourceService';
+import * as queries from './answer-queries';
+
+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',
+}
+
+interface UnderlyingDataPoint {
+    columnId: string;
+    dataValue: any;
+}
+
+/**
+ * Class representing the answer service provided with the
+ * custom action payload. This service could be used to run
+ * graphql queries in the context of the answer on which the
+ * custom action was triggered.
+ *
+ * @example
+ * ```js
+ *  embed.on(EmbedEvent.CustomAction, e => {
+ *     const underlying = await e.answerService.getUnderlyingDataForPoint([
+ *       'col name 1'
+ *     ]);
+ *     const data = await underlying.fetchData(0, 100);
+ *  })
+ * ```
+ * @version
+ * ThoughtSpot: 9.9.0.cl / SDK: 1.25.0
+ */
+export class AnswerService {
+    constructor(
+        private session: SessionInterface,
+        private answer: any,
+        private thoughtSpotHost: string,
+        private selectedPoints?: VizPoint[],
+    ) {
+        this.session = removeTypename(session);
+    }
+
+    public async getSourceDetail() {
+        const sourceId = this.answer.sources[0].header.guid;
+        return getSourceDetail(
+            this.thoughtSpotHost,
+            sourceId,
+        );
+    }
+
+    public async removeColumns(columnIds: string[]) {
+        return this.executeQuery(
+            queries.removeColumns,
+            {
+                logicalColumnIds: columnIds,
+            },
+        );
+    }
+
+    public async addColumns(columnIds: string[]) {
+        return this.executeQuery(
+            queries.addColumns,
+            {
+                columns: columnIds.map((colId) => ({ logicalColumnId: colId })),
+            },
+        );
+    }
+
+    public async fetchData(offset = 0, size = 1000) {
+        const { answer } = await this.executeQuery(
+            queries.getAnswerData,
+            {
+                deadline: 0,
+                dataPaginationParams: {
+                    isClientPaginated: true,
+                    offset,
+                    size,
+                },
+            },
+        );
+        const { columns, data } = answer.visualizations[0];
+        return {
+            columns,
+            data,
+        };
+    }
+
+    /**
+     *
+     * @param userLocale
+     * @param omitInfo Omit the download Info on top of the CSV
+     * @returns Response
+     */
+    public async fetchCSVBlob(userLocale = 'en-us', omitInfo = false): Promise<Response> {
+        if (omitInfo) {
+            console.warn('omitInfo not supported yet.');
+        }
+        const fetchUrl = `${this.thoughtSpotHost}/prism/download/answer/csv?sessionId=${this.session.sessionId}&genNo=${this.session.genNo}&userLocale=${userLocale}&exportFileName=data&omitInfo=${omitInfo}`;
+        return fetch(fetchUrl, {
+            credentials: 'include',
+        });
+    }
+
+    public async getUnderlyingDataForPoint(
+        outputColumnNames: string[],
+        selectedPoints?: UnderlyingDataPoint[],
+    ): Promise<AnswerService> {
+        if (!selectedPoints && !this.selectedPoints) {
+            throw new Error('Needs to be triggered in context of a point');
+        }
+
+        if (!selectedPoints) {
+            selectedPoints = getSelectedPointsForUnderlyingDataQuery(
+                this.selectedPoints,
+            );
+        }
+
+        const sourceDetail = await this.getSourceDetail();
+        const ouputColumnGuids = getGuidsFromColumnNames(sourceDetail, outputColumnNames);
+        const unAggAnswer = await graphqlQuery({
+            query: queries.getUnaggregatedAnswerSession,
+            variables: {
+                session: this.session,
+                columns: selectedPoints,
+            },
+            thoughtSpotHost: this.thoughtSpotHost,
+        });
+        const unaggAnswerSession = new AnswerService(
+            unAggAnswer.id,
+            unAggAnswer.answer,
+            this.thoughtSpotHost,
+        );
+        const currentColumns: Set<string> = new Set(
+            unAggAnswer.answer.visualizations[0].columns
+                .map(
+                    (c: any) => c.column.referencedColumns[0].guid,
+                ),
+        );
+
+        const columnsToAdd = [...ouputColumnGuids].filter((col) => !currentColumns.has(col));
+        if (columnsToAdd.length) {
+            await unaggAnswerSession.addColumns(columnsToAdd);
+        }
+
+        const columnsToRemove = [...currentColumns].filter((col) => !ouputColumnGuids.has(col));
+        if (columnsToRemove.length) {
+            await unaggAnswerSession.removeColumns(columnsToRemove);
+        }
+
+        return unaggAnswerSession;
+    }
+
+    public async executeQuery(query: string, variables: any): Promise<any> {
+        const data = await graphqlQuery({
+            query,
+            variables: {
+                session: this.session,
+                ...variables,
+            },
+            thoughtSpotHost: this.thoughtSpotHost,
+            isCompositeQuery: false,
+        });
+
+        this.session = deepMerge(this.session, data?.id || {}) as unknown as SessionInterface;
+        return data;
+    }
+
+    public getSession() {
+        return this.session;
+    }
+}
+
+/**
+ *
+ * @param sourceDetail
+ * @param colNames
+ */
+function getGuidsFromColumnNames(sourceDetail: any, colNames: string[]) {
+    const cols = sourceDetail.columns.reduce((colSet: any, col: any) => {
+        colSet[col.name] = col;
+        return colSet;
+    }, {});
+
+    return new Set(colNames.map((colName) => {
+        const col = cols[colName];
+        return col.id;
+    }));
+}
+
+/**
+ *
+ * @param selectedPoints
+ */
+function getSelectedPointsForUnderlyingDataQuery(
+    selectedPoints: VizPoint[],
+): UnderlyingDataPoint[] {
+    const underlyingDataPoint: UnderlyingDataPoint[] = [];
+    /**
+     *
+     * @param colVal
+     */
+    function addPointFromColVal(colVal: ColumnValue) {
+        const dataType = colVal.column.dataType;
+        const id = colVal.column.id;
+        let dataValue;
+        if (dataType === 'DATE') {
+            dataValue = [{
+                epochRange: {
+                    startEpoch: colVal.value,
+                },
+            }];
+        } else {
+            dataValue = [{ value: colVal.value }];
+        }
+        underlyingDataPoint.push({
+            columnId: colVal.column.id,
+            dataValue,
+        });
+    }
+
+    selectedPoints.forEach((p) => {
+        p.selectedAttributes.forEach(addPointFromColVal);
+    });
+    return underlyingDataPoint;
+}

package/src/utils/graphql/graphql-request.ts

@@ -0,0 +1,45 @@
+import { getOperationNameFromQuery } from '../../utils';
+
+/**
+ *
+ * @param root0
+ * @param root0.query
+ * @param root0.variables
+ * @param root0.thoughtSpotHost
+ * @param root0.isCompositeQuery
+ */
+export async function graphqlQuery({
+    query,
+    variables,
+    thoughtSpotHost,
+    isCompositeQuery = false,
+}: {
+    query: string,
+    variables: any,
+    thoughtSpotHost: string,
+    isCompositeQuery?: boolean
+}) {
+    const operationName = getOperationNameFromQuery(query);
+    try {
+        const response = await fetch(`${thoughtSpotHost}/prism/?op=${operationName}`, {
+            method: 'POST',
+            headers: {
+                'content-type': 'application/json;charset=UTF-8',
+                'x-requested-by': 'ThoughtSpot',
+                accept: '*/*',
+                'accept-language': 'en-us',
+            },
+            body: JSON.stringify({
+                operationName,
+                query,
+                variables,
+            }),
+            credentials: 'include',
+        });
+        const result = await response.json();
+        const dataValues = Object.values(result.data);
+        return (isCompositeQuery) ? result.data : dataValues[0];
+    } catch (error) {
+        return error;
+    }
+}

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

@@ -0,0 +1,10 @@
+import 'jest-fetch-mock';
+import { getSourceDetail } from './sourceService';
+
+describe('Source service tests', () => {
+    test('Should return source detail and cache it', async () => {
+        await getSourceDetail('https://tshost', 'id');
+        await getSourceDetail('https://tshost', 'id');
+        expect(fetchMock).toBeCalledTimes(1);
+    });
+});

package/src/utils/graphql/sourceService.ts

@@ -0,0 +1,71 @@
+import { graphqlQuery } from './graphql-request';
+
+export const getSourceDetailQuery = `
+    query GetSourceDetail($ids: [GUID!]!) {
+        getSourceDetailById(ids: $ids, type: LOGICAL_TABLE) {
+        id
+        name
+        description
+        authorName
+        authorDisplayName
+        isExternal
+        type
+        created
+        modified
+        columns {
+            id
+            name
+            author
+            authorDisplayName
+            description
+            dataType
+            type
+            modified
+            ownerName
+            owner
+            dataRecency
+            sources {
+            tableId
+            tableName
+            columnId
+            columnName
+            __typename
+            }
+            synonyms
+            cohortAnswerId
+            __typename
+        }
+        relationships
+        destinationRelationships
+        dataSourceId
+        __typename
+        }
+    }  
+`;
+
+const sourceDetailCache = new Map<string, any>();
+
+/**
+ *
+ * @param thoughtSpotHost
+ * @param sourceId
+ */
+export async function getSourceDetail(
+    thoughtSpotHost: string,
+    sourceId: string,
+): Promise<any> {
+    if (sourceDetailCache.has(sourceId)) {
+        return sourceDetailCache.get(sourceId);
+    }
+    const details = await graphqlQuery({
+        query: getSourceDetailQuery,
+        variables: {
+            ids: [sourceId],
+        },
+        thoughtSpotHost,
+    });
+
+    const souceDetails = details[0];
+    sourceDetailCache.set(sourceId, souceDetails);
+    return souceDetails;
+}

package/src/utils/processData.spec.ts

@@ -1,8 +1,8 @@
 import * as processDataInstance from './processData';
-import * as answerServiceInstance from './answerService';
+import * as answerServiceInstance from './graphql/answerService/answerService';
 import * as auth from '../auth';
 import * as base from '../embed/base';
-import { EmbedEvent, OperationType, AuthType } from '../types';
+import { EmbedEvent, AuthType } from '../types';
 
 describe('Unit test for process data', () => {
     beforeAll(() => {
@@ -16,26 +16,12 @@ describe('Unit test for process data', () => {
     });
 
     const thoughtSpotHost = 'http://localhost';
-    test('processDataInstance, when operation is GetChartWithData', () => {
-        const answerService = {};
-        const processChartData = {
-            answerService,
-            data: {
-                session: 'session',
-                query: 'query',
-                operation: OperationType.GetChartWithData,
-            },
-        };
-        jest.spyOn(answerServiceInstance, 'getAnswerServiceInstance').mockReturnValue(
-            answerService,
-        );
-        expect(
-            processDataInstance.processCustomAction(processChartData, thoughtSpotHost),
-        ).toStrictEqual(processChartData);
-    });
 
     test('ProcessData, when Action is CustomAction', async () => {
-        const processedData = { type: EmbedEvent.CustomAction };
+        const processedData = {
+            type: EmbedEvent.CustomAction,
+            data: {},
+        };
         jest.spyOn(processDataInstance, 'processCustomAction').mockImplementation(async () => ({}));
         expect(
             processDataInstance.processEventData(
@@ -44,16 +30,20 @@ describe('Unit test for process data', () => {
                 thoughtSpotHost,
                 null,
             ),
-        ).toStrictEqual(processedData);
+        ).toEqual(expect.objectContaining({
+            ...processedData,
+            answerService: {
+                answer: undefined,
+                selectedPoints: undefined,
+                session: undefined,
+                thoughtSpotHost: 'http://localhost',
+            },
+        }));
     });
 
     test('ProcessData, when Action is non CustomAction', () => {
         const processedData = { type: EmbedEvent.Data };
         jest.spyOn(processDataInstance, 'processCustomAction').mockImplementation(async () => ({}));
-        jest.spyOn(
-            answerServiceInstance,
-            'getAnswerServiceInstance',
-        ).mockImplementation(async () => ({}));
         processDataInstance.processEventData(EmbedEvent.Data, processedData, thoughtSpotHost, null);
         expect(processDataInstance.processCustomAction).not.toBeCalled();
     });

package/src/utils/processData.ts

@@ -6,8 +6,8 @@ import {
     notifyLogout,
 } from '../embed/base';
 import { AuthFailureType, initSession } from '../auth';
-import { AuthType, EmbedEvent, OperationType } from '../types';
-import { getAnswerServiceInstance } from './answerService';
+import { AuthType, CustomActionPayload, EmbedEvent } from '../types';
+import { AnswerService } from './graphql/answerService/answerService';
 
 /**
  *
@@ -15,19 +15,17 @@ import { getAnswerServiceInstance } from './answerService';
  * @param thoughtSpotHost
  */
 export function processCustomAction(e: any, thoughtSpotHost: string) {
-    if (
-        [OperationType.GetChartWithData, OperationType.GetTableWithHeadlineData].includes(
-            e.data?.operation,
-        )
-    ) {
-        const { session, query, operation } = e.data;
-        const answerService = getAnswerServiceInstance(session, query, operation, thoughtSpotHost);
-        return {
-            ...e,
-            answerService,
-        };
-    }
-    return e;
+    const { session, embedAnswerData, contextMenuPoints } = e.data as CustomActionPayload;
+    const answerService = new AnswerService(
+        session,
+        embedAnswerData,
+        thoughtSpotHost,
+        contextMenuPoints?.selectedPoints,
+    );
+    return {
+        ...e,
+        answerService,
+    };
 }
 
 /**