@thoughtspot/ts-chart-sdk 0.0.2-alpha.22 → 0.0.2-alpha.24

package/src/main/logger.ts

@@ -0,0 +1,97 @@
+import { getQueryParam } from './util';
+
+const loggers: Record<string, any> = {};
+const url = window.location.href;
+
+export enum LogLevel {
+    SILENT = -1 as number,
+    ERROR = 0 as number,
+    WARN = 1 as number,
+    INFO = 2 as number,
+    DEBUG = 3 as number,
+    TRACE = 4 as number,
+}
+
+export const logMethods: { [key: number]: any } = {
+    [LogLevel.ERROR]: console.error,
+    [LogLevel.WARN]: console.warn,
+    [LogLevel.INFO]: console.info,
+    [LogLevel.DEBUG]: console.log,
+    [LogLevel.TRACE]: console.trace,
+};
+
+class Logger {
+    private msgPrefix: string;
+
+    constructor(name: string) {
+        this.msgPrefix = name ? `(${name})` : '';
+    }
+
+    private getFormattedMessage(msg: string, logLevel: LogLevel) {
+        return (
+            `${LogLevel[logLevel]} ${this.msgPrefix}` +
+            `(${msg ? `] ${msg}` : ''})`
+        );
+    }
+
+    public async logMessages(args: any, logLevel: LogLevel) {
+        const newArgs = args;
+        if (getQueryParam(url, 'debug') !== 'true') {
+            return;
+        }
+        const logFn = logMethods[logLevel];
+        newArgs[0] = this.getFormattedMessage(newArgs[0], logLevel);
+        if (logFn) {
+            logFn(...newArgs);
+        }
+    }
+
+    public async trace(...args: any) {
+        this.logMessages(args, LogLevel.TRACE);
+    }
+
+    /**
+     * Wrapper for log.log() with debug level
+     * @param msg
+     */
+    public async debug(...args: any) {
+        this.logMessages(args, LogLevel.DEBUG);
+    }
+
+    public async log(...args: any) {
+        this.debug(...args);
+    }
+
+    /**
+     * Wrapper for log.info() with info level
+     * @param msg
+     */
+    public async info(...args: any) {
+        this.logMessages(args, LogLevel.INFO);
+    }
+
+    /**
+     * Wrapper for log.warn() with warn level
+     *
+     * @param {string} msg The log message
+     */
+    public async warn(...args: any) {
+        this.logMessages(args, LogLevel.WARN);
+    }
+
+    /**
+     * Wrapper for log.error() with error level
+     * Error is propagated via callback
+     * @param {string}  msg  The log message
+     */
+    public async error(...args: any) {
+        const stackTrace = this.logMessages(args, LogLevel.ERROR);
+    }
+}
+
+export function create(name: string): any {
+    if (!loggers[name]) {
+        loggers[name] = new Logger(name);
+    }
+    return loggers[name];
+}

package/src/main/util.spec.ts

@@ -1,4 +1,4 @@
-import { timeout } from './util';
+import { getQueryParam, handleMissingValue, timeout } from './util';
 
 describe('timeout function', () => {
     jest.useFakeTimers();
@@ -39,3 +39,56 @@ describe('timeout function', () => {
         await expect(result).rejects.toThrow('Original error');
     });
 });
