@dhis2/analytics 28.0.3 → 28.0.5

package/build/es/components/OpenFileDialog/OpenFileDialog.js

@@ -5,24 +5,22 @@ import { Box, Modal, ModalTitle, ModalContent, DataTable, DataTableHead, DataTab
 import isEqual from 'lodash/isEqual';
 import PropTypes from 'prop-types';
 import React, { useCallback, useEffect, useMemo, useReducer, useState } from 'react';
-import { VIS_TYPE_GROUP_ALL, VIS_TYPE_GROUP_CHARTS } from '../../modules/visTypes.js';
-import { CreatedByFilter, CREATED_BY_ALL, CREATED_BY_ALL_BUT_CURRENT_USER, CREATED_BY_CURRENT_USER } from './CreatedByFilter.js';
+import { CreatedByFilter, formatUserFilter, CREATED_BY_ALL } from './CreatedByFilter.js';
 import { FileList } from './FileList.js';
 import { NameFilter } from './NameFilter.js';
 import { styles } from './OpenFileDialog.styles.js';
 import { PaginationControls } from './PaginationControls.js';
 import { getTranslatedString, AOTypeMap } from './utils.js';
-import { VisTypeFilter } from './VisTypeFilter.js';
+import { VisTypeFilter, formatTypeFilter } from './VisTypeFilter.js';
 const getQuery = type => ({
   files: {
     resource: AOTypeMap[type].apiEndpoint,
-    params: _ref => {
-      let {
-        sortField = 'displayName',
-        sortDirection = 'iasc',
-        page = 1,
-        filters
-      } = _ref;
+    params: ({
+      sortField = 'displayName',
+      sortDirection = 'iasc',
+      page = 1,
+      filters
+    }) => {
       const queryParams = {
         filter: filters,
         fields: `id,type,displayName,title,displayDescription,created,lastUpdated,user,access,href`,
@@ -37,17 +35,25 @@ const getQuery = type => ({
     }
   }
 });
-export const OpenFileDialog = _ref2 => {
-  let {
-    type,
-    open,
-    filterVisTypes,
-    defaultFilterVisType,
-    onClose,
-    onFileSelect,
-    onNew,
-    currentUser
-  } = _ref2;
+export const formatFilters = (currentUser, filters, filterVisTypes) => {
+  const queryFilters = [];
+  filters.searchTerm && queryFilters.push(`identifiable:token:${filters.searchTerm}`);
+  const userFilter = formatUserFilter(filters.createdBy, currentUser.id);
+  userFilter && queryFilters.push(userFilter);
+  const typeFilter = formatTypeFilter(filterVisTypes, filters.visType);
+  typeFilter && queryFilters.push(typeFilter);
+  return queryFilters;
+};
+export const OpenFileDialog = ({
+  type,
+  open,
+  filterVisTypes,
+  defaultFilterVisType,
+  onClose,
+  onFileSelect,
+  onNew,
+  currentUser
+}) => {
   const filesQuery = useMemo(() => getQuery(type), [type]);
   const defaultFilters = {
     searchTerm: '',
@@ -70,36 +76,7 @@ export const OpenFileDialog = _ref2 => {
   });
   const [nameFilterValue, setNameFilterValue] = useState(defaultFilters.searchTerm);
   const [searchTimeout, setSearchTimeout] = useState(null);
-  const formatFilters = useCallback(() => {
-    const queryFilters = [];
-    switch (filters.createdBy) {
-      case CREATED_BY_ALL_BUT_CURRENT_USER:
-        queryFilters.push(`user.id:!eq:${currentUser.id}`);
-        break;
-      case CREATED_BY_CURRENT_USER:
-        queryFilters.push(`user.id:eq:${currentUser.id}`);
-        break;
-      case CREATED_BY_ALL:
-      default:
-        break;
-    }
-    if (filters.visType) {
-      switch (filters.visType) {
-        case VIS_TYPE_GROUP_ALL:
-          break;
-        case VIS_TYPE_GROUP_CHARTS:
-          queryFilters.push('type:!eq:PIVOT_TABLE');
-          break;
-        default:
-          queryFilters.push(`type:eq:${filters.visType}`);
-          break;
-      }
-    }
-    if (filters.searchTerm) {
-      queryFilters.push(`identifiable:token:${filters.searchTerm}`);
-    }
-    return queryFilters;
-  }, [currentUser, filters]);
+  const formatFiltersCb = useCallback(() => formatFilters(currentUser, filters, filterVisTypes), [currentUser, filters, filterVisTypes]);
   const formatSortDirection = useCallback(() => {
     if (sortField === 'displayName' && sortDirection !== 'default') {
       return `i${sortDirection}`;
@@ -129,17 +106,14 @@ export const OpenFileDialog = _ref2 => {
   const setPage = pageNum => setState({
     page: pageNum
   });
-  const sortData = _ref3 => {
-    let {
-      name,
-      direction
-    } = _ref3;
-    return setState({
-      sortField: name,
-      sortDirection: direction,
-      page: 1
-    });
-  };
+  const sortData = ({
+    name,
+    direction
+  }) => setState({
+    sortField: name,
+    sortDirection: direction,
+    page: 1
+  });
   useEffect(() => {
     // only fetch data when the dialog is open
     if (open) {
@@ -147,10 +121,10 @@ export const OpenFileDialog = _ref2 => {
         page,
         sortField,
         sortDirection: formatSortDirection(),
-        filters: formatFilters()
+        filters: formatFiltersCb()
       });
     }
-  }, [open, page, sortField, filters, refetch, formatFilters, formatSortDirection]);
+  }, [open, page, sortField, filters, refetch, formatFiltersCb, formatSortDirection]);
   const headers = [{
     field: 'displayName',
     label: i18n.t('Name'),
@@ -233,20 +207,17 @@ export const OpenFileDialog = _ref2 => {
     className: `jsx-${styles.__hash}` + " " + "data-table-wrapper"
   }, /*#__PURE__*/React.createElement(DataTable, {
     layout: "fixed"
-  }, /*#__PURE__*/React.createElement(DataTableHead, null, /*#__PURE__*/React.createElement(DataTableRow, null, data !== null && data !== void 0 && data.files[AOTypeMap[type].apiEndpoint].length ? headers.map(_ref4 => {
-    let {
-      field,
-      label,
-      width
-    } = _ref4;
-    return /*#__PURE__*/React.createElement(DataTableColumnHeader, {
-      width: width,
-      key: field,
-      name: field,
-      onSortIconClick: sortData,
-      sortDirection: getSortDirection(field)
-    }, label);
-  }) : /*#__PURE__*/React.createElement(DataTableColumnHeader, null))), /*#__PURE__*/React.createElement(DataTableBody, {
+  }, /*#__PURE__*/React.createElement(DataTableHead, null, /*#__PURE__*/React.createElement(DataTableRow, null, data !== null && data !== void 0 && data.files[AOTypeMap[type].apiEndpoint].length ? headers.map(({
+    field,
+    label,
+    width
+  }) => /*#__PURE__*/React.createElement(DataTableColumnHeader, {
+    width: width,
+    key: field,
+    name: field,
+    onSortIconClick: sortData,
+    sortDirection: getSortDirection(field)
+  }, label)) : /*#__PURE__*/React.createElement(DataTableColumnHeader, null))), /*#__PURE__*/React.createElement(DataTableBody, {
     className: "data-table-body"
   }, loading && /*#__PURE__*/React.createElement(DataTableRow, null, /*#__PURE__*/React.createElement(DataTableCell, {
     large: true

package/build/es/components/OpenFileDialog/PaginationControls.js

@@ -2,34 +2,28 @@ import i18n from '@dhis2/d2-i18n';
 import { Pagination } from '@dhis2/ui';
 import PropTypes from 'prop-types';
 import React from 'react';
-export const PaginationControls = _ref => {
-  let {
-    page,
-    pager,
-    onPageChange
-  } = _ref;
-  return /*#__PURE__*/React.createElement(Pagination, {
-    page: page,
-    pageCount: pager.pageCount,
-    pageSize: pager.pageSize,
-    total: pager.total,
-    onPageChange: onPageChange,
-    onPageSizeChange: Function.prototype,
-    hidePageSizeSelect: true,
-    pageSummaryText: _ref2 => {
-      let {
-        firstItem: firstItemIndex,
-        lastItem: lastItemIndex,
-        total: totalNumberOfItems
-      } = _ref2;
-      return i18n.t('{{firstItemIndex}}-{{lastItemIndex}} of {{totalNumberOfItems}}', {
-        firstItemIndex,
-        lastItemIndex,
-        totalNumberOfItems
-      });
-    }
-  });
-};
+export const PaginationControls = ({
+  page,
+  pager,
+  onPageChange
+}) => /*#__PURE__*/React.createElement(Pagination, {
+  page: page,
+  pageCount: pager.pageCount,
+  pageSize: pager.pageSize,
+  total: pager.total,
+  onPageChange: onPageChange,
+  onPageSizeChange: Function.prototype,
+  hidePageSizeSelect: true,
+  pageSummaryText: ({
+    firstItem: firstItemIndex,
+    lastItem: lastItemIndex,
+    total: totalNumberOfItems
+  }) => i18n.t('{{firstItemIndex}}-{{lastItemIndex}} of {{totalNumberOfItems}}', {
+    firstItemIndex,
+    lastItemIndex,
+    totalNumberOfItems
+  })
+});
 PaginationControls.propTypes = {
   page: PropTypes.number,
   pager: PropTypes.object,

package/build/es/components/OpenFileDialog/VisTypeFilter.js

@@ -2,46 +2,74 @@ import i18n from '@dhis2/d2-i18n';
 import { SingleSelect, colors } from '@dhis2/ui';
 import PropTypes from 'prop-types';
 import React from 'react';
-import { getDisplayNameByVisType, visTypeIcons } from '../../modules/visTypes.js';
+import { getDisplayNameByVisType, visTypeIcons, VIS_TYPE_GROUP_ALL, VIS_TYPE_GROUP_CHARTS, VIS_TYPE_PIVOT_TABLE } from '../../modules/visTypes.js';
 import { VisTypeIcon } from '../VisTypeIcon.js';
 import { CustomSelectOption } from './CustomSelectOption.js';
-export const VisTypeFilter = _ref => {
-  let {
-    visTypes,
-    selected,
-    onChange
-  } = _ref;
-  return /*#__PURE__*/React.createElement(SingleSelect, {
-    selected: selected,
-    onChange: _ref2 => {
-      let {
-        selected
-      } = _ref2;
-      return onChange(selected);
-    },
-    prefix: i18n.t('Type'),
-    dense: true,
-    maxHeight: "400px"
-  }, visTypes === null || visTypes === void 0 ? void 0 : visTypes.map(_ref3 => {
-    let {
+export const formatTypeFilter = (filterVisTypes, visType) => {
+  const defaultFilterTypes = [];
+  let defaultTypeFilter;
+  if (Array.isArray(filterVisTypes)) {
+    defaultFilterTypes.push(...filterVisTypes.filter(({
       type,
-      disabled,
-      insertDivider
-    } = _ref3;
-    return /*#__PURE__*/React.createElement(CustomSelectOption, {
-      key: type,
-      disabled: disabled,
-      label: getDisplayNameByVisType(type),
-      insertDivider: insertDivider,
-      value: type,
-      icon: visTypeIcons[type] ? /*#__PURE__*/React.createElement(VisTypeIcon, {
-        type: type,
-        useSmall: true,
-        color: colors.grey600
-      }) : undefined
-    });
-  }));
+      disabled
+    }) => !(disabled || [VIS_TYPE_GROUP_ALL, VIS_TYPE_GROUP_CHARTS].includes(type))).map(({
+      type
+    }) => type));
+    if (defaultFilterTypes.length) {
+      defaultTypeFilter = `type:in:[${defaultFilterTypes.join(',')}]`;
+    }
+  }
+  switch (visType) {
+    case VIS_TYPE_GROUP_ALL:
+      {
+        return defaultTypeFilter;
+      }
+    case VIS_TYPE_GROUP_CHARTS:
+      {
+        if (defaultFilterTypes.length) {
+          return `type:in:[${defaultFilterTypes.filter(item => item !== VIS_TYPE_PIVOT_TABLE).join(',')}]`;
+        } else {
+          return `type:!eq:${VIS_TYPE_PIVOT_TABLE}`;
+        }
+      }
+    default:
+      {
+        if (visType) {
+          return `type:eq:${visType}`;
+        } else if (defaultTypeFilter) {
+          return defaultTypeFilter;
+        }
+      }
+  }
 };
+export const VisTypeFilter = ({
+  visTypes,
+  selected,
+  onChange
+}) => /*#__PURE__*/React.createElement(SingleSelect, {
+  selected: selected,
+  onChange: ({
+    selected
+  }) => onChange(selected),
+  prefix: i18n.t('Type'),
+  dense: true,
+  maxHeight: "400px"
+}, visTypes === null || visTypes === void 0 ? void 0 : visTypes.map(({
+  type,
+  disabled,
+  insertDivider
+}) => /*#__PURE__*/React.createElement(CustomSelectOption, {
+  key: type,
+  disabled: disabled,
+  label: getDisplayNameByVisType(type),
+  insertDivider: insertDivider,
+  value: type,
+  icon: visTypeIcons[type] ? /*#__PURE__*/React.createElement(VisTypeIcon, {
+    type: type,
+    useSmall: true,
+    color: colors.grey600
+  }) : undefined
+})));
 VisTypeFilter.propTypes = {
   selected: PropTypes.string,
   visTypes: PropTypes.arrayOf(PropTypes.shape({

package/build/es/components/OpenFileDialog/__tests__/OpenFileDialog.spec.js

@@ -0,0 +1,49 @@
+import { VIS_TYPE_COLUMN, VIS_TYPE_GROUP_ALL, VIS_TYPE_GROUP_CHARTS, VIS_TYPE_LINE_LIST, VIS_TYPE_PIVOT_TABLE } from '../../../modules/visTypes.js';
+import { CREATED_BY_ALL, CREATED_BY_ALL_BUT_CURRENT_USER, CREATED_BY_CURRENT_USER } from '../CreatedByFilter.js';
+import { formatFilters } from '../OpenFileDialog.js';
+describe('OpenFileDialog - formatFilters', () => {
+  const currentUser = {
+    id: 'test-user'
+  };
+  const createdByTestCases = [[CREATED_BY_ALL, []], [CREATED_BY_CURRENT_USER, [`user.id:eq:${currentUser.id}`]], [CREATED_BY_ALL_BUT_CURRENT_USER, [`user.id:!eq:${currentUser.id}`]]];
+  test.each(createdByTestCases)('formats the createdBy filter given %p', (createdBy, expected) => expect(formatFilters(currentUser, {
+    createdBy
+  })).toEqual(expected));
+  test('formats the searchTerm filter', () => {
+    const testSearchTerm = 'test search term';
+    expect(formatFilters(currentUser, {
+      searchTerm: testSearchTerm
+    })).toEqual([`identifiable:token:${testSearchTerm}`]);
+  });
+  const typeTestCases = [
+  // no type filter when no visType nor filterVisTypes
+  [undefined, undefined, []],
+  // no type filter because VIS_TYPE_GROUP_ALL is selected
+  [undefined, VIS_TYPE_GROUP_ALL, []],
+  // only VIS_TYPE_PIVOT_TABLE ignored because no filterVisTypes is passed and VIS_TYPE_GROUP_CHARTS is selected
+  [undefined, VIS_TYPE_GROUP_CHARTS, [`type:!eq:${VIS_TYPE_PIVOT_TABLE}`]],
+  // no filterVisTypes and VIS_TYPE_PIVOT_TABLE selected
+  [undefined, VIS_TYPE_PIVOT_TABLE, [`type:eq:${VIS_TYPE_PIVOT_TABLE}`]],
+  // group types are ignored
+  [[VIS_TYPE_PIVOT_TABLE, VIS_TYPE_GROUP_ALL, VIS_TYPE_GROUP_CHARTS], VIS_TYPE_GROUP_ALL, [`type:in:[${VIS_TYPE_PIVOT_TABLE}]`]],
+  // VIS_TYPE_PIVOT_TABLE is ignored because VIS_TYPE_GROUP_CHARTS is selected
+  [[VIS_TYPE_PIVOT_TABLE, VIS_TYPE_COLUMN, VIS_TYPE_GROUP_CHARTS], VIS_TYPE_GROUP_CHARTS, [`type:in:[${VIS_TYPE_COLUMN}]`]],
+  // when filterVisTypes is passed the default type filter only include those
+  [[VIS_TYPE_PIVOT_TABLE], '', [`type:in:[${VIS_TYPE_PIVOT_TABLE}]`]], [[VIS_TYPE_LINE_LIST, VIS_TYPE_PIVOT_TABLE], '', [`type:in:[${VIS_TYPE_LINE_LIST},${VIS_TYPE_PIVOT_TABLE}]`]]];
+  test.each(typeTestCases)('formats the type filter given %p and %p', (types, visType, expected) => expect(formatFilters(currentUser, {
+    visType
+  }, types === null || types === void 0 ? void 0 : types.map(type => ({
+    type
+  })))).toEqual(expected));
+  test('combined filters', () => {
+    expect(formatFilters(currentUser, {
+      createdBy: CREATED_BY_CURRENT_USER,
+      searchTerm: 'test',
+      visType: VIS_TYPE_GROUP_ALL
+    }, [{
+      type: VIS_TYPE_LINE_LIST
+    }, {
+      type: VIS_TYPE_PIVOT_TABLE
+    }])).toEqual([`identifiable:token:test`, `user.id:eq:${currentUser.id}`, `type:in:[${VIS_TYPE_LINE_LIST},${VIS_TYPE_PIVOT_TABLE}]`]);
+  });
+});

package/build/es/components/Options/VisualizationOptions.js

@@ -3,40 +3,33 @@ import { ButtonStrip, Modal, ModalTitle, ModalContent, ModalActions, Button, Fie
 import PropTypes from 'prop-types';
 import React, { useState } from 'react';
 import { modalContent, tabSection, tabSectionTitle, tabSectionTitleDisabled, tabSectionTitleMargin, tabSectionOption, tabSectionOptionItem, tabSectionOptionToggleable, tabSectionToggleableSubsection, tabSectionOptionComplexInline, tabSectionOptionText, tabBar, tabContent, tabSectionOptionIcon } from './styles/VisualizationOptions.style.js';
-const VisualizationOptions = _ref => {
-  let {
-    initiallyActiveTabKey,
-    optionsConfig,
-    onClose,
-    onUpdate
-  } = _ref;
+const VisualizationOptions = ({
+  initiallyActiveTabKey,
+  optionsConfig,
+  onClose,
+  onUpdate
+}) => {
   const [activeTabKey, setActiveTabKey] = useState(initiallyActiveTabKey);
-  const generateTabContent = sections => sections.map(_ref2 => {
-    let {
-      key,
-      label,
-      content,
-      helpText
-    } = _ref2;
-    return /*#__PURE__*/React.createElement("div", {
-      key: key,
-      className: tabSection.className
-    }, /*#__PURE__*/React.createElement(FieldSet, null, label ? /*#__PURE__*/React.createElement(Legend, null, /*#__PURE__*/React.createElement("span", {
-      className: tabSectionTitle.className
-    }, label)) : null, content, helpText ? /*#__PURE__*/React.createElement(Legend, null, /*#__PURE__*/React.createElement(Help, null, helpText)) : null));
-  });
-  const generateTabs = tabs => tabs.map(_ref3 => {
-    let {
-      key,
-      label,
-      content
-    } = _ref3;
-    return {
-      key,
-      label,
-      content: generateTabContent(content)
-    };
-  });
+  const generateTabContent = sections => sections.map(({
+    key,
+    label,
+    content,
+    helpText
+  }) => /*#__PURE__*/React.createElement("div", {
+    key: key,
+    className: tabSection.className
+  }, /*#__PURE__*/React.createElement(FieldSet, null, label ? /*#__PURE__*/React.createElement(Legend, null, /*#__PURE__*/React.createElement("span", {
+    className: tabSectionTitle.className
+  }, label)) : null, content, helpText ? /*#__PURE__*/React.createElement(Legend, null, /*#__PURE__*/React.createElement(Help, null, helpText)) : null)));
+  const generateTabs = tabs => tabs.map(({
+    key,
+    label,
+    content
+  }) => ({
+    key,
+    label,
+    content: generateTabContent(content)
+  }));
   const getModalContent = () => {
     const tabs = generateTabs(optionsConfig);
     let activeTabIndex = tabs.findIndex(tab => tab.key === activeTabKey);
@@ -47,17 +40,14 @@ const VisualizationOptions = _ref => {
       className: tabBar.className
     }, /*#__PURE__*/React.createElement(TabBar, {
       dataTest: 'options-modal-tab-bar'
-    }, tabs.map((_ref4, index) => {
-      let {
-        key,
-        label
-      } = _ref4;
-      return /*#__PURE__*/React.createElement(Tab, {
-        key: key,
-        onClick: () => setActiveTabKey(key),
-        selected: index === activeTabIndex
-      }, label);
-    })), tabBar.styles), /*#__PURE__*/React.createElement("div", {
+    }, tabs.map(({
+      key,
+      label
+    }, index) => /*#__PURE__*/React.createElement(Tab, {
+      key: key,
+      onClick: () => setActiveTabKey(key),
+      selected: index === activeTabIndex
+    }, label))), tabBar.styles), /*#__PURE__*/React.createElement("div", {
       className: tabContent.className
     }, tabs[activeTabIndex].content, tabContent.styles, tabSection.styles, tabSectionTitle.styles, tabSectionTitleDisabled.styles, tabSectionTitleMargin.styles, tabSectionOption.styles, tabSectionOptionItem.styles, tabSectionOptionToggleable.styles, tabSectionToggleableSubsection.styles, tabSectionOptionComplexInline.styles, tabSectionOptionText.styles, tabSectionOptionIcon.styles));
   };

package/build/es/components/OrgUnitDimension/OrgUnitDimension.js

@@ -11,17 +11,16 @@ import { ouIdHelper, USER_ORG_UNIT, USER_ORG_UNIT_CHILDREN, USER_ORG_UNIT_GRANDC
 import { DIMENSION_ID_ORGUNIT } from '../../modules/predefinedDimensions.js';
 import styles from './styles/OrgUnitDimension.style.js';
 const DYNAMIC_ORG_UNITS = [USER_ORG_UNIT, USER_ORG_UNIT_CHILDREN, USER_ORG_UNIT_GRANDCHILDREN];
-const OrgUnitDimension = _ref => {
-  let {
-    roots,
-    selected,
-    onSelect,
-    hideGroupSelect,
-    hideLevelSelect,
-    hideUserOrgUnits,
-    warning,
-    displayNameProp
-  } = _ref;
+const OrgUnitDimension = ({
+  roots,
+  selected,
+  onSelect,
+  hideGroupSelect = false,
+  hideLevelSelect = false,
+  hideUserOrgUnits = false,
+  warning,
+  displayNameProp
+}) => {
   const [ouLevels, setOuLevels] = useState([]);
   const [ouGroups, setOuGroups] = useState([]);
   const dataEngine = useDataEngine();
@@ -138,44 +137,35 @@ const OrgUnitDimension = _ref => {
   }, /*#__PURE__*/React.createElement(Checkbox, {
     label: i18n.t('User organisation unit'),
     checked: selected.some(item => item.id === USER_ORG_UNIT),
-    onChange: _ref2 => {
-      let {
-        checked
-      } = _ref2;
-      return onSelectItems({
-        id: USER_ORG_UNIT,
-        checked,
-        displayName: i18n.t('User organisation unit')
-      });
-    },
+    onChange: ({
+      checked
+    }) => onSelectItems({
+      id: USER_ORG_UNIT,
+      checked,
+      displayName: i18n.t('User organisation unit')
+    }),
     dense: true
   }), /*#__PURE__*/React.createElement(Checkbox, {
     label: i18n.t('User sub-units'),
     checked: selected.some(item => item.id === USER_ORG_UNIT_CHILDREN),
-    onChange: _ref3 => {
-      let {
-        checked
-      } = _ref3;
-      return onSelectItems({
-        id: USER_ORG_UNIT_CHILDREN,
-        checked,
-        displayName: i18n.t('User sub-units')
-      });
-    },
+    onChange: ({
+      checked
+    }) => onSelectItems({
+      id: USER_ORG_UNIT_CHILDREN,
+      checked,
+      displayName: i18n.t('User sub-units')
+    }),
     dense: true
   }), /*#__PURE__*/React.createElement(Checkbox, {
     label: i18n.t('User sub-x2-units'),
     checked: selected.some(item => item.id === USER_ORG_UNIT_GRANDCHILDREN),
-    onChange: _ref4 => {
-      let {
-        checked
-      } = _ref4;
-      return onSelectItems({
-        id: USER_ORG_UNIT_GRANDCHILDREN,
-        checked,
-        displayName: i18n.t('User sub-x2-units')
-      });
-    },
+    onChange: ({
+      checked
+    }) => onSelectItems({
+      id: USER_ORG_UNIT_GRANDCHILDREN,
+      checked,
+      displayName: i18n.t('User sub-x2-units')
+    }),
     dense: true
   })), /*#__PURE__*/React.createElement("div", {
     className: `jsx-${styles.__hash}` + " " + "orgUnitTreeWrapper"
@@ -191,12 +181,9 @@ const OrgUnitDimension = _ref => {
     }) || "")
   }, !hideLevelSelect && /*#__PURE__*/React.createElement(MultiSelect, {
     selected: ouLevels.length ? selected.filter(item => ouIdHelper.hasLevelPrefix(item.id)).map(item => ouIdHelper.removePrefix(item.id)) : [],
-    onChange: _ref5 => {
-      let {
-        selected
-      } = _ref5;
-      return onLevelChange(selected);
-    },
+    onChange: ({
+      selected
+    }) => onLevelChange(selected),
     placeholder: i18n.t('Select a level'),
     loading: !ouLevels.length,
     dense: true,
@@ -208,12 +195,9 @@ const OrgUnitDimension = _ref => {
     dataTest: `org-unit-level-select-option-${level.id}`
   }))), !hideGroupSelect && /*#__PURE__*/React.createElement(MultiSelect, {
     selected: ouGroups.length ? selected.filter(item => ouIdHelper.hasGroupPrefix(item.id)).map(item => ouIdHelper.removePrefix(item.id)) : [],
-    onChange: _ref6 => {
-      let {
-        selected
-      } = _ref6;
-      return onGroupChange(selected);
-    },
+    onChange: ({
+      selected
+    }) => onGroupChange(selected),
     placeholder: i18n.t('Select a group'),
     loading: !ouGroups.length,
     dense: true,
@@ -244,11 +228,6 @@ const OrgUnitDimension = _ref => {
     id: styles.__hash
   }, styles));
 };
-OrgUnitDimension.defaultProps = {
-  hideGroupSelect: false,
-  hideLevelSelect: false,
-  hideUserOrgUnits: false
-};
 OrgUnitDimension.propTypes = {
   displayNameProp: PropTypes.string,
   hideGroupSelect: PropTypes.bool,