fix: use shared vis types (#368)

* use vis types from analytics * upgrades to and depends on @dhis2/analytics to v2.5.2 * implemented layout rules for the "add to layout" button
dhis2 · Nov 14, 2019 · 26d12c6 · 26d12c6
1 parent a3dbb9f
commit 26d12c6
Show file tree

Hide file tree

Showing 25 changed files with 195 additions and 249 deletions.
diff --git a/packages/app/i18n/en.pot b/packages/app/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: 2019-11-11T13:15:11.091Z\n"
-"PO-Revision-Date: 2019-11-11T13:15:11.091Z\n"
+"POT-Creation-Date: 2019-11-11T14:45:11.552Z\n"
+"PO-Revision-Date: 2019-11-11T14:45:11.552Z\n"
 
 msgid "Rename successful"
 msgstr ""
@@ -45,9 +45,6 @@ msgstr ""
 msgid "Hide"
 msgstr ""
 
-msgid "Remove"
-msgstr ""
-
 msgid "Download"
 msgstr ""
 
@@ -114,6 +111,9 @@ msgstr ""
 msgid "Move to"
 msgstr ""
 
+msgid "Remove"
+msgstr ""
+
 msgid "None selected"
 msgstr ""
 
@@ -297,45 +297,6 @@ msgstr ""
 msgid "Chart options"
 msgstr ""
 
-msgid "Column"
-msgstr ""
-
-msgid "Stacked column"
-msgstr ""
-
-msgid "Bar"
-msgstr ""
-
-msgid "Stacked bar"
-msgstr ""
-
-msgid "Line"
-msgstr ""
-
-msgid "Area"
-msgstr ""
-
-msgid "Pie"
-msgstr ""
-
-msgid "Radar"
-msgstr ""
-
-msgid "Gauge"
-msgstr ""
-
-msgid "Year over year (line)"
-msgstr ""
-
-msgid "Year over year (column)"
-msgstr ""
-
-msgid "Single value"
-msgstr ""
-
-msgid "Open as Map"
-msgstr ""
-
 msgid "Reporting rate"
 msgstr ""
 

diff --git a/packages/app/package.json b/packages/app/package.json
@@ -25,7 +25,7 @@
         "webpack-bundle-analyzer": "^3.0.3"
     },
     "dependencies": {
-        "@dhis2/analytics": "^2.5.1",
+        "@dhis2/analytics": "^2.5.2",
         "@dhis2/d2-i18n": "^1.0.6",
         "@dhis2/d2-ui-core": "^6.2.1",
         "@dhis2/d2-ui-file-menu": "^6.2.1",

diff --git a/packages/app/src/actions/current.js b/packages/app/src/actions/current.js
@@ -3,6 +3,7 @@ import {
     SET_CURRENT_FROM_UI,
     CLEAR_CURRENT,
 } from '../reducers/current';
+import { sGetUi } from '../reducers/ui';
 
 export const acSetCurrent = value => ({
     type: SET_CURRENT,
@@ -17,3 +18,7 @@ export const acSetCurrentFromUi = value => ({
     type: SET_CURRENT_FROM_UI,
     value,
 });
+
+export const tSetCurrentFromUi = () => async (dispatch, getState) => {
+    dispatch(acSetCurrentFromUi(sGetUi(getState())));
+};
diff --git a/packages/app/src/components/DimensionsPanel/Dialogs/AddToLayoutButton/AddToLayoutButton.js b/packages/app/src/components/DimensionsPanel/Dialogs/AddToLayoutButton/AddToLayoutButton.js
@@ -9,15 +9,15 @@ import { getAvailableAxes } from '@dhis2/analytics';
 import UpdateButton from '../../../UpdateButton/UpdateButton';
 import Menu from './Menu';
 import {
-    sGetUi,
     sGetUiActiveModalDialog,
     sGetDimensionIdsFromLayout,
+    sGetUiType,
 } from '../../../../reducers/ui';
 import {
     acSetUiActiveModalDialog,
     acAddUiLayoutDimensions,
 } from '../../../../actions/ui';
-import { acSetCurrentFromUi } from '../../../../actions/current';
+import { tSetCurrentFromUi } from '../../../../actions/current';
 
 import { ADD_TO_LAYOUT_OPTIONS } from '../../../../modules/layout';
 import styles from './styles/AddToLayoutButton.style';
@@ -41,7 +41,9 @@ export class AddToLayoutButton extends Component {
         this.props.onAddDimension({
             [this.props.dialogId]: axisName,
         });
-        this.props.onUpdate(this.props.ui);
+
+        this.props.onUpdate();
+
         this.props.closeDialog(null);
     };
 
@@ -53,7 +55,7 @@ export class AddToLayoutButton extends Component {
         );
 
     renderMenuItems = () =>
-        this.getAxisMeta(getAvailableAxes(this.props.ui.type))
+        this.getAxisMeta(getAvailableAxes(this.props.visType))
             .slice(1)
             .map(axisMetaObj => (
                 <MenuItem
@@ -68,7 +70,7 @@ export class AddToLayoutButton extends Component {
 
     renderAddToLayoutButton = () => {
         const availableAxisMeta = this.getAxisMeta(
-            getAvailableAxes(this.props.ui.type)
+            getAvailableAxes(this.props.visType)
         );
 
         return (
@@ -79,7 +81,7 @@ export class AddToLayoutButton extends Component {
                     color="primary"
                     disableRipple
                     disableFocusRipple
-                    onClick={() => this.onUpdate(availableAxisMeta[0].name)}
+                    onClick={() => this.onUpdate(availableAxisMeta[0].axisName)}
                 >
                     {availableAxisMeta[0].name}
                 </Button>
@@ -117,23 +119,25 @@ export class AddToLayoutButton extends Component {
 
 AddToLayoutButton.propTypes = {
     classes: PropTypes.object.isRequired,
+    visType: PropTypes.string.isRequired,
     dialogId: PropTypes.string.isRequired,
     dimensionIdsInLayout: PropTypes.array.isRequired,
-    closeDialog: PropTypes.func.isRequired,
     onAddDimension: PropTypes.func.isRequired,
+    onUpdate: PropTypes.func.isRequired,
+    closeDialog: PropTypes.func.isRequired,
 };
 
 const mapStateToProps = state => ({
-    ui: sGetUi(state),
+    visType: sGetUiType(state),
     dialogId: sGetUiActiveModalDialog(state),
     dimensionIdsInLayout: sGetDimensionIdsFromLayout(state),
 });
 
 export default connect(
     mapStateToProps,
     {
-        closeDialog: acSetUiActiveModalDialog,
         onAddDimension: acAddUiLayoutDimensions,
-        onUpdate: acSetCurrentFromUi,
+        onUpdate: tSetCurrentFromUi,
+        closeDialog: acSetUiActiveModalDialog,
     }
 )(withStyles(styles)(AddToLayoutButton));
diff --git a/packages/app/src/components/DimensionsPanel/Dialogs/DialogManager.js b/packages/app/src/components/DimensionsPanel/Dialogs/DialogManager.js
@@ -18,6 +18,7 @@ import {
     DIMENSION_ID_PERIOD,
     DIMENSION_ID_ORGUNIT,
     FIXED_DIMENSIONS,
+    isSingleValue,
 } from '@dhis2/analytics';
 
 import HideButton from './HideButton';
@@ -45,7 +46,6 @@ import { sGetMetadata } from '../../../reducers/metadata';
 import { sGetSettingsDisplayNameProperty } from '../../../reducers/settings';
 import { apiFetchRecommendedIds } from '../../../api/dimensions';
 import { removeLastPathSegment, getOuPath } from '../../../modules/orgUnit';
-import { isSingleValue } from '../../../modules/chartTypes';
 
 export class DialogManager extends Component {
     state = {

diff --git a/packages/app/src/components/DimensionsPanel/Dialogs/__tests__/DialogManager.spec.js b/packages/app/src/components/DimensionsPanel/Dialogs/__tests__/DialogManager.spec.js
@@ -28,6 +28,7 @@ jest.mock('@dhis2/analytics', () => {
         DynamicDimension: () => <div />,
         PeriodDimension: () => <div />,
         OrgUnitDimension: () => <div />,
+        isSingleValue: () => true,
         DIMENSION_ID_DATA: dataId,
         DIMENSION_ID_PERIOD: periodId,
         DIMENSION_ID_ORGUNIT: ouId,

diff --git a/packages/app/src/components/DimensionsPanel/DimensionsPanel.js b/packages/app/src/components/DimensionsPanel/DimensionsPanel.js
@@ -4,12 +4,12 @@ import {
     DIMENSION_ID_PERIOD,
     DimensionsPanel,
     DimensionMenu,
+    isYearOverYear,
 } from '@dhis2/analytics';
 
 import DialogManager from './Dialogs/DialogManager';
 import { SOURCE_DIMENSIONS, getInverseLayout } from '../../modules/layout';
 import { setDataTransfer } from '../../modules/dnd';
-import { isYearOverYear } from '../../modules/chartTypes';
 import * as fromReducers from '../../reducers';
 import * as fromActions from '../../actions';
 

diff --git a/packages/app/src/components/Layout/Chip.js b/packages/app/src/components/Layout/Chip.js
@@ -1,8 +1,12 @@
 import React from 'react';
 import { connect } from 'react-redux';
-import i18n from '@dhis2/d2-i18n';
-import { FIXED_DIMENSIONS, DIMENSION_ID_DATA } from '@dhis2/analytics';
 import WarningIcon from '@material-ui/icons/Warning';
+import i18n from '@dhis2/d2-i18n';
+import {
+    FIXED_DIMENSIONS,
+    DIMENSION_ID_DATA,
+    isSingleValue,
+} from '@dhis2/analytics';
 
 import Menu from './Menu';
 import Tooltip from './Tooltip';
@@ -12,7 +16,6 @@ import { sGetUiItemsByDimension, sGetUiType } from '../../reducers/ui';
 import DynamicDimensionIcon from '../../assets/DynamicDimensionIcon';
 import { sGetMetadata } from '../../reducers/metadata';
 import { styles } from './styles/Chip.style';
-import { isSingleValue } from '../../modules/chartTypes';
 
 const TOOLTIP_ENTER_DELAY = 500;
 

diff --git a/packages/app/src/components/Layout/DefaultLayout/DefaultAxis.js b/packages/app/src/components/Layout/DefaultLayout/DefaultAxis.js
@@ -7,6 +7,8 @@ import {
     AXIS_NAME_COLUMNS,
     AXIS_NAMES,
     DIMENSION_ID_DATA,
+    isYearOverYear,
+    isDualAxisType,
 } from '@dhis2/analytics';
 
 import Chip from '../Chip';
@@ -18,7 +20,6 @@ import {
 } from '../../../actions/ui';
 import { SOURCE_DIMENSIONS, menuLabels } from '../../../modules/layout';
 import { getAdaptedUiByType } from '../../../modules/ui';
-import { isYearOverYear, isDualAxisType } from '../../../modules/chartTypes';
 
 import styles from './styles/DefaultAxis.style';
 

diff --git a/packages/app/src/components/Layout/Layout.js b/packages/app/src/components/Layout/Layout.js
@@ -1,38 +1,38 @@
 import React from 'react';
 import { connect } from 'react-redux';
+import {
+    VIS_TYPE_COLUMN,
+    VIS_TYPE_STACKED_COLUMN,
+    VIS_TYPE_BAR,
+    VIS_TYPE_STACKED_BAR,
+    VIS_TYPE_LINE,
+    VIS_TYPE_AREA,
+    VIS_TYPE_PIE,
+    VIS_TYPE_RADAR,
+    VIS_TYPE_GAUGE,
+    VIS_TYPE_YEAR_OVER_YEAR_LINE,
+    VIS_TYPE_YEAR_OVER_YEAR_COLUMN,
+    VIS_TYPE_SINGLE_VALUE,
+} from '@dhis2/analytics';
 
 import DefaultLayout from './DefaultLayout/DefaultLayout';
 import YearOverYearLayout from './YearOverYearLayout/YearOverYearLayout';
 import PieLayout from './PieLayout/PieLayout';
-import {
-    COLUMN,
-    STACKED_COLUMN,
-    BAR,
-    STACKED_BAR,
-    LINE,
-    AREA,
-    PIE,
-    RADAR,
-    GAUGE,
-    YEAR_OVER_YEAR_LINE,
-    YEAR_OVER_YEAR_COLUMN,
-    SINGLE_VALUE,
-} from '../../modules/chartTypes';
 import { sGetUiType } from '../../reducers/ui';
 
 const layoutMap = {
-    [COLUMN]: DefaultLayout,
-    [STACKED_COLUMN]: DefaultLayout,
-    [BAR]: DefaultLayout,
-    [STACKED_BAR]: DefaultLayout,
-    [LINE]: DefaultLayout,
-    [AREA]: DefaultLayout,
-    [PIE]: PieLayout,
-    [RADAR]: DefaultLayout,
-    [GAUGE]: PieLayout,
-    [YEAR_OVER_YEAR_LINE]: YearOverYearLayout,
-    [YEAR_OVER_YEAR_COLUMN]: YearOverYearLayout,
-    [SINGLE_VALUE]: PieLayout,
+    [VIS_TYPE_COLUMN]: DefaultLayout,
+    [VIS_TYPE_STACKED_COLUMN]: DefaultLayout,
+    [VIS_TYPE_BAR]: DefaultLayout,
+    [VIS_TYPE_STACKED_BAR]: DefaultLayout,
+    [VIS_TYPE_LINE]: DefaultLayout,
+    [VIS_TYPE_AREA]: DefaultLayout,
+    [VIS_TYPE_PIE]: PieLayout,
+    [VIS_TYPE_RADAR]: DefaultLayout,
+    [VIS_TYPE_GAUGE]: PieLayout,
+    [VIS_TYPE_YEAR_OVER_YEAR_LINE]: YearOverYearLayout,
+    [VIS_TYPE_YEAR_OVER_YEAR_COLUMN]: YearOverYearLayout,
+    [VIS_TYPE_SINGLE_VALUE]: PieLayout,
 };
 
 const getLayoutByType = (type, props) => {