From d9305a18af22612e866f6c2d4ba3bdba556728f4 Mon Sep 17 00:00:00 2001 From: Jen Jones Arnesen Date: Wed, 3 Jun 2020 14:27:29 -0700 Subject: [PATCH 01/25] fix: ui things have moved --- i18n/en.pot | 7 ++- package.json | 4 +- src/__demo__/Filter.stories.js | 25 ++++++++ .../DataDimension/DataTypesSelector.js | 3 +- src/components/DataDimension/Detail.js | 3 +- src/components/DataDimension/Groups.js | 3 +- .../DataDimension/styles/Groups.style.js | 2 +- .../List/styles/DimensionItem.style.js | 2 +- .../List/styles/DimensionList.style.js | 2 +- .../List/styles/RecommendedIcon.style.js | 2 +- .../styles/DimensionsPanel.style.js | 2 +- .../DynamicDimension/ItemSelector.js | 2 +- src/components/Filter/Filter.js | 2 +- src/components/ItemSelector/SelectedItems.js | 3 +- .../ItemSelector/styles/ItemSelector.style.js | 2 +- .../styles/SelectedItems.style.js | 2 +- .../ItemSelector/widgets/SelectedItem.js | 2 +- .../ItemSelector/widgets/UnselectedItem.js | 2 +- .../widgets/styles/ArrowButton.style.js | 2 +- .../widgets/styles/SelectedItem.style.js | 2 +- .../widgets/styles/UnselectedItem.style.js | 2 +- .../OrgUnitDimension/OrgUnitDimension.js | 2 +- .../PeriodDimension/FixedPeriodFilter.js | 7 +-- .../PeriodDimension/PeriodSelector.js | 3 +- .../PeriodDimension/RelativePeriodFilter.js | 3 +- .../styles/PeriodFilter.style.js | 2 +- .../PivotTable/styles/PivotTable.style.js | 2 +- .../styles/DimensionSelector.style.js | 2 +- .../styles/DimensionsPanel.style.js | 2 +- src/components/styles/FilterField.style.js | 2 +- src/components/styles/TransferOption.style.js | 2 +- src/modules/pivotTable/applyLegendSet.js | 2 +- yarn.lock | 63 ++++++++++++++++++- 33 files changed, 130 insertions(+), 38 deletions(-) create mode 100644 src/__demo__/Filter.stories.js diff --git a/i18n/en.pot b/i18n/en.pot index 4c017174d..66e054b51 100644 --- a/i18n/en.pot +++ b/i18n/en.pot @@ -5,8 +5,8 @@ msgstr "" "Content-Type: text/plain; charset=utf-8\n" "Content-Transfer-Encoding: 8bit\n" "Plural-Forms: nplurals=2; plural=(n != 1)\n" -"POT-Creation-Date: 2020-05-22T11:34:10.538Z\n" -"PO-Revision-Date: 2020-05-22T11:34:10.538Z\n" +"POT-Creation-Date: 2020-06-03T21:43:03.758Z\n" +"PO-Revision-Date: 2020-06-03T21:43:03.758Z\n" msgid "Data Type" msgstr "" @@ -59,6 +59,9 @@ msgstr "" msgid "Dimension recommended with selected data" msgstr "" +msgid "No items selected" +msgstr "" + msgid "Search" msgstr "" diff --git a/package.json b/package.json index bf893baaa..4c2d52fd9 100644 --- a/package.json +++ b/package.json @@ -45,7 +45,9 @@ }, "dependencies": { "@dhis2/d2-ui-org-unit-dialog": "^7.0.3", - "@dhis2/ui-core": "^4.21.1", + "@dhis2/ui-constants": "^5.0.1", + "@dhis2/ui-core": "^5.0.1", + "@dhis2/ui-widgets": "^5.0.1", "@material-ui/core": "^3.9.3", "@material-ui/icons": "^3.0.2", "classnames": "^2.2.6", diff --git a/src/__demo__/Filter.stories.js b/src/__demo__/Filter.stories.js new file mode 100644 index 000000000..2153d983e --- /dev/null +++ b/src/__demo__/Filter.stories.js @@ -0,0 +1,25 @@ +import React, { useState } from 'react' +import { storiesOf } from '@storybook/react' + +import Filter from '../components/Filter/Filter' + +function FilterWithState() { + const [text, setText] = useState(null) + + const onTextChange = value => setText(value) + const onClearFilter = () => setText(null) + return ( + + ) +} + +storiesOf('Filter', module).add('default', () => { + return +}) diff --git a/src/components/DataDimension/DataTypesSelector.js b/src/components/DataDimension/DataTypesSelector.js index e290cd876..e6449064e 100644 --- a/src/components/DataDimension/DataTypesSelector.js +++ b/src/components/DataDimension/DataTypesSelector.js @@ -1,7 +1,8 @@ import React from 'react' import PropTypes from 'prop-types' import i18n from '@dhis2/d2-i18n' -import { SingleSelectField, SingleSelectOption } from '@dhis2/ui-core' +import { SingleSelectField } from '@dhis2/ui-widgets' +import { SingleSelectOption } from '@dhis2/ui-core' import { dataTypes } from '../../modules/dataTypes' import styles from './styles/DataTypesSelector.style' diff --git a/src/components/DataDimension/Detail.js b/src/components/DataDimension/Detail.js index a6b213ddd..51e03188c 100644 --- a/src/components/DataDimension/Detail.js +++ b/src/components/DataDimension/Detail.js @@ -1,7 +1,8 @@ import React from 'react' import PropTypes from 'prop-types' import i18n from '@dhis2/d2-i18n' -import { SingleSelectField, SingleSelectOption } from '@dhis2/ui-core' +import { SingleSelectField } from '@dhis2/ui-widgets' +import { SingleSelectOption } from '@dhis2/ui-core' import { TOTALS, DETAIL } from '../../modules/dataTypes' import styles from './styles/Detail.style' diff --git a/src/components/DataDimension/Groups.js b/src/components/DataDimension/Groups.js index c3292e214..2ec4e76ee 100644 --- a/src/components/DataDimension/Groups.js +++ b/src/components/DataDimension/Groups.js @@ -1,6 +1,7 @@ import React from 'react' import PropTypes from 'prop-types' -import { SingleSelectField, SingleSelectOption } from '@dhis2/ui-core' +import { SingleSelectField } from '@dhis2/ui-widgets' +import { SingleSelectOption } from '@dhis2/ui-core' import { Detail } from './Detail' import { dataTypes } from '../../modules/dataTypes' diff --git a/src/components/DataDimension/styles/Groups.style.js b/src/components/DataDimension/styles/Groups.style.js index e48d710c9..0edbd7384 100644 --- a/src/components/DataDimension/styles/Groups.style.js +++ b/src/components/DataDimension/styles/Groups.style.js @@ -1,5 +1,5 @@ import css from 'styled-jsx/css' -import { colors } from '@dhis2/ui-core' +import { colors } from '@dhis2/ui-constants' export default css` .container { diff --git a/src/components/DimensionsPanel/List/styles/DimensionItem.style.js b/src/components/DimensionsPanel/List/styles/DimensionItem.style.js index ccbb1bdb4..f7dcc93b8 100644 --- a/src/components/DimensionsPanel/List/styles/DimensionItem.style.js +++ b/src/components/DimensionsPanel/List/styles/DimensionItem.style.js @@ -1,4 +1,4 @@ -import { colors, theme } from '@dhis2/ui-core' +import { colors, theme } from '@dhis2/ui-constants' export const styles = { labelWrapper: { diff --git a/src/components/DimensionsPanel/List/styles/DimensionList.style.js b/src/components/DimensionsPanel/List/styles/DimensionList.style.js index 91e18fe55..9ceabc27b 100644 --- a/src/components/DimensionsPanel/List/styles/DimensionList.style.js +++ b/src/components/DimensionsPanel/List/styles/DimensionList.style.js @@ -1,4 +1,4 @@ -import { colors, spacers } from '@dhis2/ui-core' +import { colors, spacers } from '@dhis2/ui-constants' // Fix for vertical flex scrolling in Firefox/Safari: // Wrap the list in a div with position:relative (and flex:1 instead of on the list) diff --git a/src/components/DimensionsPanel/List/styles/RecommendedIcon.style.js b/src/components/DimensionsPanel/List/styles/RecommendedIcon.style.js index 5c80b3d52..ca63045c2 100644 --- a/src/components/DimensionsPanel/List/styles/RecommendedIcon.style.js +++ b/src/components/DimensionsPanel/List/styles/RecommendedIcon.style.js @@ -1,4 +1,4 @@ -import { colors, theme } from '@dhis2/ui-core' +import { colors, theme } from '@dhis2/ui-constants' export const styles = { toolTip: { diff --git a/src/components/DimensionsPanel/styles/DimensionsPanel.style.js b/src/components/DimensionsPanel/styles/DimensionsPanel.style.js index 32415002b..5d138e93e 100644 --- a/src/components/DimensionsPanel/styles/DimensionsPanel.style.js +++ b/src/components/DimensionsPanel/styles/DimensionsPanel.style.js @@ -1,4 +1,4 @@ -import { colors } from '@dhis2/ui-core' +import { colors } from '@dhis2/ui-constants' export const styles = { divContainer: { diff --git a/src/components/DynamicDimension/ItemSelector.js b/src/components/DynamicDimension/ItemSelector.js index 9e7f8bc85..6d07a5fa1 100644 --- a/src/components/DynamicDimension/ItemSelector.js +++ b/src/components/DynamicDimension/ItemSelector.js @@ -1,6 +1,6 @@ import React, { useState } from 'react' import PropTypes from 'prop-types' -import { Transfer } from '@dhis2/ui-core' +import { Transfer } from '@dhis2/ui-widgets' import i18n from '@dhis2/d2-i18n' import styles from '../styles/DimensionSelector.style' diff --git a/src/components/Filter/Filter.js b/src/components/Filter/Filter.js index 6f80d5489..0613b6495 100644 --- a/src/components/Filter/Filter.js +++ b/src/components/Filter/Filter.js @@ -1,6 +1,6 @@ import React from 'react' import PropTypes from 'prop-types' -import { InputField } from '@dhis2/ui-core' +import { InputField } from '@dhis2/ui-widgets' export const Filter = ({ text, onChange, onClear, placeholder, type }) => ( event => diff --git a/src/components/ItemSelector/widgets/UnselectedItem.js b/src/components/ItemSelector/widgets/UnselectedItem.js index 60a11195f..0932189d5 100644 --- a/src/components/ItemSelector/widgets/UnselectedItem.js +++ b/src/components/ItemSelector/widgets/UnselectedItem.js @@ -3,7 +3,7 @@ import PropTypes from 'prop-types' import cx from 'classnames' import ItemIcon from './ItemIcon' -import { colors } from '@dhis2/ui-core' +import { colors } from '@dhis2/ui-constants' import styles from './styles/UnselectedItem.style' const onClickWrapper = ({ id, index, onClick }) => event => diff --git a/src/components/ItemSelector/widgets/styles/ArrowButton.style.js b/src/components/ItemSelector/widgets/styles/ArrowButton.style.js index 779aef381..a42bf5db7 100644 --- a/src/components/ItemSelector/widgets/styles/ArrowButton.style.js +++ b/src/components/ItemSelector/widgets/styles/ArrowButton.style.js @@ -1,4 +1,4 @@ -import { colors } from '@dhis2/ui-core' +import { colors } from '@dhis2/ui-constants' import css from 'styled-jsx/css' export default css` diff --git a/src/components/ItemSelector/widgets/styles/SelectedItem.style.js b/src/components/ItemSelector/widgets/styles/SelectedItem.style.js index 097d24e3d..7d27ac513 100644 --- a/src/components/ItemSelector/widgets/styles/SelectedItem.style.js +++ b/src/components/ItemSelector/widgets/styles/SelectedItem.style.js @@ -1,4 +1,4 @@ -import { colors, theme } from '@dhis2/ui-core' +import { colors, theme } from '@dhis2/ui-constants' import css from 'styled-jsx/css' export default css` diff --git a/src/components/ItemSelector/widgets/styles/UnselectedItem.style.js b/src/components/ItemSelector/widgets/styles/UnselectedItem.style.js index c2ddd2e89..23d5da37a 100644 --- a/src/components/ItemSelector/widgets/styles/UnselectedItem.style.js +++ b/src/components/ItemSelector/widgets/styles/UnselectedItem.style.js @@ -1,4 +1,4 @@ -import { colors, theme } from '@dhis2/ui-core' +import { colors, theme } from '@dhis2/ui-constants' import css from 'styled-jsx/css' export default css` diff --git a/src/components/OrgUnitDimension/OrgUnitDimension.js b/src/components/OrgUnitDimension/OrgUnitDimension.js index 8845fac58..ef1f147e2 100644 --- a/src/components/OrgUnitDimension/OrgUnitDimension.js +++ b/src/components/OrgUnitDimension/OrgUnitDimension.js @@ -12,7 +12,7 @@ import { import { ouIdHelper } from '../../modules/ouIdHelper' import { DIMENSION_ID_ORGUNIT } from '../../modules/predefinedDimensions' import styles from './styles/OrgUnitDimension.style' -import { colors } from '@dhis2/ui-core' +import { colors } from '@dhis2/ui-constants' export const defaultState = { root: undefined, diff --git a/src/components/PeriodDimension/FixedPeriodFilter.js b/src/components/PeriodDimension/FixedPeriodFilter.js index a40ea9d3d..7aeaf5bd4 100644 --- a/src/components/PeriodDimension/FixedPeriodFilter.js +++ b/src/components/PeriodDimension/FixedPeriodFilter.js @@ -1,11 +1,8 @@ import React from 'react' import PropTypes from 'prop-types' import i18n from '@dhis2/d2-i18n' -import { - SingleSelectField, - SingleSelectOption, - InputField, -} from '@dhis2/ui-core' +import { SingleSelectField, InputField } from '@dhis2/ui-widgets' +import { SingleSelectOption } from '@dhis2/ui-core' import { getFixedPeriodsOptions } from './utils/fixedPeriods' import styles from './styles/PeriodFilter.style' diff --git a/src/components/PeriodDimension/PeriodSelector.js b/src/components/PeriodDimension/PeriodSelector.js index a42154c5c..fde69121d 100644 --- a/src/components/PeriodDimension/PeriodSelector.js +++ b/src/components/PeriodDimension/PeriodSelector.js @@ -1,6 +1,7 @@ import React, { Component } from 'react' import PropTypes from 'prop-types' -import { Transfer, TabBar, Tab } from '@dhis2/ui-core' +import { TabBar, Tab } from '@dhis2/ui-core' +import { Transfer } from '@dhis2/ui-widgets' import i18n from '@dhis2/d2-i18n' import FixedPeriodFilter from './FixedPeriodFilter' diff --git a/src/components/PeriodDimension/RelativePeriodFilter.js b/src/components/PeriodDimension/RelativePeriodFilter.js index cb5968e60..67b50b673 100644 --- a/src/components/PeriodDimension/RelativePeriodFilter.js +++ b/src/components/PeriodDimension/RelativePeriodFilter.js @@ -1,7 +1,8 @@ import React from 'react' import PropTypes from 'prop-types' import i18n from '@dhis2/d2-i18n' -import { SingleSelectOption, SingleSelectField } from '@dhis2/ui-core' +import { SingleSelectField } from '@dhis2/ui-widgets' +import { SingleSelectOption } from '@dhis2/ui-core' import { getRelativePeriodsOptions } from './utils/relativePeriods' import styles from './styles/PeriodFilter.style' diff --git a/src/components/PeriodDimension/styles/PeriodFilter.style.js b/src/components/PeriodDimension/styles/PeriodFilter.style.js index 96c62928c..306ec544c 100644 --- a/src/components/PeriodDimension/styles/PeriodFilter.style.js +++ b/src/components/PeriodDimension/styles/PeriodFilter.style.js @@ -1,5 +1,5 @@ import css from 'styled-jsx/css' -import { spacers } from '@dhis2/ui-core' +import { spacers } from '@dhis2/ui-constants' export default css` .leftSection { diff --git a/src/components/PivotTable/styles/PivotTable.style.js b/src/components/PivotTable/styles/PivotTable.style.js index f575c681e..63a15ae00 100644 --- a/src/components/PivotTable/styles/PivotTable.style.js +++ b/src/components/PivotTable/styles/PivotTable.style.js @@ -1,5 +1,5 @@ import css from 'styled-jsx/css' -import { colors } from '@dhis2/ui-core' +import { colors } from '@dhis2/ui-constants' import { DISPLAY_DENSITY_PADDING_COMPACT, DISPLAY_DENSITY_PADDING_NORMAL, diff --git a/src/components/styles/DimensionSelector.style.js b/src/components/styles/DimensionSelector.style.js index 68aea8b9a..29b2bc67e 100644 --- a/src/components/styles/DimensionSelector.style.js +++ b/src/components/styles/DimensionSelector.style.js @@ -1,5 +1,5 @@ import css from 'styled-jsx/css' -import { spacers, colors } from '@dhis2/ui-core' +import { spacers, colors } from '@dhis2/ui-constants' export default css` .filterContainer { diff --git a/src/components/styles/DimensionsPanel.style.js b/src/components/styles/DimensionsPanel.style.js index 04d7624fa..a7c631a11 100644 --- a/src/components/styles/DimensionsPanel.style.js +++ b/src/components/styles/DimensionsPanel.style.js @@ -1,4 +1,4 @@ -import { colors } from '@dhis2/ui-core' +import { colors } from '@dhis2/ui-constants' export const styles = { divContainer: { diff --git a/src/components/styles/FilterField.style.js b/src/components/styles/FilterField.style.js index 62893a6ed..9789f8e5a 100644 --- a/src/components/styles/FilterField.style.js +++ b/src/components/styles/FilterField.style.js @@ -1,5 +1,5 @@ import css from 'styled-jsx/css' -import { colors } from '@dhis2/ui-core' +import { colors } from '@dhis2/ui-constants' export default css` .container { diff --git a/src/components/styles/TransferOption.style.js b/src/components/styles/TransferOption.style.js index 47675b039..bfc350e53 100644 --- a/src/components/styles/TransferOption.style.js +++ b/src/components/styles/TransferOption.style.js @@ -1,5 +1,5 @@ import css from 'styled-jsx/css' -import { colors, spacers, theme } from '@dhis2/ui-core' +import { colors, spacers, theme } from '@dhis2/ui-constants' export default css` .wrapper:last-child { diff --git a/src/modules/pivotTable/applyLegendSet.js b/src/modules/pivotTable/applyLegendSet.js index bee0e84bf..6530f4a9c 100644 --- a/src/modules/pivotTable/applyLegendSet.js +++ b/src/modules/pivotTable/applyLegendSet.js @@ -1,5 +1,5 @@ import { isColorBright } from './isColorBright' -import { colors } from '@dhis2/ui-core' +import { colors } from '@dhis2/ui-constants' import { getColorByValueFromLegendSet, LEGEND_DISPLAY_STRATEGY_BY_DATA_ITEM, diff --git a/yarn.lock b/yarn.lock index 7b9b3de9f..2b0334bb3 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1139,6 +1139,24 @@ resolved "https://registry.yarnpkg.com/@dhis2/app-runtime/-/app-runtime-2.1.1.tgz#442946bd52f1d4a968cf1ba05e68440f11f78996" integrity sha512-jYf3YNiPE9RrAPD9C980s/3dhSh8JEq1s3B82O9T7gf+Vx2/covDIPnyU+64HmEjER+6gR5wHWbp7jOzBYSgLA== +"@dhis2/app-runtime@^2.2.1": + version "2.2.1" + resolved "https://registry.yarnpkg.com/@dhis2/app-runtime/-/app-runtime-2.2.1.tgz#9c2192c247bbca44e721c2ece1a0d6f8bcdf00d6" + integrity sha512-rX4+Dz31zov0OZNKxcOBbVdXwac5nxX0a4e6G0MKE2OCuHZtvASNbahl86IAasCjuNOclUSgLmIJpEhqlnUxpw== + dependencies: + "@dhis2/app-service-config" "2.2.1" + "@dhis2/app-service-data" "2.2.1" + +"@dhis2/app-service-config@2.2.1": + version "2.2.1" + resolved "https://registry.yarnpkg.com/@dhis2/app-service-config/-/app-service-config-2.2.1.tgz#5417b6ec266fa0e3d84a9405010cee43ed6a0027" + integrity sha512-o841GSzjg/VaucWN/9Axo42Dv6CS4Wra3BAw+qFsMtZ7agFKbSssbxyloDiB0/TDv9moR8xivfAHn8kfcVwuNQ== + +"@dhis2/app-service-data@2.2.1": + version "2.2.1" + resolved "https://registry.yarnpkg.com/@dhis2/app-service-data/-/app-service-data-2.2.1.tgz#b418a9624761cedded3ebddc3459db90bdaa3c16" + integrity sha512-XeAmjjt8sL1sbu8rsEEQDBQyc//cHww79kCGXpuFHR5tytzhT31cQ457/zNqU3DW61xKgv+bCWk845kuD26UbQ== + "@dhis2/app-shell@4.0.7": version "4.0.7" resolved "https://registry.yarnpkg.com/@dhis2/app-shell/-/app-shell-4.0.7.tgz#cbbe010fc4cf015ba4a09aceaeedeb566eda38da" @@ -1237,7 +1255,7 @@ semver "^7.1.3" yargs "^15.3.1" -"@dhis2/d2-i18n@^1.0.5", "@dhis2/d2-i18n@^1.0.6": +"@dhis2/d2-i18n@^1", "@dhis2/d2-i18n@^1.0.5", "@dhis2/d2-i18n@^1.0.6": version "1.0.6" resolved "https://registry.yarnpkg.com/@dhis2/d2-i18n/-/d2-i18n-1.0.6.tgz#2914be8acf296f3a6bf7b51c76c46da6a120b0ff" integrity sha512-7YdA4ppFosjuyf7ZMm47BrdsA5TWLM9lmS0lUPgjcCVeeWfUgagqzf4W5JGB9XQ3w1vzK+yy5zH2Ij8IgRAGhA== @@ -1283,7 +1301,27 @@ dependencies: prop-types "^15" -"@dhis2/ui-core@^4.21.1", "@dhis2/ui-core@^4.6.1": +"@dhis2/ui-constants@5.0.1", "@dhis2/ui-constants@^5.0.1": + version "5.0.1" + resolved "https://registry.yarnpkg.com/@dhis2/ui-constants/-/ui-constants-5.0.1.tgz#6e85e8aa1790c4cb37edd7218edfe57b5de13c33" + integrity sha512-9YKKUUSLX4vI/StkhxmRnXglMCcWkBun0dNNQUFWV28RyJIeu9YeWlpdxHEPRvCVgcguoFwHQxJ6ULdFqYO65A== + dependencies: + "@dhis2/prop-types" "^1.6.4" + +"@dhis2/ui-core@5.0.1", "@dhis2/ui-core@^5.0.1": + version "5.0.1" + resolved "https://registry.yarnpkg.com/@dhis2/ui-core/-/ui-core-5.0.1.tgz#cf0fc11e826c919bcb25270d1a808d6a4597ee3f" + integrity sha512-lZ7FC1F+LSQvYWOR2VwoOw28B98rOKT1T4YhPKzOlBkGO6TlOE5V2+VwDOFA8mPr7I0ZanQfSnmMJRoLbo4Bog== + dependencies: + "@dhis2/prop-types" "^1.6.4" + "@dhis2/ui-constants" "5.0.1" + "@dhis2/ui-icons" "5.0.1" + "@popperjs/core" "^2.4.0" + classnames "^2.2.6" + react-popper "^2.2.3" + resize-observer-polyfill "^1.5.1" + +"@dhis2/ui-core@^4.6.1": version "4.21.1" resolved "https://registry.yarnpkg.com/@dhis2/ui-core/-/ui-core-4.21.1.tgz#2b5518f6bd5de75404df3eefa83452e0c40852aa" integrity sha512-dpK4UwktLw9qcRkDe5wU76j35ntoulqKpcaBoxXZ1+/rzR2FeaJ+w4l+I+bg45jcK9WjLLsFClc1zi+O/MG1MA== @@ -1294,6 +1332,13 @@ react-popper "^2.2.3" resize-observer-polyfill "^1.5.1" +"@dhis2/ui-icons@5.0.1": + version "5.0.1" + resolved "https://registry.yarnpkg.com/@dhis2/ui-icons/-/ui-icons-5.0.1.tgz#67ca1f0ec3b98c08986758527917df0d4aa4e78f" + integrity sha512-Gmh+nRsRiK3JNCB7BY/pBQAStBCX7/c/EOovUY0UzdYXhoA88pwDpRDtfhFhwaDx63rdWzs45AjEMng5DxqQNw== + dependencies: + "@dhis2/prop-types" "^1.6.4" + "@dhis2/ui-widgets@^2.1.1": version "2.1.1" resolved "https://registry.yarnpkg.com/@dhis2/ui-widgets/-/ui-widgets-2.1.1.tgz#23b1887c0190e83bb7a41e6b570dfd41ba99d838" @@ -1302,6 +1347,20 @@ "@dhis2/prop-types" "^1.6" classnames "^2.2.6" +"@dhis2/ui-widgets@^5.0.1": + version "5.0.1" + resolved "https://registry.yarnpkg.com/@dhis2/ui-widgets/-/ui-widgets-5.0.1.tgz#ecb5a2ae3319cd5345450bb11dc85a3b0956b709" + integrity sha512-v5fRMEyXHVLvZ7dsHMFSn3HQSO0t4E6/Fd630/ja+oOw/GbDnyGfK8xayr62vu4zpjUZu14NbP5o5THTBpnSTw== + dependencies: + "@dhis2/app-runtime" "^2.2.1" + "@dhis2/d2-i18n" "^1" + "@dhis2/prop-types" "^1.6.4" + "@dhis2/ui-constants" "5.0.1" + "@dhis2/ui-core" "5.0.1" + "@dhis2/ui-icons" "5.0.1" + classnames "^2.2.6" + resize-observer-polyfill "^1.5.1" + "@emotion/cache@^10.0.27": version "10.0.29" resolved "https://registry.yarnpkg.com/@emotion/cache/-/cache-10.0.29.tgz#87e7e64f412c060102d589fe7c6dc042e6f9d1e0" From 33485dc34119108ff1247d6af9a893902bbec602 Mon Sep 17 00:00:00 2001 From: Jen Jones Arnesen Date: Wed, 3 Jun 2020 21:48:42 -0700 Subject: [PATCH 02/25] fix: partly working dynamic dimension --- .../DynamicDimension/ItemSelector.js | 19 ++++----- src/components/TransferOption.js | 42 +++++++++++-------- 2 files changed, 33 insertions(+), 28 deletions(-) diff --git a/src/components/DynamicDimension/ItemSelector.js b/src/components/DynamicDimension/ItemSelector.js index 6d07a5fa1..e60a41cfa 100644 --- a/src/components/DynamicDimension/ItemSelector.js +++ b/src/components/DynamicDimension/ItemSelector.js @@ -5,7 +5,7 @@ import i18n from '@dhis2/d2-i18n' import styles from '../styles/DimensionSelector.style' import { TransferOption } from '../TransferOption' -import GenericIcon from '../../assets/DimensionItemIcons/GenericIcon' +// import GenericIcon from '../../assets/DimensionItemIcons/GenericIcon' import { TRANSFER_HEIGHT, TRANSFER_OPTIONS_WIDTH, @@ -34,6 +34,10 @@ const ItemSelector = ({ ) + const transferItems = allItems.map(({ id, name }) => { + return { label: name, value: id } + }) + return ( { @@ -49,18 +53,11 @@ const ItemSelector = ({ selectedWidth={TRANSFER_SELECTED_WIDTH} selectedEmptyComponent={renderEmptySelection()} rightFooter={rightFooter} + options={transferItems} + renderOption={TransferOption} // TODO: Add a filter placeholer once the Transfer component supports this (https://github.com/dhis2/ui/issues/131) // TODO: Add rightHeader "Selected Periods" once the Transfer component supports this (https://github.com/dhis2/ui-core/issues/885) - > - {allItems.map(item => ( - - ))} - + /> ) } diff --git a/src/components/TransferOption.js b/src/components/TransferOption.js index b77882d54..d3381456b 100644 --- a/src/components/TransferOption.js +++ b/src/components/TransferOption.js @@ -1,10 +1,12 @@ -import React, { useRef } from 'react' +// import React, { useRef } from 'react' +import React from 'react' import cx from 'classnames' import propTypes from '@dhis2/prop-types' +import GenericIcon from '../assets/DimensionItemIcons/GenericIcon' import styles from './styles/TransferOption.style' -const DOUBLE_CLICK_MAX_DELAY = 500 +// const DOUBLE_CLICK_MAX_DELAY = 500 export const TransferOption = ({ disabled, @@ -13,9 +15,9 @@ export const TransferOption = ({ onClick, onDoubleClick, value, - icon, + // icon, }) => { - const doubleClickTimeout = useRef(null) + // const doubleClickTimeout = useRef(null) return (
@@ -26,22 +28,28 @@ export const TransferOption = ({ const option = { label, value } - if (doubleClickTimeout.current) { - clearTimeout(doubleClickTimeout.current) - doubleClickTimeout.current = null + // if (doubleClickTimeout.current) { + // clearTimeout(doubleClickTimeout.current) + // doubleClickTimeout.current = null - onDoubleClick({ option }, event) - } else { - doubleClickTimeout.current = setTimeout(() => { - clearTimeout(doubleClickTimeout.current) - doubleClickTimeout.current = null - }, DOUBLE_CLICK_MAX_DELAY) + // onDoubleClick({ option }, event) + // } else { + // doubleClickTimeout.current = setTimeout(() => { + // clearTimeout(doubleClickTimeout.current) + // doubleClickTimeout.current = null + // }, DOUBLE_CLICK_MAX_DELAY) - onClick({ option }, event) - } + onClick({ option }, event) + // } + }} + onDoubleClick={event => { + if (disabled) return + + const option = { label, value } + onDoubleClick({ option }, event) }} > - {icon} + {GenericIcon} {label}
@@ -55,7 +63,7 @@ TransferOption.propTypes = { value: propTypes.string.isRequired, disabled: propTypes.bool, highlighted: propTypes.bool, - icon: propTypes.node, + // icon: propTypes.node, onClick: propTypes.func, onDoubleClick: propTypes.func, } From c55027c5b675f6fdcd755dbaee3662a260e8d80d Mon Sep 17 00:00:00 2001 From: Martin Ohlson Date: Thu, 4 Jun 2020 14:21:38 +0200 Subject: [PATCH 03/25] refactor: replaced all ui- deps with ui --- package.json | 4 +- .../DataDimension/DataTypesSelector.js | 3 +- src/components/DataDimension/Detail.js | 3 +- src/components/DataDimension/Groups.js | 4 +- .../DataDimension/styles/Groups.style.js | 2 +- .../List/styles/DimensionItem.style.js | 2 +- .../List/styles/DimensionList.style.js | 2 +- .../List/styles/RecommendedIcon.style.js | 2 +- .../styles/DimensionsPanel.style.js | 2 +- .../DynamicDimension/ItemSelector.js | 2 +- src/components/Filter/Filter.js | 2 +- .../Filter/__tests__/Filter.spec.js | 2 +- src/components/ItemSelector/SelectedItems.js | 3 +- .../ItemSelector/UnselectedItems.js | 2 +- .../ItemSelector/styles/ItemSelector.style.js | 2 +- .../styles/SelectedItems.style.js | 2 +- .../ItemSelector/widgets/SelectedItem.js | 2 +- .../ItemSelector/widgets/UnselectedItem.js | 2 +- .../widgets/styles/ArrowButton.style.js | 2 +- .../widgets/styles/SelectedItem.style.js | 2 +- .../widgets/styles/UnselectedItem.style.js | 2 +- .../OrgUnitDimension/OrgUnitDimension.js | 3 +- .../PeriodDimension/FixedPeriodFilter.js | 3 +- .../PeriodDimension/PeriodSelector.js | 3 +- .../PeriodDimension/RelativePeriodFilter.js | 3 +- .../styles/PeriodFilter.style.js | 2 +- .../PivotTable/styles/PivotTable.style.js | 2 +- .../styles/DimensionSelector.style.js | 2 +- .../styles/DimensionsPanel.style.js | 2 +- src/components/styles/FilterField.style.js | 2 +- src/components/styles/TransferOption.style.js | 2 +- src/modules/pivotTable/applyLegendSet.js | 2 +- yarn.lock | 76 ++++++++++++++++--- 33 files changed, 99 insertions(+), 52 deletions(-) diff --git a/package.json b/package.json index 4c2d52fd9..c4ec89764 100644 --- a/package.json +++ b/package.json @@ -45,9 +45,7 @@ }, "dependencies": { "@dhis2/d2-ui-org-unit-dialog": "^7.0.3", - "@dhis2/ui-constants": "^5.0.1", - "@dhis2/ui-core": "^5.0.1", - "@dhis2/ui-widgets": "^5.0.1", + "@dhis2/ui": "^5.0.1", "@material-ui/core": "^3.9.3", "@material-ui/icons": "^3.0.2", "classnames": "^2.2.6", diff --git a/src/components/DataDimension/DataTypesSelector.js b/src/components/DataDimension/DataTypesSelector.js index e6449064e..211d73639 100644 --- a/src/components/DataDimension/DataTypesSelector.js +++ b/src/components/DataDimension/DataTypesSelector.js @@ -1,8 +1,7 @@ import React from 'react' import PropTypes from 'prop-types' import i18n from '@dhis2/d2-i18n' -import { SingleSelectField } from '@dhis2/ui-widgets' -import { SingleSelectOption } from '@dhis2/ui-core' +import { SingleSelectField, SingleSelectOption } from '@dhis2/ui' import { dataTypes } from '../../modules/dataTypes' import styles from './styles/DataTypesSelector.style' diff --git a/src/components/DataDimension/Detail.js b/src/components/DataDimension/Detail.js index 51e03188c..5778e4cb4 100644 --- a/src/components/DataDimension/Detail.js +++ b/src/components/DataDimension/Detail.js @@ -1,8 +1,7 @@ import React from 'react' import PropTypes from 'prop-types' import i18n from '@dhis2/d2-i18n' -import { SingleSelectField } from '@dhis2/ui-widgets' -import { SingleSelectOption } from '@dhis2/ui-core' +import { SingleSelectField, SingleSelectOption } from '@dhis2/ui' import { TOTALS, DETAIL } from '../../modules/dataTypes' import styles from './styles/Detail.style' diff --git a/src/components/DataDimension/Groups.js b/src/components/DataDimension/Groups.js index 2ec4e76ee..60f49039f 100644 --- a/src/components/DataDimension/Groups.js +++ b/src/components/DataDimension/Groups.js @@ -1,7 +1,7 @@ import React from 'react' import PropTypes from 'prop-types' -import { SingleSelectField } from '@dhis2/ui-widgets' -import { SingleSelectOption } from '@dhis2/ui-core' +import { SingleSelectField } from '@dhis2/ui' +import { SingleSelectOption } from '@dhis2/ui' import { Detail } from './Detail' import { dataTypes } from '../../modules/dataTypes' diff --git a/src/components/DataDimension/styles/Groups.style.js b/src/components/DataDimension/styles/Groups.style.js index 0edbd7384..0ffd0282c 100644 --- a/src/components/DataDimension/styles/Groups.style.js +++ b/src/components/DataDimension/styles/Groups.style.js @@ -1,5 +1,5 @@ import css from 'styled-jsx/css' -import { colors } from '@dhis2/ui-constants' +import { colors } from '@dhis2/ui' export default css` .container { diff --git a/src/components/DimensionsPanel/List/styles/DimensionItem.style.js b/src/components/DimensionsPanel/List/styles/DimensionItem.style.js index f7dcc93b8..0be4b3787 100644 --- a/src/components/DimensionsPanel/List/styles/DimensionItem.style.js +++ b/src/components/DimensionsPanel/List/styles/DimensionItem.style.js @@ -1,4 +1,4 @@ -import { colors, theme } from '@dhis2/ui-constants' +import { colors, theme } from '@dhis2/ui' export const styles = { labelWrapper: { diff --git a/src/components/DimensionsPanel/List/styles/DimensionList.style.js b/src/components/DimensionsPanel/List/styles/DimensionList.style.js index 9ceabc27b..79eb6b5c9 100644 --- a/src/components/DimensionsPanel/List/styles/DimensionList.style.js +++ b/src/components/DimensionsPanel/List/styles/DimensionList.style.js @@ -1,4 +1,4 @@ -import { colors, spacers } from '@dhis2/ui-constants' +import { colors, spacers } from '@dhis2/ui' // Fix for vertical flex scrolling in Firefox/Safari: // Wrap the list in a div with position:relative (and flex:1 instead of on the list) diff --git a/src/components/DimensionsPanel/List/styles/RecommendedIcon.style.js b/src/components/DimensionsPanel/List/styles/RecommendedIcon.style.js index ca63045c2..23bbdb861 100644 --- a/src/components/DimensionsPanel/List/styles/RecommendedIcon.style.js +++ b/src/components/DimensionsPanel/List/styles/RecommendedIcon.style.js @@ -1,4 +1,4 @@ -import { colors, theme } from '@dhis2/ui-constants' +import { colors, theme } from '@dhis2/ui' export const styles = { toolTip: { diff --git a/src/components/DimensionsPanel/styles/DimensionsPanel.style.js b/src/components/DimensionsPanel/styles/DimensionsPanel.style.js index 5d138e93e..8bf0b3294 100644 --- a/src/components/DimensionsPanel/styles/DimensionsPanel.style.js +++ b/src/components/DimensionsPanel/styles/DimensionsPanel.style.js @@ -1,4 +1,4 @@ -import { colors } from '@dhis2/ui-constants' +import { colors } from '@dhis2/ui' export const styles = { divContainer: { diff --git a/src/components/DynamicDimension/ItemSelector.js b/src/components/DynamicDimension/ItemSelector.js index e60a41cfa..23cb7c021 100644 --- a/src/components/DynamicDimension/ItemSelector.js +++ b/src/components/DynamicDimension/ItemSelector.js @@ -1,6 +1,6 @@ import React, { useState } from 'react' import PropTypes from 'prop-types' -import { Transfer } from '@dhis2/ui-widgets' +import { Transfer } from '@dhis2/ui' import i18n from '@dhis2/d2-i18n' import styles from '../styles/DimensionSelector.style' diff --git a/src/components/Filter/Filter.js b/src/components/Filter/Filter.js index 0613b6495..04496dd2e 100644 --- a/src/components/Filter/Filter.js +++ b/src/components/Filter/Filter.js @@ -1,6 +1,6 @@ import React from 'react' import PropTypes from 'prop-types' -import { InputField } from '@dhis2/ui-widgets' +import { InputField } from '@dhis2/ui' export const Filter = ({ text, onChange, onClear, placeholder, type }) => ( event => diff --git a/src/components/ItemSelector/widgets/UnselectedItem.js b/src/components/ItemSelector/widgets/UnselectedItem.js index 0932189d5..56def32df 100644 --- a/src/components/ItemSelector/widgets/UnselectedItem.js +++ b/src/components/ItemSelector/widgets/UnselectedItem.js @@ -3,7 +3,7 @@ import PropTypes from 'prop-types' import cx from 'classnames' import ItemIcon from './ItemIcon' -import { colors } from '@dhis2/ui-constants' +import { colors } from '@dhis2/ui' import styles from './styles/UnselectedItem.style' const onClickWrapper = ({ id, index, onClick }) => event => diff --git a/src/components/ItemSelector/widgets/styles/ArrowButton.style.js b/src/components/ItemSelector/widgets/styles/ArrowButton.style.js index a42bf5db7..9cf8e093a 100644 --- a/src/components/ItemSelector/widgets/styles/ArrowButton.style.js +++ b/src/components/ItemSelector/widgets/styles/ArrowButton.style.js @@ -1,4 +1,4 @@ -import { colors } from '@dhis2/ui-constants' +import { colors } from '@dhis2/ui' import css from 'styled-jsx/css' export default css` diff --git a/src/components/ItemSelector/widgets/styles/SelectedItem.style.js b/src/components/ItemSelector/widgets/styles/SelectedItem.style.js index 7d27ac513..08bb938e0 100644 --- a/src/components/ItemSelector/widgets/styles/SelectedItem.style.js +++ b/src/components/ItemSelector/widgets/styles/SelectedItem.style.js @@ -1,4 +1,4 @@ -import { colors, theme } from '@dhis2/ui-constants' +import { colors, theme } from '@dhis2/ui' import css from 'styled-jsx/css' export default css` diff --git a/src/components/ItemSelector/widgets/styles/UnselectedItem.style.js b/src/components/ItemSelector/widgets/styles/UnselectedItem.style.js index 23d5da37a..fa322e5c2 100644 --- a/src/components/ItemSelector/widgets/styles/UnselectedItem.style.js +++ b/src/components/ItemSelector/widgets/styles/UnselectedItem.style.js @@ -1,4 +1,4 @@ -import { colors, theme } from '@dhis2/ui-constants' +import { colors, theme } from '@dhis2/ui' import css from 'styled-jsx/css' export default css` diff --git a/src/components/OrgUnitDimension/OrgUnitDimension.js b/src/components/OrgUnitDimension/OrgUnitDimension.js index ef1f147e2..2f8bb9ab2 100644 --- a/src/components/OrgUnitDimension/OrgUnitDimension.js +++ b/src/components/OrgUnitDimension/OrgUnitDimension.js @@ -2,7 +2,7 @@ import React, { Component, Fragment } from 'react' import PropTypes from 'prop-types' import sortBy from 'lodash/sortBy' import { OrgUnitSelector, userOrgUnits } from '@dhis2/d2-ui-org-unit-dialog' -import { CircularLoader } from '@dhis2/ui-core' +import { CircularLoader, colors } from '@dhis2/ui' import { apiFetchOrganisationUnitGroups, @@ -12,7 +12,6 @@ import { import { ouIdHelper } from '../../modules/ouIdHelper' import { DIMENSION_ID_ORGUNIT } from '../../modules/predefinedDimensions' import styles from './styles/OrgUnitDimension.style' -import { colors } from '@dhis2/ui-constants' export const defaultState = { root: undefined, diff --git a/src/components/PeriodDimension/FixedPeriodFilter.js b/src/components/PeriodDimension/FixedPeriodFilter.js index 7aeaf5bd4..d2d7c2643 100644 --- a/src/components/PeriodDimension/FixedPeriodFilter.js +++ b/src/components/PeriodDimension/FixedPeriodFilter.js @@ -1,8 +1,7 @@ import React from 'react' import PropTypes from 'prop-types' import i18n from '@dhis2/d2-i18n' -import { SingleSelectField, InputField } from '@dhis2/ui-widgets' -import { SingleSelectOption } from '@dhis2/ui-core' +import { SingleSelectField, InputField, SingleSelectOption } from '@dhis2/ui' import { getFixedPeriodsOptions } from './utils/fixedPeriods' import styles from './styles/PeriodFilter.style' diff --git a/src/components/PeriodDimension/PeriodSelector.js b/src/components/PeriodDimension/PeriodSelector.js index fde69121d..3e8de42f6 100644 --- a/src/components/PeriodDimension/PeriodSelector.js +++ b/src/components/PeriodDimension/PeriodSelector.js @@ -1,7 +1,6 @@ import React, { Component } from 'react' import PropTypes from 'prop-types' -import { TabBar, Tab } from '@dhis2/ui-core' -import { Transfer } from '@dhis2/ui-widgets' +import { TabBar, Tab, Transfer } from '@dhis2/ui' import i18n from '@dhis2/d2-i18n' import FixedPeriodFilter from './FixedPeriodFilter' diff --git a/src/components/PeriodDimension/RelativePeriodFilter.js b/src/components/PeriodDimension/RelativePeriodFilter.js index 67b50b673..a7fc2c113 100644 --- a/src/components/PeriodDimension/RelativePeriodFilter.js +++ b/src/components/PeriodDimension/RelativePeriodFilter.js @@ -1,8 +1,7 @@ import React from 'react' import PropTypes from 'prop-types' import i18n from '@dhis2/d2-i18n' -import { SingleSelectField } from '@dhis2/ui-widgets' -import { SingleSelectOption } from '@dhis2/ui-core' +import { SingleSelectField, SingleSelectOption } from '@dhis2/ui' import { getRelativePeriodsOptions } from './utils/relativePeriods' import styles from './styles/PeriodFilter.style' diff --git a/src/components/PeriodDimension/styles/PeriodFilter.style.js b/src/components/PeriodDimension/styles/PeriodFilter.style.js index 306ec544c..0ef8255ed 100644 --- a/src/components/PeriodDimension/styles/PeriodFilter.style.js +++ b/src/components/PeriodDimension/styles/PeriodFilter.style.js @@ -1,5 +1,5 @@ import css from 'styled-jsx/css' -import { spacers } from '@dhis2/ui-constants' +import { spacers } from '@dhis2/ui' export default css` .leftSection { diff --git a/src/components/PivotTable/styles/PivotTable.style.js b/src/components/PivotTable/styles/PivotTable.style.js index 63a15ae00..c51a6e611 100644 --- a/src/components/PivotTable/styles/PivotTable.style.js +++ b/src/components/PivotTable/styles/PivotTable.style.js @@ -1,5 +1,5 @@ import css from 'styled-jsx/css' -import { colors } from '@dhis2/ui-constants' +import { colors } from '@dhis2/ui' import { DISPLAY_DENSITY_PADDING_COMPACT, DISPLAY_DENSITY_PADDING_NORMAL, diff --git a/src/components/styles/DimensionSelector.style.js b/src/components/styles/DimensionSelector.style.js index 29b2bc67e..932b6f699 100644 --- a/src/components/styles/DimensionSelector.style.js +++ b/src/components/styles/DimensionSelector.style.js @@ -1,5 +1,5 @@ import css from 'styled-jsx/css' -import { spacers, colors } from '@dhis2/ui-constants' +import { spacers, colors } from '@dhis2/ui' export default css` .filterContainer { diff --git a/src/components/styles/DimensionsPanel.style.js b/src/components/styles/DimensionsPanel.style.js index a7c631a11..391f3655a 100644 --- a/src/components/styles/DimensionsPanel.style.js +++ b/src/components/styles/DimensionsPanel.style.js @@ -1,4 +1,4 @@ -import { colors } from '@dhis2/ui-constants' +import { colors } from '@dhis2/ui' export const styles = { divContainer: { diff --git a/src/components/styles/FilterField.style.js b/src/components/styles/FilterField.style.js index 9789f8e5a..74c11d342 100644 --- a/src/components/styles/FilterField.style.js +++ b/src/components/styles/FilterField.style.js @@ -1,5 +1,5 @@ import css from 'styled-jsx/css' -import { colors } from '@dhis2/ui-constants' +import { colors } from '@dhis2/ui' export default css` .container { diff --git a/src/components/styles/TransferOption.style.js b/src/components/styles/TransferOption.style.js index bfc350e53..064004dd2 100644 --- a/src/components/styles/TransferOption.style.js +++ b/src/components/styles/TransferOption.style.js @@ -1,5 +1,5 @@ import css from 'styled-jsx/css' -import { colors, spacers, theme } from '@dhis2/ui-constants' +import { colors, spacers, theme } from '@dhis2/ui' export default css` .wrapper:last-child { diff --git a/src/modules/pivotTable/applyLegendSet.js b/src/modules/pivotTable/applyLegendSet.js index 6530f4a9c..704f8ae45 100644 --- a/src/modules/pivotTable/applyLegendSet.js +++ b/src/modules/pivotTable/applyLegendSet.js @@ -1,5 +1,5 @@ import { isColorBright } from './isColorBright' -import { colors } from '@dhis2/ui-constants' +import { colors } from '@dhis2/ui' import { getColorByValueFromLegendSet, LEGEND_DISPLAY_STRATEGY_BY_DATA_ITEM, diff --git a/yarn.lock b/yarn.lock index 2b0334bb3..c51705da8 100644 --- a/yarn.lock +++ b/yarn.lock @@ -936,6 +936,13 @@ dependencies: regenerator-runtime "^0.13.4" +"@babel/runtime@^7.10.0": + version "7.10.2" + resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.10.2.tgz#d103f21f2602497d38348a32e008637d506db839" + integrity sha512-6sF3uQw2ivImfVIl62RZ7MXhO2tap69WeWK57vAaimT6AZbE4FbqjdEJIN1UqoD6wI6B+1n9UiagafH1sxjOtg== + dependencies: + regenerator-runtime "^0.13.4" + "@babel/template@^7.4.0", "@babel/template@^7.8.3", "@babel/template@^7.8.6": version "7.8.6" resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.8.6.tgz#86b22af15f828dfb086474f964dcc3e39c43ce2b" @@ -1301,14 +1308,14 @@ dependencies: prop-types "^15" -"@dhis2/ui-constants@5.0.1", "@dhis2/ui-constants@^5.0.1": +"@dhis2/ui-constants@5.0.1": version "5.0.1" resolved "https://registry.yarnpkg.com/@dhis2/ui-constants/-/ui-constants-5.0.1.tgz#6e85e8aa1790c4cb37edd7218edfe57b5de13c33" integrity sha512-9YKKUUSLX4vI/StkhxmRnXglMCcWkBun0dNNQUFWV28RyJIeu9YeWlpdxHEPRvCVgcguoFwHQxJ6ULdFqYO65A== dependencies: "@dhis2/prop-types" "^1.6.4" -"@dhis2/ui-core@5.0.1", "@dhis2/ui-core@^5.0.1": +"@dhis2/ui-core@5.0.1": version "5.0.1" resolved "https://registry.yarnpkg.com/@dhis2/ui-core/-/ui-core-5.0.1.tgz#cf0fc11e826c919bcb25270d1a808d6a4597ee3f" integrity sha512-lZ7FC1F+LSQvYWOR2VwoOw28B98rOKT1T4YhPKzOlBkGO6TlOE5V2+VwDOFA8mPr7I0ZanQfSnmMJRoLbo4Bog== @@ -1332,6 +1339,17 @@ react-popper "^2.2.3" resize-observer-polyfill "^1.5.1" +"@dhis2/ui-forms@5.0.1": + version "5.0.1" + resolved "https://registry.yarnpkg.com/@dhis2/ui-forms/-/ui-forms-5.0.1.tgz#4f9be1cd9d220c16ce236b786c2c59f69b1dac46" + integrity sha512-iRkjn01gfjss1R8Y4ogwgB48seLKG/zwkafk+0TwP/CVl5AdRRIb3p9XHInBGCwbvEg3XchvmD/5eg8ueTzBJg== + dependencies: + "@dhis2/prop-types" "^1.6.4" + "@dhis2/ui-core" "5.0.1" + classnames "^2.2.6" + final-form "^4.20.0" + react-final-form "^6.5.0" + "@dhis2/ui-icons@5.0.1": version "5.0.1" resolved "https://registry.yarnpkg.com/@dhis2/ui-icons/-/ui-icons-5.0.1.tgz#67ca1f0ec3b98c08986758527917df0d4aa4e78f" @@ -1339,6 +1357,20 @@ dependencies: "@dhis2/prop-types" "^1.6.4" +"@dhis2/ui-widgets@5.0.1": + version "5.0.1" + resolved "https://registry.yarnpkg.com/@dhis2/ui-widgets/-/ui-widgets-5.0.1.tgz#ecb5a2ae3319cd5345450bb11dc85a3b0956b709" + integrity sha512-v5fRMEyXHVLvZ7dsHMFSn3HQSO0t4E6/Fd630/ja+oOw/GbDnyGfK8xayr62vu4zpjUZu14NbP5o5THTBpnSTw== + dependencies: + "@dhis2/app-runtime" "^2.2.1" + "@dhis2/d2-i18n" "^1" + "@dhis2/prop-types" "^1.6.4" + "@dhis2/ui-constants" "5.0.1" + "@dhis2/ui-core" "5.0.1" + "@dhis2/ui-icons" "5.0.1" + classnames "^2.2.6" + resize-observer-polyfill "^1.5.1" + "@dhis2/ui-widgets@^2.1.1": version "2.1.1" resolved "https://registry.yarnpkg.com/@dhis2/ui-widgets/-/ui-widgets-2.1.1.tgz#23b1887c0190e83bb7a41e6b570dfd41ba99d838" @@ -1347,19 +1379,16 @@ "@dhis2/prop-types" "^1.6" classnames "^2.2.6" -"@dhis2/ui-widgets@^5.0.1": +"@dhis2/ui@^5.0.1": version "5.0.1" - resolved "https://registry.yarnpkg.com/@dhis2/ui-widgets/-/ui-widgets-5.0.1.tgz#ecb5a2ae3319cd5345450bb11dc85a3b0956b709" - integrity sha512-v5fRMEyXHVLvZ7dsHMFSn3HQSO0t4E6/Fd630/ja+oOw/GbDnyGfK8xayr62vu4zpjUZu14NbP5o5THTBpnSTw== + resolved "https://registry.yarnpkg.com/@dhis2/ui/-/ui-5.0.1.tgz#5b7c961afd9dab411ae38aaead4092fd4ba4c023" + integrity sha512-5oORi/j0w+QpZaKTclMamnzUR8t8GakLAMvWlUdUfCkwyk2NTbq5JVn7t4JgKgHs7wj4SHNoyXiMvjcCauzkNg== dependencies: - "@dhis2/app-runtime" "^2.2.1" - "@dhis2/d2-i18n" "^1" - "@dhis2/prop-types" "^1.6.4" "@dhis2/ui-constants" "5.0.1" "@dhis2/ui-core" "5.0.1" + "@dhis2/ui-forms" "5.0.1" "@dhis2/ui-icons" "5.0.1" - classnames "^2.2.6" - resize-observer-polyfill "^1.5.1" + "@dhis2/ui-widgets" "5.0.1" "@emotion/cache@^10.0.27": version "10.0.29" @@ -1772,6 +1801,11 @@ "@storybook/react" "^5.3.3" uuid "^3.1.0" +"@scarf/scarf@^1.0.5": + version "1.0.5" + resolved "https://registry.yarnpkg.com/@scarf/scarf/-/scarf-1.0.5.tgz#accee0bce88a9047672f7c8faf3cada59c996b81" + integrity sha512-9WKaGVpQH905Aqkk+BczFEeLQxS07rl04afFRPUG9IcSlOwmo5EVVuuNu0d4M9LMYucObvK0LoAe+5HfMW2QhQ== + "@sindresorhus/is@^0.14.0": version "0.14.0" resolved "https://registry.yarnpkg.com/@sindresorhus/is/-/is-0.14.0.tgz#9fb3a3cf3132328151f353de4632e01e52102bea" @@ -6864,6 +6898,14 @@ fill-range@^7.0.1: dependencies: to-regex-range "^5.0.1" +final-form@^4.20.0: + version "4.20.0" + resolved "https://registry.yarnpkg.com/final-form/-/final-form-4.20.0.tgz#454ba46f783a4c4404ad875cf36f470395ad5efa" + integrity sha512-kdPGNlR/23M2p7ccVwE/vCBQH9TH1NAhhMVkETHbaQXkTWIJdEii3ZdHrOgYvFY7O87myEhcqzx3zjMERtoNJg== + dependencies: + "@babel/runtime" "^7.10.0" + "@scarf/scarf" "^1.0.5" + finalhandler@~1.1.2: version "1.1.2" resolved "https://registry.yarnpkg.com/finalhandler/-/finalhandler-1.1.2.tgz#b7e7d000ffd11938d0fdb053506f6ebabe9f587d" @@ -12669,6 +12711,15 @@ react-fast-compare@^3.0.1: resolved "https://registry.yarnpkg.com/react-fast-compare/-/react-fast-compare-3.1.1.tgz#0becf31e3812fa70dc231e259f40d892d4767900" integrity sha512-SCsAORWK59BvauR2L1BTdjQbJcSGJJz03U0awektk2hshLKrITDDFTlgGCqIZpTDlPC/NFlZee6xTMzXPVLiHw== +react-final-form@^6.5.0: + version "6.5.0" + resolved "https://registry.yarnpkg.com/react-final-form/-/react-final-form-6.5.0.tgz#b0440acf534fd57991c048764ab20af13124aed6" + integrity sha512-H97PLCtfMIN32NHqm85E738Pj+NOF1p0eQEG+h5DbdaofwtqDRp7taHu45+PlXOqg9ANbM6MyXkYxWpIiE6qbQ== + dependencies: + "@babel/runtime" "^7.10.0" + "@scarf/scarf" "^1.0.5" + ts-essentials "^6.0.5" + react-focus-lock@^2.1.0: version "2.2.1" resolved "https://registry.yarnpkg.com/react-focus-lock/-/react-focus-lock-2.2.1.tgz#1d12887416925dc53481914b7cedd39494a3b24a" @@ -14914,6 +14965,11 @@ ts-dedent@^1.1.0: resolved "https://registry.yarnpkg.com/ts-dedent/-/ts-dedent-1.1.1.tgz#68fad040d7dbd53a90f545b450702340e17d18f3" integrity sha512-UGTRZu1evMw4uTPyYF66/KFd22XiU+jMaIuHrkIHQ2GivAXVlLV0v/vHrpOuTRf9BmpNHi/SO7Vd0rLu0y57jg== +ts-essentials@^6.0.5: + version "6.0.5" + resolved "https://registry.yarnpkg.com/ts-essentials/-/ts-essentials-6.0.5.tgz#dd5b98f73bd56dc94d15dfbc0fbf01da3163eb42" + integrity sha512-RSAKlpu+E0DCGY8FsbG92EveRLw2Y+UgK3ksX01w1VaHeG01dKkYo/KtAV4q0qPT6nPbLfyerb2YPVSediP+8g== + ts-pnp@1.1.6, ts-pnp@^1.1.2, ts-pnp@^1.1.6: version "1.1.6" resolved "https://registry.yarnpkg.com/ts-pnp/-/ts-pnp-1.1.6.tgz#389a24396d425a0d3162e96d2b4638900fdc289a" From aa12c8a64c6ee8ca429404cc053adb9946e8d7e9 Mon Sep 17 00:00:00 2001 From: Martin Ohlson Date: Thu, 4 Jun 2020 14:32:01 +0200 Subject: [PATCH 04/25] test: added DynamicDimension story --- src/__demo__/DynamicDimension.stories.js | 18 ++++++++++++++++++ 1 file changed, 18 insertions(+) create mode 100644 src/__demo__/DynamicDimension.stories.js diff --git a/src/__demo__/DynamicDimension.stories.js b/src/__demo__/DynamicDimension.stories.js new file mode 100644 index 000000000..549fc7127 --- /dev/null +++ b/src/__demo__/DynamicDimension.stories.js @@ -0,0 +1,18 @@ +import React from 'react' +import { storiesOf } from '@storybook/react' + +import ItemSelector from '../components/DynamicDimension/ItemSelector' + +const items = [ + { id: '1', name: 'One' }, + { id: '2', name: 'Two' }, +] + +storiesOf('DynamicDimension', module).add('ItemSelector', () => { + return ( + console.log(selected)} + allItems={items} + /> + ) +}) From a821728d661881f1b00923148a6fe35ce66c8c68 Mon Sep 17 00:00:00 2001 From: Martin Ohlson Date: Thu, 4 Jun 2020 14:33:51 +0200 Subject: [PATCH 05/25] test: snapshot update --- .../__snapshots__/SelectedItems.spec.js.snap | 52 ++++++++++++++----- .../__snapshots__/PeriodSelector.spec.js.snap | 1 + 2 files changed, 39 insertions(+), 14 deletions(-) diff --git a/src/components/ItemSelector/__tests__/__snapshots__/SelectedItems.spec.js.snap b/src/components/ItemSelector/__tests__/__snapshots__/SelectedItems.spec.js.snap index dfaa682d0..971c5734c 100644 --- a/src/components/ItemSelector/__tests__/__snapshots__/SelectedItems.spec.js.snap +++ b/src/components/ItemSelector/__tests__/__snapshots__/SelectedItems.spec.js.snap @@ -567,19 +567,31 @@ exports[`The SelectedItems component list with items matches the snapshot with l onClick={[Function]} type="button" > - + +
- + +
} selected={Array []} selectedEmptyComponent={ From 44d63a199529c9761cfbe75e3754eadbc8fb22c3 Mon Sep 17 00:00:00 2001 From: Martin Ohlson Date: Thu, 4 Jun 2020 17:01:37 +0200 Subject: [PATCH 06/25] fix: dynamic dimensions works again --- .../DynamicDimension/DynamicDimension.js | 12 +++---- .../DynamicDimension/ItemSelector.js | 15 +++------ src/components/TransferOption.js | 33 ++++--------------- 3 files changed, 18 insertions(+), 42 deletions(-) diff --git a/src/components/DynamicDimension/DynamicDimension.js b/src/components/DynamicDimension/DynamicDimension.js index f7036174c..4aaaf4ede 100644 --- a/src/components/DynamicDimension/DynamicDimension.js +++ b/src/components/DynamicDimension/DynamicDimension.js @@ -20,14 +20,14 @@ export const DynamicDimension = ({ }, []) const getItems = async () => - setItems(await apiFetchItemsByDimension(context, dimensionId)) + setItems(await apiFetchItemsByDimension(context, dimensionId)) // TODO: refactor to use the data engine instead // TODO: This needs to be refactored to use a loading spinner once Transfer supports it: https://jira.dhis2.org/browse/TECH-379 - const selectItems = items => { - const formattedItems = items.map(item => ({ - id: item.value, - name: item.label, - })) + const selectItems = selectedItems => { + const formattedItems = selectedItems.map(selectedItem => ({ + id: selectedItem, + name: items.find(item => item.id === selectedItem).name, + })) // TODO: fetch the name from somewhere else, as not all content in selectedItems might be present in the items list onSelect({ dimensionId: dimensionId, items: formattedItems, diff --git a/src/components/DynamicDimension/ItemSelector.js b/src/components/DynamicDimension/ItemSelector.js index 23cb7c021..756562815 100644 --- a/src/components/DynamicDimension/ItemSelector.js +++ b/src/components/DynamicDimension/ItemSelector.js @@ -20,11 +20,7 @@ const ItemSelector = ({ rightFooter, }) => { const [selectedItems, setSelectedItems] = useState( - initialSelectedItems.map(item => ({ - label: item.name, - value: item.id, - key: item.id, - })) + initialSelectedItems.map(item => item.id) ) const renderEmptySelection = () => ( @@ -34,10 +30,6 @@ const ItemSelector = ({ ) - const transferItems = allItems.map(({ id, name }) => { - return { label: name, value: id } - }) - return ( { @@ -53,7 +45,10 @@ const ItemSelector = ({ selectedWidth={TRANSFER_SELECTED_WIDTH} selectedEmptyComponent={renderEmptySelection()} rightFooter={rightFooter} - options={transferItems} + options={allItems.map(({ id, name }) => ({ + label: name, + value: id, + }))} renderOption={TransferOption} // TODO: Add a filter placeholer once the Transfer component supports this (https://github.com/dhis2/ui/issues/131) // TODO: Add rightHeader "Selected Periods" once the Transfer component supports this (https://github.com/dhis2/ui-core/issues/885) diff --git a/src/components/TransferOption.js b/src/components/TransferOption.js index d3381456b..4d0e19fbf 100644 --- a/src/components/TransferOption.js +++ b/src/components/TransferOption.js @@ -1,4 +1,3 @@ -// import React, { useRef } from 'react' import React from 'react' import cx from 'classnames' import propTypes from '@dhis2/prop-types' @@ -6,8 +5,6 @@ import GenericIcon from '../assets/DimensionItemIcons/GenericIcon' import styles from './styles/TransferOption.style' -// const DOUBLE_CLICK_MAX_DELAY = 500 - export const TransferOption = ({ disabled, label, @@ -15,41 +12,25 @@ export const TransferOption = ({ onClick, onDoubleClick, value, - // icon, + //icon, }) => { - // const doubleClickTimeout = useRef(null) - return (
{ if (disabled) return - - const option = { label, value } - - // if (doubleClickTimeout.current) { - // clearTimeout(doubleClickTimeout.current) - // doubleClickTimeout.current = null - - // onDoubleClick({ option }, event) - // } else { - // doubleClickTimeout.current = setTimeout(() => { - // clearTimeout(doubleClickTimeout.current) - // doubleClickTimeout.current = null - // }, DOUBLE_CLICK_MAX_DELAY) - - onClick({ option }, event) - // } + onClick({ label, value }, event) }} onDoubleClick={event => { if (disabled) return - - const option = { label, value } - onDoubleClick({ option }, event) + onDoubleClick({ label, value }, event) }} > {GenericIcon} + { + // TODO: reimplement the custom icon, as different Dimensions need different icons + } {label}
@@ -63,7 +44,7 @@ TransferOption.propTypes = { value: propTypes.string.isRequired, disabled: propTypes.bool, highlighted: propTypes.bool, - // icon: propTypes.node, + //icon: propTypes.node, onClick: propTypes.func, onDoubleClick: propTypes.func, } From 930eb8d845cd860a735185062c1ba6898acb1838 Mon Sep 17 00:00:00 2001 From: Jen Jones Arnesen Date: Thu, 4 Jun 2020 16:31:55 -0700 Subject: [PATCH 07/25] fix: naming for clarity, story that needs addressing --- src/__demo__/DynamicDimension.stories.js | 28 ++++++++++++++++++- .../DynamicDimension/DynamicDimension.js | 19 ++++++++----- .../DynamicDimension/ItemSelector.js | 21 ++++++++------ 3 files changed, 52 insertions(+), 16 deletions(-) diff --git a/src/__demo__/DynamicDimension.stories.js b/src/__demo__/DynamicDimension.stories.js index 549fc7127..2f9d7808e 100644 --- a/src/__demo__/DynamicDimension.stories.js +++ b/src/__demo__/DynamicDimension.stories.js @@ -6,9 +6,12 @@ import ItemSelector from '../components/DynamicDimension/ItemSelector' const items = [ { id: '1', name: 'One' }, { id: '2', name: 'Two' }, + { id: '3', name: 'Three' }, + { id: '4', name: 'Four' }, + { id: '5', name: 'Five' }, ] -storiesOf('DynamicDimension', module).add('ItemSelector', () => { +storiesOf('DynamicDimension', module).add('ItemSelector none selected', () => { return ( console.log(selected)} @@ -16,3 +19,26 @@ storiesOf('DynamicDimension', module).add('ItemSelector', () => { /> ) }) + +storiesOf('DynamicDimension', module).add('ItemSelector one selected', () => { + return ( + console.log(selected)} + allItems={items} + initialSelectedItems={[{ id: '2' }]} + /> + ) +}) + +storiesOf('DynamicDimension', module).add( + 'ItemSelector one selected not in options', + () => { + return ( + console.log(selected)} + allItems={items} + initialSelectedItems={[{ id: '6' }]} + /> + ) + } +) diff --git a/src/components/DynamicDimension/DynamicDimension.js b/src/components/DynamicDimension/DynamicDimension.js index 4aaaf4ede..f21086f46 100644 --- a/src/components/DynamicDimension/DynamicDimension.js +++ b/src/components/DynamicDimension/DynamicDimension.js @@ -23,10 +23,10 @@ export const DynamicDimension = ({ setItems(await apiFetchItemsByDimension(context, dimensionId)) // TODO: refactor to use the data engine instead // TODO: This needs to be refactored to use a loading spinner once Transfer supports it: https://jira.dhis2.org/browse/TECH-379 - const selectItems = selectedItems => { - const formattedItems = selectedItems.map(selectedItem => ({ - id: selectedItem, - name: items.find(item => item.id === selectedItem).name, + const onSelectItems = selectedItemIds => { + const formattedItems = selectedItemIds.map(id => ({ + id, + name: items.find(item => item.id === id).name, })) // TODO: fetch the name from somewhere else, as not all content in selectedItems might be present in the items list onSelect({ dimensionId: dimensionId, @@ -36,9 +36,9 @@ export const DynamicDimension = ({ return ( item.id)} rightFooter={rightFooter} // TODO: Pass in a func prop to fetch items, instead of fetching them on this level, to enable the loading spinner? /> @@ -48,7 +48,12 @@ export const DynamicDimension = ({ DynamicDimension.propTypes = { context: PropTypes.object.isRequired, dimensionId: PropTypes.string.isRequired, - selectedItems: PropTypes.array.isRequired, + selectedItems: PropTypes.arrayOf( + PropTypes.shape({ + id: PropTypes.string, + name: PropTypes.string, + }) + ).isRequired, onSelect: PropTypes.func.isRequired, rightFooter: PropTypes.node, } diff --git a/src/components/DynamicDimension/ItemSelector.js b/src/components/DynamicDimension/ItemSelector.js index 756562815..47753f162 100644 --- a/src/components/DynamicDimension/ItemSelector.js +++ b/src/components/DynamicDimension/ItemSelector.js @@ -15,12 +15,12 @@ import { const ItemSelector = ({ allItems, onSelect, - initialSelectedItems, + initialSelectedItemIds, leftHeader, rightFooter, }) => { - const [selectedItems, setSelectedItems] = useState( - initialSelectedItems.map(item => item.id) + const [selectedItemIds, setSelectedItemIds] = useState( + initialSelectedItemIds ) const renderEmptySelection = () => ( @@ -33,10 +33,10 @@ const ItemSelector = ({ return ( { - setSelectedItems(selected) + setSelectedItemIds(selected) onSelect(selected) }} - selected={selectedItems} + selected={selectedItemIds} leftHeader={leftHeader} filterable enableOrderChange @@ -57,15 +57,20 @@ const ItemSelector = ({ } ItemSelector.propTypes = { - allItems: PropTypes.arrayOf(PropTypes.object).isRequired, + allItems: PropTypes.arrayOf( + PropTypes.shape({ + id: PropTypes.string, + name: PropTypes.string, + }) + ).isRequired, onSelect: PropTypes.func.isRequired, - initialSelectedItems: PropTypes.arrayOf(PropTypes.object), + initialSelectedItemIds: PropTypes.arrayOf(PropTypes.string), leftHeader: PropTypes.node, rightFooter: PropTypes.node, } ItemSelector.defaultProps = { - initialSelectedItems: [], + initialSelectedItemIds: [], } export default ItemSelector From 8c698a73b692f0b692cb2dd4762c4648cf8fd127 Mon Sep 17 00:00:00 2001 From: Jen Jones Arnesen Date: Thu, 4 Jun 2020 16:38:38 -0700 Subject: [PATCH 08/25] fix: add missing prop in story --- src/__demo__/DynamicDimension.stories.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/__demo__/DynamicDimension.stories.js b/src/__demo__/DynamicDimension.stories.js index 2f9d7808e..a80770d60 100644 --- a/src/__demo__/DynamicDimension.stories.js +++ b/src/__demo__/DynamicDimension.stories.js @@ -25,7 +25,7 @@ storiesOf('DynamicDimension', module).add('ItemSelector one selected', () => { console.log(selected)} allItems={items} - initialSelectedItems={[{ id: '2' }]} + initialSelectedItems={[{ id: '2', name: 'Two' }]} /> ) }) @@ -37,7 +37,7 @@ storiesOf('DynamicDimension', module).add( console.log(selected)} allItems={items} - initialSelectedItems={[{ id: '6' }]} + initialSelectedItems={[{ id: '6', name: 'Six' }]} /> ) } From 2801b3bfe3985dd78886cdfc94406995bd5ca39b Mon Sep 17 00:00:00 2001 From: Martin Ohlson Date: Fri, 5 Jun 2020 10:23:43 +0200 Subject: [PATCH 09/25] chore: fixed broken stories and added a dev note --- src/__demo__/DynamicDimension.stories.js | 23 +++++++++++++++++------ 1 file changed, 17 insertions(+), 6 deletions(-) diff --git a/src/__demo__/DynamicDimension.stories.js b/src/__demo__/DynamicDimension.stories.js index a80770d60..a2dcac601 100644 --- a/src/__demo__/DynamicDimension.stories.js +++ b/src/__demo__/DynamicDimension.stories.js @@ -25,7 +25,7 @@ storiesOf('DynamicDimension', module).add('ItemSelector one selected', () => { console.log(selected)} allItems={items} - initialSelectedItems={[{ id: '2', name: 'Two' }]} + initialSelectedItemIds={[items[2].id]} /> ) }) @@ -34,11 +34,22 @@ storiesOf('DynamicDimension', module).add( 'ItemSelector one selected not in options', () => { return ( - console.log(selected)} - allItems={items} - initialSelectedItems={[{ id: '6', name: 'Six' }]} - /> + <> + console.log(selected)} + allItems={items} + initialSelectedItemIds={['6']} + /> +

+ Note: This currently does not work as ui (currently @5.0.1) + does not yet support selected items that are not part of the + options array{' '} + + https://jira.dhis2.org/browse/TECH-380 + +

+ + // TODO: fix the issue above ) } ) From 7b41d128fa2b824320ba7a76d1ea64f252db1644 Mon Sep 17 00:00:00 2001 From: Martin Ohlson Date: Fri, 5 Jun 2020 16:09:21 +0200 Subject: [PATCH 10/25] chore: comment for bug once pagination is added --- src/components/DynamicDimension/DynamicDimension.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/DynamicDimension/DynamicDimension.js b/src/components/DynamicDimension/DynamicDimension.js index f21086f46..24298c1e2 100644 --- a/src/components/DynamicDimension/DynamicDimension.js +++ b/src/components/DynamicDimension/DynamicDimension.js @@ -21,12 +21,13 @@ export const DynamicDimension = ({ const getItems = async () => setItems(await apiFetchItemsByDimension(context, dimensionId)) // TODO: refactor to use the data engine instead + // TODO: *** Once pagination is in use, check if there are items that are in selectedItems that needs to be added to the items list // TODO: This needs to be refactored to use a loading spinner once Transfer supports it: https://jira.dhis2.org/browse/TECH-379 const onSelectItems = selectedItemIds => { const formattedItems = selectedItemIds.map(id => ({ id, - name: items.find(item => item.id === id).name, + name: items.find(item => item.id === id).name, // TODO: Re: *** above, this won't work with pagination })) // TODO: fetch the name from somewhere else, as not all content in selectedItems might be present in the items list onSelect({ dimensionId: dimensionId, From bd2c228c5677af3eeab524ac6a4cbe558e84a323 Mon Sep 17 00:00:00 2001 From: Martin Ohlson Date: Mon, 8 Jun 2020 15:09:56 +0200 Subject: [PATCH 11/25] fix: period selector works again --- src/__demo__/PeriodDimension.stories.js | 15 +- .../PeriodDimension/FixedPeriodFilter.js | 4 +- .../PeriodDimension/PeriodDimension.js | 6 +- .../PeriodDimension/PeriodSelector.js | 64 ++++--- .../PeriodDimension/RelativePeriodFilter.js | 4 +- .../__snapshots__/PeriodSelector.spec.js.snap | 146 ++++------------ .../__tests__/fixedPeriods.spec.js | 68 ++++---- .../PeriodDimension/utils/fixedPeriods.js | 163 +++++++++--------- .../PeriodDimension/utils/relativePeriods.js | 136 ++++++++------- 9 files changed, 259 insertions(+), 347 deletions(-) diff --git a/src/__demo__/PeriodDimension.stories.js b/src/__demo__/PeriodDimension.stories.js index f5980384c..cb1f8bc17 100644 --- a/src/__demo__/PeriodDimension.stories.js +++ b/src/__demo__/PeriodDimension.stories.js @@ -3,6 +3,17 @@ import { storiesOf } from '@storybook/react' import PeriodDimension from '../components/PeriodDimension/PeriodDimension' -storiesOf('PeriodDimension', module).add('default', () => { - return +const selectedPeriods = [{ id: 'LAST_12_MONTHS', name: 'Last 12 months' }] + +storiesOf('PeriodDimension', module).add('None selected', () => { + return console.log(selected)} /> +}) + +storiesOf('PeriodDimension', module).add('One selected', () => { + return ( + console.log(selected)} + /> + ) }) diff --git a/src/components/PeriodDimension/FixedPeriodFilter.js b/src/components/PeriodDimension/FixedPeriodFilter.js index d2d7c2643..d6a52b59e 100644 --- a/src/components/PeriodDimension/FixedPeriodFilter.js +++ b/src/components/PeriodDimension/FixedPeriodFilter.js @@ -25,7 +25,7 @@ const FixedPeriodFilter = ({ ))} @@ -46,7 +46,7 @@ const FixedPeriodFilter = ({ ) FixedPeriodFilter.propTypes = { - currentPeriodType: PropTypes.object.isRequired, + currentPeriodType: PropTypes.string.isRequired, currentYear: PropTypes.string.isRequired, onSelectPeriodType: PropTypes.func.isRequired, onSelectYear: PropTypes.func.isRequired, diff --git a/src/components/PeriodDimension/PeriodDimension.js b/src/components/PeriodDimension/PeriodDimension.js index 958ec5f4b..2e03f3202 100644 --- a/src/components/PeriodDimension/PeriodDimension.js +++ b/src/components/PeriodDimension/PeriodDimension.js @@ -6,13 +6,9 @@ import { DIMENSION_ID_PERIOD } from '../../modules/predefinedDimensions' export const PeriodDimension = ({ onSelect, selectedPeriods, rightFooter }) => { const selectPeriods = periods => { - const formattedPeriods = periods.map(period => ({ - id: period.value, - name: period.label, - })) onSelect({ dimensionId: DIMENSION_ID_PERIOD, - items: formattedPeriods, + items: periods, }) } diff --git a/src/components/PeriodDimension/PeriodSelector.js b/src/components/PeriodDimension/PeriodSelector.js index 3e8de42f6..3d7128a31 100644 --- a/src/components/PeriodDimension/PeriodSelector.js +++ b/src/components/PeriodDimension/PeriodSelector.js @@ -9,7 +9,7 @@ import { MONTHS, getRelativePeriodsOptionsById } from './utils/relativePeriods' import { MONTHLY, getFixedPeriodsOptionsById } from './utils/fixedPeriods' import styles from '../styles/DimensionSelector.style' import { TransferOption } from '../TransferOption' -import PeriodIcon from '../../assets/DimensionItemIcons/PeriodIcon' +//import PeriodIcon from '../../assets/DimensionItemIcons/PeriodIcon' //TODO: Reimplement the icon import { TRANSFER_HEIGHT, TRANSFER_OPTIONS_WIDTH, @@ -31,16 +31,10 @@ class PeriodSelector extends Component { selectedPeriods: [], isRelative: true, relativeFilter: { - periodType: { - label: defaultRelativePeriodType.getName(), - value: defaultRelativePeriodType.id, - }, + periodType: defaultRelativePeriodType.id, }, fixedFilter: { - periodType: { - label: defaultFixedPeriodType.getName(), - value: defaultFixedPeriodType.id, - }, + periodType: defaultFixedPeriodType.id, year: defaultFixedPeriodYear.toString(), }, } @@ -48,13 +42,7 @@ class PeriodSelector extends Component { constructor(props) { super(props) - this.state.selectedPeriods = this.props.initialSelectedPeriods.map( - item => ({ - label: item.name, - value: item.id, - key: item.id, - }) - ) + this.state.selectedPeriods = this.props.initialSelectedPeriods } onIsRelativeClick = isRelative => { @@ -63,10 +51,10 @@ class PeriodSelector extends Component { this.setState({ allPeriods: isRelative ? getRelativePeriodsOptionsById( - this.state.relativeFilter.periodType.value + this.state.relativeFilter.periodType ).getPeriods() : getFixedPeriodsOptionsById( - this.state.fixedFilter.periodType.value + this.state.fixedFilter.periodType ).getPeriods( fixedPeriodConfig(Number(this.state.fixedFilter.year)) ), @@ -100,7 +88,7 @@ class PeriodSelector extends Component { }) this.setState({ allPeriods: getRelativePeriodsOptionsById( - filter.value + filter ).getPeriods(), }) }} @@ -132,7 +120,7 @@ class PeriodSelector extends Component { this.setState({ fixedFilter, allPeriods: getFixedPeriodsOptionsById( - fixedFilter.periodType.value + fixedFilter.periodType ).getPeriods(fixedPeriodConfig(Number(fixedFilter.year))), }) } @@ -147,10 +135,17 @@ class PeriodSelector extends Component { render = () => ( { - this.setState({ selectedPeriods: selected }) - this.props.onSelect(selected) + const formattedItems = selected.map(id => ({ + id, + name: [ + ...this.state.allPeriods, + ...this.state.selectedPeriods, + ].find(item => item.id === id).name, + })) + this.setState({ selectedPeriods: formattedItems }) + this.props.onSelect(formattedItems) }} - selected={this.state.selectedPeriods} + selected={this.state.selectedPeriods.map(period => period.id)} leftHeader={this.renderHeader()} enableOrderChange height={TRANSFER_HEIGHT} @@ -158,23 +153,24 @@ class PeriodSelector extends Component { selectedWidth={TRANSFER_SELECTED_WIDTH} selectedEmptyComponent={this.renderEmptySelection()} rightFooter={this.props.rightFooter} + options={this.state.allPeriods.map(({ id, name }) => ({ + label: name, + value: id, + }))} + renderOption={TransferOption} // TODO: Add rightHeader "Selected Periods" once the Transfer component supports this (https://github.com/dhis2/ui-core/issues/885) - > - {this.state.allPeriods.map(item => ( - - ))} - + >
) } PeriodSelector.propTypes = { onSelect: PropTypes.func.isRequired, - initialSelectedPeriods: PropTypes.arrayOf(PropTypes.object), + initialSelectedPeriods: PropTypes.arrayOf( + PropTypes.shape({ + id: PropTypes.string, + name: PropTypes.string, + }) + ), rightFooter: PropTypes.node, } diff --git a/src/components/PeriodDimension/RelativePeriodFilter.js b/src/components/PeriodDimension/RelativePeriodFilter.js index a7fc2c113..511b94004 100644 --- a/src/components/PeriodDimension/RelativePeriodFilter.js +++ b/src/components/PeriodDimension/RelativePeriodFilter.js @@ -19,7 +19,7 @@ const RelativePeriodFilter = ({ currentFilter, onSelectFilter }) => ( ))} @@ -28,7 +28,7 @@ const RelativePeriodFilter = ({ currentFilter, onSelectFilter }) => ( ) RelativePeriodFilter.propTypes = { - currentFilter: PropTypes.object.isRequired, + currentFilter: PropTypes.string.isRequired, onSelectFilter: PropTypes.func.isRequired, } diff --git a/src/components/PeriodDimension/__tests__/__snapshots__/PeriodSelector.spec.js.snap b/src/components/PeriodDimension/__tests__/__snapshots__/PeriodSelector.spec.js.snap index a47932dcd..48decf8cb 100644 --- a/src/components/PeriodDimension/__tests__/__snapshots__/PeriodSelector.spec.js.snap +++ b/src/components/PeriodDimension/__tests__/__snapshots__/PeriodSelector.spec.js.snap @@ -31,12 +31,7 @@ exports[`The Period Selector component matches the snapshot 1`] = ` className="filterContainer" >
@@ -47,6 +42,34 @@ exports[`The Period Selector component matches the snapshot 1`] = ` } maxSelections={Infinity} 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="420px" renderOption={[Function]} rightFooter={} @@ -64,114 +87,5 @@ exports[`The Period Selector component matches the snapshot 1`] = ` } selectedWidth="298px" -> - - - - } - key="THIS_MONTH" - label="This month" - value="THIS_MONTH" - /> - - - - } - key="LAST_MONTH" - label="Last month" - value="LAST_MONTH" - /> - - - - } - key="LAST_3_MONTHS" - label="Last 3 months" - value="LAST_3_MONTHS" - /> - - - - } - key="LAST_6_MONTHS" - label="Last 6 months" - value="LAST_6_MONTHS" - /> - - - - } - key="LAST_12_MONTHS" - label="Last 12 months" - value="LAST_12_MONTHS" - /> - - - - } - key="MONTHS_THIS_YEAR" - label="Months this year" - value="MONTHS_THIS_YEAR" - /> -
+/> `; diff --git a/src/components/PeriodDimension/__tests__/fixedPeriods.spec.js b/src/components/PeriodDimension/__tests__/fixedPeriods.spec.js index b4e6fce29..a2eb152bf 100644 --- a/src/components/PeriodDimension/__tests__/fixedPeriods.spec.js +++ b/src/components/PeriodDimension/__tests__/fixedPeriods.spec.js @@ -59,7 +59,7 @@ describe('fixedPeriods utils', () => { iso: '20190101', id: '20190101', }) - expect(periods[0].getName()).toEqual('2019-01-01') + expect(periods[0].name).toEqual('2019-01-01') }) it('should return the correct object for 31 dec 2019 day', () => { @@ -70,7 +70,7 @@ describe('fixedPeriods utils', () => { id: '20191231', }) - expect(periods[364].getName()).toEqual('2019-12-31') + expect(periods[364].name).toEqual('2019-12-31') }) }) @@ -98,9 +98,7 @@ describe('fixedPeriods utils', () => { iso: '2009W1', id: '2009W1', }) - expect(periods[0].getName()).toEqual( - 'Week 1 - 2008-12-29 - 2009-01-04' - ) + expect(periods[0].name).toEqual('Week 1 - 2008-12-29 - 2009-01-04') }) it('should return the correct object for week 53', () => { @@ -110,7 +108,7 @@ describe('fixedPeriods utils', () => { iso: '2009W53', id: '2009W53', }) - expect(periods[52].getName()).toEqual( + expect(periods[52].name).toEqual( 'Week 53 - 2009-12-28 - 2010-01-03' ) }) @@ -139,7 +137,7 @@ describe('fixedPeriods utils', () => { iso: '2019WedW27', id: '2019WedW27', }) - expect(periods[26].getName()).toEqual( + expect(periods[26].name).toEqual( 'Week 27 - 2019-07-03 - 2019-07-09' ) }) @@ -169,7 +167,7 @@ describe('fixedPeriods utils', () => { iso: '2019ThuW27', id: '2019ThuW27', }) - expect(periods[26].getName()).toEqual( + expect(periods[26].name).toEqual( 'Week 27 - 2019-07-04 - 2019-07-10' ) }) @@ -200,7 +198,7 @@ describe('fixedPeriods utils', () => { id: '2019SatW10', }) - expect(periods[9].getName()).toEqual( + expect(periods[9].name).toEqual( 'Week 10 - 2019-03-02 - 2019-03-08' ) }) @@ -230,7 +228,7 @@ describe('fixedPeriods utils', () => { iso: '2019SunW11', id: '2019SunW11', }) - expect(periods[10].getName()).toEqual( + expect(periods[10].name).toEqual( 'Week 11 - 2019-03-10 - 2019-03-16' ) }) @@ -261,7 +259,7 @@ describe('fixedPeriods utils', () => { iso: '2019BiW1', id: '2019BiW1', }) - expect(periods[0].getName()).toEqual( + expect(periods[0].name).toEqual( 'Bi-Week 1 - 2018-12-31 - 2019-01-13' ) }) @@ -273,7 +271,7 @@ describe('fixedPeriods utils', () => { iso: '2019BiW26', id: '2019BiW26', }) - expect(periods[25].getName()).toEqual( + expect(periods[25].name).toEqual( 'Bi-Week 26 - 2019-12-16 - 2019-12-29' ) }) @@ -303,7 +301,7 @@ describe('fixedPeriods utils', () => { iso: '201901', id: '201901', }) - expect(periods[0].getName()).toEqual('January 2019') + expect(periods[0].name).toEqual('January 2019') }) it('should return the correct object for month 12', () => { @@ -313,7 +311,7 @@ describe('fixedPeriods utils', () => { iso: '201912', id: '201912', }) - expect(periods[11].getName()).toEqual('December 2019') + expect(periods[11].name).toEqual('December 2019') }) }) @@ -341,7 +339,7 @@ describe('fixedPeriods utils', () => { iso: '201901B', id: '201901B', }) - expect(periods[0].getName()).toEqual('January - February 2019') + expect(periods[0].name).toEqual('January - February 2019') }) it('should return the correct object for bi-month 3', () => { @@ -351,7 +349,7 @@ describe('fixedPeriods utils', () => { iso: '201903B', id: '201903B', }) - expect(periods[2].getName()).toEqual('May - June 2019') + expect(periods[2].name).toEqual('May - June 2019') }) it('should return the correct object for bi-month 6', () => { @@ -361,7 +359,7 @@ describe('fixedPeriods utils', () => { iso: '201906B', id: '201906B', }) - expect(periods[5].getName()).toEqual('November - December 2019') + expect(periods[5].name).toEqual('November - December 2019') }) }) @@ -389,7 +387,7 @@ describe('fixedPeriods utils', () => { iso: '2019Q1', id: '2019Q1', }) - expect(periods[0].getName()).toEqual('January - March 2019') + expect(periods[0].name).toEqual('January - March 2019') }) it('should return the correct object for quarter 4', () => { @@ -399,7 +397,7 @@ describe('fixedPeriods utils', () => { iso: '2019Q4', id: '2019Q4', }) - expect(periods[3].getName()).toEqual('October - December 2019') + expect(periods[3].name).toEqual('October - December 2019') }) }) @@ -427,7 +425,7 @@ describe('fixedPeriods utils', () => { iso: '2019S1', id: '2019S1', }) - expect(periods[0].getName()).toEqual('January - June 2019') + expect(periods[0].name).toEqual('January - June 2019') }) it('should return the correct object for six-monthly 2', () => { @@ -437,7 +435,7 @@ describe('fixedPeriods utils', () => { iso: '2019S2', id: '2019S2', }) - expect(periods[1].getName()).toEqual('July - December 2019') + expect(periods[1].name).toEqual('July - December 2019') }) }) @@ -465,7 +463,7 @@ describe('fixedPeriods utils', () => { iso: '2019AprilS1', id: '2019AprilS1', }) - expect(periods[0].getName()).toEqual('April - September 2019') + expect(periods[0].name).toEqual('April - September 2019') }) it('should return the correct object for six-monthly April 2', () => { @@ -475,7 +473,7 @@ describe('fixedPeriods utils', () => { iso: '2019AprilS2', id: '2019AprilS2', }) - expect(periods[1].getName()).toEqual('October 2019 - March 2020') + expect(periods[1].name).toEqual('October 2019 - March 2020') }) }) @@ -503,7 +501,7 @@ describe('fixedPeriods utils', () => { iso: '2020', id: '2020', }) - expect(periods[0].getName()).toEqual('2020') + expect(periods[0].name).toEqual('2020') }) it('should return the correct object for yearly period 10', () => { @@ -513,7 +511,7 @@ describe('fixedPeriods utils', () => { iso: '2029', id: '2029', }) - expect(periods[9].getName()).toEqual('2029') + expect(periods[9].name).toEqual('2029') }) }) @@ -542,7 +540,7 @@ describe('fixedPeriods utils', () => { endDate: '2020-10-31', id: '2019Nov', }) - expect(periods[0].getName()).toEqual('November 2019 - October 2020') + expect(periods[0].name).toEqual('November 2019 - October 2020') }) it('should return the correct object for financial November period 10', () => { @@ -551,7 +549,7 @@ describe('fixedPeriods utils', () => { endDate: '2029-10-31', id: '2028Nov', }) - expect(periods[9].getName()).toEqual('November 2028 - October 2029') + expect(periods[9].name).toEqual('November 2028 - October 2029') }) }) @@ -580,9 +578,7 @@ describe('fixedPeriods utils', () => { endDate: '2020-09-30', id: '2019Oct', }) - expect(periods[0].getName()).toEqual( - 'October 2019 - September 2020' - ) + expect(periods[0].name).toEqual('October 2019 - September 2020') }) it('should return the correct object for financial October period 10', () => { @@ -591,9 +587,7 @@ describe('fixedPeriods utils', () => { endDate: '2029-09-30', id: '2028Oct', }) - expect(periods[9].getName()).toEqual( - 'October 2028 - September 2029' - ) + expect(periods[9].name).toEqual('October 2028 - September 2029') }) }) @@ -622,7 +616,7 @@ describe('fixedPeriods utils', () => { endDate: '2020-06-30', id: '2019July', }) - expect(periods[0].getName()).toEqual('July 2019 - June 2020') + expect(periods[0].name).toEqual('July 2019 - June 2020') }) it('should return the correct object for financial July period 10', () => { @@ -631,7 +625,7 @@ describe('fixedPeriods utils', () => { endDate: '2029-06-30', id: '2028July', }) - expect(periods[9].getName()).toEqual('July 2028 - June 2029') + expect(periods[9].name).toEqual('July 2028 - June 2029') }) }) @@ -660,7 +654,7 @@ describe('fixedPeriods utils', () => { endDate: '2020-03-31', id: '2019April', }) - expect(periods[0].getName()).toEqual('April 2019 - March 2020') + expect(periods[0].name).toEqual('April 2019 - March 2020') }) it('should return the correct object for financial April period 10', () => { @@ -669,7 +663,7 @@ describe('fixedPeriods utils', () => { endDate: '2029-03-31', id: '2028April', }) - expect(periods[9].getName()).toEqual('April 2028 - March 2029') + expect(periods[9].name).toEqual('April 2028 - March 2029') }) }) }) diff --git a/src/components/PeriodDimension/utils/fixedPeriods.js b/src/components/PeriodDimension/utils/fixedPeriods.js index 2b9579302..2725e6689 100644 --- a/src/components/PeriodDimension/utils/fixedPeriods.js +++ b/src/components/PeriodDimension/utils/fixedPeriods.js @@ -38,7 +38,7 @@ const getMonthName = key => { return monthNames[key] } -const dailyPeriodType = (formatYyyyMmDd, fnFilter) => { +const getDailyPeriodType = (formatYyyyMmDd, fnFilter) => { return config => { let periods = [] const offset = parseInt(config.offset, 10) @@ -51,7 +51,7 @@ const dailyPeriodType = (formatYyyyMmDd, fnFilter) => { const period = {} period.startDate = formatYyyyMmDd(date) period.endDate = period.startDate - period.getName = () => period.startDate + period.name = period.startDate period.iso = period.startDate.replace(/-/g, '') period.id = period.iso periods.push(period) @@ -65,7 +65,7 @@ const dailyPeriodType = (formatYyyyMmDd, fnFilter) => { } } -const weeklyPeriodType = (formatYyyyMmDd, weekObj, fnFilter) => { +const getWeeklyPeriodType = (formatYyyyMmDd, weekObj, fnFilter) => { // Calculate the first date of an EPI year base on ISO standard ( first week always contains 4th Jan ) const getEpiWeekStartDay = (year, startDayOfWeek) => { const jan4 = new Date(year, 0, 4) @@ -101,10 +101,9 @@ const weeklyPeriodType = (formatYyyyMmDd, weekObj, fnFilter) => { period.endDate = formatYyyyMmDd(date) const weekNumber = week - period.getName = () => - `${i18n.t('Week {{weekNumber}}', { weekNumber })} - ${ - period.startDate - } - ${period.endDate}` + period.name = `${i18n.t('Week {{weekNumber}}', { weekNumber })} - ${ + period.startDate + } - ${period.endDate}` // if end date is Jan 4th or later, week belongs to next year if (date.getFullYear() > year && date.getDate() >= 4) { @@ -124,7 +123,7 @@ const weeklyPeriodType = (formatYyyyMmDd, weekObj, fnFilter) => { } } -const biWeeklyPeriodType = (formatYyyyMmDd, fnFilter) => { +const getBiWeeklyPeriodType = (formatYyyyMmDd, fnFilter) => { return config => { let periods = [] const offset = parseInt(config.offset, 10) @@ -151,10 +150,9 @@ const biWeeklyPeriodType = (formatYyyyMmDd, fnFilter) => { period.endDate = formatYyyyMmDd(date) const biWeekNumber = biWeek - period.getName = () => - `${i18n.t('Bi-Week {{biWeekNumber}}', { biWeekNumber })} - ${ - period.startDate - } - ${period.endDate}` + period.name = `${i18n.t('Bi-Week {{biWeekNumber}}', { + biWeekNumber, + })} - ${period.startDate} - ${period.endDate}` // if end date is Jan 4th or later, biweek belongs to next year if (date.getFullYear() > year && date.getDate() >= 4) { @@ -175,7 +173,7 @@ const biWeeklyPeriodType = (formatYyyyMmDd, fnFilter) => { } } -const monthlyPeriodType = (formatYyyyMmDd, fnFilter) => { +const getMonthlyPeriodType = (formatYyyyMmDd, fnFilter) => { const formatIso = date => { const y = date.getFullYear() let m = String(date.getMonth() + 1) @@ -201,7 +199,7 @@ const monthlyPeriodType = (formatYyyyMmDd, fnFilter) => { date.setDate(1) period.startDate = formatYyyyMmDd(date) const monthName = getMonthName(date.getMonth()) - period.getName = () => `${monthName} ${year}` + period.name = `${monthName} ${year}` period.iso = formatIso(date) period.id = period.iso @@ -217,7 +215,7 @@ const monthlyPeriodType = (formatYyyyMmDd, fnFilter) => { } } -const biMonthlyPeriodType = (formatYyyyMmDd, fnFilter) => { +const getBiMonthlyPeriodType = (formatYyyyMmDd, fnFilter) => { return config => { let periods = [] const offset = parseInt(config.offset, 10) @@ -237,7 +235,7 @@ const biMonthlyPeriodType = (formatYyyyMmDd, fnFilter) => { const monthStart = getMonthName(date.getMonth()) const monthEnd = getMonthName(date.getMonth() + 1) const fullYear = date.getFullYear() - period.getName = () => `${monthStart} - ${monthEnd} ${fullYear}` + period.name = `${monthStart} - ${monthEnd} ${fullYear}` period.iso = `${year}0${index}B` period.id = period.iso periods.push(period) @@ -254,7 +252,7 @@ const biMonthlyPeriodType = (formatYyyyMmDd, fnFilter) => { } } -const quarterlyPeriodType = (formatYyyyMmDd, fnFilter) => { +const getQuarterlyPeriodType = (formatYyyyMmDd, fnFilter) => { return config => { let periods = [] const offset = parseInt(config.offset, 10) @@ -274,7 +272,7 @@ const quarterlyPeriodType = (formatYyyyMmDd, fnFilter) => { const monthStart = getMonthName(date.getMonth()) const monthEnd = getMonthName(date.getMonth() + 2) const fullYear = date.getFullYear() - period.getName = () => `${monthStart} - ${monthEnd} ${fullYear}` + period.name = `${monthStart} - ${monthEnd} ${fullYear}` period.iso = `${year}Q${quarter}` period.id = period.iso periods.push(period) @@ -290,7 +288,7 @@ const quarterlyPeriodType = (formatYyyyMmDd, fnFilter) => { } } -const sixMonthlyPeriodType = fnFilter => { +const getSixMonthlyPeriodType = fnFilter => { return config => { let periods = [] const offset = parseInt(config.offset, 10) @@ -301,7 +299,7 @@ const sixMonthlyPeriodType = fnFilter => { let period = {} period.startDate = `${year}-01-01` period.endDate = `${year}-06-30` - period.getName = () => `${getMonthName(0)} - ${getMonthName(5)} ${year}` + period.name = `${getMonthName(0)} - ${getMonthName(5)} ${year}` period.iso = `${year}S1` period.id = period.iso periods.push(period) @@ -309,8 +307,7 @@ const sixMonthlyPeriodType = fnFilter => { period = {} period.startDate = `${year}-07-01` period.endDate = `${year}-12-31` - period.getName = () => - `${getMonthName(6)} - ${getMonthName(11)} ${year}` + period.name = `${getMonthName(6)} - ${getMonthName(11)} ${year}` period.iso = `${year}S2` period.id = period.iso periods.push(period) @@ -322,7 +319,7 @@ const sixMonthlyPeriodType = fnFilter => { } } -const sixMonthlyAprilPeriodType = fnFilter => { +const getSixMonthlyAprilPeriodType = fnFilter => { return config => { let periods = [] const offset = parseInt(config.offset, 10) @@ -333,7 +330,7 @@ const sixMonthlyAprilPeriodType = fnFilter => { let period = {} period.startDate = `${year}-04-01` period.endDate = `${year}-09-30` - period.getName = () => `${getMonthName(3)} - ${getMonthName(8)} ${year}` + period.name = `${getMonthName(3)} - ${getMonthName(8)} ${year}` period.iso = `${year}AprilS1` period.id = period.iso periods.push(period) @@ -341,8 +338,8 @@ const sixMonthlyAprilPeriodType = fnFilter => { period = {} period.startDate = `${year}-10-01` period.endDate = `${year + 1}-03-31` - period.getName = () => - `${getMonthName(9)} ${year} - ${getMonthName(2)} ${year + 1}` + period.name = `${getMonthName(9)} ${year} - ${getMonthName(2)} ${year + + 1}` period.iso = `${year}AprilS2` period.id = period.iso periods.push(period) @@ -354,7 +351,7 @@ const sixMonthlyAprilPeriodType = fnFilter => { } } -const yearlyPeriodType = (formatYyyyMmDd, fnFilter) => { +const getYearlyPeriodType = (formatYyyyMmDd, fnFilter) => { return config => { let periods = [] const offset = parseInt(config.offset, 10) @@ -369,7 +366,7 @@ const yearlyPeriodType = (formatYyyyMmDd, fnFilter) => { date.setMonth(0, 1) period.startDate = formatYyyyMmDd(date) const dateString = date.getFullYear().toString() - period.getName = () => dateString + period.name = dateString period.iso = date.getFullYear().toString() period.id = period.iso.toString() periods.push(period) @@ -384,7 +381,7 @@ const yearlyPeriodType = (formatYyyyMmDd, fnFilter) => { } } -const financialOctoberPeriodType = (formatYyyyMmDd, fnFilter) => { +const getFinancialOctoberPeriodType = (formatYyyyMmDd, fnFilter) => { return config => { let periods = [] const offset = parseInt(config.offset, 10) @@ -401,10 +398,9 @@ const financialOctoberPeriodType = (formatYyyyMmDd, fnFilter) => { period.startDate = formatYyyyMmDd(date) const yearStart = date.getFullYear() const yearEnd = date.getFullYear() + 1 - period.getName = () => - `${getMonthName(9)} ${yearStart} - ${getMonthName( - 8 - )} ${yearEnd}` + period.name = `${getMonthName(9)} ${yearStart} - ${getMonthName( + 8 + )} ${yearEnd}` period.id = `${date.getFullYear()}Oct` periods.push(period) date.setDate(date.getDate() - 1) @@ -418,7 +414,7 @@ const financialOctoberPeriodType = (formatYyyyMmDd, fnFilter) => { } } -const financialNovemberPeriodType = (formatYyyyMmDd, fnFilter) => { +const getFinancialNovemberPeriodType = (formatYyyyMmDd, fnFilter) => { return config => { let periods = [] const offset = parseInt(config.offset, 10) @@ -435,10 +431,9 @@ const financialNovemberPeriodType = (formatYyyyMmDd, fnFilter) => { period.startDate = formatYyyyMmDd(date) const yearStart = date.getFullYear() const yearEnd = date.getFullYear() + 1 - period.getName = () => - `${getMonthName(10)} ${yearStart} - ${getMonthName( - 9 - )} ${yearEnd}` + period.name = `${getMonthName(10)} ${yearStart} - ${getMonthName( + 9 + )} ${yearEnd}` period.id = `${date.getFullYear()}Nov` periods.push(period) date.setDate(date.getDate() - 1) @@ -452,7 +447,7 @@ const financialNovemberPeriodType = (formatYyyyMmDd, fnFilter) => { } } -const financialJulyPeriodType = (formatYyyyMmDd, fnFilter) => { +const getFinancialJulyPeriodType = (formatYyyyMmDd, fnFilter) => { return config => { let periods = [] const offset = parseInt(config.offset, 10) @@ -469,10 +464,9 @@ const financialJulyPeriodType = (formatYyyyMmDd, fnFilter) => { period.startDate = formatYyyyMmDd(date) const yearStart = date.getFullYear() const yearEnd = date.getFullYear() + 1 - period.getName = () => - `${getMonthName(6)} ${yearStart} - ${getMonthName( - 5 - )} ${yearEnd}` + period.name = `${getMonthName(6)} ${yearStart} - ${getMonthName( + 5 + )} ${yearEnd}` period.id = `${date.getFullYear()}July` periods.push(period) date.setDate(date.getDate() - 1) @@ -486,7 +480,7 @@ const financialJulyPeriodType = (formatYyyyMmDd, fnFilter) => { } } -const financialAprilPeriodType = (formatYyyyMmDd, fnFilter) => { +const getFinancialAprilPeriodType = (formatYyyyMmDd, fnFilter) => { return config => { let periods = [] const offset = parseInt(config.offset, 10) @@ -503,10 +497,9 @@ const financialAprilPeriodType = (formatYyyyMmDd, fnFilter) => { period.startDate = formatYyyyMmDd(date) const yearStart = date.getFullYear() const yearEnd = date.getFullYear() + 1 - period.getName = () => - `${getMonthName(3)} ${yearStart} - ${getMonthName( - 2 - )} ${yearEnd}` + period.name = `${getMonthName(3)} ${yearStart} - ${getMonthName( + 2 + )} ${yearEnd}` period.id = `${date.getFullYear()}April` periods.push(period) date.setDate(date.getDate() - 1) @@ -544,127 +537,127 @@ const filterFuturePeriods = periods => { return array } -const options = [ +const getOptions = () => [ { id: DAILY, - getPeriods: dailyPeriodType(formatYyyyMmDd, filterFuturePeriods), - getName: () => i18n.t('Daily'), + getPeriods: getDailyPeriodType(formatYyyyMmDd, filterFuturePeriods), + name: i18n.t('Daily'), }, { id: WEEKLY, - getPeriods: weeklyPeriodType( + getPeriods: getWeeklyPeriodType( formatYyyyMmDd, { shortName: '', startDay: 1 }, filterFuturePeriods ), - getName: () => i18n.t('Weekly'), + name: i18n.t('Weekly'), }, { id: BIWEEKLY, - getPeriods: biWeeklyPeriodType(formatYyyyMmDd, filterFuturePeriods), - getName: () => i18n.t('Bi-weekly'), + getPeriods: getBiWeeklyPeriodType(formatYyyyMmDd, filterFuturePeriods), + name: i18n.t('Bi-weekly'), }, { id: WEEKLYWED, - getPeriods: weeklyPeriodType( + getPeriods: getWeeklyPeriodType( formatYyyyMmDd, { shortName: 'Wed', startDay: 3 }, filterFuturePeriods ), - getName: () => i18n.t('Weekly (Start Wednesday)'), + name: i18n.t('Weekly (Start Wednesday)'), }, { id: WEEKLYTHU, - getPeriods: weeklyPeriodType( + getPeriods: getWeeklyPeriodType( formatYyyyMmDd, { shortName: 'Thu', startDay: 4 }, filterFuturePeriods ), - getName: () => i18n.t('Weekly (Start Thursday)'), + name: i18n.t('Weekly (Start Thursday)'), }, { id: WEEKLYSAT, - getPeriods: weeklyPeriodType( + getPeriods: getWeeklyPeriodType( formatYyyyMmDd, { shortName: 'Sat', startDay: 6 }, filterFuturePeriods ), - getName: () => i18n.t('Weekly (Start Saturday)'), + name: i18n.t('Weekly (Start Saturday)'), }, { id: WEEKLYSUN, - getPeriods: weeklyPeriodType( + getPeriods: getWeeklyPeriodType( formatYyyyMmDd, { shortName: 'Sun', startDay: 7 }, filterFuturePeriods ), - getName: () => i18n.t('Weekly (Start Sunday)'), + name: i18n.t('Weekly (Start Sunday)'), }, { id: MONTHLY, - getPeriods: monthlyPeriodType(formatYyyyMmDd, filterFuturePeriods), - getName: () => i18n.t('Monthly'), + getPeriods: getMonthlyPeriodType(formatYyyyMmDd, filterFuturePeriods), + name: i18n.t('Monthly'), }, { id: BIMONTHLY, - getPeriods: biMonthlyPeriodType(formatYyyyMmDd, filterFuturePeriods), - getName: () => i18n.t('Bi-monthly'), + getPeriods: getBiMonthlyPeriodType(formatYyyyMmDd, filterFuturePeriods), + name: i18n.t('Bi-monthly'), }, { id: QUARTERLY, - getPeriods: quarterlyPeriodType(formatYyyyMmDd, filterFuturePeriods), - getName: () => i18n.t('Quarterly'), + getPeriods: getQuarterlyPeriodType(formatYyyyMmDd, filterFuturePeriods), + name: i18n.t('Quarterly'), }, { id: SIXMONTHLY, - getPeriods: sixMonthlyPeriodType(filterFuturePeriods), - getName: () => i18n.t('Six-monthly'), + getPeriods: getSixMonthlyPeriodType(filterFuturePeriods), + name: i18n.t('Six-monthly'), }, { id: SIXMONTHLYAPR, - getPeriods: sixMonthlyAprilPeriodType(filterFuturePeriods), - getName: () => i18n.t('Six-monthly April'), + getPeriods: getSixMonthlyAprilPeriodType(filterFuturePeriods), + name: i18n.t('Six-monthly April'), }, { id: YEARLY, - getPeriods: yearlyPeriodType(formatYyyyMmDd, filterFuturePeriods), - getName: () => i18n.t('Yearly'), + getPeriods: getYearlyPeriodType(formatYyyyMmDd, filterFuturePeriods), + name: i18n.t('Yearly'), }, { id: FYNOV, - getPeriods: financialNovemberPeriodType( + getPeriods: getFinancialNovemberPeriodType( formatYyyyMmDd, filterFuturePeriods ), - getName: () => i18n.t('Financial year (Start November)'), + name: i18n.t('Financial year (Start November)'), }, { id: FYOCT, - getPeriods: financialOctoberPeriodType( + getPeriods: getFinancialOctoberPeriodType( formatYyyyMmDd, filterFuturePeriods ), - getName: () => i18n.t('Financial year (Start October)'), + name: i18n.t('Financial year (Start October)'), }, { id: FYJUL, - getPeriods: financialJulyPeriodType( + getPeriods: getFinancialJulyPeriodType( formatYyyyMmDd, filterFuturePeriods ), - getName: () => i18n.t('Financial year (Start July)'), + name: i18n.t('Financial year (Start July)'), }, { id: FYAPR, - getPeriods: financialAprilPeriodType( + getPeriods: getFinancialAprilPeriodType( formatYyyyMmDd, filterFuturePeriods ), - getName: () => i18n.t('Financial year (Start April)'), + name: i18n.t('Financial year (Start April)'), }, ] export const getFixedPeriodsOptionsById = id => - options.find(option => option.id === id) + getOptions().find(option => option.id === id) -export const getFixedPeriodsOptions = () => options +export const getFixedPeriodsOptions = () => getOptions() diff --git a/src/components/PeriodDimension/utils/relativePeriods.js b/src/components/PeriodDimension/utils/relativePeriods.js index b1f5e9dd3..8ed450681 100644 --- a/src/components/PeriodDimension/utils/relativePeriods.js +++ b/src/components/PeriodDimension/utils/relativePeriods.js @@ -10,131 +10,139 @@ export const SIXMONTHS = 'SixMonths' export const FINACIALYEARS = 'FinancialYears' export const YEARS = 'Years' -const daysPeriodType = () => [ - { id: 'TODAY', getName: () => i18n.t('Today') }, - { id: 'YESTERDAY', getName: () => i18n.t('Yesterday') }, - { id: 'LAST_3_DAYS', getName: () => i18n.t('Last 3 days') }, - { id: 'LAST_7_DAYS', getName: () => i18n.t('Last 7 days') }, - { id: 'LAST_14_DAYS', getName: () => i18n.t('Last 14 days') }, +const getDaysPeriodType = () => [ + { id: 'TODAY', name: i18n.t('Today') }, + { id: 'YESTERDAY', name: i18n.t('Yesterday') }, + { id: 'LAST_3_DAYS', name: i18n.t('Last 3 days') }, + { id: 'LAST_7_DAYS', name: i18n.t('Last 7 days') }, + { id: 'LAST_14_DAYS', name: i18n.t('Last 14 days') }, ] -const weeksPeriodType = () => [ - { id: 'THIS_WEEK', getName: () => i18n.t('This week') }, - { id: 'LAST_WEEK', getName: () => i18n.t('Last week') }, - { id: 'LAST_4_WEEKS', getName: () => i18n.t('Last 4 weeks') }, - { id: 'LAST_12_WEEKS', getName: () => i18n.t('Last 12 weeks') }, - { id: 'LAST_52_WEEKS', getName: () => i18n.t('Last 52 weeks') }, - { id: 'WEEKS_THIS_YEAR', getName: () => i18n.t('Weeks this year') }, +const getWeeksPeriodType = () => [ + { id: 'THIS_WEEK', name: i18n.t('This week') }, + { id: 'LAST_WEEK', name: i18n.t('Last week') }, + { id: 'LAST_4_WEEKS', name: i18n.t('Last 4 weeks') }, + { id: 'LAST_12_WEEKS', name: i18n.t('Last 12 weeks') }, + { id: 'LAST_52_WEEKS', name: i18n.t('Last 52 weeks') }, + { id: 'WEEKS_THIS_YEAR', name: i18n.t('Weeks this year') }, ] -const biWeeksPeriodType = () => [ - { id: 'THIS_BIWEEK', getName: () => i18n.t('This bi-week') }, - { id: 'LAST_BIWEEK', getName: () => i18n.t('Last bi-week') }, - { id: 'LAST_4_BIWEEKS', getName: () => i18n.t('Last 4 bi-weeks') }, +const getBiWeeksPeriodType = () => [ + { id: 'THIS_BIWEEK', name: i18n.t('This bi-week') }, + { id: 'LAST_BIWEEK', name: i18n.t('Last bi-week') }, + { id: 'LAST_4_BIWEEKS', name: i18n.t('Last 4 bi-weeks') }, ] -const monthsPeriodType = () => [ - { id: 'THIS_MONTH', getName: () => i18n.t('This month') }, - { id: 'LAST_MONTH', getName: () => i18n.t('Last month') }, - { id: 'LAST_3_MONTHS', getName: () => i18n.t('Last 3 months') }, - { id: 'LAST_6_MONTHS', getName: () => i18n.t('Last 6 months') }, - { id: 'LAST_12_MONTHS', getName: () => i18n.t('Last 12 months') }, +const getMonthsPeriodType = () => [ + { id: 'THIS_MONTH', name: i18n.t('This month') }, + { id: 'LAST_MONTH', name: i18n.t('Last month') }, + { id: 'LAST_3_MONTHS', name: i18n.t('Last 3 months') }, + { id: 'LAST_6_MONTHS', name: i18n.t('Last 6 months') }, + { id: 'LAST_12_MONTHS', name: i18n.t('Last 12 months') }, { id: 'MONTHS_THIS_YEAR', - getName: () => i18n.t('Months this year'), + name: i18n.t('Months this year'), }, ] -const biMonthsPeriodType = () => [ - { id: 'THIS_BIMONTH', getName: () => i18n.t('This bi-month') }, - { id: 'LAST_BIMONTH', getName: () => i18n.t('Last bi-month') }, +const getBiMonthsPeriodType = () => [ + { id: 'THIS_BIMONTH', name: i18n.t('This bi-month') }, + { id: 'LAST_BIMONTH', name: i18n.t('Last bi-month') }, { id: 'LAST_6_BIMONTHS', - getName: () => i18n.t('Last 6 bi-months'), + name: i18n.t('Last 6 bi-months'), }, { id: 'BIMONTHS_THIS_YEAR', - getName: () => i18n.t('Bi-months this year'), + name: i18n.t('Bi-months this year'), }, ] -const quartersPeriodType = () => [ - { id: 'THIS_QUARTER', getName: () => i18n.t('This quarter') }, - { id: 'LAST_QUARTER', getName: () => i18n.t('Last quarter') }, - { id: 'LAST_4_QUARTERS', getName: () => i18n.t('Last 4 quarters') }, +const getQuartersPeriodType = () => [ + { id: 'THIS_QUARTER', name: i18n.t('This quarter') }, + { id: 'LAST_QUARTER', name: i18n.t('Last quarter') }, + { id: 'LAST_4_QUARTERS', name: i18n.t('Last 4 quarters') }, { id: 'QUARTERS_THIS_YEAR', - getName: () => i18n.t('Quarters this year'), + name: i18n.t('Quarters this year'), }, ] -const sixMonthsPeriodType = () => [ - { id: 'THIS_SIX_MONTH', getName: () => i18n.t('This six-month') }, - { id: 'LAST_SIX_MONTH', getName: () => i18n.t('Last six-month') }, +const getSixMonthsPeriodType = () => [ + { id: 'THIS_SIX_MONTH', name: i18n.t('This six-month') }, + { id: 'LAST_SIX_MONTH', name: i18n.t('Last six-month') }, { id: 'LAST_2_SIXMONTHS', - getName: () => i18n.t('Last 2 six-month'), + name: i18n.t('Last 2 six-month'), }, ] -const financialYearsPeriodType = () => [ +const getFinancialYearsPeriodType = () => [ { id: 'THIS_FINANCIAL_YEAR', - getName: () => i18n.t('This financial year'), + name: i18n.t('This financial year'), }, { id: 'LAST_FINANCIAL_YEAR', - getName: () => i18n.t('Last financial year'), + name: i18n.t('Last financial year'), }, { id: 'LAST_5_FINANCIAL_YEARS', - getName: () => i18n.t('Last 5 financial years'), + name: i18n.t('Last 5 financial years'), }, ] -const yearsPeriodType = () => [ - { id: 'THIS_YEAR', getName: () => i18n.t('This year') }, - { id: 'LAST_YEAR', getName: () => i18n.t('Last year') }, - { id: 'LAST_5_YEARS', getName: () => i18n.t('Last 5 years') }, +const getYearsPeriodType = () => [ + { id: 'THIS_YEAR', name: i18n.t('This year') }, + { id: 'LAST_YEAR', name: i18n.t('Last year') }, + { id: 'LAST_5_YEARS', name: i18n.t('Last 5 years') }, ] -const options = [ - { id: DAYS, getPeriods: daysPeriodType, getName: () => i18n.t('Days') }, - { id: WEEKS, getPeriods: weeksPeriodType, getName: () => i18n.t('Weeks') }, +const getOptions = () => [ + { id: DAYS, getPeriods: () => getDaysPeriodType(), name: i18n.t('Days') }, + { + id: WEEKS, + getPeriods: () => getWeeksPeriodType(), + name: i18n.t('Weeks'), + }, { id: BIWEEKS, - getPeriods: biWeeksPeriodType, - getName: () => i18n.t('Bi-weeks'), + getPeriods: () => getBiWeeksPeriodType(), + name: i18n.t('Bi-weeks'), }, { id: MONTHS, - getPeriods: monthsPeriodType, - getName: () => i18n.t('Months'), + getPeriods: () => getMonthsPeriodType(), + name: i18n.t('Months'), }, { id: BIMONTHS, - getPeriods: biMonthsPeriodType, - getName: () => i18n.t('Bi-months'), + getPeriods: () => getBiMonthsPeriodType(), + name: i18n.t('Bi-months'), }, { id: QUARTERS, - getPeriods: quartersPeriodType, - getName: () => i18n.t('Quarters'), + getPeriods: () => getQuartersPeriodType(), + name: i18n.t('Quarters'), }, { id: SIXMONTHS, - getPeriods: sixMonthsPeriodType, - getName: () => i18n.t('Six-months'), + getPeriods: () => getSixMonthsPeriodType(), + name: i18n.t('Six-months'), }, { id: FINACIALYEARS, - getPeriods: financialYearsPeriodType, - getName: () => i18n.t('Financial Years'), + getPeriods: () => getFinancialYearsPeriodType(), + name: i18n.t('Financial Years'), + }, + { + id: YEARS, + getPeriods: () => getYearsPeriodType(), + name: i18n.t('Years'), }, - { id: YEARS, getPeriods: yearsPeriodType, getName: () => i18n.t('Years') }, ] export const getRelativePeriodsOptionsById = id => - options.find(option => option.id === id) + getOptions().find(option => option.id === id) -export const getRelativePeriodsOptions = () => options +export const getRelativePeriodsOptions = () => getOptions() From 0e5993f7c031c37fe91cf029f7df30e53d2c7922 Mon Sep 17 00:00:00 2001 From: Martin Ohlson Date: Wed, 10 Jun 2020 09:56:45 +0200 Subject: [PATCH 12/25] fix: data dimension works again --- src/components/DataDimension/DataTypesSelector.js | 5 +---- src/components/DataDimension/Detail.js | 9 +-------- src/components/DataDimension/Groups.js | 6 +----- 3 files changed, 3 insertions(+), 17 deletions(-) diff --git a/src/components/DataDimension/DataTypesSelector.js b/src/components/DataDimension/DataTypesSelector.js index 211d73639..ca7495162 100644 --- a/src/components/DataDimension/DataTypesSelector.js +++ b/src/components/DataDimension/DataTypesSelector.js @@ -10,10 +10,7 @@ export const DataTypes = ({ currentDataType, onChange }) => (
onChange(ref.selected.value)} dense > diff --git a/src/components/DataDimension/Detail.js b/src/components/DataDimension/Detail.js index 5778e4cb4..5b32b30a7 100644 --- a/src/components/DataDimension/Detail.js +++ b/src/components/DataDimension/Detail.js @@ -18,14 +18,7 @@ export const Detail = ({ currentValue, onChange }) => {
onChange(ref.selected.value)} dense > diff --git a/src/components/DataDimension/Groups.js b/src/components/DataDimension/Groups.js index 60f49039f..30fca7b92 100644 --- a/src/components/DataDimension/Groups.js +++ b/src/components/DataDimension/Groups.js @@ -32,11 +32,7 @@ export const Groups = ({
Date: Wed, 10 Jun 2020 09:57:23 +0200 Subject: [PATCH 13/25] chore: bump ui to 5.0.2 --- package.json | 2 +- yarn.lock | 72 ++++++++++++++++++++++++++-------------------------- 2 files changed, 37 insertions(+), 37 deletions(-) diff --git a/package.json b/package.json index 9cefadbe8..9ad722203 100644 --- a/package.json +++ b/package.json @@ -45,7 +45,7 @@ }, "dependencies": { "@dhis2/d2-ui-org-unit-dialog": "^7.0.4", - "@dhis2/ui": "^5.0.1", + "@dhis2/ui": "^5.0.2", "@material-ui/core": "^3.9.3", "@material-ui/icons": "^3.0.2", "classnames": "^2.2.6", diff --git a/yarn.lock b/yarn.lock index b74f2201f..b359d46c6 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1308,21 +1308,21 @@ dependencies: prop-types "^15" -"@dhis2/ui-constants@5.0.1": - version "5.0.1" - resolved "https://registry.yarnpkg.com/@dhis2/ui-constants/-/ui-constants-5.0.1.tgz#6e85e8aa1790c4cb37edd7218edfe57b5de13c33" - integrity sha512-9YKKUUSLX4vI/StkhxmRnXglMCcWkBun0dNNQUFWV28RyJIeu9YeWlpdxHEPRvCVgcguoFwHQxJ6ULdFqYO65A== +"@dhis2/ui-constants@5.0.2": + version "5.0.2" + resolved "https://registry.yarnpkg.com/@dhis2/ui-constants/-/ui-constants-5.0.2.tgz#c745cc75b30bb39f8de0e220a1c07856a41407cf" + integrity sha512-XQHObhd5fQrFAdX7xA17IeqnLN9xrSZcZnH5GN0ubK28A2+q3S7cKlQGic0wo03v6Hl3xbK6XX74XLWtVLwwiQ== dependencies: "@dhis2/prop-types" "^1.6.4" -"@dhis2/ui-core@5.0.1": - version "5.0.1" - resolved "https://registry.yarnpkg.com/@dhis2/ui-core/-/ui-core-5.0.1.tgz#cf0fc11e826c919bcb25270d1a808d6a4597ee3f" - integrity sha512-lZ7FC1F+LSQvYWOR2VwoOw28B98rOKT1T4YhPKzOlBkGO6TlOE5V2+VwDOFA8mPr7I0ZanQfSnmMJRoLbo4Bog== +"@dhis2/ui-core@5.0.2": + version "5.0.2" + resolved "https://registry.yarnpkg.com/@dhis2/ui-core/-/ui-core-5.0.2.tgz#c1e5d178618b81bc953a5ec6c363d24c474bfdd6" + integrity sha512-OTn6VJX/PfO0fgMsaMCboHVRg6Dc1P2iN0696uEzy4HUdt5pKpZqlOgX4MX7XSz9k3Jb62wGY5bR/spKGM3NXw== dependencies: "@dhis2/prop-types" "^1.6.4" - "@dhis2/ui-constants" "5.0.1" - "@dhis2/ui-icons" "5.0.1" + "@dhis2/ui-constants" "5.0.2" + "@dhis2/ui-icons" "5.0.2" "@popperjs/core" "^2.4.0" classnames "^2.2.6" react-popper "^2.2.3" @@ -1339,35 +1339,35 @@ react-popper "^2.2.3" resize-observer-polyfill "^1.5.1" -"@dhis2/ui-forms@5.0.1": - version "5.0.1" - resolved "https://registry.yarnpkg.com/@dhis2/ui-forms/-/ui-forms-5.0.1.tgz#4f9be1cd9d220c16ce236b786c2c59f69b1dac46" - integrity sha512-iRkjn01gfjss1R8Y4ogwgB48seLKG/zwkafk+0TwP/CVl5AdRRIb3p9XHInBGCwbvEg3XchvmD/5eg8ueTzBJg== +"@dhis2/ui-forms@5.0.2": + version "5.0.2" + resolved "https://registry.yarnpkg.com/@dhis2/ui-forms/-/ui-forms-5.0.2.tgz#d4067565576b83d70b4b290b7e97b42159759ee5" + integrity sha512-Voxhk9fxUI63TCyK09+S7TQE3Oh5KVRqKDWVPkKVKvQ/2LBAaG8zEGwx5ONL47f8MI6TbEMLTnkUE+Ym81Dodg== dependencies: "@dhis2/prop-types" "^1.6.4" - "@dhis2/ui-core" "5.0.1" + "@dhis2/ui-core" "5.0.2" classnames "^2.2.6" final-form "^4.20.0" react-final-form "^6.5.0" -"@dhis2/ui-icons@5.0.1": - version "5.0.1" - resolved "https://registry.yarnpkg.com/@dhis2/ui-icons/-/ui-icons-5.0.1.tgz#67ca1f0ec3b98c08986758527917df0d4aa4e78f" - integrity sha512-Gmh+nRsRiK3JNCB7BY/pBQAStBCX7/c/EOovUY0UzdYXhoA88pwDpRDtfhFhwaDx63rdWzs45AjEMng5DxqQNw== +"@dhis2/ui-icons@5.0.2": + version "5.0.2" + resolved "https://registry.yarnpkg.com/@dhis2/ui-icons/-/ui-icons-5.0.2.tgz#48d1eb04dc7e57529635cd6cbd02b1bf37de7421" + integrity sha512-FB2VlGyaRdeqGGxHe0YivL5KxYHNglokcbqTboXU1EfEgsIOuQuOJh/R19Tepq9gr+QAYxIs9Kw9dkPfBOsuuA== dependencies: "@dhis2/prop-types" "^1.6.4" -"@dhis2/ui-widgets@5.0.1": - version "5.0.1" - resolved "https://registry.yarnpkg.com/@dhis2/ui-widgets/-/ui-widgets-5.0.1.tgz#ecb5a2ae3319cd5345450bb11dc85a3b0956b709" - integrity sha512-v5fRMEyXHVLvZ7dsHMFSn3HQSO0t4E6/Fd630/ja+oOw/GbDnyGfK8xayr62vu4zpjUZu14NbP5o5THTBpnSTw== +"@dhis2/ui-widgets@5.0.2": + version "5.0.2" + resolved "https://registry.yarnpkg.com/@dhis2/ui-widgets/-/ui-widgets-5.0.2.tgz#c5610fc8c8512dc76cb11e9e4f917d2599965381" + integrity sha512-Bbo0Wu4+O5LRYx5y90z/0NRsne8jaf0dQK42jelc4Myg8GbITAqCnwtWglkz0OC/JA7yNaTnnwHL6CBiVmV23A== dependencies: "@dhis2/app-runtime" "^2.2.1" "@dhis2/d2-i18n" "^1" "@dhis2/prop-types" "^1.6.4" - "@dhis2/ui-constants" "5.0.1" - "@dhis2/ui-core" "5.0.1" - "@dhis2/ui-icons" "5.0.1" + "@dhis2/ui-constants" "5.0.2" + "@dhis2/ui-core" "5.0.2" + "@dhis2/ui-icons" "5.0.2" classnames "^2.2.6" resize-observer-polyfill "^1.5.1" @@ -1379,16 +1379,16 @@ "@dhis2/prop-types" "^1.6" classnames "^2.2.6" -"@dhis2/ui@^5.0.1": - version "5.0.1" - resolved "https://registry.yarnpkg.com/@dhis2/ui/-/ui-5.0.1.tgz#5b7c961afd9dab411ae38aaead4092fd4ba4c023" - integrity sha512-5oORi/j0w+QpZaKTclMamnzUR8t8GakLAMvWlUdUfCkwyk2NTbq5JVn7t4JgKgHs7wj4SHNoyXiMvjcCauzkNg== - dependencies: - "@dhis2/ui-constants" "5.0.1" - "@dhis2/ui-core" "5.0.1" - "@dhis2/ui-forms" "5.0.1" - "@dhis2/ui-icons" "5.0.1" - "@dhis2/ui-widgets" "5.0.1" +"@dhis2/ui@^5.0.2": + version "5.0.2" + resolved "https://registry.yarnpkg.com/@dhis2/ui/-/ui-5.0.2.tgz#a32061f095caf1c9f603da42443b284d466fbae4" + integrity sha512-465sBOd29gHKLLQdLA0hTikmCeZZTA2LlF9oC9Xy7Y4tbgga50DkN1gJtE1MQLlcog+NaTRwX3MyrjqSzWn+AQ== + dependencies: + "@dhis2/ui-constants" "5.0.2" + "@dhis2/ui-core" "5.0.2" + "@dhis2/ui-forms" "5.0.2" + "@dhis2/ui-icons" "5.0.2" + "@dhis2/ui-widgets" "5.0.2" "@emotion/cache@^10.0.27": version "10.0.29" From 77ed8b2507db75665aaf6f81e3dff6f47cd6e7cc Mon Sep 17 00:00:00 2001 From: Martin Ohlson Date: Wed, 10 Jun 2020 10:13:26 +0200 Subject: [PATCH 14/25] v7.1.0-alpha.1 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 33c535f55..cbae3fb82 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@dhis2/analytics", - "version": "7.0.2", + "version": "7.1.0-alpha.1", "main": "./build/cjs/lib.js", "module": "./build/es/lib.js", "sideEffects": [ From 1228e5dbf9319e999b1a009eac90862d7da23884 Mon Sep 17 00:00:00 2001 From: Martin Ohlson Date: Wed, 10 Jun 2020 10:14:59 +0200 Subject: [PATCH 15/25] v7.1.0-alpha.2 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index cbae3fb82..e70981f51 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@dhis2/analytics", - "version": "7.1.0-alpha.1", + "version": "7.1.0-alpha.2", "main": "./build/cjs/lib.js", "module": "./build/es/lib.js", "sideEffects": [ From 6d305158d72edc4be12acb8d66e9343a59ba18e1 Mon Sep 17 00:00:00 2001 From: Martin Ohlson Date: Thu, 11 Jun 2020 11:43:30 +0200 Subject: [PATCH 16/25] v7.1.0-alpha.3 --- package.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index 8ab95472d..526d1e067 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@dhis2/analytics", - "version": "7.0.3", + "version": "7.1.0-alpha.3", "main": "./build/cjs/lib.js", "module": "./build/es/lib.js", "sideEffects": [ @@ -45,7 +45,7 @@ }, "dependencies": { "@dhis2/d2-ui-org-unit-dialog": "^7.0.4", - "@dhis2/ui": "^5.0.2", + "@dhis2/ui": "^5.0.3", "@material-ui/core": "^3.9.3", "@material-ui/icons": "^3.0.2", "classnames": "^2.2.6", From 068849a7e873fa8152fa8117cf53531419b3adea Mon Sep 17 00:00:00 2001 From: Martin Ohlson Date: Thu, 11 Jun 2020 11:55:10 +0200 Subject: [PATCH 17/25] chore: yarn.lock auto update --- yarn.lock | 90 +++++++++++++++++++++++++++++++++---------------------- 1 file changed, 54 insertions(+), 36 deletions(-) diff --git a/yarn.lock b/yarn.lock index 6b9152c96..a429bbebc 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1146,6 +1146,24 @@ resolved "https://registry.yarnpkg.com/@dhis2/app-runtime/-/app-runtime-2.1.1.tgz#442946bd52f1d4a968cf1ba05e68440f11f78996" integrity sha512-jYf3YNiPE9RrAPD9C980s/3dhSh8JEq1s3B82O9T7gf+Vx2/covDIPnyU+64HmEjER+6gR5wHWbp7jOzBYSgLA== +"@dhis2/app-runtime@^2.2.1": + version "2.2.2" + resolved "https://registry.yarnpkg.com/@dhis2/app-runtime/-/app-runtime-2.2.2.tgz#c2129c03d4ff3bca4eb3811d82f24d3acea07e5a" + integrity sha512-0890q1deNT/aJtjtxkDROViZBrA0EP00HVMht8YAfM+uJsnvADrtjizP53r68uamZWpCZmLQsi+2xiVAQZmvXA== + dependencies: + "@dhis2/app-service-config" "2.2.2" + "@dhis2/app-service-data" "2.2.2" + +"@dhis2/app-service-config@2.2.2": + version "2.2.2" + resolved "https://registry.yarnpkg.com/@dhis2/app-service-config/-/app-service-config-2.2.2.tgz#9de0bc717ede669ee810fb7d4d84c0d35532a426" + integrity sha512-ohPCNX1hBMh/+0L5gxrSrfH/Bz787x60L4GMWODO0WEO73M6kGCjzaYZ0vjgmSCSUYJxZ6cBeybr0FBArxHjbw== + +"@dhis2/app-service-data@2.2.2": + version "2.2.2" + resolved "https://registry.yarnpkg.com/@dhis2/app-service-data/-/app-service-data-2.2.2.tgz#093d45b8bb71b5b1e81876281379cda52b6632a7" + integrity sha512-QJrYTFj+vINcqvr27yLIKunbNJTVmDPGr9fUliUdmTkCikTwlnK8fu6TPz3rhkOUYX0VrwzFJXp3ofKQajZ9mQ== + "@dhis2/app-shell@4.0.8": version "4.0.8" resolved "https://registry.yarnpkg.com/@dhis2/app-shell/-/app-shell-4.0.8.tgz#cb9e1428e78c5edbdad7b19d7fc5baa27a4668e8" @@ -1290,21 +1308,21 @@ dependencies: prop-types "^15" -"@dhis2/ui-constants@5.0.2": - version "5.0.2" - resolved "https://registry.yarnpkg.com/@dhis2/ui-constants/-/ui-constants-5.0.2.tgz#c745cc75b30bb39f8de0e220a1c07856a41407cf" - integrity sha512-XQHObhd5fQrFAdX7xA17IeqnLN9xrSZcZnH5GN0ubK28A2+q3S7cKlQGic0wo03v6Hl3xbK6XX74XLWtVLwwiQ== +"@dhis2/ui-constants@5.0.3": + version "5.0.3" + resolved "https://registry.yarnpkg.com/@dhis2/ui-constants/-/ui-constants-5.0.3.tgz#8d6e6adc5c7ac3de92236dd97f9be01cc18c3ed5" + integrity sha512-9dnnmc+ztKmstM/AftGs+att4qShZUJWjeLRGMbnFE/fDwAwqvNCgGzmOM3K6YWXrrvJXjQC5TVOzhmqS0jReQ== dependencies: "@dhis2/prop-types" "^1.6.4" -"@dhis2/ui-core@5.0.2": - version "5.0.2" - resolved "https://registry.yarnpkg.com/@dhis2/ui-core/-/ui-core-5.0.2.tgz#c1e5d178618b81bc953a5ec6c363d24c474bfdd6" - integrity sha512-OTn6VJX/PfO0fgMsaMCboHVRg6Dc1P2iN0696uEzy4HUdt5pKpZqlOgX4MX7XSz9k3Jb62wGY5bR/spKGM3NXw== +"@dhis2/ui-core@5.0.3": + version "5.0.3" + resolved "https://registry.yarnpkg.com/@dhis2/ui-core/-/ui-core-5.0.3.tgz#6098eb547d8cbe3453cb6f8e425512c14d7e68ef" + integrity sha512-lh6WhLq0mi9+AX7U9ScfzaPxk3nCl4yNc8LPYt/87AdM/OB7gBytDEg4qjdXlKpvstcytzV0AAUWvvkTqk7N5w== dependencies: "@dhis2/prop-types" "^1.6.4" - "@dhis2/ui-constants" "5.0.2" - "@dhis2/ui-icons" "5.0.2" + "@dhis2/ui-constants" "5.0.3" + "@dhis2/ui-icons" "5.0.3" "@popperjs/core" "^2.4.0" classnames "^2.2.6" react-popper "^2.2.3" @@ -1321,35 +1339,35 @@ react-popper "^2.2.3" resize-observer-polyfill "^1.5.1" -"@dhis2/ui-forms@5.0.2": - version "5.0.2" - resolved "https://registry.yarnpkg.com/@dhis2/ui-forms/-/ui-forms-5.0.2.tgz#d4067565576b83d70b4b290b7e97b42159759ee5" - integrity sha512-Voxhk9fxUI63TCyK09+S7TQE3Oh5KVRqKDWVPkKVKvQ/2LBAaG8zEGwx5ONL47f8MI6TbEMLTnkUE+Ym81Dodg== +"@dhis2/ui-forms@5.0.3": + version "5.0.3" + resolved "https://registry.yarnpkg.com/@dhis2/ui-forms/-/ui-forms-5.0.3.tgz#ccfd3d7b2d157eae408c6efcf5f9448e95573855" + integrity sha512-+x+9XsT7ChdmXsnE6BM/1J2/Z/1SUH45aUid8XA1wS0I31VUAwG+2g0VKqszqGHke+wKgMRwPAKNbGfChuQv1w== dependencies: "@dhis2/prop-types" "^1.6.4" - "@dhis2/ui-core" "5.0.2" + "@dhis2/ui-core" "5.0.3" classnames "^2.2.6" final-form "^4.20.0" react-final-form "^6.5.0" -"@dhis2/ui-icons@5.0.2": - version "5.0.2" - resolved "https://registry.yarnpkg.com/@dhis2/ui-icons/-/ui-icons-5.0.2.tgz#48d1eb04dc7e57529635cd6cbd02b1bf37de7421" - integrity sha512-FB2VlGyaRdeqGGxHe0YivL5KxYHNglokcbqTboXU1EfEgsIOuQuOJh/R19Tepq9gr+QAYxIs9Kw9dkPfBOsuuA== +"@dhis2/ui-icons@5.0.3": + version "5.0.3" + resolved "https://registry.yarnpkg.com/@dhis2/ui-icons/-/ui-icons-5.0.3.tgz#73618454633cc7c76d7683e0c1f7820ab2da7945" + integrity sha512-KzWr6AZAPI7nXlsZOsJgf+5htDrHnQFYc16YwpkaeW7fMh+6LT4QqlVayKAqme/4KidVb9UeOGEqF5nMyl2quw== dependencies: "@dhis2/prop-types" "^1.6.4" -"@dhis2/ui-widgets@5.0.2": - version "5.0.2" - resolved "https://registry.yarnpkg.com/@dhis2/ui-widgets/-/ui-widgets-5.0.2.tgz#c5610fc8c8512dc76cb11e9e4f917d2599965381" - integrity sha512-Bbo0Wu4+O5LRYx5y90z/0NRsne8jaf0dQK42jelc4Myg8GbITAqCnwtWglkz0OC/JA7yNaTnnwHL6CBiVmV23A== +"@dhis2/ui-widgets@5.0.3": + version "5.0.3" + resolved "https://registry.yarnpkg.com/@dhis2/ui-widgets/-/ui-widgets-5.0.3.tgz#1c7836892a9394ee0b78ee57e6d972f34769c582" + integrity sha512-ABjZiJ0ZGrKzDFiDfGizTYdTJvsmqf6fMywr9qUS+AR2p0xDtCfZsi+lURlV9yh35rWm9+/kEgMEet3T5gfHxQ== dependencies: "@dhis2/app-runtime" "^2.2.1" "@dhis2/d2-i18n" "^1" "@dhis2/prop-types" "^1.6.4" - "@dhis2/ui-constants" "5.0.2" - "@dhis2/ui-core" "5.0.2" - "@dhis2/ui-icons" "5.0.2" + "@dhis2/ui-constants" "5.0.3" + "@dhis2/ui-core" "5.0.3" + "@dhis2/ui-icons" "5.0.3" classnames "^2.2.6" resize-observer-polyfill "^1.5.1" @@ -1361,16 +1379,16 @@ "@dhis2/prop-types" "^1.6" classnames "^2.2.6" -"@dhis2/ui@^5.0.2": - version "5.0.2" - resolved "https://registry.yarnpkg.com/@dhis2/ui/-/ui-5.0.2.tgz#a32061f095caf1c9f603da42443b284d466fbae4" - integrity sha512-465sBOd29gHKLLQdLA0hTikmCeZZTA2LlF9oC9Xy7Y4tbgga50DkN1gJtE1MQLlcog+NaTRwX3MyrjqSzWn+AQ== - dependencies: - "@dhis2/ui-constants" "5.0.2" - "@dhis2/ui-core" "5.0.2" - "@dhis2/ui-forms" "5.0.2" - "@dhis2/ui-icons" "5.0.2" - "@dhis2/ui-widgets" "5.0.2" +"@dhis2/ui@^5.0.3": + version "5.0.3" + resolved "https://registry.yarnpkg.com/@dhis2/ui/-/ui-5.0.3.tgz#fb59afd3bf89a7d61754d86e2d8461622660c983" + integrity sha512-U82vkn1GJzbSGW4xhYuBiVXeyuQLc+fP+5ZmK7pTUwJHTrlZKBxfpmX80cWYKswCDV21EXLlyd/ESrjkEG2dQw== + dependencies: + "@dhis2/ui-constants" "5.0.3" + "@dhis2/ui-core" "5.0.3" + "@dhis2/ui-forms" "5.0.3" + "@dhis2/ui-icons" "5.0.3" + "@dhis2/ui-widgets" "5.0.3" "@emotion/cache@^10.0.27": version "10.0.29" From 4ff5203b1c1a4a0b4535faf925c083a1aceb0084 Mon Sep 17 00:00:00 2001 From: Martin Ohlson Date: Thu, 11 Jun 2020 16:51:51 +0200 Subject: [PATCH 18/25] fix: transferOption icon reimplemented --- .../DynamicDimension/ItemSelector.js | 21 +++++++++++++++++-- .../PeriodDimension/PeriodSelector.js | 21 +++++++++++++++++-- src/components/TransferOption.js | 10 +++------ 3 files changed, 41 insertions(+), 11 deletions(-) diff --git a/src/components/DynamicDimension/ItemSelector.js b/src/components/DynamicDimension/ItemSelector.js index 47753f162..d4c51215e 100644 --- a/src/components/DynamicDimension/ItemSelector.js +++ b/src/components/DynamicDimension/ItemSelector.js @@ -5,7 +5,7 @@ import i18n from '@dhis2/d2-i18n' import styles from '../styles/DimensionSelector.style' import { TransferOption } from '../TransferOption' -// import GenericIcon from '../../assets/DimensionItemIcons/GenericIcon' +import GenericIcon from '../../assets/DimensionItemIcons/GenericIcon' import { TRANSFER_HEIGHT, TRANSFER_OPTIONS_WIDTH, @@ -49,7 +49,24 @@ const ItemSelector = ({ label: name, value: id, }))} - renderOption={TransferOption} + renderOption={({ + disabled, + label, + highlighted, + onClick, + onDoubleClick, + value, + }) => ( + + )} // TODO: Add a filter placeholer once the Transfer component supports this (https://github.com/dhis2/ui/issues/131) // TODO: Add rightHeader "Selected Periods" once the Transfer component supports this (https://github.com/dhis2/ui-core/issues/885) /> diff --git a/src/components/PeriodDimension/PeriodSelector.js b/src/components/PeriodDimension/PeriodSelector.js index 3d7128a31..f6d6f1f11 100644 --- a/src/components/PeriodDimension/PeriodSelector.js +++ b/src/components/PeriodDimension/PeriodSelector.js @@ -9,7 +9,7 @@ import { MONTHS, getRelativePeriodsOptionsById } from './utils/relativePeriods' import { MONTHLY, getFixedPeriodsOptionsById } from './utils/fixedPeriods' import styles from '../styles/DimensionSelector.style' import { TransferOption } from '../TransferOption' -//import PeriodIcon from '../../assets/DimensionItemIcons/PeriodIcon' //TODO: Reimplement the icon +import PeriodIcon from '../../assets/DimensionItemIcons/PeriodIcon' //TODO: Reimplement the icon import { TRANSFER_HEIGHT, TRANSFER_OPTIONS_WIDTH, @@ -157,7 +157,24 @@ class PeriodSelector extends Component { label: name, value: id, }))} - renderOption={TransferOption} + renderOption={({ + disabled, + label, + highlighted, + onClick, + onDoubleClick, + value, + }) => ( + + )} // TODO: Add rightHeader "Selected Periods" once the Transfer component supports this (https://github.com/dhis2/ui-core/issues/885) > ) diff --git a/src/components/TransferOption.js b/src/components/TransferOption.js index 4d0e19fbf..598ac3b39 100644 --- a/src/components/TransferOption.js +++ b/src/components/TransferOption.js @@ -1,7 +1,6 @@ import React from 'react' import cx from 'classnames' import propTypes from '@dhis2/prop-types' -import GenericIcon from '../assets/DimensionItemIcons/GenericIcon' import styles from './styles/TransferOption.style' @@ -12,7 +11,7 @@ export const TransferOption = ({ onClick, onDoubleClick, value, - //icon, + icon, }) => { return (
@@ -27,10 +26,7 @@ export const TransferOption = ({ onDoubleClick({ label, value }, event) }} > - {GenericIcon} - { - // TODO: reimplement the custom icon, as different Dimensions need different icons - } + {icon} {label}
@@ -44,7 +40,7 @@ TransferOption.propTypes = { value: propTypes.string.isRequired, disabled: propTypes.bool, highlighted: propTypes.bool, - //icon: propTypes.node, + icon: propTypes.node, onClick: propTypes.func, onDoubleClick: propTypes.func, } From 2ce5cf2b238dfebf545fac4add4708c2a755bffe Mon Sep 17 00:00:00 2001 From: Martin Ohlson Date: Thu, 11 Jun 2020 16:52:21 +0200 Subject: [PATCH 19/25] v7.1.0-alpha.4 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 526d1e067..8a21cea87 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@dhis2/analytics", - "version": "7.1.0-alpha.3", + "version": "7.1.0-alpha.4", "main": "./build/cjs/lib.js", "module": "./build/es/lib.js", "sideEffects": [ From 723796ba46140a077858ecf726391d4fc7fb7e5d Mon Sep 17 00:00:00 2001 From: Martin Ohlson Date: Thu, 11 Jun 2020 16:56:21 +0200 Subject: [PATCH 20/25] refactor: removed duplicate import --- src/components/DataDimension/Groups.js | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/components/DataDimension/Groups.js b/src/components/DataDimension/Groups.js index 30fca7b92..58298f3ff 100644 --- a/src/components/DataDimension/Groups.js +++ b/src/components/DataDimension/Groups.js @@ -1,7 +1,6 @@ import React from 'react' import PropTypes from 'prop-types' -import { SingleSelectField } from '@dhis2/ui' -import { SingleSelectOption } from '@dhis2/ui' +import { SingleSelectField, SingleSelectOption } from '@dhis2/ui' import { Detail } from './Detail' import { dataTypes } from '../../modules/dataTypes' From 10c0f961d1e3e3455de20486f1960f9606047197 Mon Sep 17 00:00:00 2001 From: Martin Ohlson Date: Thu, 11 Jun 2020 16:59:30 +0200 Subject: [PATCH 21/25] refactor: removed obsolete check --- src/components/DataDimension/Groups.js | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/src/components/DataDimension/Groups.js b/src/components/DataDimension/Groups.js index 58298f3ff..2f98fb772 100644 --- a/src/components/DataDimension/Groups.js +++ b/src/components/DataDimension/Groups.js @@ -23,15 +23,13 @@ export const Groups = ({ const groupDetail = dataTypes[dataType].groupDetail - const selected = optionItems.find(item => item.id === groupId) || {} - return (
Date: Thu, 11 Jun 2020 17:02:03 +0200 Subject: [PATCH 22/25] refactor: removed obsolete label variable --- src/components/DataDimension/Detail.js | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/components/DataDimension/Detail.js b/src/components/DataDimension/Detail.js index 5b32b30a7..d666d3b05 100644 --- a/src/components/DataDimension/Detail.js +++ b/src/components/DataDimension/Detail.js @@ -13,12 +13,11 @@ const getOptions = () => ({ export const Detail = ({ currentValue, onChange }) => { const options = getOptions() - const currentLabel = options[currentValue] return (
onChange(ref.selected.value)} dense > From f6d27090064974bf8cffcd8edbc5891b16a31c73 Mon Sep 17 00:00:00 2001 From: Jen Jones Arnesen Date: Thu, 11 Jun 2020 08:25:34 -0700 Subject: [PATCH 23/25] refactor: spread props --- .../DynamicDimension/ItemSelector.js | 20 +++---------------- .../PeriodDimension/PeriodSelector.js | 19 ++---------------- 2 files changed, 5 insertions(+), 34 deletions(-) diff --git a/src/components/DynamicDimension/ItemSelector.js b/src/components/DynamicDimension/ItemSelector.js index d4c51215e..5ea949b61 100644 --- a/src/components/DynamicDimension/ItemSelector.js +++ b/src/components/DynamicDimension/ItemSelector.js @@ -30,6 +30,7 @@ const ItemSelector = ({ ) + console.log('test') return ( { @@ -49,23 +50,8 @@ const ItemSelector = ({ label: name, value: id, }))} - renderOption={({ - disabled, - label, - highlighted, - onClick, - onDoubleClick, - value, - }) => ( - + renderOption={props => ( + )} // TODO: Add a filter placeholer once the Transfer component supports this (https://github.com/dhis2/ui/issues/131) // TODO: Add rightHeader "Selected Periods" once the Transfer component supports this (https://github.com/dhis2/ui-core/issues/885) diff --git a/src/components/PeriodDimension/PeriodSelector.js b/src/components/PeriodDimension/PeriodSelector.js index f6d6f1f11..5afdc3783 100644 --- a/src/components/PeriodDimension/PeriodSelector.js +++ b/src/components/PeriodDimension/PeriodSelector.js @@ -157,23 +157,8 @@ class PeriodSelector extends Component { label: name, value: id, }))} - renderOption={({ - disabled, - label, - highlighted, - onClick, - onDoubleClick, - value, - }) => ( - + renderOption={props => ( + )} // TODO: Add rightHeader "Selected Periods" once the Transfer component supports this (https://github.com/dhis2/ui-core/issues/885) > From c78ab8cfe458cc90e54f3a9ed024cd939c123b7b Mon Sep 17 00:00:00 2001 From: Jen Jones Arnesen Date: Thu, 11 Jun 2020 08:26:47 -0700 Subject: [PATCH 24/25] fix: restore package version --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 8a21cea87..8ac635964 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@dhis2/analytics", - "version": "7.1.0-alpha.4", + "version": "7.0.3", "main": "./build/cjs/lib.js", "module": "./build/es/lib.js", "sideEffects": [ From f7ca41bedd1abc9c0ea1b2f83292a9d42d8c9289 Mon Sep 17 00:00:00 2001 From: Jen Jones Arnesen Date: Thu, 11 Jun 2020 08:29:05 -0700 Subject: [PATCH 25/25] fix: remove console.log --- src/components/DynamicDimension/ItemSelector.js | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/DynamicDimension/ItemSelector.js b/src/components/DynamicDimension/ItemSelector.js index 5ea949b61..98f05b587 100644 --- a/src/components/DynamicDimension/ItemSelector.js +++ b/src/components/DynamicDimension/ItemSelector.js @@ -30,7 +30,6 @@ const ItemSelector = ({ ) - console.log('test') return ( {