Skip to content

Commit

Permalink
fix: vis type imports (#496)
Browse files Browse the repository at this point in the history
  • Loading branch information
martinkrulltott committed Nov 29, 2019
1 parent cb169c7 commit 2a1daaf
Show file tree
Hide file tree
Showing 5 changed files with 195 additions and 212 deletions.
216 changes: 107 additions & 109 deletions packages/app/src/components/App.js
Original file line number Diff line number Diff line change
@@ -1,39 +1,39 @@
import React, { Component } from 'react';
import { connect } from 'react-redux';
import { createSelector } from 'reselect';
import PropTypes from 'prop-types';
import i18n from '@dhis2/d2-i18n';

import Snackbar from '../components/Snackbar/Snackbar';
import MenuBar from './MenuBar/MenuBar';
import TitleBar from './TitleBar/TitleBar';
import VisualizationTypeSelector from './VisualizationTypeSelector/VisualizationTypeSelector';
import DimensionsPanel from './DimensionsPanel/DimensionsPanel';
import Interpretations from './Interpretations/Interpretations';
import Visualization from './Visualization/Visualization';
import Layout from './Layout/Layout';
import * as fromReducers from '../reducers';
import { sGetUiType } from '../reducers/ui';
import * as fromActions from '../actions';
import history from '../modules/history';
import defaultMetadata from '../modules/metadata';
import { chartTypes } from '@dhis2/data-visualizer-plugin';
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { createSelector } from 'reselect'
import PropTypes from 'prop-types'
import i18n from '@dhis2/d2-i18n'
import { VIS_TYPE_PIVOT_TABLE } from '@dhis2/analytics'

import Snackbar from '../components/Snackbar/Snackbar'
import MenuBar from './MenuBar/MenuBar'
import TitleBar from './TitleBar/TitleBar'
import VisualizationTypeSelector from './VisualizationTypeSelector/VisualizationTypeSelector'
import DimensionsPanel from './DimensionsPanel/DimensionsPanel'
import Interpretations from './Interpretations/Interpretations'
import Visualization from './Visualization/Visualization'
import Layout from './Layout/Layout'
import * as fromReducers from '../reducers'
import { sGetUiType } from '../reducers/ui'
import * as fromActions from '../actions'
import history from '../modules/history'
import defaultMetadata from '../modules/metadata'
import {
apiFetchAOFromUserDataStore,
CURRENT_AO_KEY,
} from '../api/userDataStore';
} from '../api/userDataStore'

import './App.css';
import './scrollbar.css';
import { getParentGraphMapFromVisualization } from '../modules/ui';
import AxisSetup from './AxisSetup/AxisSetup';
import './App.css'
import './scrollbar.css'
import { getParentGraphMapFromVisualization } from '../modules/ui'
import AxisSetup from './AxisSetup/AxisSetup'

export class App extends Component {
unlisten = null;
unlisten = null

state = {
previousLocation: null,
};
}

/**
* The following cases require a fetch/refetch of the AO
Expand All @@ -43,44 +43,44 @@ export class App extends Component {
*/
refetch = location => {
if (!this.state.previousLocation) {
return true;
return true
}

const id = location.pathname.slice(1).split('/')[0];
const prevId = this.state.previousLocation.slice(1).split('/')[0];
const id = location.pathname.slice(1).split('/')[0]
const prevId = this.state.previousLocation.slice(1).split('/')[0]

if (
id !== prevId ||
this.state.previousLocation === location.pathname
) {
return true;
return true
}

return false;
};
return false
}

