@thoughtspot/ts-chart-sdk 0.0.2-alpha.2 → 0.0.2-alpha.20

package/src/utils/conditional-formatting/conditional-formatting.ts

@@ -0,0 +1,229 @@
+/**
+ * @file: Conditional Formatting Utils
+ * @fileoverview All CF utils for the Custom Chart implementations
+ * @author Yashvardhan Nehra <yashvardhan.nehra@thoughtspot.com>
+ *
+ * Copyright: ThoughtSpot Inc. 2023
+ */
+
+import _ from 'lodash';
+import { ChartColumn } from '../../types/answer-column.types';
+import { DataPointsArray } from '../../types/common.types';
+import {
+    ConditionalFormatting,
+    ConditionalFormattingComparisonTypes,
+    ConditionalMetric,
+    Operators,
+    Parameter,
+} from '../../types/conditional-formatting.types';
+
+export const getMinRangeValue = (
+    metric: ConditionalMetric,
+): number | undefined | null => metric?.rangeValues?.min;
+
+export const getMaxRangeValue = (
+    metric: ConditionalMetric,
+): number | undefined | null => metric?.rangeValues?.max;
+
+/**
+ * Performs a value-based comparison between two values based on the specified operator in the
+ * metric.
+ *
+ * @param metric - The conditional formatting metric info
+ * @param lhsValue - The left-hand side value to compare.
+ * @param rhsValue - The right-hand side value to compare.
+ * @returns Boolean indicating the result of the comparison.
+ */
+const doValueBasedComparison = (
+    metric: ConditionalMetric,
+    lhsValue?: string | number | null,
+    rhsValue?: string | number | null,
+): boolean => {
+    switch (metric.operator) {
+        case Operators.Is:
+        case Operators.EqualTo:
+            return (
+                !_.isNil(lhsValue) &&
+                !_.isNil(rhsValue) &&
+                (_.isEqual(lhsValue, rhsValue) ||
+                    _.isEqual(_.toString(lhsValue), _.toString(rhsValue)))
+            );
+        case Operators.IsNot:
+        case Operators.NotEqualTo: {
+            if (_.isNil(lhsValue) || _.isNil(rhsValue))
+                return lhsValue !== rhsValue;
+            return !_.isEqual(_.toString(lhsValue), _.toString(rhsValue));
+        }
+        case Operators.IsNull:
+        case Operators.IsEmpty:
+            return _.isNil(lhsValue);
+        case Operators.IsNotNull:
+        case Operators.IsNotEmpty:
+            return !_.isNil(lhsValue);
+        case Operators.LessThan:
+            return _.toNumber(lhsValue) < _.toNumber(rhsValue);
+        case Operators.LessThanEqualTo:
+            return _.toNumber(lhsValue) <= _.toNumber(rhsValue);
+        case Operators.GreaterThan:
+            return _.toNumber(lhsValue) > _.toNumber(rhsValue);
+        case Operators.GreaterThanEqualTo:
+            return _.toNumber(lhsValue) >= _.toNumber(rhsValue);
+        case Operators.IsBetween:
+            return (
+                lhsValue != null &&
+                +lhsValue >= (getMinRangeValue(metric) ?? -Infinity) &&
+                +lhsValue <= (getMaxRangeValue(metric) ?? Infinity)
+            );
+        case Operators.Contains:
+            return (
+                lhsValue != null &&
+                rhsValue != null &&
+                _.includes(_.toString(lhsValue), rhsValue.toString())
+            );
+        case Operators.DoesNotContain:
+            return (
+                lhsValue != null &&
+                rhsValue != null &&
+                !_.includes(_.toString(lhsValue), rhsValue.toString())
+            );
+        case Operators.StartsWith:
+            return (
+                lhsValue != null &&
+                rhsValue != null &&
+                _.startsWith(_.toString(lhsValue), rhsValue.toString())
+            );
+        case Operators.EndsWith:
+            return (
+                lhsValue != null &&
+                rhsValue != null &&
+                _.endsWith(_.toString(lhsValue), rhsValue.toString())
+            );
+        default:
+            return false;
+    }
+};
+
+/**
+ * Evaluates whether the condition defined by the metric is satisfied.
+ *
+ * @param metric - The conditional formatting metric info
+ * @param parameters - An array of parameters that may include the parameter needed for ParameterBased comparison.
+ * @param lhsColValue - The value of the left-hand side column, used in ColumnBased and some ValueBased comparisons.
+ * @param rhsColValue - The value of the right-hand side column, used in ColumnBased comparisons.
+ * @returns Boolean indicating whether the condition is satisfied.
+ */
+export const isConditionSatisfied = (
+    metric: ConditionalMetric,
+    parameters?: Parameter[],
+    lhsColValue?: string | number | null,
+    rhsColValue?: string | number | null,
+): boolean => {
+    let parameter = null;
+    let parameterValue = null;
+    switch (metric.comparisonType) {
+        case ConditionalFormattingComparisonTypes.ValueBased:
+            return doValueBasedComparison(metric, lhsColValue, metric.value);
+        case ConditionalFormattingComparisonTypes.ParameterBased:
+            parameter = parameters?.find(
+                (parameter: Parameter) =>
+                    parameter.id === metric.comparisonParameterId,
+            );
+            parameterValue =
+                parameter?.overrideValue || parameter?.defaultValue;
+            return doValueBasedComparison(metric, lhsColValue, parameterValue);
+        case ConditionalFormattingComparisonTypes.ColumnBased:
+            return doValueBasedComparison(metric, lhsColValue, rhsColValue);
+        default:
+            return doValueBasedComparison(metric, lhsColValue, metric.value);
+    }
+};
+
+/**
+ * Validates if the conditional rule is applicable or not.
+ *
+ * @param conditionalMetric - The conditional rule to be validated.
+ * @param index - The index of the data point to evaluate.
+ * @param columnId - The ID of the column for which to validate the rule.
+ * @param dataAttr - The data points array containing the data for the chart.
+ * @param inScopeParameters - The list of parameters available for the chart.
+ * @returns Boolean indicating if the conditional rule is applicable or not.
+ */
+export function validateCfCondition(
+    conditionalMetric: ConditionalMetric,
+    index: number,
+    columnId: string,
+    dataAttr?: DataPointsArray,
+    inScopeParameters?: Parameter[],
+): boolean {
+    let lhsColumnValue;
+    let rhsColumnValue;
+    if (dataAttr?.columns) {
+        const columnIdx = _.findIndex(
+            dataAttr.columns,
+            (colId) => colId === columnId,
+        );
+        lhsColumnValue = dataAttr?.dataValue[index][columnIdx];
+    }
+    const lhsId = conditionalMetric.lhsColumnId;
+    const rhsId = conditionalMetric.rhsColumnId;
+    if (lhsId && dataAttr?.columns) {
+        const lhsIdx = _.findIndex(
+            dataAttr.columns,
+            (colId) => colId === lhsId,
+        );
+        lhsColumnValue = dataAttr?.dataValue[index][lhsIdx];
+    }
+    if (rhsId && dataAttr?.columns) {
+        const rhsIdx = _.findIndex(
+            dataAttr.columns,
+            (colId) => colId === rhsId,
+        );
+        rhsColumnValue = dataAttr?.dataValue[index][rhsIdx];
+    }
+    return isConditionSatisfied(
+        conditionalMetric,
+        inScopeParameters,
+        lhsColumnValue,
+        rhsColumnValue,
+    );
+}
+
+/**
+ * Evaluates all conditional formatting rules against a specific data point and returns the first
+ * applicable rule.
+ *
+ * @param idx - The index of the data point to evaluate.
+ * @param columnId - The ID of the column for which to validate the rule.
+ * @param dataArr - The array of data points against which the conditional formatting rules will be evaluated.
+ * @param conditionalFormatting - The conditional formattings applied on a column.
+ * @returns The first ConditionalMetric that is applicable to the specified data point, or null if no rules are applicable.
+ */
+export const applicableConditionalFormatting = (
+    idx: number,
+    columnId: string,
+    dataArr: DataPointsArray,
+    conditionalFormatting?: ConditionalFormatting,
+): ConditionalMetric | null => {
+    return (
+        _.find(conditionalFormatting?.rows, (conditionalMetric) => {
+            return validateCfCondition(
+                conditionalMetric as ConditionalMetric,
+                idx,
+                columnId,
+                dataArr,
+            );
+        }) || null
+    );
+};
+
+/**
+ * Retrieves all conditional formatting rules applied to a column.
+ *
+ * @param column - The column for which to retrieve conditional formatting rules.
+ * @returns An array of ConditionalFormatting configurations applied to the specified column, or undefined if no configurations are applicable.
+ */
+export function getCfForColumn(
+    column: ChartColumn,
+): ConditionalFormatting | undefined {
+    return column?.columnProperties?.conditionalFormatting || undefined;
+}

