diff --git a/common/app/Flash/Flash.jsx b/common/app/Flash/Flash.jsx
index d4334e2826..e36d8e2339 100644
--- a/common/app/Flash/Flash.jsx
+++ b/common/app/Flash/Flash.jsx
@@ -2,19 +2,23 @@ import React from 'react';
import PropTypes from 'prop-types';
import { CloseButton } from 'react-bootstrap';
import { connect } from 'react-redux';
-import { createSelector } from 'reselect';
import ns from './ns.json';
-import { alertTypes, latestMessageSelector } from './redux';
+import {
+ alertTypes,
+ latestMessageSelector,
+ clickOnClose
+} from './redux';
const propTypes = {
alertType: PropTypes.oneOf(Object.keys(alertTypes)),
+ clickOnClose: PropTypes.func.isRequired,
message: PropTypes.string
};
const mapStateToProps = latestMessageSelector;
-const mapDispatchToProps = null;
+const mapDispatchToProps = { clickOnClose };
-export function Flash({ alertType, message }) {
+export function Flash({ alertType, clickOnClose, message }) {
if (!message) {
return null;
}
@@ -24,7 +28,7 @@ export function Flash({ alertType, message }) {
{ message }
-
+
);
diff --git a/common/app/Flash/redux/index.js b/common/app/Flash/redux/index.js
index e79dd0fd8c..7237aa2d92 100644
--- a/common/app/Flash/redux/index.js
+++ b/common/app/Flash/redux/index.js
@@ -1,8 +1,19 @@
-import { composeReducers } from 'berkeleys-redux-utils';
import _ from 'lodash/fp';
+import {
+ createTypes,
+ createAction,
+ composeReducers,
+ handleActions
+} from 'berkeleys-redux-utils';
import ns from '../ns.json';
+export const types = createTypes([
+ 'clickOnClose'
+], ns);
+
+export const clickOnClose = createAction(types.clickOnClose, _.noop);
+
export const alertTypes = _.keyBy(_.identity)([
'success',
'info',
@@ -30,11 +41,20 @@ export const latestMessageSelector = _.flow(
getNS,
_.property('stack'),
_.head,
- _.defaultTo(_.stubObject)
+ _.defaultTo({})
);
export default composeReducers(
ns,
+ handleActions(
+ () => ({
+ [types.clickOnClose]: (state) => ({
+ ...state,
+ stack: _.tail(state.stack)
+ })
+ }),
+ defaultState,
+ ),
function metaReducer(state = defaultState, action) {
if (isFlashAction(action)) {
const { payload: { alertType, message } } = getFlashAction(action);