loadVisualization = async location => {
const { store } = this.context;
const { store } = this.context

if (location.pathname.length > 1) {
// /currentAnalyticalObject
// /${id}/
// /${id}/interpretation/${interpretationId}
const pathParts = location.pathname.slice(1).split('/');
const id = pathParts[0];
const interpretationId = pathParts[2];
const urlContainsCurrentAOKey = id === CURRENT_AO_KEY;
const pathParts = location.pathname.slice(1).split('/')
const id = pathParts[0]
const interpretationId = pathParts[2]
const urlContainsCurrentAOKey = id === CURRENT_AO_KEY

if (urlContainsCurrentAOKey) {
const AO = await apiFetchAOFromUserDataStore();
const AO = await apiFetchAOFromUserDataStore()

this.props.addParentGraphMap(
getParentGraphMapFromVisualization(AO)
);
)

this.props.setVisualization(AO);
this.props.setUiFromVisualization(AO);
this.props.setCurrentFromUi(this.props.ui);
this.props.setVisualization(AO)
this.props.setUiFromVisualization(AO)
this.props.setCurrentFromUi(this.props.ui)
}

if (!urlContainsCurrentAOKey && this.refetch(location)) {
Expand All @@ -91,31 +91,31 @@ export class App extends Component {
interpretationId,
ouLevels: this.props.ouLevels,
})
);
)
}

if (!interpretationId) {
store.dispatch(fromActions.fromUi.acClearUiInterpretation());
store.dispatch(fromActions.fromUi.acClearUiInterpretation())
}
} else {
fromActions.clearVisualization(store.dispatch, store.getState);
fromActions.fromUi.acClearUiInterpretation(store.dispatch);
fromActions.clearVisualization(store.dispatch, store.getState)
fromActions.fromUi.acClearUiInterpretation(store.dispatch)
}

this.setState({ previousLocation: location.pathname });
};
this.setState({ previousLocation: location.pathname })
}

componentDidMount = async () => {
const { store } = this.context;
const { d2, userSettings } = this.props;
const { store } = this.context
const { d2, userSettings } = this.props

await store.dispatch(
fromActions.fromSettings.tAddSettings(userSettings)
);
store.dispatch(fromActions.fromUser.acReceivedUser(d2.currentUser));
store.dispatch(fromActions.fromDimensions.tSetDimensions());
)
store.dispatch(fromActions.fromUser.acReceivedUser(d2.currentUser))
store.dispatch(fromActions.fromDimensions.tSetDimensions())

const rootOrgUnit = this.props.settings.rootOrganisationUnit;
const rootOrgUnit = this.props.settings.rootOrganisationUnit

store.dispatch(
fromActions.fromMetadata.acAddMetadata({
Expand All @@ -125,26 +125,26 @@ export class App extends Component {
path: `/${rootOrgUnit.id}`,
},
})
);
)

this.loadVisualization(this.props.location);
this.loadVisualization(this.props.location)

this.unlisten = history.listen(location => {
this.loadVisualization(location);
});
this.loadVisualization(location)
})

document.body.addEventListener(
'keyup',
e =>
e.key === 'Enter' &&
e.ctrlKey === true &&
this.props.setCurrentFromUi(this.props.ui)
);
};
)
}

componentWillUnmount() {
if (this.unlisten) {
this.unlisten();
this.unlisten()
}
}

Expand All @@ -153,63 +153,64 @@ export class App extends Component {
baseUrl: this.props.baseUrl,
i18n,
d2: this.props.d2,
};
}
}

render() {
return (<>
<AxisSetup />
<div className="data-visualizer-app flex-ct flex-dir-col">
<div className="section-toolbar flex-ct">
<div className="toolbar-type">
<VisualizationTypeSelector />
</div>
<div className="toolbar-menubar flex-grow-1">
<MenuBar apiObjectName={this.props.apiObjectName} />
</div>
</div>
<div className="section-main flex-grow-1 flex-ct">
<div className="main-left">
<DimensionsPanel />
</div>
<div className="main-center flex-grow-1 flex-basis-0 flex-ct flex-dir-col">
<div className="main-center-layout">
<Layout />
return (
<>
<AxisSetup />
<div className="data-visualizer-app flex-ct flex-dir-col">
<div className="section-toolbar flex-ct">
<div className="toolbar-type">
<VisualizationTypeSelector />
</div>
<div className="main-center-titlebar">
<TitleBar />
</div>
<div className="main-center-canvas flex-grow-1">
<Visualization />
<div className="toolbar-menubar flex-grow-1">
<MenuBar apiObjectName={this.props.apiObjectName} />
</div>
</div>
{this.props.ui.rightSidebarOpen && this.props.current && (
<div className="main-right">
<Interpretations
type={this.props.apiObjectName}
id={this.props.current.id}
/>
<div className="section-main flex-grow-1 flex-ct">
<div className="main-left">
<DimensionsPanel />
</div>
<div className="main-center flex-grow-1 flex-basis-0 flex-ct flex-dir-col">
<div className="main-center-layout">
<Layout />
</div>
<div className="main-center-titlebar">
<TitleBar />
</div>
<div className="main-center-canvas flex-grow-1">
<Visualization />
</div>
</div>
)}
{this.props.ui.rightSidebarOpen && this.props.current && (
<div className="main-right">
<Interpretations
type={this.props.apiObjectName}
id={this.props.current.id}
/>
</div>
)}
</div>
</div>
</div>
<Snackbar />
</>);
<Snackbar />
</>
)
}
}