+
+describe('getQueryParam', () => {
+    it('should return the value of a query parameter if it exists', () => {
+        const url = 'https://example.com/?key=value';
+        expect(getQueryParam(url, 'key')).toBe('value');
+    });
+
+    it('should return an empty string if the query parameter does not exist', () => {
+        const url = 'https://example.com/';
+        expect(getQueryParam(url, 'missingKey')).toBe('');
+    });
+
+    it('should return "false" if the query parameter is "debug" and it is not present', () => {
+        const url = 'https://example.com/';
+        expect(getQueryParam(url, 'debug')).toBe('false');
+    });
+
+    it('should return the default value "false" if the query parameter is "debug" and is set to an empty value', () => {
+        const url = 'https://example.com/?debug=';
+        expect(getQueryParam(url, 'debug')).toBe('');
+    });
+
+    it('should handle complex URLs with multiple parameters correctly', () => {
+        const url = 'https://example.com/?key1=value1&key2=value2';
+        expect(getQueryParam(url, 'key2')).toBe('value2');
+    });
+});
+
+describe('handleMissingValue', () => {
+    it('should return "false" if paramKey is "debug" and paramValue is undefined', () => {
+        expect(handleMissingValue('debug', undefined)).toBe('false');
+    });
+
+    it('should return "false" if paramKey is "debug" and paramValue is null', () => {
+        expect(handleMissingValue('debug', null)).toBe('false');
+    });
+
+    it('should return an empty string if paramValue is undefined and paramKey is not "debug"', () => {
+        expect(handleMissingValue('param', undefined)).toBe('');
+    });
+
+    it('should return an empty string if paramValue is null and paramKey is not "debug"', () => {
+        expect(handleMissingValue('param', null)).toBe('');
+    });
+
+    it('should return the paramValue if paramValue is defined and not null', () => {
+        expect(handleMissingValue('param', 'value')).toBe('value');
+    });
+
+    it('should return the paramValue even if paramKey is "debug" and paramValue is defined', () => {
+        expect(handleMissingValue('debug', 'true')).toBe('true');
+    });
+});

package/src/main/util.ts

@@ -9,3 +9,23 @@ export function timeout(promise: Promise<any>, ms: number, message?: string) {
         }),
     ]);
 }
+
+export function handleMissingValue(
+    paramKey: string,
+    paramValue?: string | null,
+): string {
+    if (paramKey === 'debug') {
+        return paramValue ?? 'false';
+    }
+
+    return paramValue ?? '';
+}
+
+export function getQueryParam(url: string, paramName: string): string {
+    const urlObj = new URL(url);
+    const paramValue = handleMissingValue(
+        paramName,
+        urlObj.searchParams.get(paramName),
+    );
+    return paramValue;
+}

package/src/react/use-custom-chart-context.tsx

@@ -12,6 +12,7 @@ import {
     CustomChartContext,
     CustomChartContextProps,
 } from '../main/custom-chart-context';
