@datarailsshared/dr_renderer 1.2.10 → 1.2.11

package/tests/mock/widgets.json

@@ -0,0 +1,403 @@
+[
+  {
+    "id": 9422,
+    "template_id": 7199,
+    "rows": [
+      {
+        "name": "Scenario",
+        "id": 161922,
+        "type": "Text",
+        "idx": 18,
+        "format": null,
+        "allow_blanks": true,
+        "is_calculated": false,
+        "calculated_formula": null,
+        "sorting": null,
+        "is_consolidated": false,
+        "consolidated_fields": [],
+        "error_policy": "SET_DEFAULT",
+        "default_value": null,
+        "date_split_options": null,
+        "date_field_before_split": null,
+        "category": [],
+        "mandatory": false,
+        "letter_case": null,
+        "trim": true,
+        "kind": null,
+        "date_format": "infer",
+        "consider_fiscal_in_view": false,
+        "description": null,
+        "is_hidden": false,
+        "usage_info": {
+          "usage_info": {
+            "ex_tables": [
+              7076
+            ]
+          }
+        },
+        "ignore_hours": true,
+        "alias": ""
+      }
+    ],
+    "cols": [
+      {
+        "name": "Account level 1",
+        "id": 161918,
+        "type": "Text",
+        "idx": 14,
+        "format": null,
+        "allow_blanks": true,
+        "is_calculated": false,
+        "calculated_formula": null,
+        "sorting": null,
+        "is_consolidated": false,
+        "consolidated_fields": [],
+        "error_policy": "SET_DEFAULT",
+        "default_value": null,
+        "date_split_options": null,
+        "date_field_before_split": null,
+        "category": [],
+        "mandatory": false,
+        "letter_case": null,
+        "trim": true,
+        "kind": null,
+        "date_format": "infer",
+        "consider_fiscal_in_view": false,
+        "description": null,
+        "is_hidden": false,
+        "usage_info": {
+          "usage_info": {
+            "ex_tables": [
+              7076
+            ]
+          }
+        },
+        "ignore_hours": true,
+        "alias": ""
+      },
+      {
+        "name": "Account level 2",
+        "id": 161919,
+        "type": "Text",
+        "idx": 15,
+        "format": null,
+        "allow_blanks": true,
+        "is_calculated": false,
+        "calculated_formula": null,
+        "sorting": null,
+        "is_consolidated": false,
+        "consolidated_fields": [],
+        "error_policy": "SET_DEFAULT",
+        "default_value": null,
+        "date_split_options": null,
+        "date_field_before_split": null,
+        "category": [],
+        "mandatory": false,
+        "letter_case": null,
+        "trim": true,
+        "kind": null,
+        "date_format": "infer",
+        "consider_fiscal_in_view": false,
+        "description": null,
+        "is_hidden": false,
+        "usage_info": {
+          "usage_info": {
+            "ex_tables": [
+              7076
+            ]
+          }
+        },
+        "ignore_hours": true,
+        "alias": ""
+      },
+      {
+        "name": "Posting Date",
+        "id": 161923,
+        "type": "Date",
+        "idx": 19,
+        "format": null,
+        "allow_blanks": true,
+        "is_calculated": false,
+        "calculated_formula": null,
+        "sorting": null,
+        "is_consolidated": false,
+        "consolidated_fields": [],
+        "error_policy": "SET_DEFAULT",
+        "default_value": null,
+        "date_split_options": null,
+        "date_field_before_split": null,
+        "category": [],
+        "mandatory": false,
+        "letter_case": null,
+        "trim": true,
+        "kind": null,
+        "date_format": "infer",
+        "consider_fiscal_in_view": false,
+        "description": null,
+        "is_hidden": false,
+        "usage_info": {
+          "usage_info": {
+            "ex_tables": [
+              7076
+            ]
+          }
+        },
+        "ignore_hours": true,
+        "alias": ""
+      }
+    ],
+    "calculated_values": [
+      {
+        "calc_id": 23,
+        "name": "Test value",
+        "field": 161922,
+        "side": "legend",
+        "format": null
+      }
+    ],
+    "filters": [
+      {
+        "field": 161918,
+        "name": "Account level 1",
+        "values": [
+          "Expenses",
+          "Income",
+          "Other Expense",
+          "Other Income"
+        ],
+        "is_excluded": false,
+        "show_in_graph": true,
+        "type": "Text",
+        "override_global_filter": true
+      },
+      {
+        "field": 161923,
+        "name": "Posting Date",
+        "values": {
+          "datetype": "range",
+          "val": {
+            "fromdate": 1641859200,
+            "todate": 1653696000
+          }
+        },
+        "is_excluded": false,
+        "show_in_graph": false,
+        "type": "Date",
+        "override_global_filter": false
+      },
+      {
+        "field": 161924,
+        "name": "Reporting Date",
+        "values": [
+          1646006400,
+          1643587200
+        ],
+        "is_excluded": false,
+        "show_in_graph": true,
+        "type": "Date",
+        "override_global_filter": true
+      }
+    ],
+    "options": {
+      "chartOptions": {
+        "axisY": {
+          "autoylabel": true,
+          "name": "Amount",
+          "min": null,
+          "max": null
+        },
+        "axisX": {
+          "autoxlabel": true,
+          "name": "Account level 1",
+          "min": null,
+          "max": null,
+          "label_step": null,
+          "zoom_x": false
+        },
+        "tooltips": {
+          "show": true,
+          "font_style": "Poppins",
+          "font_size": "12",
+          "font_color": "#545a6b",
+          "show_x_axis": true,
+          "show_data_series": true,
+          "show_value": true,
+          "show_out_of_x_axis": false,
+          "show_out_of_data_series": false
+        },
+        "label": {
+          "show": true,
+          "overlap": false,
+          "font_style": "Poppins",
+          "font_size": "11",
+          "font_color": "#151a41",
+          "show_value": true,
+          "show_out_of_x_axis": false,
+          "show_out_of_data_series": false
+        },
+        "subtitle": {
+          "subtitle": ""
+        },
+        "widget_library": {
+          "categories": "",
+          "description": "",
+          "tags": []
+        },
+        "table_options": {
+          "table_colors_offset": 0,
+          "show_column_total": true,
+          "show_row_total": true,
+          "show_subtotals_for_columns": false,
+          "show_subtotals_for_rows": false,
+          "show_subtotals_in_brackets": false,
+          "transpose_table": false,
+          "start_collapsed_rows": false,
+          "start_collapsed_columns": false,
+          "colorize_headers": true,
+          "remove_underscores": true,
+          "use_handsOnTable": false,
+          "use_new_table_design": true,
+          "hide_nulls_in_headers": true,
+          "show_all": false,
+          "freeze_panes": true,
+          "eliminate_calc_totals": false
+        },
+        "table_design_options": {
+          "columns_font_style": "Poppins",
+          "columns_font_size": "10",
+          "columns_align_text": "left",
+          "rows_font_style": "Poppins",
+          "rows_font_size": "10",
+          "rows_align_text": "left",
+          "values_font_style": "Poppins",
+          "values_font_size": "10",
+          "values_align_text": "left",
+          "totals_font_style": "Poppins",
+          "totals_font_size": "10",
+          "totals_align_text": "left"
+        },
+        "chart": {
+          "colors_offset": 0,
+          "zoom_type": "None",
+          "show": true
+        },
+        "delta_column": {
+          "field": "",
+          "name": "_Variance",
+          "formula": "x2-x1",
+          "chart": "",
+          "only_variant": false,
+          "same_yaxis": false,
+          "same_xaxis": false,
+          "is_percentage": false,
+          "sort_by_variance": false,
+          "sort_by_absolute_variance": false
+        },
+        "advanced": {
+          "error_policy": "None",
+          "from_latest": ""
+        },
+        "legends_position": {
+          "value": "top"
+        },
+        "hideChartHeader": true
+      },
+      "useDefaultFormat": false,
+      "average": false,
+      "total": false,
+      "comboOptions": {
+        "secondaryAxisSettings": {
+          "name": "Secondary Axis",
+          "max": null,
+          "min": null,
+          "is_percentage": false
+        },
+        "seriesOptions": []
+      },
+      "error_params": null,
+      "chart_title": "New Widget234",
+      "chartLabels": {
+        "legend": "Data series",
+        "axis": "X - Axis"
+      },
+      "widgetId": 9422,
+      "paletteOptions": {
+        "dashboardPalette": {
+          "id": 7615,
+          "is_default": true,
+          "colors": [
+            "rgba(205, 229, 255, 1)",
+            "rgba(0, 0, 0, 1)",
+            "rgba(94, 149, 105, 1)",
+            "rgba(251, 5, 86, 1)",
+            "#0E3E9E",
+            "#7DC5FF",
+            "#269AFF",
+            "#3DC5AA",
+            "rgba(112, 32, 100, 1)",
+            "#1591AD"
+          ],
+          "name": "testOne1212",
+          "organization": 1,
+          "variance_color": "#3DC5AA"
+        }
+      },
+      "chart_series": [
+        "Actuals"
+      ],
+      "resetSortingElement": null,
+      "show_more_max_items": 5,
+      "value_drill_down_fn": null,
+      "defaults_colors": [
+        "#0087FE",
+        "#3AD4D4",
+        "#EF4760",
+        "#FFCF33",
+        "#0E3E9E",
+        "#7DC5FF",
+        "#269AFF",
+        "#3DC5AA",
+        "#66FF99",
+        "#1591AD"
+      ],
+      "date_aggregation_configs": [
+        {
+          "field_id": 161923,
+          "field_name": "Posting Date",
+          "fnc": "sum",
+          "aggregate_by": "month",
+          "type": "YTD",
+          "rolling_month_before": 12,
+          "is_end_of_period": true,
+          "is_formatting_by_aggregation_method": true
+        }
+      ],
+      "error_has_occurred": false
+    },
+    "vals": [
+      {
+        "field": 161925,
+        "name": "Amount",
+        "aggregator": "SUM",
+        "type": "Float"
+      }
+    ],
+    "value_filter_options": "{}",
+    "values_format": "#,###",
+    "chart_type": "column-chart-stacked",
+    "widget_template_id": null,
+    "dashboard_name": "123",
+    "published_item": null,
+    "name": "New Widget234",
+    "dashboard": 9013,
+    "width": 6,
+    "height": 8,
+    "x": 0,
+    "y": 0,
+    "is_analysis": false,
+    "is_drill_down": false,
+    "is_any_field_is_empty": false,
+    "showTable": false,
+    "mydrilldownFunc": null
+  }
+]

