@datarailsshared/dr_renderer 1.1.41 → 1.2.2

package/src/graph-table-renderer.js

@@ -0,0 +1,147 @@
+/**
+ * @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 {
+    /**
+     * @type {PivotModel | undefined}
+     */
+    #pivotModel;
+
+    /**
+     * @type {GTROptions | null}
+     */
+    #options = null;
+
+    /**
+     * @type {Record<string, Record<string, number | string> | number | string>[]}
+     * 
+     */
+    #rows = [];
+
+    /**
+     * Utility properties
+     */
+    /**
+     * @type {HighChartsRenderer}
+     */
+    #hcr;
+    /**
+     * @type {JQuery}
+     */
+    #$;
+    /**
+     * @type {PivotUtilities}
+     */
+    #pivotUtilities;
+
+    /**
+     * @type {any | null}
+     */
+    #hcInstance = null;
+
+    /**
+     * 
+     * @param {HighChartsRenderer} hcr 
+     * @param {JQuery} $
+     */
+    constructor(hcr, $) {
+        this.#hcr = hcr;
+        this.#$ = $;
+        this.#pivotUtilities = this.#$.pivotUtilities;
+    }
+
+    /**
+     * 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, options) {
+        this.#options = options;
+        this.#rows = rows;
+        this.#pivotModel = this.#pivotUtilities.getPivotDataModel(rows, options);
+        return this;
+    }
+
+    /**
+     * @returns {void}
+     */
+    disposePivotModel() {
+        this.#pivotModel = undefined;
+    }
+
+    /**
+     * @see createPivotModel
+     * @returns {PivotModel | undefined}
+     */
+    getPivotModel() {
+        return this.#pivotModel;
+    }
+
+    /**
+     * @description returns Chart instance of HighCharts library
+     * @returns {any | null}
+     */
+    hcInstance() {
+        return this.#hcInstance;
+    }
+
+    #setHcInstance() {
+        if (!this.#options) {
+            return;
+        }
+        this.#hcInstance = this.#options.rendererOptions.hcInstance;
+        if (!this.#hcInstance) {
+            console.warn('[dr_renderer] HighCharts instance not found in options after the chart is rendered.');
+        }
+        /**
+         * hcInstance object is not needed in options after the chart is rendered - it's an internal object of HighCharts library
+         * Deleting to not supply it to widget object, so it cannot be used anywhere else 
+         */
+        delete this.#options.rendererOptions.hcInstance;
+    }
+
+    renderTable(widget = null) {
+        return this.#hcr.rhPivotViewV2(this.#rows, this.#options, true, widget, this.#pivotModel);
+    }
+
+    renderChart(widget = null) {
+        const chart = this.#hcr.rhPivotViewV2(this.#rows, this.#options, false, widget, this.#pivotModel);
+        setTimeout(() => {
+            this.#setHcInstance();
+        });
+        return chart;
+    }
+}
+
+export default GraphTableRenderer;