+import { create } from '../main/logger';
 import { ChartModel } from '../types/common.types';
 import {
     ChartModelUpdateEventPayload,
@@ -28,6 +29,8 @@ import {
     TSChartContextProps,
 } from './use-custom-chart-types';
 
+const logger = create('CustomChartContextHookSdk');
+
 /**
  * A custom hook to manage the Chart Context state and provide necessary
  * chart-related functionality.
@@ -143,7 +146,7 @@ export const useChartContext = (
                 return true;
             })
             .catch((e) => {
-                console.log('Error in context initialization', e);
+                logger.log('Error in context initialization', e);
             });
     };
 

package/src/react/use-custom-chart-context.util.ts

@@ -1,5 +1,6 @@
 import _ from 'lodash';
 import { CustomChartContext } from '../main/custom-chart-context';
+import { create } from '../main/logger';
 import {
     ChartToTSEvent,
     ChartToTSEventsPayloadMap,
@@ -14,6 +15,8 @@ import {
     TSToChartEventOffListener,
 } from './use-custom-chart-types';
 
+const logger = create('CustomChartContextUtilSdk');
+
 /**
  *
  * @param ctx Custom Chart Context
@@ -31,7 +34,7 @@ export const emitter = (ctx: CustomChartContext): ChartToTSEventEmitters => {
             ...args: ChartToTSEventsPayloadMap[keyof ChartToTSEventsPayloadMap]
         ): Promise<void> => {
             if (!ctx || _.isEmpty(ctx)) {
-                console.log('Context is not initialized');
+                logger.log('Context is not initialized');
                 return Promise.reject(new Error('Context not initialized'));
             }
             return ctx.emitEvent(eventName, ...args);
@@ -60,7 +63,7 @@ export const eventListener = (
             callbackFn: TSToChartEventsPayloadMap[keyof TSToChartEventsPayloadMap],
         ): Promise<void> => {
             if (!ctx || _.isEmpty(ctx)) {
-                console.log('Context is not initialized');
+                logger.log('Context is not initialized');
                 return Promise.reject(new Error('Context not initialized'));
             }
             ctx.on(eventName, callbackFn);
@@ -89,7 +92,7 @@ export const eventOffListener = (
 
         acc[emitterKey] = (): Promise<void> => {
             if (!ctx || _.isEmpty(ctx)) {
-                console.log('Context is not initialized');
+                logger.log('Context is not initialized');
                 return Promise.reject(new Error('Context not initialized'));
             }
             ctx.off(eventName);

package/src/types/common.types.ts

@@ -188,10 +188,17 @@ export type SuccessValidationResponse = {
     visualPropEditorDefinition: VisualPropEditorDefinition;
 };
 
+export type VisualPropError = {
+    propElementKey: string;
+    propElementType: string;
+    value: unknown;
+};
+
 // Generic Validation Response
 export type ValidationResponse = {
     isValid: boolean;
     validationErrorMessage?: string[];
+    visualPropError?: VisualPropError;
 };
 
 /**

package/src/types/ts-to-chart-event.types.ts

@@ -73,7 +73,6 @@ export enum TSToChartEvent {
      * @version SDK: 0.1 | ThoughtSpot:
      */
     AxisMenuActionClick = 'AxisMenuActionClick',
-
     /**
      * @version SDK: 0.2 | ThoughtSpot:
      */

package/src/types/visual-prop.types.ts

@@ -11,6 +11,11 @@
 import type { CustomChartContext } from '../main/custom-chart-context';
 import { ColumnType } from './answer-column.types';
 import { ChartModel } from './common.types';
+
+export type TSTooltipConfig = {
+    columnIds: Array<string>;
+};
+
 /**
  * Configuration for input validation rules
  */
@@ -386,13 +391,48 @@ export interface Section {
      */
     disabled?: boolean;
     /* Optional property to make the accordian expanded by default. If
-     * not passed the accordian will remain closed by default. Only works with layout type 'accordian'
+     * not passed the accordian will remain closed by default. Only works with layout type
+     * 'accordian'
      *
      * @version SDK: 0.0.2-alpha.19 | ThoughtSpot:
      */
     isAccordianExpanded?: boolean;
 }
 
+/**
+ * Native charts edit tool tip component defined for regular charts in TS Advance Chart Settings
+ *
+ * @group Visual Properties Editor
+ */
+export interface NativeEditToolTip {
+    type: 'tooltipconfig';
+    /**
+     * Key to store the value
+     *
+     * @version SDK: 0.1 | ThoughtSpot:
+     */
+    key: string;
+
+    /*
+     List of column ids that are present in ToolTipConfig by default 
+    */
+
+    defaultValue?: TSTooltipConfig;
+
+    /**
+     * I18n'ed string to show on the form label
+     *
+     * @version SDK: 0.1 | ThoughtSpot:
+     */
+    label?: string;
+    /**
+     * Determines whether it should be disabled or not
+     *
+     * @version SDK: 0.0.2-alpha.13 | ThoughtSpot:
+     */
+    disabled?: boolean;
+}
+
 /**
  * Common type placeholder for all the input element types
  *
@@ -406,7 +446,8 @@ export type PropElement =
     | ToggleFormDetail
     | CheckboxFormDetail
     | RadioButtonFormDetail
-    | DropDownFormDetail;
+    | DropDownFormDetail
+    | NativeEditToolTip;
 
 /**
  * Define Column settings, based on column type, settings needs to be defined in

package/src/utils/date-formatting.ts

@@ -8,6 +8,7 @@
 
 import _ from 'lodash';
 import { DateTime } from 'luxon';
+import { create } from '../main/logger';
 import {
     ChartColumn,
     ColumnTimeBucket,
@@ -15,6 +16,8 @@ import {
     DataType,
 } from '../types/answer-column.types';
 
+const logger = create('DateFormattingUtilsSdk');
+
 export interface CustomCalendarDate {
     v: {
         s: number;
@@ -615,7 +618,7 @@ export function formatDateNum(
         case dateNumTypes.DATE_NUM_HOUR_IN_DAY:
             return `${value}`;
         default:
-            console.log(
+            logger.log(
                 'unknown effectiveDataType for date num',
                 effectiveDataType,
             );
@@ -664,7 +667,7 @@ export function formatDate(
         epochMillis = newInputDate.getTime();
     }
     if (!_.isNumber(epochMillis)) {
-        console.log(
+        logger.log(
             'formatDate could not convert input date to a timestamp',
             inputDate,
         );