WIP

client/coral-framework/actions/notification.js

@@ -1,12 +1,18 @@
-import pym from '../services/pym';
 import * as actions from '../constants/notification';
 
-export const addNotification = (notifType, text) => {
-  pym.sendMessage('coral-alert', `${notifType}|${text}`);
-  return {type: actions.ADD_NOTIFICATION, notifType, text};
-};
-
-export const clearNotification = () => {
-  pym.sendMessage('coral-clear-notification');
-  return {type: actions.CLEAR_NOTIFICATION};
+export const notify = (kind, msg) => (dispatch, _, {notification}) => {
+  switch (kind) {
+  case 'error':
+    notification.error(msg);
+    break;
+  case 'info':
+    notification.info(msg);
+    break;
+  case 'success':
+    notification.success(msg);
+    break;
+  default:
+    throw new Error(`Unknown notification kind ${kind}`);
+  }
+  dispatch({type: actions.NOTIFY, kind, msg});
 };

client/coral-framework/components/TalkProvider.js

@@ -10,6 +10,7 @@ class TalkProvider extends React.Component {
       plugins: this.props.plugins,
       rest: this.props.rest,
       graphqlRegistry: this.props.graphqlRegistry,
+      notification: this.props.notification,
     };
   }
 
@@ -29,6 +30,7 @@ TalkProvider.childContextTypes = {
   plugins: PropTypes.object,
   rest: PropTypes.func,
   graphqlRegistry: PropTypes.object,
+  notification: PropTypes.object,
 };
 
 export default TalkProvider;

client/coral-framework/constants/notification.js

@@ -1,2 +1 @@
-export const ADD_NOTIFICATION = 'ADD_NOTIFICATION';
-export const CLEAR_NOTIFICATION = 'CLEAR_NOTIFICATION';
+export const NOTIFY = 'NOTIFY';

client/coral-framework/services/bootstrap.js

@@ -10,6 +10,7 @@ import bowser from 'bowser';
 import * as Storage from '../helpers/storage';
 import {BASE_PATH} from 'coral-framework/constants/url';
 import {createPluginsService} from './plugins';
+import {createNotificationService} from './notification';
 import {createGraphQLRegistry} from './graphqlRegistry';
 import globalFragments from 'coral-framework/graphql/fragments';
 
@@ -36,7 +37,7 @@ const getAuthToken = (store) => {
   return null;
 };
 
-export function createContext({reducers = {}, pluginsConfig = [], graphqlExtension = {}}) {
+export function createContext({reducers = {}, pluginsConfig = [], graphqlExtension = {}, notification}) {
   const protocol = location.protocol === 'https:' ? 'wss' : 'ws';
   const eventEmitter = new EventEmitter({wildcard: true});
   let store = null;
@@ -60,6 +61,11 @@ export function createContext({reducers = {}, pluginsConfig = [], graphqlExtensi
   });
   const plugins = createPluginsService(pluginsConfig);
   const graphqlRegistry = createGraphQLRegistry(plugins.getSlotFragments.bind(plugins));
+  if (!notification) {
+
+    // Use default notification service (pym based)
+    notification = createNotificationService(pym);
+  }
   const context = {
     client,
     pym,
@@ -67,6 +73,7 @@ export function createContext({reducers = {}, pluginsConfig = [], graphqlExtensi
     eventEmitter,
     rest,
     graphqlRegistry,
+    notification,
   };
 
   // Load framework fragments.

client/coral-framework/services/notification.js

@@ -0,0 +1,13 @@
+export function createNotificationService(pym) {
+  return {
+    success(msg) {
+      pym.sendMessage('coral-alert', `success|${msg}`);
+    },
+    error(msg) {
+      pym.sendMessage('coral-alert', `error|${msg}`);
+    },
+    info(msg) {
+      pym.sendMessage('coral-alert', `info|${msg}`);
+    },
+  };
+}