feat(Flash): Get flashes from ssr

client/index.js

@@ -5,10 +5,10 @@ import { render } from 'redux-epic';
 import createHistory from 'history/createBrowserHistory';
 import useLangRoutes from './utils/use-lang-routes';
 import sendPageAnalytics from './utils/send-page-analytics';
-import flashToToast from './utils/flash-to-toast';
 
 import { App, createApp, provideStore } from '../common/app';
 import { getLangFromPath } from '../common/app/utils/lang';
+import flashReducer, { messagesFoundOnBoot } from '../common/app/Flash/redux';
 
 // client specific epics
 import epics from './epics';
@@ -29,7 +29,7 @@ const {
   document,
   ga,
   __fcc__: {
-    flash = [],
+    flash = {},
     data: ssrState = {},
     csrf: {
       token: csrfToken
@@ -51,7 +51,10 @@ const defaultState = isColdStored() ?
 const primaryLang = getLangFromPath(location.pathname);
 
 defaultState.app.csrfToken = csrfToken;
-defaultState.toasts = flashToToast(flash);
+defaultState.flash = flashReducer(
+  defaultState.flash,
+  messagesFoundOnBoot(flash)
+);
 
 const serviceOptions = { xhrPath: '/services', context: { _csrf: csrfToken } };
 
@@ -78,7 +81,7 @@ createApp({
       });
     }
   })
-  .doOnNext(() => log('rendering'))
+  .do(() => log('rendering'))
   .flatMap(({ store }) => render(provideStore(App, store), DOMContainer))
   .subscribe(
     () => debug('react rendered'),

common/app/Flash/redux/index.js

@@ -8,18 +8,13 @@ import {
 
 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',
   'warning',
   'danger'
 ]);
+export const normalizeAlertType = _.get(alertTypes, 'info');
 
 export const getFlashAction = _.flow(
   _.property('meta'),
@@ -31,8 +26,24 @@ export const isFlashAction = _.flow(
   Boolean
 );
 
+export const types = createTypes([
+  'clickOnClose',
+  'messagesFoundOnBoot'
+], ns);
+
+export const clickOnClose = createAction(types.clickOnClose, _.noop);
+export const messagesFoundOnBoot = createAction(types.messagesFoundOnBoot);
+
+export const expressToStack = _.flow(
+  _.toPairs,
+  _.flatMap(([ type, messages ]) => messages.map(({ msg }) => ({
+    message: msg,
+    alertType: normalizeAlertType(type)
+  })))
+);
+
 const defaultState = {
-  stack: [{ alertType: 'danger', message: 'foo bar' }]
+  stack: [{ alertType: 'danger', message: 'foo nar' }]
 };
 
 const getNS = _.property(ns);
@@ -51,6 +62,10 @@ export default composeReducers(
       [types.clickOnClose]: (state) => ({
         ...state,
         stack: _.tail(state.stack)
+      }),
+      [types.messagesFoundOnBoot]: (state, { payload }) => ({
+        ...state,
+        stack: [...state.stack, ...expressToStack(payload)]
       })
     }),
     defaultState,
@@ -63,7 +78,7 @@ export default composeReducers(
         stack: [
           ...state.stack,
           {
-            alertType: alertTypes[alertType] || 'info',
+            alertType: normalizeAlertType(alertType),
             message: _.escape(message)
           }
         ]