@hisptz/dhis2-analytics 1.0.4 → 1.0.6

package/build/es/components/ChartAnalytics/data/stacked-chart-data.json

@@ -0,0 +1,415 @@
+{
+  "headers": [
+    {
+      "name": "ou",
+      "column": "Organisation unit",
+      "valueType": "TEXT",
+      "type": "java.lang.String",
+      "hidden": false,
+      "meta": true
+    },
+    {
+      "name": "pe",
+      "column": "Period",
+      "valueType": "TEXT",
+      "type": "java.lang.String",
+      "hidden": false,
+      "meta": true
+    },
+    {
+      "name": "value",
+      "column": "Value",
+      "valueType": "NUMBER",
+      "type": "java.lang.Double",
+      "hidden": false,
+      "meta": false
+    }
+  ],
+  "metaData": {
+    "items": {
+      "202107": {
+        "name": "July 2021"
+      },
+      "202108": {
+        "name": "August 2021"
+      },
+      "202109": {
+        "name": "September 2021"
+      },
+      "202110": {
+        "name": "October 2021"
+      },
+      "202111": {
+        "name": "November 2021"
+      },
+      "202112": {
+        "name": "December 2021"
+      },
+      "202201": {
+        "name": "January 2022"
+      },
+      "202202": {
+        "name": "February 2022"
+      },
+      "202203": {
+        "name": "March 2022"
+      },
+      "202204": {
+        "name": "April 2022"
+      },
+      "202205": {
+        "name": "May 2022"
+      },
+      "202206": {
+        "name": "June 2022"
+      },
+      "jUb8gELQApl": {
+        "name": "Kailahun"
+      },
+      "PMa2VCrupOd": {
+        "name": "Kambia"
+      },
+      "ou": {
+        "name": "Organisation unit"
+      },
+      "O6uvpzGd5pu": {
+        "name": "Bo"
+      },
+      "eTDtyyaSA7f": {
+        "name": "FIC <1y"
+      },
+      "fdc6uOvgoji": {
+        "name": "Bombali"
+      },
+      "LAST_12_MONTHS": {
+        "name": "Last 12 months"
+      },
+      "dx": {
+        "name": "Data"
+      },
+      "pe": {
+        "name": "Period"
+      },
+      "lc3eMKXaEfw": {
+        "name": "Bonthe"
+      }
+    },
+    "dimensions": {
+      "dx": [
+        "eTDtyyaSA7f"
+      ],
+      "pe": [
+        "202107",
+        "202108",
+        "202109",
+        "202110",
+        "202111",
+        "202112",
+        "202201",
+        "202202",
+        "202203",
+        "202204",
+        "202205",
+        "202206"
+      ],
+      "ou": [
+        "jUb8gELQApl",
+        "PMa2VCrupOd",
+        "O6uvpzGd5pu",
+        "lc3eMKXaEfw",
+        "fdc6uOvgoji"
+      ],
+      "co": []
+    }
+  },
+  "rows": [
+    [
+      "jUb8gELQApl",
+      "202107",
+      "66.0"
+    ],
+    [
+      "jUb8gELQApl",
+      "202108",
+      "80.6"
+    ],
+    [
+      "jUb8gELQApl",
+      "202109",
+      "83.2"
+    ],
+    [
+      "jUb8gELQApl",
+      "202110",
+      "60.1"
+    ],
+    [
+      "jUb8gELQApl",
+      "202111",
+      "78.8"
+    ],
+    [
+      "jUb8gELQApl",
+      "202112",
+      "52.2"
+    ],
+    [
+      "jUb8gELQApl",
+      "202201",
+      "72.7"
+    ],
+    [
+      "jUb8gELQApl",
+      "202202",
+      "85.8"
+    ],
+    [
+      "jUb8gELQApl",
+      "202203",
+      "78.7"
+    ],
+    [
+      "jUb8gELQApl",
+      "202204",
+      "82.9"
+    ],
+    [
+      "jUb8gELQApl",
+      "202205",
+      "82.2"
+    ],
+    [
+      "jUb8gELQApl",
+      "202206",
+      "78.5"
+    ],
+    [
+      "PMa2VCrupOd",
+      "202107",
+      "57.5"
+    ],
+    [
+      "PMa2VCrupOd",
+      "202108",
+      "59.2"
+    ],
+    [
+      "PMa2VCrupOd",
+      "202109",
+      "73.4"
+    ],
+    [
+      "PMa2VCrupOd",
+      "202110",
+      "63.9"
+    ],
+    [
+      "PMa2VCrupOd",
+      "202111",
+      "72.2"
+    ],
+    [
+      "PMa2VCrupOd",
+      "202112",
+      "51.5"
+    ],
+    [
+      "PMa2VCrupOd",
+      "202201",
+      "59.7"
+    ],
+    [
+      "PMa2VCrupOd",
+      "202202",
+      "69.6"
+    ],
+    [
+      "PMa2VCrupOd",
+      "202203",
+      "59.0"
+    ],
+    [
+      "PMa2VCrupOd",
+      "202204",
+      "63.0"
+    ],
+    [
+      "PMa2VCrupOd",
+      "202205",
+      "53.5"
+    ],
+    [
+      "PMa2VCrupOd",
+      "202206",
+      "64.6"
+    ],
+    [
+      "O6uvpzGd5pu",
+      "202107",
+      "70.7"
+    ],
+    [
+      "O6uvpzGd5pu",
+      "202108",
+      "105.6"
+    ],
+    [
+      "O6uvpzGd5pu",
+      "202109",
+      "81.0"
+    ],
+    [
+      "O6uvpzGd5pu",
+      "202110",
+      "104.7"
+    ],
+    [
+      "O6uvpzGd5pu",
+      "202111",
+      "117.0"
+    ],
+    [
+      "O6uvpzGd5pu",
+      "202112",
+      "59.9"
+    ],
+    [
+      "O6uvpzGd5pu",
+      "202201",
+      "58.6"
+    ],
+    [
+      "O6uvpzGd5pu",
+      "202202",
+      "72.0"
+    ],
+    [
+      "O6uvpzGd5pu",
+      "202203",
+      "66.5"
+    ],
+    [
+      "O6uvpzGd5pu",
+      "202204",
+      "71.2"
+    ],
+    [
+      "O6uvpzGd5pu",
+      "202205",
+      "77.9"
+    ],
+    [
+      "O6uvpzGd5pu",
+      "202206",
+      "74.3"
+    ],
+    [
+      "lc3eMKXaEfw",
+      "202107",
+      "88.2"
+    ],
+    [
+      "lc3eMKXaEfw",
+      "202108",
+      "98.1"
+    ],
+    [
+      "lc3eMKXaEfw",
+      "202109",
+      "112.7"
+    ],
+    [
+      "lc3eMKXaEfw",
+      "202111",
+      "96.2"
+    ],
+    [
+      "lc3eMKXaEfw",
+      "202201",
+      "58.5"
+    ],
+    [
+      "lc3eMKXaEfw",
+      "202202",
+      "71.5"
+    ],
+    [
+      "lc3eMKXaEfw",
+      "202203",
+      "65.8"
+    ],
+    [
+      "lc3eMKXaEfw",
+      "202204",
+      "71.5"
+    ],
+    [
+      "lc3eMKXaEfw",
+      "202205",
+      "70.8"
+    ],
+    [
+      "lc3eMKXaEfw",
+      "202206",
+      "72.6"
+    ],
+    [
+      "fdc6uOvgoji",
+      "202107",
+      "75.7"
+    ],
+    [
+      "fdc6uOvgoji",
+      "202108",
+      "76.6"
+    ],
+    [
+      "fdc6uOvgoji",
+      "202109",
+      "83.2"
+    ],
+    [
+      "fdc6uOvgoji",
+      "202110",
+      "69.8"
+    ],
+    [
+      "fdc6uOvgoji",
+      "202112",
+      "119.6"
+    ],
+    [
+      "fdc6uOvgoji",
+      "202201",
+      "75.4"
+    ],
+    [
+      "fdc6uOvgoji",
+      "202202",
+      "80.3"
+    ],
+    [
+      "fdc6uOvgoji",
+      "202203",
+      "71.7"
+    ],
+    [
+      "fdc6uOvgoji",
+      "202204",
+      "77.9"
+    ],
+    [
+      "fdc6uOvgoji",
+      "202205",
+      "76.5"
+    ],
+    [
+      "fdc6uOvgoji",
+      "202206",
+      "76.1"
+    ]
+  ],
+  "height": 57,
+  "width": 3,
+  "headerWidth": 3
+}

