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

package/build/es/components/Map/components/ThematicLayerConfiguration/components/CustomLegend/index.js

@@ -1,64 +0,0 @@
-import { Controller, useWatch } from "react-hook-form";
-import { Field, SingleSelectField, SingleSelectOption } from "@dhis2/ui";
-import { defaultClasses, defaultColorScaleName } from "../../../../utils/colors";
-import i18n from "@dhis2/d2-i18n";
-import ColorScaleSelect from "../ColorScaleSelect";
-import React from "react";
-export function CustomLegend() {
-  const scale = useWatch({
-    name: "dataItem.legendConfig.scale"
-  });
-  return /*#__PURE__*/React.createElement("div", {
-    className: "row gap-16 space-between"
-  }, /*#__PURE__*/React.createElement("div", {
-    style: {
-      width: "30%"
-    }
-  }, /*#__PURE__*/React.createElement(Controller, {
-    name: "dataItem.legendConfig.scale",
-    render: _ref => {
-      var _fieldState$error, _field$value$toString, _field$value;
-      let {
-        field,
-        fieldState
-      } = _ref;
-      return /*#__PURE__*/React.createElement(SingleSelectField, {
-        validationText: (_fieldState$error = fieldState.error) === null || _fieldState$error === void 0 ? void 0 : _fieldState$error.message,
-        error: Boolean(fieldState.error),
-        selected: (_field$value$toString = (_field$value = field.value) === null || _field$value === void 0 ? void 0 : _field$value.toString()) !== null && _field$value$toString !== void 0 ? _field$value$toString : defaultClasses.toString(),
-        label: i18n.t("Classes"),
-        onChange: _ref2 => {
-          let {
-            selected
-          } = _ref2;
-          return field.onChange(parseInt(selected));
-        },
-        name: "scale"
-      }, [3, 4, 5, 6, 7, 8, 9].map(value => /*#__PURE__*/React.createElement(SingleSelectOption, {
-        key: `${value}-classes-option`,
-        label: `${value}`,
-        value: value === null || value === void 0 ? void 0 : value.toString()
-      })));
-    }
-  })), /*#__PURE__*/React.createElement("div", {
-    style: {
-      width: "70%"
-    }
-  }, /*#__PURE__*/React.createElement(Controller, {
-    name: "dataItem.legendConfig.colorClass",
-    render: _ref3 => {
-      var _field$value2;
-      let {
-        field
-      } = _ref3;
-      return /*#__PURE__*/React.createElement(Field, {
-        label: i18n.t("Colors")
-      }, /*#__PURE__*/React.createElement(ColorScaleSelect, {
-        count: scale !== null && scale !== void 0 ? scale : defaultClasses,
-        colorClass: (_field$value2 = field.value) !== null && _field$value2 !== void 0 ? _field$value2 : defaultColorScaleName,
-        width: 300,
-        onChange: field.onChange
-      }));
-    }
-  })));
-}

package/build/es/components/Map/components/ThematicLayerConfiguration/components/IndicatorSelectorModal/index.js

@@ -1,38 +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 { Button, ButtonStrip, Modal, ModalActions, ModalContent, ModalTitle } from "@dhis2/ui";
-import React, { useCallback, useState } from "react";
-import { DataSourceSelector } from "@hisptz/dhis2-ui";
-export default function IndicatorSelectorModal(_ref) {
-  let {
-    onUpdate,
-    onClose,
-    hide,
-    selected,
-    disabled,
-    ...props
-  } = _ref;
-  const [selectedIndicators, setSelectedIndicators] = useState(selected);
-  const onUpdateClick = useCallback(() => {
-    onUpdate(selectedIndicators);
-    onClose();
-  }, [onUpdate, selectedIndicators]);
-  const onSelect = useCallback(indicators => {
-    setSelectedIndicators(indicators);
-  }, []);
-  return /*#__PURE__*/React.createElement(Modal, {
-    placement: "middle",
-    hide: hide,
-    onClose: onClose
-  }, /*#__PURE__*/React.createElement(ModalTitle, null, i18n.t("Select Data Item")), /*#__PURE__*/React.createElement(ModalContent, null, /*#__PURE__*/React.createElement(DataSourceSelector, _extends({}, props, {
-    disabled: disabled,
-    maxSelections: 1,
-    selected: selectedIndicators,
-    onSelect: onSelect
-  }))), /*#__PURE__*/React.createElement(ModalActions, null, /*#__PURE__*/React.createElement(ButtonStrip, null, /*#__PURE__*/React.createElement(Button, {
-    onClick: onClose
-  }, i18n.t("Cancel")), /*#__PURE__*/React.createElement(Button, {
-    primary: true,
-    onClick: onUpdateClick
-  }, i18n.t("Update")))));
-}

