diff --git a/src/components/ErrorDialog.js b/src/components/ErrorDialog.js index 1a1ca71f8efa9a12f3a2905ba271fcc829b5fbe6..9b819ef9d60e8bd2cc480a0f0abcbac916ebd151 100644 --- a/src/components/ErrorDialog.js +++ b/src/components/ErrorDialog.js @@ -5,6 +5,12 @@ import DialogTitle from '@material-ui/core/DialogTitle'; import PropTypes from 'prop-types'; import { Typography } from '@material-ui/core'; import Button from '@material-ui/core/Button'; +import { + first, + isUndefined, + omit, + values, +} from 'lodash'; /** */ @@ -15,13 +21,17 @@ export class ErrorDialog extends Component { */ render() { const { - error, removeError, open, t, + errors, removeError, t, } = this.props; + /* extract 'items' value and get first key-value-pair (an error) */ + const error = first(values(omit(errors, 'items'))); + const hasError = !isUndefined(error); + return ( <div> - { error && ( - <Dialog id="workspace-settings" open={open} onClose={() => removeError(error.id)}> + { hasError && ( + <Dialog id="workspace-settings" onClose={() => removeError(error.id)} open={hasError}> <DialogTitle id="form-dialog-title">{t('errorDialogTitle')}</DialogTitle> <DialogContent> <Typography variant="body2" noWrap color="inherit"> @@ -41,14 +51,13 @@ export class ErrorDialog extends Component { } ErrorDialog.propTypes = { - error: PropTypes.object, // eslint-disable-line react/forbid-prop-types - open: PropTypes.bool, // eslint-disable-line react/forbid-prop-types - removeError: PropTypes.func.isRequired, + errors: PropTypes.object, // eslint-disable-line react/forbid-prop-types + removeError: PropTypes.func, t: PropTypes.func, }; ErrorDialog.defaultProps = { - error: null, - open: false, + errors: null, + removeError: () => {}, t: key => key, }; diff --git a/src/containers/ErrorDialog.js b/src/containers/ErrorDialog.js index a892558c7da58ee2988bd87593b722d00ed8454f..2d1fc27cfae474e4f16e7c7d50bfd1501b8c99e9 100644 --- a/src/containers/ErrorDialog.js +++ b/src/containers/ErrorDialog.js @@ -4,7 +4,6 @@ import { withTranslation } from 'react-i18next'; import { withPlugins } from '../extend'; import ErrorDialog from '../components/ErrorDialog'; import * as actions from '../state/actions'; -import { getLatestError } from '../state/selectors'; /** * mapStateToProps - to hook up connect @@ -12,7 +11,7 @@ import { getLatestError } from '../state/selectors'; * @private */ const mapStateToProps = state => ({ - error: getLatestError(state), + errors: state.errors, }); /**