@hisptz/dhis2-analytics 1.0.65 → 2.0.0-alpha.0

package/build/es/components/Map/utils/helpers.js

@@ -1,14 +0,0 @@
-// Get the longest text length from an object property in an array
-import L from "leaflet";
-export const getLongestTextLength = (array, key) => array.reduce((text, curr) => curr[key] && String(curr[key]).length > text.length ? String(curr[key]) : text, "").length;
-export function getIconUrl(icon, _ref) {
-  let {
-    baseUrl
-  } = _ref;
-  return `${baseUrl}/images/orgunitgroup/${icon !== null && icon !== void 0 ? icon : "01.png"}`;
-}
-export function getIcon(url) {
-  return new L.Icon({
-    iconUrl: url
-  });
-}

package/build/es/components/Map/utils/map.js

@@ -1,147 +0,0 @@
-import { compact, filter, find, forEach, isEmpty, isString, sortBy } from "lodash";
-import { defaultClasses, defaultColorScaleName, getColorPalette } from "./colors";
-export function highlightFeature(e, style) {
-  const layer = e.target;
-  layer.setStyle(style);
-  // layer.bringToFront();
-}
-
-export function resetHighlight(e, defaultStyle) {
-  const layer = e.target;
-  layer.setStyle(defaultStyle);
-  // layer.bringToBack();
-}
-
-export function getColorFromLegendSet(legends, value) {
-  var _find;
-  if (!value) {
-    return "";
-  }
-  const legend = (_find = find(legends !== null && legends !== void 0 ? legends : [], legend => (legend === null || legend === void 0 ? void 0 : legend.startValue) <= value && (legend === null || legend === void 0 ? void 0 : legend.endValue) >= value)) !== null && _find !== void 0 ? _find : {};
-  return legend.color ? legend.color : "transparent";
-}
-export function getLegendCount(legend, data) {
-  const {
-    startValue,
-    endValue
-  } = legend;
-  return filter(data, d => d.data >= startValue && d.data <= endValue).length;
-}
-export function getOrgUnitsSelection(orgUnitSelection) {
-  var _orgUnitSelection$org, _orgUnitSelection$org2;
-  const orgUnits = [];
-  if (orgUnitSelection.userOrgUnit) {
-    orgUnits.push("USER_ORGUNIT");
-  }
-  if (orgUnitSelection.userSubUnit) {
-    orgUnits.push("USER_ORGUNIT_CHILDREN");
-  }
-  if (orgUnitSelection.userSubX2Unit) {
-    orgUnits.push("USER_ORGUNIT_GRANDCHILDREN");
-  }
-  if (!isEmpty(orgUnitSelection.levels)) {
-    forEach(orgUnitSelection.levels, level => orgUnits.push(`LEVEL-${level}`));
-  }
-  return [...orgUnits, ...((_orgUnitSelection$org = orgUnitSelection === null || orgUnitSelection === void 0 ? void 0 : (_orgUnitSelection$org2 = orgUnitSelection.orgUnits) === null || _orgUnitSelection$org2 === void 0 ? void 0 : _orgUnitSelection$org2.map(ou => `${ou.id}`)) !== null && _orgUnitSelection$org !== void 0 ? _orgUnitSelection$org : [])];
-}
-export function sanitizeOrgUnits(metaData) {
-  if (metaData) {
-    var _metaData$dimensions, _metaData$dimensions$;
-    return metaData === null || metaData === void 0 ? void 0 : (_metaData$dimensions = metaData.dimensions) === null || _metaData$dimensions === void 0 ? void 0 : (_metaData$dimensions$ = _metaData$dimensions.ou) === null || _metaData$dimensions$ === void 0 ? void 0 : _metaData$dimensions$.map(ouId => {
-      var _metaData$items$ouId, _metaData$ouHierarchy;
-      return {
-        id: ouId,
-        name: metaData === null || metaData === void 0 ? void 0 : (_metaData$items$ouId = metaData.items[ouId]) === null || _metaData$items$ouId === void 0 ? void 0 : _metaData$items$ouId.name,
-        path: metaData === null || metaData === void 0 ? void 0 : (_metaData$ouHierarchy = metaData.ouHierarchy) === null || _metaData$ouHierarchy === void 0 ? void 0 : _metaData$ouHierarchy[ouId]
-      };
-    });
-  }
-  return [];
-}
-export function toGeoJson(organisationUnits) {
-  return sortBy(organisationUnits, "le").map(ou => {
-    try {
-      const coord = JSON.parse(ou.co);
-      let gpid = "";
-      let gppg = "";
-      let type = "Point";
-      if (ou.ty === 2) {
-        type = "Polygon";
-        if (ou.co.substring(0, 4) === "[[[[") {
-          type = "MultiPolygon";
-        }
-      }
-
-      // Grand parent
-      if (isString(ou.pg) && ou.pg.length) {
-        const ids = compact(ou.pg.split("/"));
-
-        // Grand parent id
-        if (ids.length >= 2) {
-          gpid = ids[ids.length - 2];
-        }
-
-        // Grand parent parent graph
-        if (ids.length > 2) {
-          gppg = "/" + ids.slice(0, ids.length - 2).join("/");
-        }
-      }
-      return {
-        type: "Feature",
-        id: ou.id,
-        geometry: {
-          type,
-          coordinates: coord
-        },
-        properties: {
-          type,
-          id: ou.id,
-          name: ou.na,
-          hasCoordinatesDown: ou.hcd,
-          hasCoordinatesUp: ou.hcu,
-          level: ou.le,
-          grandParentParentGraph: gppg,
-          grandParentId: gpid,
-          parentGraph: ou.pg,
-          parentId: ou.pi,
-          parentName: ou.pn,
-          dimensions: ou.dimensions
-        }
-      };
-    } catch (e) {
-      return {};
-    }
-  });
-}
-export function sanitizeDate(startDate) {
-  var _startDate$split, _startDate$split$;
-  if ((startDate === null || startDate === void 0 ? void 0 : (_startDate$split = startDate.split("-")) === null || _startDate$split === void 0 ? void 0 : (_startDate$split$ = _startDate$split[0]) === null || _startDate$split$ === void 0 ? void 0 : _startDate$split$.length) < 4) {
-    var _startDate$split2, _startDate$split2$rev;
-    return startDate === null || startDate === void 0 ? void 0 : (_startDate$split2 = startDate.split("-")) === null || _startDate$split2 === void 0 ? void 0 : (_startDate$split2$rev = _startDate$split2.reverse()) === null || _startDate$split2$rev === void 0 ? void 0 : _startDate$split2$rev.join("-");
-  }
-  return startDate;
-}
-export function generateLegends(maxValue, minValue, _ref) {
-  let {
-    classesCount,
-    colorClass
-  } = _ref;
-  const count = classesCount !== null && classesCount !== void 0 ? classesCount : defaultClasses;
-  const color = colorClass !== null && colorClass !== void 0 ? colorClass : defaultColorScaleName;
-  const colorScale = [...getColorPalette(color, count)].reverse();
-  const maxLegendValue = 5 * Math.ceil(maxValue / 5);
-  const range = maxLegendValue / count;
-  const values = [];
-  let legendColorsIterator = colorScale.length - 1;
-  for (let i = 0; i < maxLegendValue; i += range) {
-    const id = colorScale[legendColorsIterator];
-    values.push({
-      startValue: Math.floor(i),
-      endValue: Math.floor(i + range),
-      id,
-      color: id
-    });
-    legendColorsIterator--;
-  }
-  return values.reverse();
-}