package/tests/seriesPointStyles-helper.test.js

@@ -0,0 +1,114 @@
+import seriesPointStylesHelper from '../src/seriesPointStyles-helper';
+
+describe('setSeriesPointStylesOnClick', () => {
+    it('should update point styles on click and update other points to non-selected styles on click', () => {
+        const selectedPoint = {
+            update: jest.fn(),
+            series: {
+                chart: {
+                    series: [{ points: [] }],
+                    redraw: jest.fn()
+                }
+            }
+        };
+
+        const otherPoint = {
+            update: jest.fn(),
+            series: selectedPoint.series
+        };
+
+        selectedPoint.series.chart.series[0].points.push(selectedPoint, otherPoint);
+
+        const mockEvent = { point: selectedPoint };
+
+        seriesPointStylesHelper.setSeriesPointStylesOnClick(mockEvent);
+
+        expect(selectedPoint.update).toHaveBeenCalledWith(
+            {
+                opacity: 1,
+                marker: {
+                    enabled: true,
+                    radius: 8
+                },
+                dataLabels: {
+                    style: {
+                        fontWeight: 'bold'
+                    }
+                }
+            },
+            false
+        );
+        expect(otherPoint.update).toHaveBeenCalledWith(
+            {
+                opacity: 0.1,
+                marker: {
+                    enabled: true,
+                    radius: 3
+                },
+                dataLabels: {
+                    style: {
+                        fontWeight: 'normal'
+                    }
+                }
+            },
+            false
+        );
+        expect(selectedPoint.series.chart.redraw).toHaveBeenCalled();
+    });
+});
+
+describe('setInitialPointStyles', () => {
+    it('should set initial point styles based on selection', () => {
+        const opts = { selectedPoint: { initialName: 'point1', y: 10 } };
+        const mockPoint = { initialName: 'point1', y: 10 };
+        const mockSeries = { data: [mockPoint] };
+        const series = [mockSeries];
+
+        seriesPointStylesHelper.setInitialPointStyles(opts, series);
+
+        expect(mockPoint).toEqual(
+            Object.assign(
+                mockPoint,
+                {
+                    opacity: 1,
+                    marker: {
+                        enabled: true,
+                        radius: 8
+                    },
+                    dataLabels: {
+                        style: {
+                            fontWeight: 'bold'
+                        }
+                    }
+                }
+            )
+        );
+    });
+
+    it('should not set styles if point is not selected', () => {
+        const opts = { selectedPoint: { initialName: 'point1', y: 10 } };
+        const mockPoint = { initialName: 'point2', y: 20 };
+        const mockSeries = { data: [mockPoint] };
+        const series = [mockSeries];
+
+        seriesPointStylesHelper.setInitialPointStyles(opts, series);
+
+        expect(mockPoint).toEqual(
+            Object.assign(
+                mockPoint,
+                {
+                    opacity: 0.1,
+                    marker: {
+                        enabled: true,
+                        radius: 3
+                    },
+                    dataLabels: {
+                        style: {
+                            fontWeight: 'normal'
+                        }
+                    }
+                }
+            )
+        );
+    });
+});