const apiObjectSelector = createSelector(
[sGetUiType],
type => (type === chartTypes.PIVOT_TABLE ? 'reportTable' : 'chart')
);
const apiObjectSelector = createSelector([sGetUiType], type =>
type === VIS_TYPE_PIVOT_TABLE ? 'reportTable' : 'chart'
)

const mapStateToProps = state => ({
settings: fromReducers.fromSettings.sGetSettings(state),
current: fromReducers.fromCurrent.sGetCurrent(state),
interpretations: fromReducers.fromVisualization.sGetInterpretations(state),
ui: fromReducers.fromUi.sGetUi(state),
apiObjectName: apiObjectSelector(state),
});
})

const mapDispatchToProps = dispatch => ({
setCurrentFromUi: ui =>
Expand All @@ -222,25 +223,22 @@ const mapDispatchToProps = dispatch => ({
dispatch(fromActions.fromUi.acSetUiFromVisualization(visualization)),
addParentGraphMap: parentGraphMap =>
dispatch(fromActions.fromUi.acAddParentGraphMap(parentGraphMap)),
});
})

App.contextTypes = {
store: PropTypes.object,
};
}

App.childContextTypes = {
d2: PropTypes.object,
baseUrl: PropTypes.string,
i18n: PropTypes.object,
};
}

App.propTypes = {
d2: PropTypes.object,
baseUrl: PropTypes.string,
location: PropTypes.object,
};
}

export default connect(
mapStateToProps,
mapDispatchToProps
)(App);
export default connect(mapStateToProps, mapDispatchToProps)(App)
Original file line number Diff line number Diff line change
@@ -1,21 +1,21 @@
import React from 'react';
import { shallow } from 'enzyme';
import React from 'react'
import { shallow } from 'enzyme'

import { AddToLayoutButton } from '../AddToLayoutButton';
import { AddToLayoutButton } from '../AddToLayoutButton'

describe('The AddToLayoutButton component ', () => {
let props;
let shallowButton;
let props
let shallowButton

const getShallowAddToLayoutButton = () => {
if (!shallowButton) {
shallowButton = shallow(<AddToLayoutButton {...props} />);
shallowButton = shallow(<AddToLayoutButton {...props} />)
}
return shallowButton;
};
return shallowButton
}

// TODO remove
console.log('getShallowAddToLayoutButton', getShallowAddToLayoutButton);
console.log('getShallowAddToLayoutButton', getShallowAddToLayoutButton)

beforeEach(() => {
props = {
Expand All @@ -25,13 +25,13 @@ describe('The AddToLayoutButton component ', () => {
dialogId: '',
onAddDimension: jest.fn(),
ui: { type: 'COLUMN' },
};
shallowButton = undefined;
});
}
shallowButton = undefined
})

it('new test below must be fixed', () => {
expect(true).toBe(true);
});
expect(true).toBe(true)
})

// new tests
// https://jira.dhis2.org/browse/DHIS2-7809
Expand Down Expand Up @@ -67,4 +67,4 @@ describe('The AddToLayoutButton component ', () => {
expect(addToFilterButton.find('div').length).toEqual(0);
expect(addToFilterButton.length).toEqual(1);
});*/
});
})
Loading

0 comments on commit 2a1daaf

Please sign in to comment.