package/build/es/components/SingleValueContainer/SingleValueContainer.test.js

@@ -1,20 +0,0 @@
-import { mount } from "@cypress/react";
-import React from "react";
-import { SingleValueContainer } from ".";
-describe("Single Value Container Tests", () => {
-  it("should render", function () {
-    const arg = {
-      title: "PRIORITY INDICATORS",
-      singleValueItems: [{
-        label: "Total Bookings",
-        value: 136
-      }, {
-        label: "At least one dose",
-        value: 45,
-        percentage: 23,
-        color: "#0D47A1"
-      }]
-    };
-    mount( /*#__PURE__*/React.createElement(SingleValueContainer, arg));
-  });
-});

package/build/es/components/SingleValueContainer/components/SingleValueItem/SingleValueItem.js

@@ -1,47 +0,0 @@
-import { Tooltip } from "@dhis2/ui";
-import { capitalize } from "lodash";
-import React from "react";
-import { animated, useSpring } from "react-spring";
-import styles from "../../styles/SingleValueContainer.module.css";
-import SingleValuePercentage from "./SingleValuePercentage";
-export default function SingleValueItem(_ref) {
-  var _ref2, _ref3;
-  let {
-    label,
-    value,
-    color,
-    percentage,
-    animationDuration,
-    animationDelay,
-    globalAnimationDelay,
-    decimalPlaces,
-    globalAnimationDuration
-  } = _ref;
-  const numberFormatter = value => Intl.NumberFormat("en-US", {
-    notation: "compact",
-    maximumFractionDigits: decimalPlaces !== null && decimalPlaces !== void 0 ? decimalPlaces : 1
-  }).format(value);
-  const sanitizedValue = useSpring({
-    val: value,
-    from: {
-      val: 0
-    },
-    config: {
-      duration: (_ref2 = animationDuration !== null && animationDuration !== void 0 ? animationDuration : globalAnimationDuration) !== null && _ref2 !== void 0 ? _ref2 : 1000
-    },
-    delay: (_ref3 = animationDelay !== null && animationDelay !== void 0 ? animationDelay : globalAnimationDelay) !== null && _ref3 !== void 0 ? _ref3 : 10
-  });
-  const tooltipContent = `${label}: ${value}`;
-  return /*#__PURE__*/React.createElement("div", {
-    className: `${styles["single-value-item"]} text-center`
-  }, /*#__PURE__*/React.createElement("div", {
-    className: styles["font-large"]
-  }, label), /*#__PURE__*/React.createElement(Tooltip, {
-    content: capitalize(tooltipContent)
-  }, /*#__PURE__*/React.createElement(animated.div, {
-    className: `${styles["font-bold"]} ${styles["font-xx-large"]} ${styles["padding-top"]}`
-  }, sanitizedValue.val.to(value => numberFormatter(Math.floor(value))))), percentage ? /*#__PURE__*/React.createElement(SingleValuePercentage, {
-    color: color,
-    percentage: percentage
-  }) : /*#__PURE__*/React.createElement("span", null));
-}