package/build/es/components/Map/components/ThematicLayerConfiguration/components/LegendSetSelector/index.js

@@ -1,70 +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 { useDataQuery } from "@dhis2/app-runtime";
-import React, { useMemo } from "react";
-import { SingleSelectField, SingleSelectOption } from "@dhis2/ui";
-import i18n from "@dhis2/d2-i18n";
-import { isEmpty } from "lodash";
-const legendSetQuery = {
-  legendSets: {
-    resource: "legendSets",
-    params: {
-      fields: ["displayName", "id"]
-    }
-  }
-};
-export function LegendSetSelector(_ref) {
-  let {
-    selected,
-    onChange,
-    error,
-    required,
-    ...props
-  } = _ref;
-  const {
-    loading,
-    data
-  } = useDataQuery(legendSetQuery);
-  const options = useMemo(() => {
-    if (data) {
-      var _data$legendSets, _data$legendSets$lege;
-      return data === null || data === void 0 ? void 0 : (_data$legendSets = data.legendSets) === null || _data$legendSets === void 0 ? void 0 : (_data$legendSets$lege = _data$legendSets.legendSets) === null || _data$legendSets$lege === void 0 ? void 0 : _data$legendSets$lege.map(_ref2 => {
-        let {
-          displayName,
-          id
-        } = _ref2;
-        return {
-          label: displayName,
-          value: id
-        };
-      });
-    }
-    return [];
-  }, [data]);
-  return /*#__PURE__*/React.createElement(SingleSelectField, _extends({
-    required: required,
-    error: Boolean(error),
-    validationText: error === null || error === void 0 ? void 0 : error.message
-  }, props, {
-    label: i18n.t("Legend set"),
-    filterable: true,
-    selected: !isEmpty(options) ? selected : undefined,
-    loadingText: i18n.t("Please wait..."),
-    onChange: _ref3 => {
-      let {
-        selected
-      } = _ref3;
-      return onChange(selected);
-    },
-    loading: loading
-  }), options === null || options === void 0 ? void 0 : options.map(_ref4 => {
-    let {
-      label,
-      value
-    } = _ref4;
-    return /*#__PURE__*/React.createElement(SingleSelectOption, {
-      key: `${label}-legend-option`,
-      label: label,
-      value: value
-    });
-  }));
-}

package/build/es/components/Map/components/ThematicLayerConfiguration/index.js

