@dhis2/analytics 28.0.4 → 28.0.5

package/build/es/components/TranslationDialog/TranslationModal/__tests__/TranslationModal.spec.js

@@ -1,5 +1,5 @@
-import { ModalTitle, Modal } from '@dhis2/ui';
-import { shallow } from 'enzyme';
+import { CustomDataProvider } from '@dhis2/app-runtime';
+import { render, screen } from '@testing-library/react';
 import React from 'react';
 import { TranslationModal } from '../TranslationModal.js';
 const mockUseTranslationResults = jest.fn(() => ({
@@ -9,19 +9,26 @@ const mockUseTranslationResults = jest.fn(() => ({
 jest.mock('../useTranslationsResults.js', () => ({
   useTranslationsResults: args => mockUseTranslationResults(args)
 }));
-describe('The Translation Dialog component', () => {
-  let shallowTranslationModal;
+describe('TranslationDialog component', () => {
   let props;
   const onClose = jest.fn();
   const onTranslationSaved = jest.fn();
-  const getTranslationModalComponent = props => {
-    if (!shallowTranslationModal) {
-      shallowTranslationModal = shallow(/*#__PURE__*/React.createElement(TranslationModal, props));
-    }
-    return shallowTranslationModal;
+  const renderTranslationModalComponent = props => {
+    return render(/*#__PURE__*/React.createElement(CustomDataProvider, {
+      data: {
+        i18n: {
+          name: 'Name',
+          description: 'Description'
+        },
+        'locales/db': [{
+          locale: 'en',
+          name: 'English',
+          displayName: 'English'
+        }]
+      }
+    }, /*#__PURE__*/React.createElement(TranslationModal, props)));
   };
   beforeEach(() => {
-    shallowTranslationModal = undefined;
     props = {
       fieldsToTranslate: ['name', 'description'],
       objectToTranslate: {
@@ -32,15 +39,17 @@ describe('The Translation Dialog component', () => {
       onTranslationSaved
     };
   });
-  it('renders a Modal component', () => {
-    expect(getTranslationModalComponent(props).find(Modal)).toHaveLength(1);
+  test('renders a Modal component', () => {
+    renderTranslationModalComponent(props);
+    expect(screen.getByTestId('dhis2-analytics-translation-modal')).toBeInTheDocument();
   });
-  it("renders a ModalTitle containing the object's name", () => {
-    expect(getTranslationModalComponent(props).find(ModalTitle).childAt(0).text()).toEqual(`Translate: ${props.objectToTranslate.name}`);
+  test("renders a ModalTitle containing the object's name", () => {
+    renderTranslationModalComponent(props);
+    expect(screen.getByText(`Translate: ${props.objectToTranslate.name}`)).toBeInTheDocument();
   });
   test.each(['https://dhis2.tld/path/api/visualization/object-id', 'https://dhis2.tld/path/api/42/visualization/object-id'])('uses the correct resource for the translation endpoint', href => {
     props.objectToTranslate.href = href;
-    getTranslationModalComponent(props);
+    renderTranslationModalComponent(props);
     expect(mockUseTranslationResults).toHaveBeenCalled();
     expect(mockUseTranslationResults).toHaveBeenCalledWith({
       resource: 'visualization/object-id'

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@dhis2/analytics",
-    "version": "28.0.4",
+    "version": "28.0.5",
     "main": "./build/cjs/index.js",
     "module": "./build/es/index.js",
     "exports": {
@@ -42,10 +42,8 @@
         "@testing-library/dom": "^10.4.0",
         "@testing-library/jest-dom": "^6.6.3",
         "@testing-library/react": "^16.3.0",
-        "enzyme": "^3.9.0",
-        "enzyme-adapter-react-16": "^1.15.6",
+        "@testing-library/user-event": "^14.6.1",
         "fs-extra": "^10.1.0",
-        "jest-enzyme": "^7.0.2",
         "prop-types": "^15",
         "react": "^18.3.1",
         "react-dom": "^18.3.1",

package/build/cjs/components/OrgUnitDimension/__tests__/__snapshots__/OrgUnitDimension.spec.js.snap

@@ -1,89 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`The OrgUnitDimension component matches the snapshot 1`] = `
-<div
-  className="container"
->
-  <div
-    className="userOrgUnitsWrapper"
-  >
-    <Checkbox
-      checked={false}
-      dataTest="dhis2-uicore-checkbox"
-      dense={true}
-      indeterminate={false}
-      label="User organisation unit"
-      onChange={[Function]}
-    />
-    <Checkbox
-      checked={false}
-      dataTest="dhis2-uicore-checkbox"
-      dense={true}
-      indeterminate={false}
-      label="User sub-units"
-      onChange={[Function]}
-    />
-    <Checkbox
-      checked={false}
-      dataTest="dhis2-uicore-checkbox"
-      dense={true}
-      indeterminate={false}
-      label="User sub-x2-units"
-      onChange={[Function]}
-    />
-  </div>
-  <div
-    className="orgUnitTreeWrapper"
-  >
-    <OrganisationUnitTree
-      dataTest="org-unit-tree"
-      initiallyExpanded={Array []}
-      onChange={[Function]}
-      roots={Array []}
-      selected={Array []}
-    />
-  </div>
-  <div
-    className="selectsWrapper"
-  >
-    <MultiSelect
-      dataTest="org-unit-level-select"
-      dense={true}
-      loading={true}
-      onChange={[Function]}
-      placeholder="Select a level"
-      selected={Array []}
-    />
-    <MultiSelect
-      dataTest="org-unit-group-select"
-      dense={true}
-      loading={true}
-      onChange={[Function]}
-      placeholder="Select a group"
-      selected={Array []}
-    />
-  </div>
-  <div
-    className="summaryWrapper"
-  >
-    <span
-      className="summaryText"
-    >
-      Nothing selected
-    </span>
-    <div
-      className="deselectButton"
-    >
-      <Button
-        disabled={true}
-        onClick={[Function]}
-        secondary={true}
-        small={true}
-      >
-        Deselect all
-      </Button>
-    </div>
-  </div>
-  <style />
-</div>
-`;

package/build/cjs/components/PeriodDimension/__tests__/PeriodSelector.spec.js

@@ -1,29 +0,0 @@
-"use strict";
-
-var _enzyme = require("enzyme");
-var _react = _interopRequireDefault(require("react"));
-var _PeriodTransfer = _interopRequireDefault(require("../PeriodTransfer.js"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-describe('The Period Selector component', () => {
-  let props;
-  let shallowPeriodTransfer;
-  const getWrapper = () => {
-    if (!shallowPeriodTransfer) {
-      shallowPeriodTransfer = (0, _enzyme.shallow)(/*#__PURE__*/_react.default.createElement(_PeriodTransfer.default, props));
-    }
-    return shallowPeriodTransfer;
-  };
-  beforeEach(() => {
-    props = {
-      initialSelectedPeriods: [],
-      onSelect: jest.fn(),
-      rightFooter: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null),
-      dataTest: 'period-dimension'
-    };
-    shallowPeriodTransfer = undefined;
-  });
-  it('matches the snapshot', () => {
-    const wrapper = getWrapper();
-    expect(wrapper).toMatchSnapshot();
-  });
-});

package/build/cjs/components/PeriodDimension/__tests__/__snapshots__/FixedPeriodSingleSelect.spec.js.snap

@@ -1,92 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`The Fixed Period Single Select component matches the snapshot 1`] = `
-<div
-  data-test="dhis2-analytics-fixedperiodselect"
->
-  <div
-    className="row"
-  >
-    <FixedPeriodFilter
-      currentPeriodType="MONTHLY"
-      currentYear="2014"
-      onSelectPeriodType={[Function]}
-      onSelectYear={[Function]}
-    />
-  </div>
-  <SingleSelectField
-    clearText={[Function]}
-    dataTest="dhis2-uiwidgets-singleselectfield"
-    dense={true}
-    empty={[Function]}
-    filterPlaceholder={[Function]}
-    label="Period"
-    loadingText={[Function]}
-    noMatchText={[Function]}
-    onChange={[Function]}
-    selected="201405"
-  >
-    <SingleSelectOption
-      key="201401"
-      label="January 2014"
-      value="201401"
-    />
-    <SingleSelectOption
-      key="201402"
-      label="February 2014"
-      value="201402"
-    />
-    <SingleSelectOption
-      key="201403"
-      label="March 2014"
-      value="201403"
-    />
-    <SingleSelectOption
-      key="201404"
-      label="April 2014"
-      value="201404"
-    />
-    <SingleSelectOption
-      key="201405"
-      label="May 2014"
-      value="201405"
-    />
-    <SingleSelectOption
-      key="201406"
-      label="June 2014"
-      value="201406"
-    />
-    <SingleSelectOption
-      key="201407"
-      label="July 2014"
-      value="201407"
-    />
-    <SingleSelectOption
-      key="201408"
-      label="August 2014"
-      value="201408"
-    />
-    <SingleSelectOption
-      key="201409"
-      label="September 2014"
-      value="201409"
-    />
-    <SingleSelectOption
-      key="201410"
-      label="October 2014"
-      value="201410"
-    />
-    <SingleSelectOption
-      key="201411"
-      label="November 2014"
-      value="201411"
-    />
-    <SingleSelectOption
-      key="201412"
-      label="December 2014"
-      value="201412"
-    />
-  </SingleSelectField>
-  <style />
-</div>
-`;

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

@@ -1,16 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`The Period Dimension component matches the snapshot 1`] = `
-<PeriodTransfer
-  dataTest="period-dimension"
-  onSelect={[Function]}
-  periodsSettings={
-    Object {
-      "calendar": "gregory",
-      "locale": "en",
-    }
-  }
-  rightFooter={<React.Fragment />}
-  selectedItems={Array []}
-/>
-`;

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

@@ -1,89 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`The Period Selector component matches the snapshot 1`] = `
-<Transfer
-  dataTest="period-dimension-transfer"
-  enableOrderChange={true}
-  height="512px"
-  leftHeader={
-    <React.Fragment>
-      <TabBar>
-        <Tab
-          dataTest="period-dimension-relative-periods-button"
-          onClick={[Function]}
-          selected={true}
-        >
-          Relative periods
-        </Tab>
-        <Tab
-          dataTest="period-dimension-fixed-periods-button"
-          onClick={[Function]}
-          selected={false}
-        >
-          Fixed periods
-        </Tab>
-      </TabBar>
-      <div
-        className="filterContainer"
-      >
-        <RelativePeriodFilter
-          currentFilter="MONTHLY"
-          dataTest="period-dimension-relative-period-filter"
-          excludedPeriodTypes={Array []}
-          onSelectFilter={[Function]}
-        />
-      </div>
-      <style>
-        
-      </style>
-    </React.Fragment>
-  }
-  onChange={[Function]}
-  options={
-    Array [
-      Object {
-        "label": "This month",
-        "value": "THIS_MONTH",
-      },
-      Object {
-        "label": "Last month",
-        "value": "LAST_MONTH",
-      },
-      Object {
-        "label": "Last 3 months",
-        "value": "LAST_3_MONTHS",
-      },
-      Object {
-        "label": "Last 6 months",
-        "value": "LAST_6_MONTHS",
-      },
-      Object {
-        "label": "Last 12 months",
-        "value": "LAST_12_MONTHS",
-      },
-      Object {
-        "label": "Months this year",
-        "value": "MONTHS_THIS_YEAR",
-      },
-    ]
-  }
-  optionsWidth="520px"
-  renderOption={[Function]}
-  rightFooter={<React.Fragment />}
-  rightHeader={<RightHeader />}
-  selected={Array []}
-  selectedEmptyComponent={
-    <React.Fragment>
-      <p
-        className="emptyList"
-      >
-        No periods selected
-      </p>
-      <style>
-        
-      </style>
-    </React.Fragment>
-  }
-  selectedWidth="520px"
-/>
-`;

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

@@ -1,89 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`The OrgUnitDimension component matches the snapshot 1`] = `
-<div
-  className="container"
->
-  <div
-    className="userOrgUnitsWrapper"
-  >
-    <Checkbox
-      checked={false}
-      dataTest="dhis2-uicore-checkbox"
-      dense={true}
-      indeterminate={false}
-      label="User organisation unit"
-      onChange={[Function]}
-    />
-    <Checkbox
-      checked={false}
-      dataTest="dhis2-uicore-checkbox"
-      dense={true}
-      indeterminate={false}
-      label="User sub-units"
-      onChange={[Function]}
-    />
-    <Checkbox
-      checked={false}
-      dataTest="dhis2-uicore-checkbox"
-      dense={true}
-      indeterminate={false}
-      label="User sub-x2-units"
-      onChange={[Function]}
-    />
-  </div>
-  <div
-    className="orgUnitTreeWrapper"
-  >
-    <OrganisationUnitTree
-      dataTest="org-unit-tree"
-      initiallyExpanded={Array []}
-      onChange={[Function]}
-      roots={Array []}
-      selected={Array []}
-    />
-  </div>
-  <div
-    className="selectsWrapper"
-  >
-    <MultiSelect
-      dataTest="org-unit-level-select"
-      dense={true}
-      loading={true}
-      onChange={[Function]}
-      placeholder="Select a level"
-      selected={Array []}
-    />
-    <MultiSelect
-      dataTest="org-unit-group-select"
-      dense={true}
-      loading={true}
-      onChange={[Function]}
-      placeholder="Select a group"
-      selected={Array []}
-    />
-  </div>
-  <div
-    className="summaryWrapper"
-  >
-    <span
-      className="summaryText"
-    >
-      Nothing selected
-    </span>
-    <div
-      className="deselectButton"
-    >
-      <Button
-        disabled={true}
-        onClick={[Function]}
-        secondary={true}
-        small={true}
-      >
-        Deselect all
-      </Button>
-    </div>
-  </div>
-  <style />
-</div>
-`;

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

@@ -1,26 +0,0 @@
-import { shallow } from 'enzyme';
-import React from 'react';
-import PeriodTransfer from '../PeriodTransfer.js';
-describe('The Period Selector component', () => {
-  let props;
-  let shallowPeriodTransfer;
-  const getWrapper = () => {
-    if (!shallowPeriodTransfer) {
-      shallowPeriodTransfer = shallow(/*#__PURE__*/React.createElement(PeriodTransfer, props));
-    }
-    return shallowPeriodTransfer;
-  };
-  beforeEach(() => {
-    props = {
-      initialSelectedPeriods: [],
-      onSelect: jest.fn(),
-      rightFooter: /*#__PURE__*/React.createElement(React.Fragment, null),
-      dataTest: 'period-dimension'
-    };
-    shallowPeriodTransfer = undefined;
-  });
-  it('matches the snapshot', () => {
-    const wrapper = getWrapper();
-    expect(wrapper).toMatchSnapshot();
-  });
-});

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

@@ -1,92 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`The Fixed Period Single Select component matches the snapshot 1`] = `
-<div
-  data-test="dhis2-analytics-fixedperiodselect"
->
-  <div
-    className="row"
-  >
-    <FixedPeriodFilter
-      currentPeriodType="MONTHLY"
-      currentYear="2014"
-      onSelectPeriodType={[Function]}
-      onSelectYear={[Function]}
-    />
-  </div>
-  <SingleSelectField
-    clearText={[Function]}
-    dataTest="dhis2-uiwidgets-singleselectfield"
-    dense={true}
-    empty={[Function]}
-    filterPlaceholder={[Function]}
-    label="Period"
-    loadingText={[Function]}
-    noMatchText={[Function]}
-    onChange={[Function]}
-    selected="201405"
-  >
-    <SingleSelectOption
-      key="201401"
-      label="January 2014"
-      value="201401"
-    />
-    <SingleSelectOption
-      key="201402"
-      label="February 2014"
-      value="201402"
-    />
-    <SingleSelectOption
-      key="201403"
-      label="March 2014"
-      value="201403"
-    />
-    <SingleSelectOption
-      key="201404"
-      label="April 2014"
-      value="201404"
-    />
-    <SingleSelectOption
-      key="201405"
-      label="May 2014"
-      value="201405"
-    />
-    <SingleSelectOption
-      key="201406"
-      label="June 2014"
-      value="201406"
-    />
-    <SingleSelectOption
-      key="201407"
-      label="July 2014"
-      value="201407"
-    />
-    <SingleSelectOption
-      key="201408"
-      label="August 2014"
-      value="201408"
-    />
-    <SingleSelectOption
-      key="201409"
-      label="September 2014"
-      value="201409"
-    />
-    <SingleSelectOption
-      key="201410"
-      label="October 2014"
-      value="201410"
-    />
-    <SingleSelectOption
-      key="201411"
-      label="November 2014"
-      value="201411"
-    />
-    <SingleSelectOption
-      key="201412"
-      label="December 2014"
-      value="201412"
-    />
-  </SingleSelectField>
-  <style />
-</div>
-`;

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

@@ -1,16 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`The Period Dimension component matches the snapshot 1`] = `
-<PeriodTransfer
-  dataTest="period-dimension"
-  onSelect={[Function]}
-  periodsSettings={
-    Object {
-      "calendar": "gregory",
-      "locale": "en",
-    }
-  }
-  rightFooter={<React.Fragment />}
-  selectedItems={Array []}
-/>
-`;