package/build/es/components/SingleValueContainer/components/SingleValueItem/SingleValuePercentage.js

@@ -1,17 +0,0 @@
-import { LinearLoader } from "@dhis2/ui";
-import React from "react";
-import styles from "../../styles/SingleValueContainer.module.css";
-export default function SingleValuePercentage(_ref) {
-  let {
-    percentage,
-    color
-  } = _ref;
-  const width = "100%";
-  return /*#__PURE__*/React.createElement("div", {
-    className: "w-100"
-  }, /*#__PURE__*/React.createElement(LinearLoader, {
-    className: styles["percent-value"],
-    width: width,
-    amount: percentage
-  }));
-}

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

@@ -1,30 +0,0 @@
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-import i18n from "@dhis2/d2-i18n";
-import { CssReset } from "@dhis2/ui";
-import React, { Suspense } from "react";
-import SingleValueItem from "./components/SingleValueItem/SingleValueItem";
-import styles from "./styles/SingleValueContainer.module.css";
-export * from "./types/props";
-export function SingleValueContainer(_ref) {
-  let {
-    title,
-    singleValueItems,
-    animationDuration,
-    animationDelay
-  } = _ref;
-  return /*#__PURE__*/React.createElement("div", {
-    className: "w-100 h-100"
-  }, /*#__PURE__*/React.createElement(CssReset, null), /*#__PURE__*/React.createElement(Suspense, {
-    fallback: /*#__PURE__*/React.createElement("div", null, i18n.t("Loading ..."))
-  }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
-    className: `${styles["font-x-large"]} ${styles["font-bold"]}`
-  }, title), /*#__PURE__*/React.createElement("div", {
-    className: styles["single-value-list"]
-  }, singleValueItems.map(singleValueItem => /*#__PURE__*/React.createElement(SingleValueItem, _extends({
-    key: `${singleValueItem.label}-${singleValueItem.value}`
-  }, singleValueItem, {
-    globalAnimationDuration: animationDuration,
-    globalAnimationDelay: animationDelay
-  })))))));
-}
-export { SingleValueItem };