package/build/es/components/ChartAnalytics/hooks/useChart.js

@@ -0,0 +1,32 @@
+import { useCallback, useEffect, useState } from "react";
+import { getChartInstance, updateLayout } from "../utils/chart";
+export function useChart(_ref) {
+  let {
+    id,
+    analytics,
+    config
+  } = _ref;
+  const [chart, setChart] = useState(getChartInstance(id, analytics, config).getOptions());
+  const changeChartType = useCallback(type => {
+    const updatedLayout = updateLayout(config, {
+      type
+    });
+    const updatedConfig = {
+      ...config,
+      layout: updatedLayout,
+      type
+    };
+    const chartInstance = getChartInstance(id, analytics, updatedConfig);
+    setChart(chartInstance.getOptions());
+  }, [config, id, analytics]);
+  useEffect(() => {
+    if (analytics && config) {
+      const chartInstance = getChartInstance(id, analytics, config);
+      setChart(chartInstance.getOptions());
+    }
+  }, [analytics, config, id]);
+  return {
+    chart,
+    changeChartType
+  };
+}

package/build/es/components/ChartAnalytics/index.js

@@ -0,0 +1,40 @@
+import { uid } from "@hisptz/dhis2-utils";
+import HighCharts from "highcharts";
+import HighchartsReact from "highcharts-react-official";
+import React, { forwardRef, useRef } from "react";
+import ChartDownloadMenu from "./components/DownloadMenu";
+import { useChart } from "./hooks/useChart";
+import "./styles/custom-highchart.css";
+export * from "./services/export";
+export { ChartDownloadMenu };
+function ChartAnalytics(_ref, ref) {
+  let {
+    analytics,
+    config,
+    containerProps
+  } = _ref;
+  const id = useRef(`${uid()}-chart-item`);
+  const {
+    chart
+  } = useChart({
+    id: id.current,
+    analytics,
+    config
+  });
+  if (!chart) {
+    return null;
+  }
+  return /*#__PURE__*/React.createElement(HighchartsReact, {
+    immutable: true,
+    ref: ref,
+    containerProps: {
+      id: id.current,
+      ...(containerProps !== null && containerProps !== void 0 ? containerProps : {})
+    },
+    highcharts: HighCharts,
+    options: {
+      ...chart
+    }
+  });
+}
+export default /*#__PURE__*/forwardRef(ChartAnalytics);