@@ -1,254 +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 { Button, ButtonStrip, Field, InputField, Modal, ModalActions, ModalContent, ModalTitle, Radio, SingleSelectField, SingleSelectOption } from "@dhis2/ui";
-import { Controller, FormProvider, useForm, useFormContext, useWatch } from "react-hook-form";
-import React, { useMemo, useState } from "react";
-import { compact } from "lodash";
-import { defaultClasses, defaultColorScaleName } from "../../utils/colors";
-import IndicatorSelectorModal from "./components/IndicatorSelectorModal";
-import { LegendSetSelector } from "./components/LegendSetSelector";
-import { CustomLegend } from "./components/CustomLegend";
-export function RadiusField() {
-  return /*#__PURE__*/React.createElement("div", {
-    className: "row gap-8"
-  }, /*#__PURE__*/React.createElement(Controller, {
-    render: _ref => {
-      var _fieldState$error, _field$value;
-      let {
-        field,
-        fieldState
-      } = _ref;
-      return /*#__PURE__*/React.createElement(InputField, _extends({}, field, {
-        error: Boolean(fieldState.error),
-        validationText: (_fieldState$error = fieldState.error) === null || _fieldState$error === void 0 ? void 0 : _fieldState$error.message,
-        value: (_field$value = field.value) === null || _field$value === void 0 ? void 0 : _field$value.toString(),
-        onChange: _ref2 => {
-          let {
-            value
-          } = _ref2;
-          return field.onChange(parseInt(value));
-        },
-        label: i18n.t("Min"),
-        type: "number"
-      }));
-    },
-    name: "radius.min"
-  }), /*#__PURE__*/React.createElement(Controller, {
-    render: _ref3 => {
-      var _field$value2;
-      let {
-        field,
-        fieldState
-      } = _ref3;
-      return /*#__PURE__*/React.createElement(InputField, {
-        value: (_field$value2 = field.value) === null || _field$value2 === void 0 ? void 0 : _field$value2.toString(),
-        onChange: _ref4 => {
-          let {
-            value
-          } = _ref4;
-          return field.onChange(parseInt(value));
-        },
-        label: i18n.t("Max"),
-        type: "number"
-      });
-    },
-    name: "radius.max"
-  }));
-}
-function TypeField() {
-  const {
-    setValue
-  } = useFormContext();
-  const resetFields = type => {
-    if (type === "bubble") {
-      setValue(`radius`, {
-        min: 5,
-        max: 30
-      });
-    } else {
-      setValue(`radius`, undefined);
-    }
-  };
-  return /*#__PURE__*/React.createElement(Controller, {
-    rules: {
-      required: i18n.t("Layer type is required")
-    },
-    render: _ref5 => {
-      var _fieldState$error2;
-      let {
-        field,
-        fieldState
-      } = _ref5;
-      return /*#__PURE__*/React.createElement(SingleSelectField, {
-        label: i18n.t("Layer type"),
-        required: true,
-        error: Boolean(fieldState.error),
-        validationText: (_fieldState$error2 = fieldState.error) === null || _fieldState$error2 === void 0 ? void 0 : _fieldState$error2.message,
-        onChange: _ref6 => {
-          let {
-            selected
-          } = _ref6;
-          resetFields(selected);
-          field.onChange(selected);
-        },
-        selected: field.value
-      }, /*#__PURE__*/React.createElement(SingleSelectOption, {
-        value: "choropleth",
-        label: i18n.t("Choropleth")
-      }), /*#__PURE__*/React.createElement(SingleSelectOption, {
-        value: "bubble",
-        label: i18n.t("Bubble")
-      }));
-    },
-    name: "type"
-  });
-}
-export function ThematicLayerConfiguration(_ref7) {
-  let {
-    exclude,
-    form
-  } = _ref7;
-  const [type, legendSet, dataItemId] = useWatch({
-    control: form.control,
-    name: ["type", "dataItem.legendSet", "dataItem.id"]
-  });
-  const [legendType, setLegendType] = useState(legendSet ? "legendSet" : "custom");
-  const [dataSelectorOpen, setDataSelectorOpen] = useState(false);
-  const onLegendTypeChange = type => _ref8 => {
-    let {
-      value
-    } = _ref8;
-    if (type === "custom") {
-      form.setValue("dataItem.legendSet", undefined);
-      form.setValue("dataItem.legendConfig.scale", defaultClasses);
-      form.setValue("dataItem.legendConfig.colorClass", defaultColorScaleName);
-    } else {
-      form.setValue("dataItem.legendConfig", undefined);
-    }
-    setLegendType(value);
-  };
-  const disabled = useMemo(() => {
-    var _exclude$filter;
-    return (_exclude$filter = exclude === null || exclude === void 0 ? void 0 : exclude.filter(indicator => indicator !== dataItemId)) !== null && _exclude$filter !== void 0 ? _exclude$filter : [];
-  }, [dataItemId, exclude]);
-  return /*#__PURE__*/React.createElement(FormProvider, form, /*#__PURE__*/React.createElement("div", {
-    className: "column gap-16"
-  }, /*#__PURE__*/React.createElement(TypeField, null), /*#__PURE__*/React.createElement(Controller, {
-    rules: {
-      validate: {
-        required: value => {
-          return Boolean(value === null || value === void 0 ? void 0 : value.id) || i18n.t("A data item is required");
-        }
-      }
-    },
-    render: _ref9 => {
-      var _fieldState$error3, _field$value3, _field$value4, _field$value5, _field$value6;
-      let {
-        field,
-        fieldState
-      } = _ref9;
-      return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
-        style: {
-          alignItems: "flex-end"
-        },
-        className: "row w-100 gap-16 align-end"
-      }, /*#__PURE__*/React.createElement("div", {
-        onClick: () => setDataSelectorOpen(true),
-        style: {
-          flex: 1
-        }
-      }, /*#__PURE__*/React.createElement(InputField, {
-        required: true,
-        error: Boolean(fieldState.error),
-        validationText: (_fieldState$error3 = fieldState.error) === null || _fieldState$error3 === void 0 ? void 0 : _fieldState$error3.message,
-        disabled: true,
-        inputWidth: "100%",
-        label: i18n.t("Data Item"),
-        value: (_field$value3 = field.value) === null || _field$value3 === void 0 ? void 0 : _field$value3.displayName
-      })), /*#__PURE__*/React.createElement(Button, {
-        onClick: () => setDataSelectorOpen(true)
-      }, (_field$value4 = field.value) !== null && _field$value4 !== void 0 && _field$value4.id ? i18n.t("Change") : i18n.t("Select"))), dataSelectorOpen && /*#__PURE__*/React.createElement(IndicatorSelectorModal, {
-        disabled: disabled,
-        onUpdate: values => {
-          const [indicator] = values !== null && values !== void 0 ? values : [];
-          field.onChange({
-            id: indicator.id,
-            displayName: indicator.displayName,
-            type: "indicator"
-          });
-        },
-        onClose: () => setDataSelectorOpen(false),
-        hide: !dataSelectorOpen,
-        selected: compact([{
-          id: (_field$value5 = field.value) === null || _field$value5 === void 0 ? void 0 : _field$value5.id,
-          displayName: (_field$value6 = field.value) === null || _field$value6 === void 0 ? void 0 : _field$value6.displayName
-        }])
-      }));
-    },
-    name: "dataItem"
-  }), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Field, {
-    label: i18n.t("Legend")
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "column gap-8"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "row gap-16"
-  }, /*#__PURE__*/React.createElement(Radio, {
-    checked: legendType === "legendSet",
-    label: i18n.t("Legend set"),
-    name: "legendSet",
-    value: "legendSet",
-    onChange: onLegendTypeChange("legendSet")
-  }), /*#__PURE__*/React.createElement(Radio, {
-    checked: legendType === "custom",
-    label: i18n.t("Custom legend"),
-    name: "custom",
-    value: "custom",
-    onChange: onLegendTypeChange("custom")
-  })), /*#__PURE__*/React.createElement("div", null, legendType === "legendSet" && /*#__PURE__*/React.createElement(Controller, {
-    rules: {
-      required: i18n.t("Legend set is required")
-    },
-    name: "dataItem.legendSet",
-    render: _ref10 => {
-      let {
-        field,
-        fieldState
-      } = _ref10;
-      return /*#__PURE__*/React.createElement(LegendSetSelector, _extends({
-        required: true,
-        selected: field.value
-      }, field, fieldState));
-    }
-  }), legendType === "custom" && /*#__PURE__*/React.createElement(CustomLegend, null)))), type === "bubble" && /*#__PURE__*/React.createElement(Field, {
-    label: i18n.t("Radius")
-  }, /*#__PURE__*/React.createElement(RadiusField, null)))));
-}
-export function ThematicLayerConfigModal(_ref11) {
-  let {
-    open,
-    exclude,
-    config,
-    onClose,
-    onChange,
-    ...props
-  } = _ref11;
-  const form = useForm({
-    defaultValues: config
-  });
-  const onSubmitClick = values => {
-    onChange(values);
-    onClose();
-  };
-  return /*#__PURE__*/React.createElement(Modal, _extends({}, props, {
-    open: open,
-    onClose: onClose
-  }), /*#__PURE__*/React.createElement(ModalTitle, null, i18n.t("Configure Thematic Layer")), /*#__PURE__*/React.createElement(ModalContent, null, /*#__PURE__*/React.createElement(ThematicLayerConfiguration, {
-    form: form,
-    exclude: exclude
-  })), /*#__PURE__*/React.createElement(ModalActions, null, /*#__PURE__*/React.createElement(ButtonStrip, null, /*#__PURE__*/React.createElement(Button, {
-    onClick: onClose
-  }, i18n.t("Cancel")), /*#__PURE__*/React.createElement(Button, {
-    primary: true,
-    onClick: form.handleSubmit(onSubmitClick)
-  }, i18n.t("Save")))));
-}