package/build/es/components/SingleValueContainer/styles/SingleValueContainer.module.css

@@ -1,39 +0,0 @@
-.single-value-list {
-    padding: 10px 2px;
-    width: 100%;
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: space-around;
-}
-
-.padding-top {
-    padding-top: 12px;
-}
-
-.percent-value {
-    border-radius: 1rem;
-}
-
-.percent-value div {
-    height: .5rem !important;
-}
-
-.font-large {
-    font-size: 1rem;
-}
-
-.font-x-large {
-    font-size: 1.5rem;
-}
-
-.font-xx-large {
-    font-size: 3rem;
-}
-
-.font-bold {
-    font-weight: bold;
-}
-
-.single-value-item {
-    margin: 0 1vw;
-}

package/build/es/components/SingleValueContainer/types/props.js

@@ -1 +0,0 @@
-export {};

package/build/es/components/Visualization/components/AnalyticsDataProvider/index.js

@@ -1,93 +0,0 @@
-import React, { createContext, useContext, useEffect, useMemo } from "react";
-import { useDimensions } from "../DimensionsProvider";
-import { useDataQuery } from "@dhis2/app-runtime";
-import { useLayout } from "../LayoutProvider";
-import { forEach, set } from "lodash";
-const AnalyticsContext = /*#__PURE__*/createContext(undefined);
-const analyticsQuery = {
-  analytics: {
-    resource: "analytics",
-    params: _ref => {
-      let {
-        dimensions,
-        filters
-      } = _ref;
-      return {
-        dimension: Object.keys(dimensions).map(dimension => {
-          var _dimensions$dimension;
-          return `${dimension}:${(_dimensions$dimension = dimensions[dimension]) === null || _dimensions$dimension === void 0 ? void 0 : _dimensions$dimension.join(';')}`;
-        }),
-        filter: Object.keys(filters).map(dimension => {
-          var _filters$dimension;
-          return `${dimension}:${(_filters$dimension = filters[dimension]) === null || _filters$dimension === void 0 ? void 0 : _filters$dimension.join(';')}`;
-        }),
-        includeMetadataDetails: true
-      };
-    }
-  }
-};
-export function useAnalyticsData() {
-  var _useContext;
-  return (_useContext = useContext(AnalyticsContext)) !== null && _useContext !== void 0 ? _useContext : {
-    analytics: {},
-    loading: false
-  };
-}
-export function AnalyticsDataProvider(_ref2) {
-  let {
-    children
-  } = _ref2;
-  const [analyticsDimensions] = useDimensions();
-  const [layout] = useLayout();
-  const {
-    dimensions,
-    filters
-  } = useMemo(() => {
-    var _layout$columns, _layout$rows, _layout$filters;
-    const dimensions = {};
-    const filters = {};
-    forEach([...((_layout$columns = layout === null || layout === void 0 ? void 0 : layout.columns) !== null && _layout$columns !== void 0 ? _layout$columns : []), ...((_layout$rows = layout === null || layout === void 0 ? void 0 : layout.rows) !== null && _layout$rows !== void 0 ? _layout$rows : [])], dimension => {
-      set(dimensions, [dimension], analyticsDimensions === null || analyticsDimensions === void 0 ? void 0 : analyticsDimensions[dimension]);
-    });
-    forEach([...((_layout$filters = layout === null || layout === void 0 ? void 0 : layout.filters) !== null && _layout$filters !== void 0 ? _layout$filters : [])], dimension => {
-      set(filters, [dimension], analyticsDimensions === null || analyticsDimensions === void 0 ? void 0 : analyticsDimensions[dimension]);
-    });
-    return {
-      dimensions,
-      filters
-    };
-  }, [layout, analyticsDimensions]);
-  console.log({
-    filters
-  });
-  const {
-    data: analytics,
-    error,
-    loading,
-    refetch,
-    called
-  } = useDataQuery(analyticsQuery, {
-    variables: {
-      dimensions,
-      filters
-    },
-    lazy: true
-  });
-  useEffect(() => {
-    refetch({
-      dimensions,
-      filters
-    });
-  }, [dimensions, filters]);
-  useEffect(() => {
-    if (error) {
-      throw error;
-    }
-  }, [error]);
-  return /*#__PURE__*/React.createElement(AnalyticsContext.Provider, {
-    value: {
-      analytics: analytics === null || analytics === void 0 ? void 0 : analytics.analytics,
-      loading
-    }
-  }, children);
-}