package/src/utils/date-formatting.spec.ts

@@ -0,0 +1,168 @@
+/**
+ * @file: Date Formatting Spec
+ *
+ * @author Yashvardhan Nehra <yashvardhan.nehra@thoughtspot.com>
+ *
+ * Copyright: ThoughtSpot Inc. 2023
+ */
+
+import {
+    ChartColumn,
+    ChartSpecificColumnType,
+    ColumnTimeBucket,
+    ColumnType,
+    DataType,
+} from '../types/answer-column.types';
+import {
+    CustomCalendarDate,
+    dateFormatter,
+    getCustomCalendarGuidFromColumn,
+    getDisplayString,
+    getStartEpoch,
+    hasCustomCalendar,
+    isAttribute,
+    isDateColumn,
+    isDateFamilyColumn,
+    isDateNumColumn,
+    isTimeColumn,
+} from './date-formatting';
+
+describe('date-formatting', () => {
+    let col: ChartColumn;
+    beforeEach(() => {
+        col = {
+            id: 'testId',
+            name: 'test',
+            type: ColumnType.MEASURE,
+            chartSpecificColumnType: ChartSpecificColumnType.UNKNOWN,
+            timeBucket: ColumnTimeBucket.AUTO,
+            dataType: DataType.UNKNOWN,
+            calenderGuid: '12345',
+        };
+    });
+    test('isDateColumn should return true for DATE data type', () => {
+        col.dataType = DataType.DATE;
+        expect(isDateColumn(col)).toBe(true);
+    });
+
+    test('isDateColumn should return true for DATE_TIME data type', () => {
+        col.dataType = DataType.DATE_TIME;
+        expect(isDateColumn(col)).toBe(true);
+    });
+
+    test('isAttribute should return true for ATTRIBUTE column type', () => {
+        col.type = ColumnType.ATTRIBUTE;
+        expect(isAttribute(col)).toBe(true);
+    });
+
+    test('isAttribute should return false for non-ATTRIBUTE column type', () => {
+        col.type = ColumnType.MEASURE;
+        expect(isAttribute(col)).toBe(false);
+    });
+
+    test('getCustomCalendarGuidFromColumn should return the calendarGuid', () => {
+        col.calenderGuid = '12345';
+        expect(getCustomCalendarGuidFromColumn(col)).toBe('12345');
+    });
+
+    test('isDateNumColumn should return true for ATTRIBUTE type with specific time buckets', () => {
+        col.type = ColumnType.ATTRIBUTE;
+        col.timeBucket = ColumnTimeBucket.HOUR_OF_DAY;
+        expect(isDateNumColumn(col)).toBe(true);
+    });
+
+    test('isDateNumColumn should return false for non-ATTRIBUTE type', () => {
+        col.type = ColumnType.MEASURE;
+        col.timeBucket = ColumnTimeBucket.DAY_OF_WEEK;
+        expect(isDateNumColumn(col)).toBe(false);
+    });
+
+    test('isDateFamilyColumn should return true for DATE data type', () => {
+        col.dataType = DataType.DATE;
+        expect(isDateFamilyColumn(col)).toBe(true);
+    });
+
+    test('isDateFamilyColumn should return true for DATE_NUM column', () => {
+        col.type = ColumnType.ATTRIBUTE;
+        col.timeBucket = ColumnTimeBucket.DAY_OF_WEEK;
+        expect(isDateFamilyColumn(col)).toBe(true);
+    });
+
+    test('isTimeColumn should return true for TIME data type', () => {
+        col.dataType = DataType.TIME;
+        expect(isTimeColumn(col)).toBe(true);
+    });
+
+    test('hasCustomCalendar should return true for date family columns with custom calendar', () => {
+        col.dataType = DataType.DATE;
+        col.calenderGuid = '12345';
+        expect(hasCustomCalendar(col)).toBe(true);
+    });
+
+    test('getStartEpoch should return the start epoch from CustomCalendarDate', () => {
+        const date = {
+            v: { s: 12345, e: 12346 },
+            d: 'Custom_Date',
+        } as CustomCalendarDate;
+        expect(getStartEpoch(date)).toBe(date.v.s);
+    });
+
+    test('getStartEpoch should return null if start epoch is not present', () => {
+        const date = { v: {}, d: '01-07-2021' } as CustomCalendarDate;
+        expect(getStartEpoch(date)).toBe(null);
+    });
+
+    test('getDisplayString should return display string if present', () => {
+        const date = { v: { s: 1625097600, e: 1625184000 }, d: '01-07-2021' };
+        expect(getDisplayString(date)).toBe('01-07-2021');
+    });
+
+    test('getDisplayString should return null if display string is not present', () => {
+        const date = {
+            v: { s: 1625097600, e: 1625184000 },
+        } as CustomCalendarDate;
+        expect(getDisplayString(date)).toBe(null);
+    });
+
+    test('dateFormatter should return custom calendar display string if present', () => {
+        const dataValue = {
+            v: { s: 1625097600, e: 1625184000 },
+            d: '01-07-2021',
+        } as CustomCalendarDate;
+        col.dataType = DataType.DATE;
+        col.calenderGuid = '12345';
+        expect(dateFormatter(dataValue, col)).toBe('01-07-2021');
+    });
+
+    test('dateFormatter should return formatted date from start epoch if custom calendar display string is not present', () => {
+        const dataValue = {
+            v: { s: 1625097600, e: 1625184000 },
+        } as CustomCalendarDate;
+        col.dataType = DataType.DATE;
+        col.calenderGuid = '12345';
+        expect(dateFormatter(dataValue, col)).toBe('01-07-2021');
+    });
+
+    test('dateFormatter should return null if start epoch is not present', () => {
+        const dataValue = { v: { e: 1625184000 } } as CustomCalendarDate;
+        col.dataType = DataType.DATE;
+        col.calenderGuid = '12345';
+        expect(dateFormatter(dataValue, col)).toBe(null);
+    });
+
+    test('dateFormatter should return formatted date for non-custom calendar column', () => {
+        const dataValue = 1625097600;
+        col.dataType = DataType.DATE;
+        col.calenderGuid = undefined;
+        expect(dateFormatter(dataValue, col)).toBe('01-07-2021');
+    });
+    test('dateFormatter should format the date based on custom calendar', () => {
+        col.dataType = DataType.DATE;
+        col.calenderGuid = '12345';
+        const date = {
+            v: { s: 12345, e: 12346 },
+            d: 'Custom_Date',
+        } as CustomCalendarDate;
+        expect(dateFormatter(date, col)).toBe(date.d);
+    });
+});

