@dhis2/analytics 26.4.0 → 26.5.0

package/build/es/components/Interpretations/common/Interpretation/Interpretation.js

@@ -16,7 +16,8 @@ export const Interpretation = _ref => {
     disabled,
     onReplyIconClick,
     dashboardRedirectUrl,
-    isInThread
+    isInThread,
+    onLikeToggled
   } = _ref;
   const [isUpdateMode, setIsUpdateMode] = useState(false);
   const [showSharingDialog, setShowSharingDialog] = useState(false);
@@ -27,7 +28,10 @@ export const Interpretation = _ref => {
   } = useLike({
     interpretation,
     currentUser,
-    onComplete: onUpdated
+    onComplete: likedBy => onLikeToggled({
+      id: interpretation.id,
+      likedBy
+    })
   });
   const shouldShowButton = Boolean(!!onClick && !disabled & !dashboardRedirectUrl);
   const interpretationAccess = getInterpretationAccess(interpretation, currentUser);
@@ -113,6 +117,7 @@ Interpretation.propTypes = {
   currentUser: PropTypes.object.isRequired,
   interpretation: PropTypes.object.isRequired,
   onDeleted: PropTypes.func.isRequired,
+  onLikeToggled: PropTypes.func.isRequired,
   onReplyIconClick: PropTypes.func.isRequired,
   onUpdated: PropTypes.func.isRequired,
   dashboardRedirectUrl: PropTypes.string,

package/build/es/components/Interpretations/common/Interpretation/useLike.js

@@ -18,12 +18,22 @@ const useLike = _ref => {
   const [like, {
     loading: likeLoading
   }] = useDataMutation(likeMutationRef.current, {
-    onComplete
+    onComplete: () => {
+      const newLikedBy = interpretation.likedBy.concat({
+        id: currentUser.id
+      });
+      setIsLikedByCurrentUser(true);
+      onComplete(newLikedBy);
+    }
   });
   const [unlike, {
     loading: unlikeLoading
   }] = useDataMutation(unlikeMutationRef.current, {
-    onComplete
+    onComplete: () => {
+      const newLikedBy = interpretation.likedBy.filter(lb => lb.id !== currentUser.id);
+      setIsLikedByCurrentUser(false);
+      onComplete(newLikedBy);
+    }
   });
   const [isLikedByCurrentUser, setIsLikedByCurrentUser] = useState(false);
   const toggleLike = () => {

package/build/es/components/PeriodDimension/PeriodDimension.js

@@ -16,7 +16,8 @@ const PeriodDimension = _ref => {
     onSelect,
     selectedPeriods,
     rightFooter,
-    excludedPeriodTypes
+    excludedPeriodTypes,
+    infoBoxMessage
   } = _ref;
   const {
     systemInfo
@@ -44,7 +45,8 @@ const PeriodDimension = _ref => {
   };
   return /*#__PURE__*/React.createElement(PeriodTransfer, {
     onSelect: selectPeriods,
-    initialSelectedPeriods: selectedPeriods,
+    selectedItems: selectedPeriods,
+    infoBoxMessage: infoBoxMessage,
     rightFooter: rightFooter,
     dataTest: 'period-dimension',
     excludedPeriodTypes: excludedPeriodTypes,
@@ -54,6 +56,7 @@ const PeriodDimension = _ref => {
 PeriodDimension.propTypes = {
   onSelect: PropTypes.func.isRequired,
   excludedPeriodTypes: PropTypes.arrayOf(PropTypes.string),
+  infoBoxMessage: PropTypes.string,
   rightFooter: PropTypes.node,
   selectedPeriods: PropTypes.array
 };

package/build/es/components/PeriodDimension/PeriodTransfer.js

@@ -1,7 +1,7 @@
 import _JSXStyle from "styled-jsx/style";
 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 { getNowInCalendar } from '@dhis2/multi-calendar-dates';
-import { TabBar, Tab, Transfer } from '@dhis2/ui';
+import { IconInfo16, TabBar, Tab, Transfer } from '@dhis2/ui';
 import PropTypes from 'prop-types';
 import React, { useState } from 'react';
 import PeriodIcon from '../../assets/DimensionItemIcons/PeriodIcon.js'; //TODO: Reimplement the icon.js
@@ -14,15 +14,35 @@ import RelativePeriodFilter from './RelativePeriodFilter.js';
 import { getFixedPeriodsOptionsById } from './utils/fixedPeriods.js';
 import { MONTHLY, QUARTERLY } from './utils/index.js';
 import { getRelativePeriodsOptionsById } from './utils/relativePeriods.js';
-const PeriodTransfer = _ref => {
+const RightHeader = _ref => {
+  let {
+    infoBoxMessage
+  } = _ref;
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("p", {
+    className: `jsx-${styles.__hash}` + " " + "rightHeader"
+  }, i18n.t('Selected Periods')), infoBoxMessage && /*#__PURE__*/React.createElement("div", {
+    className: `jsx-${styles.__hash}` + " " + "info-container"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: `jsx-${styles.__hash}`
+  }, /*#__PURE__*/React.createElement(IconInfo16, null)), /*#__PURE__*/React.createElement("span", {
+    className: `jsx-${styles.__hash}` + " " + "info-text"
+  }, infoBoxMessage)), /*#__PURE__*/React.createElement(_JSXStyle, {
+    id: styles.__hash
+  }, styles));
+};
+RightHeader.propTypes = {
+  infoBoxMessage: PropTypes.string
+};
+const PeriodTransfer = _ref2 => {
   let {
     onSelect,
     dataTest,
-    initialSelectedPeriods,
+    selectedItems,
     rightFooter,
     excludedPeriodTypes,
-    periodsSettings
-  } = _ref;
+    periodsSettings,
+    infoBoxMessage
+  } = _ref2;
   const defaultRelativePeriodType = excludedPeriodTypes.includes(MONTHLY) ? getRelativePeriodsOptionsById(QUARTERLY) : getRelativePeriodsOptionsById(MONTHLY);
   const defaultFixedPeriodType = excludedPeriodTypes.includes(MONTHLY) ? getFixedPeriodsOptionsById(QUARTERLY, periodsSettings) : getFixedPeriodsOptionsById(MONTHLY, periodsSettings);
   const now = getNowInCalendar(periodsSettings.calendar);
@@ -35,7 +55,6 @@ const PeriodTransfer = _ref => {
     reversePeriods: false
   });
   const [allPeriods, setAllPeriods] = useState(defaultRelativePeriodType.getPeriods());
-  const [selectedPeriods, setSelectedPeriods] = useState(initialSelectedPeriods);
   const [isRelative, setIsRelative] = useState(true);
   const [relativeFilter, setRelativeFilter] = useState({
     periodType: defaultRelativePeriodType.id
@@ -44,6 +63,10 @@ const PeriodTransfer = _ref => {
     periodType: defaultFixedPeriodType.id,
     year: defaultFixedPeriodYear.toString()
   });
+  const isActive = value => {
+    const item = selectedItems.find(item => item.id === value);
+    return !item || item.isActive;
+  };
   const onIsRelativeClick = state => {
     if (state !== isRelative) {
       setIsRelative(state);
@@ -90,11 +113,6 @@ const PeriodTransfer = _ref => {
   })), /*#__PURE__*/React.createElement(_JSXStyle, {
     id: styles.__hash
   }, styles));
-  const renderRightHeader = () => /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("p", {
-    className: `jsx-${styles.__hash}` + " " + "rightHeader"
-  }, i18n.t('Selected Periods')), /*#__PURE__*/React.createElement(_JSXStyle, {
-    id: styles.__hash
-  }, styles));
   const onSelectFixedPeriods = filter => {
     setFixedFilter(filter);
     setAllPeriods(getFixedPeriodsOptionsById(filter.periodType, periodsSettings).getPeriods(fixedPeriodConfig(Number(filter.year)), periodsSettings));
@@ -105,45 +123,58 @@ const PeriodTransfer = _ref => {
     id: styles.__hash
   }, styles));
   return /*#__PURE__*/React.createElement(Transfer, {
-    onChange: _ref2 => {
+    onChange: _ref3 => {
       let {
         selected
-      } = _ref2;
-      const formattedItems = selected.map(id => ({
-        id,
-        name: [...allPeriods, ...selectedPeriods].find(item => item.id === id).name
-      }));
-      setSelectedPeriods(formattedItems);
+      } = _ref3;
+      const formattedItems = selected.map(id => {
+        const matchingItem = [...allPeriods, ...selectedItems].find(item => item.id === id);
+        return {
+          id,
+          name: matchingItem.name,
+          isActive: matchingItem.isActive
+        };
+      });
       onSelect(formattedItems);
     },
-    selected: selectedPeriods.map(period => period.id),
+    selected: selectedItems.map(period => period.id),
     leftHeader: renderLeftHeader(),
     enableOrderChange: true,
     height: TRANSFER_HEIGHT,
     optionsWidth: TRANSFER_OPTIONS_WIDTH,
     selectedWidth: TRANSFER_SELECTED_WIDTH,
     selectedEmptyComponent: renderEmptySelection(),
-    rightHeader: renderRightHeader(),
+    rightHeader: /*#__PURE__*/React.createElement(RightHeader, {
+      infoBoxMessage: infoBoxMessage
+    }),
     rightFooter: rightFooter,
-    options: [...allPeriods, ...selectedPeriods].map(_ref3 => {
+    options: [...allPeriods, ...selectedItems].map(_ref4 => {
       let {
         id,
         name
-      } = _ref3;
+      } = _ref4;
       return {
         label: name,
         value: id
       };
     }),
-    renderOption: props => /*#__PURE__*/React.createElement(TransferOption, _extends({}, props, {
-      icon: PeriodIcon,
-      dataTest: `${dataTest}-transfer-option`
-    })),
+    renderOption: _ref5 => {
+      let {
+        value,
+        ...props
+      } = _ref5;
+      return /*#__PURE__*/React.createElement(TransferOption, _extends({}, props, {
+        value: value,
+        active: isActive(value),
+        icon: PeriodIcon,
+        dataTest: `${dataTest}-transfer-option`
+      }));
+    },
     dataTest: `${dataTest}-transfer`
   });
 };
 PeriodTransfer.defaultProps = {
-  initialSelectedPeriods: [],
+  selectedItems: [],
   excludedPeriodTypes: [],
   periodsSettings: {
     calendar: 'gregory',
@@ -154,14 +185,16 @@ PeriodTransfer.propTypes = {
   onSelect: PropTypes.func.isRequired,
   dataTest: PropTypes.string,
   excludedPeriodTypes: PropTypes.arrayOf(PropTypes.string),
-  initialSelectedPeriods: PropTypes.arrayOf(PropTypes.shape({
-    id: PropTypes.string,
-    name: PropTypes.string
-  })),
+  infoBoxMessage: PropTypes.string,
   periodsSettings: PropTypes.shape({
     calendar: PropTypes.string,
     locale: PropTypes.string
   }),
-  rightFooter: PropTypes.node
+  rightFooter: PropTypes.node,
+  selectedItems: PropTypes.arrayOf(PropTypes.shape({
+    id: PropTypes.string,
+    isActive: PropTypes.bool,
+    name: PropTypes.string
+  }))
 };
 export default PeriodTransfer;

package/build/es/components/PeriodDimension/__tests__/__snapshots__/PeriodDimension.spec.js.snap

@@ -4,7 +4,6 @@ exports[`The Period Dimension component matches the snapshot 1`] = `
 <PeriodTransfer
   dataTest="period-dimension"
   excludedPeriodTypes={Array []}
-  initialSelectedPeriods={Array []}
   onSelect={[Function]}
   periodsSettings={
     Object {
@@ -13,5 +12,6 @@ exports[`The Period Dimension component matches the snapshot 1`] = `
     }
   }
   rightFooter={<React.Fragment />}
+  selectedItems={Array []}
 />
 `;

package/build/es/components/PeriodDimension/__tests__/__snapshots__/PeriodSelector.spec.js.snap

@@ -77,18 +77,7 @@ exports[`The Period Selector component matches the snapshot 1`] = `
   optionsWidth="420px"
   renderOption={[Function]}
   rightFooter={<React.Fragment />}
-  rightHeader={
-    <React.Fragment>
-      <p
-        className="rightHeader"
-      >
-        Selected Periods
-      </p>
-      <style>
-        
-      </style>
-    </React.Fragment>
-  }
+  rightHeader={<RightHeader />}
   selected={Array []}
   selectedEmptyComponent={
     <React.Fragment>

package/build/es/components/VisTypeIcon.js

@@ -1,7 +1,7 @@
-import { IconTable16, IconVisualizationArea16, IconVisualizationAreaStacked16, IconVisualizationBar16, IconVisualizationBarStacked16, IconVisualizationColumn16, IconVisualizationColumnMulti16, IconVisualizationColumnStacked16, IconVisualizationGauge16, IconVisualizationLine16, IconVisualizationLinelist16, IconVisualizationLineMulti16, IconVisualizationPie16, IconVisualizationRadar16, IconVisualizationScatter16, IconVisualizationSingleValue16, IconTable24, IconVisualizationArea24, IconVisualizationAreaStacked24, IconVisualizationBar24, IconVisualizationBarStacked24, IconVisualizationColumn24, IconVisualizationLinelist24, IconVisualizationColumnMulti24, IconVisualizationColumnStacked24, IconVisualizationGauge24, IconVisualizationLine24, IconVisualizationLineMulti24, IconVisualizationPie24, IconVisualizationRadar24, IconVisualizationScatter24, IconVisualizationSingleValue24 } from '@dhis2/ui';
+import { IconVisualizationArea16, IconVisualizationAreaStacked16, IconVisualizationBar16, IconVisualizationBarStacked16, IconVisualizationColumn16, IconVisualizationColumnMulti16, IconVisualizationColumnStacked16, IconVisualizationGauge16, IconVisualizationLine16, IconVisualizationLinelist16, IconVisualizationLineMulti16, IconVisualizationOutlierTable16, IconVisualizationPie16, IconVisualizationPivotTable16, IconVisualizationRadar16, IconVisualizationScatter16, IconVisualizationSingleValue16, IconVisualizationArea24, IconVisualizationAreaStacked24, IconVisualizationBar24, IconVisualizationBarStacked24, IconVisualizationColumn24, IconVisualizationLinelist24, IconVisualizationColumnMulti24, IconVisualizationColumnStacked24, IconVisualizationGauge24, IconVisualizationLine24, IconVisualizationLineMulti24, IconVisualizationOutlierTable24, IconVisualizationPie24, IconVisualizationPivotTable24, IconVisualizationRadar24, IconVisualizationScatter24, IconVisualizationSingleValue24 } from '@dhis2/ui';
 import PropTypes from 'prop-types';
 import React from 'react';
-import { VIS_TYPE_LINE_LIST, VIS_TYPE_PIVOT_TABLE, VIS_TYPE_COLUMN, VIS_TYPE_STACKED_COLUMN, VIS_TYPE_BAR, VIS_TYPE_STACKED_BAR, VIS_TYPE_LINE, VIS_TYPE_AREA, VIS_TYPE_STACKED_AREA, VIS_TYPE_PIE, VIS_TYPE_RADAR, VIS_TYPE_GAUGE, VIS_TYPE_YEAR_OVER_YEAR_LINE, VIS_TYPE_YEAR_OVER_YEAR_COLUMN, VIS_TYPE_SINGLE_VALUE, VIS_TYPE_SCATTER } from '../modules/visTypes.js';
+import { VIS_TYPE_LINE_LIST, VIS_TYPE_PIVOT_TABLE, VIS_TYPE_COLUMN, VIS_TYPE_STACKED_COLUMN, VIS_TYPE_BAR, VIS_TYPE_STACKED_BAR, VIS_TYPE_LINE, VIS_TYPE_AREA, VIS_TYPE_STACKED_AREA, VIS_TYPE_PIE, VIS_TYPE_RADAR, VIS_TYPE_GAUGE, VIS_TYPE_YEAR_OVER_YEAR_LINE, VIS_TYPE_YEAR_OVER_YEAR_COLUMN, VIS_TYPE_SINGLE_VALUE, VIS_TYPE_SCATTER, VIS_TYPE_OUTLIER_TABLE } from '../modules/visTypes.js';
 export const VisTypeIcon = _ref => {
   let {
     type,
@@ -17,7 +17,7 @@ export const VisTypeIcon = _ref => {
       }
     case VIS_TYPE_PIVOT_TABLE:
       {
-        VisIcon = useSmall ? IconTable16 : IconTable24;
+        VisIcon = useSmall ? IconVisualizationPivotTable16 : IconVisualizationPivotTable24;
         break;
       }
     case VIS_TYPE_BAR:
@@ -85,6 +85,11 @@ export const VisTypeIcon = _ref => {
         VisIcon = useSmall ? IconVisualizationScatter16 : IconVisualizationScatter24;
         break;
       }
+    case VIS_TYPE_OUTLIER_TABLE:
+      {
+        VisIcon = useSmall ? IconVisualizationOutlierTable16 : IconVisualizationOutlierTable24;
+        break;
+      }
     case VIS_TYPE_COLUMN:
     default:
       {

package/build/es/index.js

@@ -97,15 +97,15 @@ export { getLayoutTypeByVisType } from './modules/visTypeToLayoutType.js';
 
 // Modules: visTypes
 
-export { VIS_TYPE_GROUP_ALL, VIS_TYPE_GROUP_CHARTS, VIS_TYPE_COLUMN, VIS_TYPE_STACKED_COLUMN, VIS_TYPE_BAR, VIS_TYPE_STACKED_BAR, VIS_TYPE_LINE, VIS_TYPE_AREA, VIS_TYPE_STACKED_AREA, VIS_TYPE_PIE, VIS_TYPE_RADAR, VIS_TYPE_GAUGE, VIS_TYPE_BUBBLE, VIS_TYPE_YEAR_OVER_YEAR_LINE, VIS_TYPE_YEAR_OVER_YEAR_COLUMN, VIS_TYPE_SINGLE_VALUE, VIS_TYPE_PIVOT_TABLE, VIS_TYPE_SCATTER, VIS_TYPE_LINE_LIST, visTypeDisplayNames, visTypeIcons, getDisplayNameByVisType, defaultVisType, isStacked, isMultiType, isYearOverYear, isDualAxisType, isSingleValue, isTwoCategoryChartType, isLegendSetType, isColumnBasedType, isVerticalType } from './modules/visTypes.js';
+export { VIS_TYPE_GROUP_ALL, VIS_TYPE_GROUP_CHARTS, VIS_TYPE_COLUMN, VIS_TYPE_STACKED_COLUMN, VIS_TYPE_BAR, VIS_TYPE_STACKED_BAR, VIS_TYPE_LINE, VIS_TYPE_AREA, VIS_TYPE_STACKED_AREA, VIS_TYPE_PIE, VIS_TYPE_RADAR, VIS_TYPE_GAUGE, VIS_TYPE_BUBBLE, VIS_TYPE_YEAR_OVER_YEAR_LINE, VIS_TYPE_YEAR_OVER_YEAR_COLUMN, VIS_TYPE_SINGLE_VALUE, VIS_TYPE_PIVOT_TABLE, VIS_TYPE_SCATTER, VIS_TYPE_LINE_LIST, VIS_TYPE_OUTLIER_TABLE, visTypeDisplayNames, visTypeIcons, getDisplayNameByVisType, defaultVisType, isStacked, isMultiType, isYearOverYear, isDualAxisType, isSingleValue, isOutlierTable, isTwoCategoryChartType, isLegendSetType, isColumnBasedType, isVerticalType } from './modules/visTypes.js';
 
 // Modules: layoutTypes
 
-export { LAYOUT_TYPE_DEFAULT, LAYOUT_TYPE_PIE, LAYOUT_TYPE_SINGLE_VALUE, LAYOUT_TYPE_YEAR_OVER_YEAR, LAYOUT_TYPE_PIVOT_TABLE, LAYOUT_TYPE_SCATTER, LAYOUT_TYPE_LINE_LIST } from './modules/layoutTypes.js';
+export { LAYOUT_TYPE_DEFAULT, LAYOUT_TYPE_PIE, LAYOUT_TYPE_SINGLE_VALUE, LAYOUT_TYPE_YEAR_OVER_YEAR, LAYOUT_TYPE_PIVOT_TABLE, LAYOUT_TYPE_SCATTER, LAYOUT_TYPE_LINE_LIST, LAYOUT_TYPE_OUTLIER_TABLE } from './modules/layoutTypes.js';
 
 // Modules: layoutUiRules
 
-export { getAvailableAxes, getDisallowedDimensions, getAxisMaxNumberOfItems, getAxisMaxNumberOfDimensions, getAxisMinNumberOfDimensions, hasAxisTooManyItems, getAxisPerLockedDimension, getAllLockedDimensionIds, canDimensionBeAddedToAxis, isDimensionLocked, isAxisFull, getTransferableDimension } from './modules/layoutUiRules/index.js';
+export { getAvailableAxes, getDisallowedDimensions, getDimensionMaxNumberOfItems, getAxisMaxNumberOfItems, getAxisMaxNumberOfDimensions, getAxisMinNumberOfDimensions, hasAxisTooManyItems, hasDimensionTooManyItems, getAxisPerLockedDimension, getAllLockedDimensionIds, canDimensionBeAddedToAxis, isDimensionLocked, isAxisFull, getTransferableDimension } from './modules/layoutUiRules/index.js';
 
 // Visualizations
 
@@ -131,4 +131,4 @@ export { DAILY, WEEKLY, WEEKLYWED, WEEKLYTHU, WEEKLYSAT, WEEKLYSUN, WEEKS_THIS_Y
 export { getRelativePeriodsOptionsById } from './components/PeriodDimension/utils/relativePeriods.js';
 export { getFixedPeriodsOptionsById } from './components/PeriodDimension/utils/fixedPeriods.js';
 export { default as VisualizationOptions } from './components/Options/VisualizationOptions.js';
-export { DIMENSION_TYPE_INDICATOR, DIMENSION_TYPE_DATA_ELEMENT, DIMENSION_TYPE_DATA_SET, DIMENSION_TYPE_EVENT_DATA_ITEM, DIMENSION_TYPE_PROGRAM_INDICATOR, DIMENSION_TYPE_PROGRAM_DATA_ELEMENT, DIMENSION_TYPE_PROGRAM_ATTRIBUTE, DIMENSION_TYPE_DATA_ELEMENT_OPERAND, DIMENSION_TYPE_CATEGORY, DIMENSION_TYPE_CATEGORY_OPTION_GROUP_SET, DIMENSION_TYPE_ALL, DIMENSION_TYPE_DATA, DIMENSION_TYPE_DATA_ELEMENT_GROUP_SET, DIMENSION_TYPE_ORGANISATION_UNIT, DIMENSION_TYPE_PERIOD, DIMENSION_TYPE_ORGANISATION_UNIT_GROUP_SET, DIMENSION_TYPE_EXPRESSION_DIMENSION_ITEM } from './modules/dataTypes.js';
+export { DIMENSION_TYPE_INDICATOR, DIMENSION_TYPE_DATA_ELEMENT, DIMENSION_TYPE_DATA_SET, DIMENSION_TYPE_EVENT_DATA_ITEM, DIMENSION_TYPE_PROGRAM_INDICATOR, DIMENSION_TYPE_PROGRAM_DATA_ELEMENT, DIMENSION_TYPE_PROGRAM_ATTRIBUTE, DIMENSION_TYPE_DATA_ELEMENT_OPERAND, DIMENSION_TYPE_CATEGORY, DIMENSION_TYPE_CATEGORY_OPTION_GROUP_SET, DIMENSION_TYPE_ALL, DIMENSION_TYPE_DATA, DIMENSION_TYPE_DATA_ELEMENT_GROUP_SET, DIMENSION_TYPE_ORGANISATION_UNIT, DIMENSION_TYPE_PERIOD, DIMENSION_TYPE_ORGANISATION_UNIT_GROUP_SET, DIMENSION_TYPE_EXPRESSION_DIMENSION_ITEM, dataTypeMap } from './modules/dataTypes.js';

package/build/es/locales/en/translations.json

@@ -44,6 +44,7 @@
     "Drag items here, or double click in the list, to start building a calculation formula": "Drag items here, or double click in the list, to start building a calculation formula",
     "Math operators": "Math operators",
     "Data Type": "Data Type",
+    "Only {{dataType}} can be used in {{visType}}": "Only {{dataType}} can be used in {{visType}}",
     "All types": "All types",
     "Disaggregation": "Disaggregation",
     "No data": "No data",
@@ -54,10 +55,12 @@
     "No data sets found": "No data sets found",
     "No event data items found": "No event data items found",
     "No program indicators found": "No program indicators found",
+    "No calculations found": "No calculations found",
     "No indicators found for \"{{- searchTerm}}\"": "No indicators found for \"{{- searchTerm}}\"",
     "No data sets found for \"{{- searchTerm}}\"": "No data sets found for \"{{- searchTerm}}\"",
     "No event data items found for \"{{- searchTerm}}\"": "No event data items found for \"{{- searchTerm}}\"",
     "No program indicators found for \"{{- searchTerm}}\"": "No program indicators found for \"{{- searchTerm}}\"",
+    "No calculations found for \"{{- searchTerm}}\"": "No calculations found for \"{{- searchTerm}}\"",
     "Nothing found for \"{{- searchTerm}}\"": "Nothing found for \"{{- searchTerm}}\"",
     "Calculation": "Calculation",
     "Metric type": "Metric type",
@@ -201,9 +204,9 @@
     "Year": "Year",
     "Select year": "Select year",
     "Period": "Period",
+    "Selected Periods": "Selected Periods",
     "Relative periods": "Relative periods",
     "Fixed periods": "Fixed periods",
-    "Selected Periods": "Selected Periods",
     "No periods selected": "No periods selected",
     "Daily": "Daily",
     "Weekly": "Weekly",
@@ -371,6 +374,7 @@
     "Radar": "Radar",
     "Scatter": "Scatter",
     "Single value": "Single value",
+    "Outlier table": "Outlier table",
     "All charts": "All charts",
     "{{seriesName}} (trend)": "{{seriesName}} (trend)",
     "Trend": "Trend",

package/build/es/modules/__tests__/getAdaptedUiLayoutByType.spec.js

@@ -1,9 +1,10 @@
 import { getAdaptedUiLayoutByType } from '../getAdaptedUiLayoutByType.js';
 import { AXIS_ID_COLUMNS, AXIS_ID_ROWS, AXIS_ID_FILTERS } from '../layout/axis.js';
 import { DIMENSION_ID_DATA, DIMENSION_ID_PERIOD, DIMENSION_ID_ORGUNIT } from '../predefinedDimensions.js';
-import { VIS_TYPE_COLUMN, VIS_TYPE_YEAR_OVER_YEAR_LINE, VIS_TYPE_BAR, VIS_TYPE_PIE, VIS_TYPE_SINGLE_VALUE } from '../visTypes.js';
+import { VIS_TYPE_COLUMN, VIS_TYPE_YEAR_OVER_YEAR_LINE, VIS_TYPE_BAR, VIS_TYPE_PIE, VIS_TYPE_SINGLE_VALUE, VIS_TYPE_OUTLIER_TABLE } from '../visTypes.js';
 const someId = 'someId';
 const otherId = 'otherId';
+const thirdId = 'thirdId';
 describe('getAdaptedUiLayoutByType', () => {
   it('column: moves all extra dimensions in columns and rows to filters', () => {
     const initialState = {
@@ -107,6 +108,20 @@ describe('getAdaptedUiLayoutByType', () => {
     };
     expect(actualState).toEqual(expectedState);
   });
+  it('outlier table: removes all dimensions but dx,pe,ou which are moved to columns', () => {
+    const initialState = {
+      [AXIS_ID_COLUMNS]: [DIMENSION_ID_DATA, someId],
+      [AXIS_ID_ROWS]: [DIMENSION_ID_PERIOD, otherId],
+      [AXIS_ID_FILTERS]: [DIMENSION_ID_ORGUNIT, thirdId]
+    };
+    const actualState = getAdaptedUiLayoutByType(initialState, VIS_TYPE_OUTLIER_TABLE);
+    const expectedState = {
+      [AXIS_ID_COLUMNS]: [DIMENSION_ID_DATA, DIMENSION_ID_PERIOD, DIMENSION_ID_ORGUNIT],
+      [AXIS_ID_ROWS]: [],
+      [AXIS_ID_FILTERS]: []
+    };
+    expect(actualState).toEqual(expectedState);
+  });
   it('pivot -> sv with dimension strings', () => {
     const initialLayout = {
       [AXIS_ID_COLUMNS]: [DIMENSION_ID_DATA, DIMENSION_ID_PERIOD],

package/build/es/modules/axis.js

@@ -1,6 +1,6 @@
 import i18n from '../locales/index.js';
 import { AXIS_ID_COLUMNS, AXIS_ID_ROWS, AXIS_ID_FILTERS } from './layout/axis.js';
-import { LAYOUT_TYPE_DEFAULT, LAYOUT_TYPE_PIE, LAYOUT_TYPE_YEAR_OVER_YEAR, LAYOUT_TYPE_PIVOT_TABLE, LAYOUT_TYPE_SCATTER, LAYOUT_TYPE_LINE_LIST } from './layoutTypes.js';
+import { LAYOUT_TYPE_DEFAULT, LAYOUT_TYPE_PIE, LAYOUT_TYPE_YEAR_OVER_YEAR, LAYOUT_TYPE_PIVOT_TABLE, LAYOUT_TYPE_SCATTER, LAYOUT_TYPE_LINE_LIST, LAYOUT_TYPE_OUTLIER_TABLE } from './layoutTypes.js';
 const getAxisNamesByLayoutType = layoutType => {
   switch (layoutType) {
     case LAYOUT_TYPE_DEFAULT:
@@ -28,6 +28,10 @@ const getAxisNamesByLayoutType = layoutType => {
         [AXIS_ID_ROWS]: i18n.t('Points'),
         [AXIS_ID_FILTERS]: i18n.t('Filter')
       };
+    case LAYOUT_TYPE_OUTLIER_TABLE:
+      return {
+        [AXIS_ID_COLUMNS]: i18n.t('Columns')
+      };
   }
 };
 export const getAxisNameByLayoutType = (axisId, layoutType) => {

package/build/es/modules/getAdaptedUiLayoutByType.js

@@ -1,7 +1,7 @@
 import isObject from 'lodash/isObject';
 import { AXIS_ID_COLUMNS, AXIS_ID_ROWS, AXIS_ID_FILTERS } from './layout/axis.js';
 import { DIMENSION_ID_DATA, DIMENSION_ID_ORGUNIT, DIMENSION_ID_PERIOD } from './predefinedDimensions.js';
-import { VIS_TYPE_YEAR_OVER_YEAR_LINE, VIS_TYPE_YEAR_OVER_YEAR_COLUMN, VIS_TYPE_PIE, VIS_TYPE_GAUGE, VIS_TYPE_SINGLE_VALUE, VIS_TYPE_PIVOT_TABLE, VIS_TYPE_SCATTER, isTwoCategoryChartType } from './visTypes.js';
+import { VIS_TYPE_YEAR_OVER_YEAR_LINE, VIS_TYPE_YEAR_OVER_YEAR_COLUMN, VIS_TYPE_PIE, VIS_TYPE_GAUGE, VIS_TYPE_SINGLE_VALUE, VIS_TYPE_PIVOT_TABLE, VIS_TYPE_SCATTER, VIS_TYPE_OUTLIER_TABLE, isTwoCategoryChartType } from './visTypes.js';
 export const getAdaptedUiLayoutByType = (layout, type) => {
   var _layout$rows;
   if (isTwoCategoryChartType(type) && ((_layout$rows = layout.rows) === null || _layout$rows === void 0 ? void 0 : _layout$rows.length) > 1) {
@@ -26,6 +26,8 @@ export const getAdaptedUiLayoutByType = (layout, type) => {
       return layout;
     case VIS_TYPE_SCATTER:
       return getScatterLayout(layout);
+    case VIS_TYPE_OUTLIER_TABLE:
+      return getOutlierTableLayout(layout);
     default:
       return getDefaultLayout(layout);
   }
@@ -99,6 +101,13 @@ const getSingleValueLayout = layout => {
   };
 };
 
+// Transform from ui.layout to outlier table layout format
+const getOutlierTableLayout = () => ({
+  [AXIS_ID_COLUMNS]: [DIMENSION_ID_DATA, DIMENSION_ID_PERIOD, DIMENSION_ID_ORGUNIT],
+  [AXIS_ID_ROWS]: [],
+  [AXIS_ID_FILTERS]: []
+});
+
 /**
  *
  * @param {string|object} dimension

package/build/es/modules/layoutTypes.js

@@ -4,4 +4,5 @@ export const LAYOUT_TYPE_SINGLE_VALUE = 'LAYOUT_TYPE_SINGLE_VALUE';
 export const LAYOUT_TYPE_YEAR_OVER_YEAR = 'LAYOUT_TYPE_YEAR_OVER_YEAR';
 export const LAYOUT_TYPE_PIVOT_TABLE = 'LAYOUT_TYPE_PIVOT_TABLE';
 export const LAYOUT_TYPE_SCATTER = 'LAYOUT_TYPE_SCATTER';
-export const LAYOUT_TYPE_LINE_LIST = 'LAYOUT_TYPE_LINE_LIST';
+export const LAYOUT_TYPE_LINE_LIST = 'LAYOUT_TYPE_LINE_LIST';
+export const LAYOUT_TYPE_OUTLIER_TABLE = 'LAYOUT_TYPE_OUTLIER_TABLE';

package/build/es/modules/layoutUiRules/__tests__/rules.spec.js

@@ -1,14 +1,16 @@
 import { ALL_AXIS_IDS } from '../../layout/axis.js';
-import { DIMENSION_ID_DATA, DIMENSION_ID_ORGUNIT, DIMENSION_ID_PERIOD } from '../../predefinedDimensions.js';
+import { DIMENSION_ID_DATA, DIMENSION_ID_ORGUNIT, DIMENSION_ID_PERIOD, DIMENSION_ID_ASSIGNED_CATEGORIES } from '../../predefinedDimensions.js';
 import { testResourceRules, testResourceRequiredProps, testResourceAllRuleProps } from '../rules.js';
 
 // Consts
+const validDims = [DIMENSION_ID_DATA, DIMENSION_ID_PERIOD, DIMENSION_ID_ORGUNIT];
 const lockableDims = [DIMENSION_ID_DATA, DIMENSION_ID_PERIOD, DIMENSION_ID_ORGUNIT];
-const disallowableDims = [DIMENSION_ID_DATA, DIMENSION_ID_PERIOD];
+const disallowableDims = [DIMENSION_ID_DATA, DIMENSION_ID_PERIOD, DIMENSION_ID_ASSIGNED_CATEGORIES];
 
 // Helper fns
 const allArrayItemsAreValid = (allItems, validItems) => allItems.every(value => validItems.includes(value));
 const allArrayItemsAreValidAxisIds = array => allArrayItemsAreValid(array, ALL_AXIS_IDS);
+const allArrayItemsAreValidDimensionIds = array => allArrayItemsAreValid(array, validDims);
 const onlyRulesWithProp = ruleProp => testResourceRules.filter(rule => rule[ruleProp]);
 
 // Partial tests
@@ -18,6 +20,9 @@ const testPropHasKeysAndValues = ruleProp => it('has keys and values', () => {
 const testPropIsArray = ruleProp => it('is an array', () => {
   expect(onlyRulesWithProp(ruleProp).every(rule => Array.isArray(rule[ruleProp]))).toBe(true);
 });
+const testKeysAreValidDimensionIds = ruleProp => it('keys should be valid dimension ids', () => {
+  expect(onlyRulesWithProp(ruleProp).every(rule => allArrayItemsAreValidDimensionIds(Object.keys(rule[ruleProp])))).toBe(true);
+});
 const testKeysAreValidAxisIds = ruleProp => it('keys should be valid axis ids', () => {
   expect(onlyRulesWithProp(ruleProp).every(rule => allArrayItemsAreValidAxisIds(Object.keys(rule[ruleProp])))).toBe(true);
 });
@@ -56,6 +61,13 @@ describe("verify each rule's ", () => {
       testNoValuesNegative(ruleProp);
     });
   });
+  describe('MAX_ITEMS_PER_DIM', () => {
+    const ruleProp = testResourceAllRuleProps['MAX_ITEMS_PER_DIM'];
+    testPropHasKeysAndValues(ruleProp);
+    testKeysAreValidDimensionIds(ruleProp);
+    testNoValuesZero(ruleProp);
+    testNoValuesNegative(ruleProp);
+  });
   describe('AVAILABLE_AXES', () => {
     const ruleProp = testResourceAllRuleProps['AVAILABLE_AXES'];
     testPropIsArray(ruleProp);

package/build/es/modules/layoutUiRules/index.js

@@ -1,2 +1,2 @@
-export { getAvailableAxesByVisType as getAvailableAxes, getDisallowedDimsByVisType as getDisallowedDimensions, getAxisMaxNumberOfItemsByVisType as getAxisMaxNumberOfItems, getAxisMaxNumberOfDimsByVisType as getAxisMaxNumberOfDimensions, getAxisMinNumberOfDimsByVisType as getAxisMinNumberOfDimensions, getAxisPerLockedDimByVisType as getAxisPerLockedDimension, getAllLockedDimIdsByVisType as getAllLockedDimensionIds } from './rulesHelper.js';
-export { hasAxisTooManyItemsByVisType as hasAxisTooManyItems, isDimensionLockedByVisType as isDimensionLocked, isAxisFullByVisType as isAxisFull, canDimensionBeAddedToAxisByVisType as canDimensionBeAddedToAxis, getTransferableDimensionPerAxisByVisType as getTransferableDimension } from './rulesUtils.js';
+export { getAvailableAxesByVisType as getAvailableAxes, getDisallowedDimsByVisType as getDisallowedDimensions, getAxisMaxNumberOfItemsByVisType as getAxisMaxNumberOfItems, getAxisMaxNumberOfDimsByVisType as getAxisMaxNumberOfDimensions, getAxisMinNumberOfDimsByVisType as getAxisMinNumberOfDimensions, getAxisPerLockedDimByVisType as getAxisPerLockedDimension, getAllLockedDimIdsByVisType as getAllLockedDimensionIds, getDimMaxNumberOfItemsByVisType as getDimensionMaxNumberOfItems } from './rulesHelper.js';
+export { hasAxisTooManyItemsByVisType as hasAxisTooManyItems, hasDimensionTooManyItemsByVisType as hasDimensionTooManyItems, isDimensionLockedByVisType as isDimensionLocked, isAxisFullByVisType as isAxisFull, canDimensionBeAddedToAxisByVisType as canDimensionBeAddedToAxis, getTransferableDimensionPerAxisByVisType as getTransferableDimension } from './rulesUtils.js';

package/build/es/modules/layoutUiRules/rules.js

@@ -1,10 +1,11 @@
 import { AXIS_ID_COLUMNS, AXIS_ID_ROWS, AXIS_ID_FILTERS } from '../layout/axis.js';
-import { DIMENSION_ID_PERIOD, DIMENSION_ID_DATA, DIMENSION_ID_ORGUNIT } from '../predefinedDimensions.js';
-import { VIS_TYPE_COLUMN, VIS_TYPE_STACKED_COLUMN, VIS_TYPE_BAR, VIS_TYPE_STACKED_BAR, VIS_TYPE_LINE, VIS_TYPE_AREA, VIS_TYPE_STACKED_AREA, VIS_TYPE_RADAR, VIS_TYPE_GAUGE, VIS_TYPE_PIE, VIS_TYPE_SINGLE_VALUE, VIS_TYPE_YEAR_OVER_YEAR_LINE, VIS_TYPE_YEAR_OVER_YEAR_COLUMN, VIS_TYPE_PIVOT_TABLE, VIS_TYPE_SCATTER, VIS_TYPE_LINE_LIST } from '../visTypes.js';
+import { DIMENSION_ID_PERIOD, DIMENSION_ID_DATA, DIMENSION_ID_ORGUNIT, DIMENSION_ID_ASSIGNED_CATEGORIES } from '../predefinedDimensions.js';
+import { VIS_TYPE_COLUMN, VIS_TYPE_STACKED_COLUMN, VIS_TYPE_BAR, VIS_TYPE_STACKED_BAR, VIS_TYPE_LINE, VIS_TYPE_AREA, VIS_TYPE_STACKED_AREA, VIS_TYPE_RADAR, VIS_TYPE_GAUGE, VIS_TYPE_PIE, VIS_TYPE_SINGLE_VALUE, VIS_TYPE_YEAR_OVER_YEAR_LINE, VIS_TYPE_YEAR_OVER_YEAR_COLUMN, VIS_TYPE_PIVOT_TABLE, VIS_TYPE_SCATTER, VIS_TYPE_LINE_LIST, VIS_TYPE_OUTLIER_TABLE } from '../visTypes.js';
 const RULE_PROP_AVAILABLE_AXES = 'availableAxes',
   RULE_PROP_MAX_DIMS_PER_AXIS = 'maxNumberOfDimsPerAxis',
   RULE_PROP_MIN_DIMS_PER_AXIS = 'minNumberOfDimsPerAxis',
   RULE_PROP_MAX_ITEMS_PER_AXIS = 'maxNumberOfItemsPerAxis',
+  RULE_PROP_MAX_ITEMS_PER_DIM = 'maxNumberOfItemsPerDim',
   RULE_PROP_DISALLOWED_DIMS = 'disallowedDims',
   RULE_PROP_LOCKED_DIMS = 'lockedDims';
 const defaultRules = {
@@ -82,6 +83,21 @@ const scatterRules = {
 const lineListRules = {
   [RULE_PROP_AVAILABLE_AXES]: [AXIS_ID_COLUMNS, AXIS_ID_FILTERS]
 };
+const outlierTableRules = {
+  [RULE_PROP_AVAILABLE_AXES]: [AXIS_ID_COLUMNS],
+  [RULE_PROP_MIN_DIMS_PER_AXIS]: {
+    [AXIS_ID_COLUMNS]: 3
+  },
+  [RULE_PROP_MAX_ITEMS_PER_DIM]: {
+    [DIMENSION_ID_PERIOD]: 1
+  },
+  [RULE_PROP_LOCKED_DIMS]: {
+    [DIMENSION_ID_DATA]: AXIS_ID_COLUMNS,
+    [DIMENSION_ID_PERIOD]: AXIS_ID_COLUMNS,
+    [DIMENSION_ID_ORGUNIT]: AXIS_ID_COLUMNS
+  },
+  [RULE_PROP_DISALLOWED_DIMS]: [DIMENSION_ID_ASSIGNED_CATEGORIES]
+};
 const visTypeToRules = {
   [VIS_TYPE_COLUMN]: defaultRules,
   [VIS_TYPE_STACKED_COLUMN]: defaultRules,
@@ -98,7 +114,8 @@ const visTypeToRules = {
   [VIS_TYPE_YEAR_OVER_YEAR_COLUMN]: yearOverYearRules,
   [VIS_TYPE_PIVOT_TABLE]: pivotTableRules,
   [VIS_TYPE_SCATTER]: scatterRules,
-  [VIS_TYPE_LINE_LIST]: lineListRules
+  [VIS_TYPE_LINE_LIST]: lineListRules,
+  [VIS_TYPE_OUTLIER_TABLE]: outlierTableRules
 };
 const getRulesByVisType = visType => {
   const rules = visTypeToRules[visType];
@@ -113,6 +130,7 @@ const getRulesByVisType = visType => {
 export const getAvailableAxesByVisType = visType => getRulesByVisType(visType)[RULE_PROP_AVAILABLE_AXES] || [];
 export const getMaxNumberOfDimsPerAxisByVisType = visType => getRulesByVisType(visType)[RULE_PROP_MAX_DIMS_PER_AXIS] || {};
 export const getMinNumberOfDimsPerAxisByVisType = visType => getRulesByVisType(visType)[RULE_PROP_MIN_DIMS_PER_AXIS] || {};
+export const getMaxNumberOfItemsPerDimByVisType = visType => getRulesByVisType(visType)[RULE_PROP_MAX_ITEMS_PER_DIM] || {};
 export const getMaxNumberOfItemsPerAxisByVisType = visType => getRulesByVisType(visType)[RULE_PROP_MAX_ITEMS_PER_AXIS] || {};
 export const getDisallowedDimsByVisType = visType => getRulesByVisType(visType)[RULE_PROP_DISALLOWED_DIMS] || [];
 export const getLockedDimsByVisType = visType => getRulesByVisType(visType)[RULE_PROP_LOCKED_DIMS] || {};
@@ -126,6 +144,7 @@ export const testResourceAllRuleProps = {
   MAX_DIMS_PER_AXIS: RULE_PROP_MAX_DIMS_PER_AXIS,
   MIN_DIMS_PER_AXIS: RULE_PROP_MIN_DIMS_PER_AXIS,
   MAX_ITEMS_PER_AXIS: RULE_PROP_MAX_ITEMS_PER_AXIS,
+  MAX_ITEMS_PER_DIM: RULE_PROP_MAX_ITEMS_PER_DIM,
   DISALLOWED_DIMS: RULE_PROP_DISALLOWED_DIMS,
   LOCKED_DIMS: RULE_PROP_LOCKED_DIMS
 };

package/build/es/modules/layoutUiRules/rulesHelper.js

@@ -1,4 +1,4 @@
-import { getMaxNumberOfItemsPerAxisByVisType, getMaxNumberOfDimsPerAxisByVisType, getMinNumberOfDimsPerAxisByVisType, getLockedDimsByVisType } from './rules.js';
+import { getMaxNumberOfItemsPerDimByVisType, getMaxNumberOfItemsPerAxisByVisType, getMaxNumberOfDimsPerAxisByVisType, getMinNumberOfDimsPerAxisByVisType, getLockedDimsByVisType } from './rules.js';
 
 // Selectors
 
@@ -7,4 +7,5 @@ export const getAxisMaxNumberOfItemsByVisType = (visType, axisId) => getMaxNumbe
 export const getAxisMaxNumberOfDimsByVisType = (visType, axisId) => getMaxNumberOfDimsPerAxisByVisType(visType)[axisId];
 export const getAxisMinNumberOfDimsByVisType = (visType, axisId) => getMinNumberOfDimsPerAxisByVisType(visType)[axisId];
 export const getAxisPerLockedDimByVisType = (visType, dimensionId) => getLockedDimsByVisType(visType)[dimensionId];
-export const getAllLockedDimIdsByVisType = visType => Object.keys(getLockedDimsByVisType(visType));
+export const getAllLockedDimIdsByVisType = visType => Object.keys(getLockedDimsByVisType(visType));
+export const getDimMaxNumberOfItemsByVisType = (visType, dimensionId) => getMaxNumberOfItemsPerDimByVisType(visType)[dimensionId];

package/build/es/modules/layoutUiRules/rulesUtils.js

@@ -1,8 +1,12 @@
 import { getLockedDimsByVisType } from './rules.js';
-import { getAxisMaxNumberOfDimsByVisType, getAxisMaxNumberOfItemsByVisType, getAllLockedDimIdsByVisType } from './rulesHelper.js';
+import { getAxisMaxNumberOfDimsByVisType, getAxisMaxNumberOfItemsByVisType, getDimMaxNumberOfItemsByVisType, getAllLockedDimIdsByVisType } from './rulesHelper.js';
 export const hasAxisTooManyItemsByVisType = (visType, axisId, numberOfItems) => {
   const maxNumberOfItemsPerAxis = getAxisMaxNumberOfItemsByVisType(visType, axisId);
-  return maxNumberOfItemsPerAxis ? numberOfItems > maxNumberOfItemsPerAxis : false;
+  return maxNumberOfItemsPerAxis && numberOfItems > maxNumberOfItemsPerAxis;
+};
+export const hasDimensionTooManyItemsByVisType = (visType, dimensionId, numberOfItems) => {
+  const maxNumberOfItemsPerDimension = getDimMaxNumberOfItemsByVisType(visType, dimensionId);
+  return maxNumberOfItemsPerDimension && numberOfItems > maxNumberOfItemsPerDimension;
 };
 export const isDimensionLockedByVisType = (visType, dimensionId) => getAllLockedDimIdsByVisType(visType).includes(dimensionId);
 export const isAxisFullByVisType = (visType, axisId, axisDimensionsCount) => axisDimensionsCount >= getAxisMaxNumberOfDimsByVisType(visType, axisId);