package/build/es/components/Visualization/components/DimensionsProvider/index.js

@@ -1,44 +0,0 @@
-import React, { createContext, useContext, useReducer } from "react";
-import { set } from "lodash";
-import { useUpdateEffect } from "usehooks-ts";
-export const DimensionState = /*#__PURE__*/createContext({
-  dx: [],
-  pe: [],
-  ou: []
-});
-export const DimensionUpdateState = /*#__PURE__*/createContext(undefined);
-function reducer(state, _ref) {
-  let {
-    dimension,
-    value
-  } = _ref;
-  const updatedState = {
-    ...(state !== null && state !== void 0 ? state : {})
-  };
-  set(updatedState, [dimension], value);
-  return updatedState;
-}
-export function useDimensions() {
-  return [useContext(DimensionState), useContext(DimensionUpdateState)];
-}
-export function DimensionsProvider(_ref2) {
-  let {
-    children,
-    dimensions
-  } = _ref2;
-  const [state, dispatch] = useReducer(reducer, dimensions);
-  useUpdateEffect(() => {
-    Object.keys(dimensions).forEach(dimension => {
-      var _dimensions$dimension;
-      dispatch({
-        dimension: dimension,
-        value: (_dimensions$dimension = dimensions[dimension]) !== null && _dimensions$dimension !== void 0 ? _dimensions$dimension : []
-      });
-    });
-  }, [dimensions]);
-  return /*#__PURE__*/React.createElement(DimensionState.Provider, {
-    value: state
-  }, /*#__PURE__*/React.createElement(DimensionUpdateState.Provider, {
-    value: dispatch
-  }, children));
-}

package/build/es/components/Visualization/components/LayoutProvider/index.js

@@ -1,20 +0,0 @@
-import React, { createContext, useContext, useState } from "react";
-export const LayoutState = /*#__PURE__*/createContext(undefined);
-export function useLayout() {
-  var _useContext;
-  return [(_useContext = useContext(LayoutState)) !== null && _useContext !== void 0 ? _useContext : {
-    rows: [],
-    filters: [],
-    columns: []
-  }];
-}
-export function LayoutProvider(_ref) {
-  let {
-    defaultLayout,
-    children
-  } = _ref;
-  const [layout, setLayout] = useState(defaultLayout);
-  return /*#__PURE__*/React.createElement(LayoutState.Provider, {
-    value: layout
-  }, children);
-}

package/build/es/components/Visualization/components/VisualizationDimensionSelector/index.js