package/src/utils/date-formatting.ts

@@ -0,0 +1,109 @@
+/**
+ * @file: Date Formatting Utils
+ *
+ * @author Yashvardhan Nehra <yashvardhan.nehra@thoughtspot.com>
+ *
+ * Copyright: ThoughtSpot Inc. 2023
+ */
+
+import _ from 'lodash';
+import { DateTime } from 'luxon';
+import {
+    ChartColumn,
+    ColumnTimeBucket,
+    ColumnType,
+    DataType,
+} from '../types/answer-column.types';
+
+export interface CustomCalendarDate {
+    v: {
+        s: number;
+        e: number;
+    };
+    d: string;
+}
+
+export const isDateColumn = (col: ChartColumn) =>
+    DataType[col.dataType] === 'DATE' || DataType[col.dataType] === 'DATE_TIME';
+
+export const isAttribute = (col: ChartColumn) =>
+    col.type === ColumnType.ATTRIBUTE;
+
+export const getCustomCalendarGuidFromColumn = (col: ChartColumn) =>
+    col.calenderGuid;
+
+const isDateNumTimeBucket = (col: ChartColumn): boolean => {
+    return [
+        ColumnTimeBucket.HOUR_OF_DAY,
+        ColumnTimeBucket.DAY_OF_WEEK,
+        ColumnTimeBucket.DAY_OF_MONTH,
+        ColumnTimeBucket.DAY_OF_QUARTER,
+        ColumnTimeBucket.DAY_OF_YEAR,
+        ColumnTimeBucket.WEEK_OF_MONTH,
+        ColumnTimeBucket.WEEK_OF_QUARTER,
+        ColumnTimeBucket.WEEK_OF_YEAR,
+        ColumnTimeBucket.MONTH_OF_QUARTER,
+        ColumnTimeBucket.MONTH_OF_YEAR,
+        ColumnTimeBucket.QUARTER_OF_YEAR,
+    ].includes(col.timeBucket);
+};
+export const isDateNumColumn = (col: ChartColumn): boolean => {
+    return isAttribute(col) && isDateNumTimeBucket(col);
+};
+
+export const isDateFamilyColumn = (col: ChartColumn): boolean => {
+    return isDateColumn(col) || isDateNumColumn(col);
+};
+
+export const isTimeColumn = (col: ChartColumn) => {
+    return DataType[col.dataType] === 'TIME';
+};
+
+/**
+ * Determines if the given column has a custom calendar.
+ *
+ * @param col - The chart column to check.
+ * @returns True if the column is a date family column and has a custom calendar GUID, false otherwise.
+ */
+export const hasCustomCalendar = (col: ChartColumn): boolean =>
+    isDateFamilyColumn(col) && !!getCustomCalendarGuidFromColumn(col);
+
+/**
+ * Retrieves the start epoch from a custom calendar date.
+ *
+ * @param date - The custom calendar date object.
+ * @returns The start epoch time if present, null otherwise.
+ */
+export function getStartEpoch(date: CustomCalendarDate): number | null {
+    if (_.has(date, 'v') && _.has(date.v, 's')) {
+        return date.v.s;
+    }
+    return null;
+}
+
+export function getDisplayString(date: CustomCalendarDate): string | null {
+    if (_.has(date, 'd')) {
+        return date.d;
+    }
+    return null;
+}
+
+/**
+ * Formats the date value based on the column's properties and custom calendar settings.
+ *
+ * @param dataValue - The date value to format.
+ * @param col - The chart column.
+ * @returns The formatted date string.
+ */
+export function dateFormatter(dataValue: any, col: ChartColumn) {
+    if (hasCustomCalendar(col)) {
+        if (getDisplayString(dataValue)) {
+            return getDisplayString(dataValue);
+        }
+        const startEpoch = getStartEpoch(dataValue);
+        return startEpoch !== null
+            ? DateTime.fromMillis(startEpoch * 1000).toFormat('dd-MM-yyyy')
+            : null;
+    }
+    return DateTime.fromMillis(dataValue * 1000).toFormat('dd-MM-yyyy');
+}