package/tsconfig.json

@@ -0,0 +1,15 @@
+{
+    "compilerOptions": {
+        "declaration": true,
+        "allowJs": true,
+        "declarationDir": "./types",
+        "checkJs": true,
+        "moduleResolution": "Node16",
+        "module": "Node16",
+        "target": "esnext",
+        "emitDeclarationOnly": true,
+        "strict": true
+    },
+    "include": ["./src/graph-table-renderer.js"],
+    "exclude": ["node_modules"]
+}

package/types/graph-table-renderer.d.ts

@@ -0,0 +1,79 @@
+/**
+ * @typedef {Object} HighChartsRenderer
+ * @property {(rows: Rows, options: GTROptions | null, isTable: boolean, widget: any, pivotModel?: PivotModel) => string} rhPivotViewV2
+ */
+/**
+ * @typedef {Object} PivotUtilities
+ * @property {(rows: Rows, options: GTROptions) => PivotModel} getPivotDataModel
+ */
+/**
+ * @typedef {Object} JQuery
+ * @property {PivotUtilities} pivotUtilities
+ */
+/**
+ * @typedef {Object} PivotModel
+ */
+/**
+ * @typedef {Object} RendererOptions
+ * @property {any} hcInstance
+ */
+/**
+ * @typedef {Object} GTROptions
+ * @property {RendererOptions} rendererOptions
+ */
+/**
+ * @typedef {Record<string, Record<string, number | string> | number | string>[]} Rows - BE data response
+ */
+export class GraphTableRenderer {
+    /**
+     *
+     * @param {HighChartsRenderer} hcr
+     * @param {JQuery} $
+     */
+    constructor(hcr: HighChartsRenderer, $: JQuery);
+    /**
+     * Creates Pivot Data Model that works we BE data response to aggregate data to render with Chart and Table
+     * @param {Rows} rows BE data response
+     * @param {GTROptions} options
+     * @returns {this}
+     */
+    createPivotModel(rows: Rows, options: GTROptions): this;
+    /**
+     * @returns {void}
+     */
+    disposePivotModel(): void;
+    /**
+     * @see createPivotModel
+     * @returns {PivotModel | undefined}
+     */
+    getPivotModel(): PivotModel | undefined;
+    /**
+     * @description returns Chart instance of HighCharts library
+     * @returns {any | null}
+     */
+    hcInstance(): any | null;
+    renderTable(widget?: null): string;
+    renderChart(widget?: null): string;
+    #private;
+}
+export default GraphTableRenderer;
+export type HighChartsRenderer = {
+    rhPivotViewV2: (rows: Rows, options: GTROptions | null, isTable: boolean, widget: any, pivotModel?: PivotModel) => string;
+};
+export type PivotUtilities = {
+    getPivotDataModel: (rows: Rows, options: GTROptions) => PivotModel;
+};
+export type JQuery = {
+    pivotUtilities: PivotUtilities;
+};
+export type PivotModel = Object;
+export type RendererOptions = {
+    hcInstance: any;
+};
+export type GTROptions = {
+    rendererOptions: RendererOptions;
+};
+/**
+ * - BE data response
+ */
+export type Rows = Record<string, Record<string, number | string> | number | string>[];

package/types/index.d.ts

@@ -0,0 +1 @@
+export * from './graph-table-renderer';