@@ -1,68 +0,0 @@
-import React, { useCallback, useMemo, useState } from "react";
-import { Button, IconClock24, IconLocation24, Tooltip } from "@dhis2/ui";
-import i18n from '@dhis2/d2-i18n';
-import { useDimensions } from "../DimensionsProvider";
-import { OrgUnitSelectorModal, PeriodSelectorModal } from "@hisptz/dhis2-ui";
-import { getOrgUnitSelectionFromIds } from "../VisualizationSelector";
-import { getOrgUnitsSelection } from "../../../Map/utils/map";
-export function VisualizationDimensionSelector(_ref) {
-  let {
-    showPeriodSelector,
-    showOrgUnitSelector
-  } = _ref;
-  const [dimensions, setDimensions] = useDimensions();
-  const periods = useMemo(() => dimensions.pe, [dimensions.pe]);
-  const orgUnitSelection = useMemo(() => {
-    var _dimensions$ou;
-    return getOrgUnitSelectionFromIds((_dimensions$ou = dimensions.ou) !== null && _dimensions$ou !== void 0 ? _dimensions$ou : []);
-  }, [dimensions.ou]);
-  const [openFilter, setOpenFilter] = useState();
-  const onFilterUpdate = useCallback(type => data => {
-    setOpenFilter(undefined);
-    if (type === "ou") {
-      setDimensions({
-        dimension: "ou",
-        value: getOrgUnitsSelection(data)
-      });
-      return;
-    }
-    if (type === "pe") {
-      setDimensions({
-        dimension: "pe",
-        value: data
-      });
-      return;
-    }
-  }, [setDimensions]);
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
-    style: {
-      display: "flex",
-      gap: 8
-    }
-  }, showPeriodSelector && /*#__PURE__*/React.createElement(Tooltip, {
-    content: i18n.t("Period")
-  }, /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(PeriodSelectorModal, {
-    position: "middle",
-    enablePeriodSelector: true,
-    selectedPeriods: periods,
-    onClose: () => setOpenFilter(undefined),
-    hide: openFilter !== "pe",
-    onUpdate: onFilterUpdate("pe")
-  }), /*#__PURE__*/React.createElement(Button, {
-    onClick: () => setOpenFilter("pe"),
-    icon: /*#__PURE__*/React.createElement(IconClock24, null)
-  }))), showOrgUnitSelector && /*#__PURE__*/React.createElement(Tooltip, {
-    content: i18n.t("Location")
-  }, /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(OrgUnitSelectorModal, {
-    showUserOptions: true,
-    searchable: true,
-    title: i18n.t("Select location(s)"),
-    value: orgUnitSelection,
-    onClose: () => setOpenFilter(undefined),
-    hide: openFilter !== "ou",
-    onUpdate: onFilterUpdate("ou")
-  }), /*#__PURE__*/React.createElement(Button, {
-    onClick: () => setOpenFilter("ou"),
-    icon: /*#__PURE__*/React.createElement(IconLocation24, null)
-  })))));
-}

package/build/es/components/Visualization/components/VisualizationProvider/index.js

@@ -1,22 +0,0 @@
-import React from "react";
-import { LayoutProvider } from "../LayoutProvider";
-import { DimensionsProvider } from "../DimensionsProvider";
-import { AnalyticsDataProvider } from "../AnalyticsDataProvider";
-import { VisualizationTypeProvider } from "../VisualizationTypeProvider";
-export function VisualizationProvider(_ref) {
-  let {
-    layout,
-    dimensions,
-    children,
-    type,
-    config
-  } = _ref;
-  return /*#__PURE__*/React.createElement(DimensionsProvider, {
-    dimensions: dimensions
-  }, /*#__PURE__*/React.createElement(VisualizationTypeProvider, {
-    config: config,
-    defaultType: type
-  }, /*#__PURE__*/React.createElement(LayoutProvider, {
-    defaultLayout: layout
-  }, /*#__PURE__*/React.createElement(AnalyticsDataProvider, null, children))));
-}