package/build/es/components/ChartAnalytics/models/column.js

@@ -0,0 +1,45 @@
+import { getAllCategories, getPointSeries } from "../utils/chart";
+import { DHIS2Chart } from "./index";
+export class DHIS2ColumnChart extends DHIS2Chart {
+  getCategories() {
+    return undefined;
+  }
+  getHighchartsType() {
+    return "column";
+  }
+  getPlotOptions() {
+    return {
+      column: {
+        dataLabels: {
+          enabled: true
+        }
+      }
+    };
+  }
+  getSeries() {
+    return getPointSeries(this.analytics, this.config, "column");
+  }
+  getXAxis() {
+    return {
+      type: "category",
+      categories: getAllCategories(this.analytics, this.config),
+      crosshair: true,
+      labels: {
+        enabled: true
+      },
+      title: {
+        text: ""
+      }
+    };
+  }
+}
+export class DHIS2StackedColumnChart extends DHIS2ColumnChart {
+  getPlotOptions() {
+    return {
+      column: {
+        stacking: "normal",
+        ...super.getPlotOptions().column
+      }
+    };
+  }
+}

package/build/es/components/ChartAnalytics/models/index.js

@@ -0,0 +1,95 @@
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+export class DHIS2Chart {
+  constructor(id, analytics, config) {
+    _defineProperty(this, "id", void 0);
+    _defineProperty(this, "analytics", void 0);
+    _defineProperty(this, "config", void 0);
+    this.id = id;
+    this.analytics = analytics;
+    this.config = config;
+  }
+  getChartConfig() {
+    var _this$config;
+    return {
+      renderTo: this.id,
+      zoomType: "xy",
+      type: this.getHighchartsType(),
+      height: (_this$config = this.config) === null || _this$config === void 0 ? void 0 : _this$config.height,
+      styledMode: false
+    };
+  }
+  getOptions() {
+    var _this$config$colors, _this$config2, _this$config$highChar, _this$config3;
+    return {
+      yAxis: this.getYAxis(),
+      chart: this.getChartConfig(),
+      colors: (_this$config$colors = (_this$config2 = this.config) === null || _this$config2 === void 0 ? void 0 : _this$config2.colors) !== null && _this$config$colors !== void 0 ? _this$config$colors : ["#2f7ed8", "#0d233a", "#8bbc21", "#910000", "#1aadce", "#492970", "#f28f43", "#77a1e5", "#c42525", "#a6c96a"],
+      series: this.getSeries(),
+      plotOptions: this.getPlotOptions(),
+      title: {
+        text: ""
+      },
+      xAxis: this.getXAxis(),
+      exporting: this.getExporting(),
+      legend: {
+        enabled: true
+      },
+      credits: {
+        enabled: false
+      },
+      ...((_this$config$highChar = (_this$config3 = this.config) === null || _this$config3 === void 0 ? void 0 : _this$config3.highChartOverrides) !== null && _this$config$highChar !== void 0 ? _this$config$highChar : {})
+    };
+  }
+  getYAxis() {
+    return [{
+      title: {
+        text: "",
+        style: {
+          color: "#000000",
+          fontWeight: "normal",
+          fontSize: "14px"
+        }
+      },
+      labels: {
+        enabled: true,
+        style: {
+          color: "#000000",
+          fontWeight: "normal",
+          fontSize: "14px"
+        }
+      },
+      plotLines: [{
+        color: "#000000",
+        dashStyle: "Solid",
+        width: 2,
+        zIndex: 1000,
+        label: {
+          text: ""
+        }
+      }, {
+        color: "#bbbbbb",
+        dashStyle: "Solid",
+        zIndex: 1000,
+        width: 2,
+        label: {
+          text: ""
+        }
+      }]
+    }];
+  }
+  getExporting() {
+    var _this$config$name, _this$config4;
+    const name = (_this$config$name = (_this$config4 = this.config) === null || _this$config4 === void 0 ? void 0 : _this$config4.name) !== null && _this$config$name !== void 0 ? _this$config$name : "chart";
+    return {
+      filename: `${name}`,
+      sourceWidth: 1200,
+      buttons: {
+        contextButton: {
+          enabled: false
+        }
+      }
+    };
+  }
+}

package/build/es/components/ChartAnalytics/models/line.js

@@ -0,0 +1,28 @@
+import { getAllCategories, getPointSeries } from "../utils/chart";
+import { DHIS2Chart } from "./index";
+export class DHIS2LineChart extends DHIS2Chart {
+  getHighchartsType() {
+    return "line";
+  }
+  getPlotOptions() {
+    return {
+      line: {}
+    };
+  }
+  getSeries() {
+    return getPointSeries(this.analytics, this.config, "line");
+  }
+  getXAxis() {
+    return {
+      type: "category",
+      categories: getAllCategories(this.analytics, this.config),
+      crosshair: true,
+      labels: {
+        enabled: true
+      },
+      title: {
+        text: ""
+      }
+    };
+  }
+}