react-redux-alerts - npm Package Compare versions

Comparing version 1.4.0 to 1.5.0

lib/actions.js

@@ -18,4 +18,4 @@ 'use strict';
 
-var createAlert = exports.createAlert = function createAlert(alertName) {
-  return { type: alertConstants.CREATE_ALERT, alertName: alertName };
+var createAlert = exports.createAlert = function createAlert(alertName, alertMessage) {
+  return { type: alertConstants.CREATE_ALERT, alertName: alertName, alertMessage: alertMessage };
 };
@@ -22,0 +22,0 @@

lib/alertContainer.js

@@ -7,2 +7,4 @@ 'use strict';
 
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
 var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
@@ -66,5 +68,5 @@
           if (!this.props.isVisible) return false;
-          return _react2.default.createElement(WrappedComponent, { close: function close() {
+          return _react2.default.createElement(WrappedComponent, _extends({}, this.props, { close: function close() {
               return _this2.close();
-            } });
+            } }));
         }
@@ -71,0 +73,0 @@ }]);

lib/reducer.js

@@ -19,10 +19,12 @@ 'use strict';
 
+var initialState = { isVisible: false, message: '' };
+
 var behaviors = (_behaviors = {}, _defineProperty(_behaviors, alertTypes.CREATE_ALERT, function (state, action) {
-  return true;
+  var alertMessage = action.alertMessage;
+
+  return Object.assign({}, state, { isVisible: true, message: alertMessage });
 }), _defineProperty(_behaviors, alertTypes.DISMISS_ALERT, function (state, action) {
-  return false;
+  return Object.assign({}, state, { isVisible: false });
 }), _behaviors);
 
-var initialAlertState = false;
-
 var reducer = function reducer(state, action) {
@@ -41,8 +43,7 @@ var behavior = behaviors[action.type];
   if (type === alertTypes.INITIALIZE_ALERT) {
-    return _extends({}, state, _defineProperty({}, alertName, false));
+    return _extends({}, state, _defineProperty({}, alertName, initialState));
   }
   if (type === alertTypes.DISMISS_ALL_ALERTS) {
     return Object.keys(state).reduce(function (acc, alert) {
-      var prev = Object.assign({}, acc, _defineProperty({}, alert, initialAlertState));
-      return prev;
+      return Object.assign({}, acc, _defineProperty({}, alert, initialState));
     }, {});
@@ -54,4 +55,3 @@ }
     return Object.keys(state).reduce(function (acc, alert) {
-      var prev = alert === alertName ? acc : _extends({}, acc, _defineProperty({}, alert, state[alert]));
-      return prev;
+      return alert === alertName ? acc : _extends({}, acc, _defineProperty({}, alert, state[alert]));
     }, {});
@@ -58,0 +58,0 @@ }

package.json

 {
   "name": "react-redux-alerts",
-  "version": "1.4.0",
+  "version": "1.5.0",
   "description": "A lightweight library for creating keyed alerts in a Redux app",
@@ -8,3 +8,3 @@ "main": "./lib/index.js",
     "test": "mocha --compilers js:babel-register --recursive ",
-    "test-watch": "./node_modules/mocha/bin/mocha test --watch --recursive",
+    "test-watch": "mocha --compilers js:babel-register --watch --recursive",
     "build:lib": "babel src --out-dir lib",
@@ -11,0 +11,0 @@ "prepublish": "npm run build:lib"

readme.md

 #react-redux-alerts
----
+
+
 ## Installation
@@ -15,15 +16,14 @@ ```npm i react-redux-alerts --save```
 
+const MyAlert = () => (
+    <div>
+        This is my custom alert message.
+    </div>
+);
+
 /** 
- * This is a wrapper method that connects your alert to the store based on a alertName key. This will be the unique identifier that will allow you to both show the alert and dismiss the alert. 
+ * This is a wrapper method that connects your alert to the store based on a alertName key. This is the unique identifier that will allow you to both show the alert and dismiss the alert. 
  */
-
-const MyAlert = () -> (
-        <div>
-            This is my custom alert message.
-        </div>
-    );
-
 export default createAlert({
     alertName: 'myAlert'
-    })(MyAlert);
+})(MyAlert);
 ```
@@ -45,13 +45,13 @@
         return(
-                <div>
-                    This is my custom container.
-                    <Alert />
-                    <button onClick={() => this.props.createAlert('myAlert')}
-                        Create Alert!
-                    </button>
-                    <button onClick={() => this.props.dismissAlert('myAlert')}
-                        Dismiss Alert!
-                    </button>
-                </div>
-            )
+            <div>
+                This is my custom container.
+                <MyAlert />
+                <button onClick={() => this.props.createAlert('myAlert')}
+                    Create Alert!
+                </button>
+                <button onClick={() => this.props.dismissAlert('myAlert')}
+                    Dismiss Alert!
+                </button>
+            </div>
+        )
     }
@@ -58,0 +58,0 @@ }

src/actions.js

@@ -7,4 +7,4 @@ import * as alertConstants from './constants';
 
-export const createAlert = alertName => {
-  return { type: alertConstants.CREATE_ALERT, alertName }
+export const createAlert = (alertName, alertMessage) => {
+  return { type: alertConstants.CREATE_ALERT, alertName, alertMessage }
 };
@@ -11,0 +11,0 @@

src/alertContainer.js

@@ -24,3 +24,3 @@ import React, { Component } from 'react';
       return (
-        <WrappedComponent close={() => this.close()} />
+        <WrappedComponent {...this.props} close={() => this.close()} />
         );
@@ -27,0 +27,0 @@ }

src/reducer.js

 import * as alertTypes from './constants';
 
+const initialState = {isVisible: false, message: '' };
+
 const behaviors = {
   [alertTypes.CREATE_ALERT](state, action) {
-    return true;
+    const { alertMessage } = action;
+    return Object.assign({},
+      state,
+      { isVisible: true, message: alertMessage });
   },
   [alertTypes.DISMISS_ALERT](state, action) {
-    return false;
+    return Object.assign({},
+      state,
+      { isVisible: false });
   }
 };
 
-const initialAlertState = false;
-
 const reducer = (state, action) => {
@@ -25,11 +30,9 @@ const behavior = behaviors[action.type];
         ...state,
-        [alertName]: false
+        [alertName]: initialState
       };
   }
   if (type === alertTypes.DISMISS_ALL_ALERTS) {
-    return Object.keys(state).reduce((acc, alert) => {
-      const prev = 
-        Object.assign({}, acc, { [alert]: initialAlertState });
-      return prev;
-    }, {});
+    return Object.keys(state).reduce((acc, alert) => 
+      Object.assign({}, acc, { [alert]: initialState }), 
+    {});
   }
@@ -39,7 +42,5 @@
   if (type === alertTypes.DESTROY_ALERT) {
-    return Object.keys(state).reduce((acc, alert) => {
-      const prev = alert === alertName ? 
-        acc : { ...acc, [alert]: state[alert] };
-      return prev;
-    }, {});
+    return Object.keys(state).reduce((acc, alert) => 
+      alert === alertName ? acc : { ...acc, [alert]: state[alert] },
+    {});
   }
@@ -46,0 +47,0 @@ return Object.assign({}, state, {

test/actions.spec.js

@@ -13,2 +13,3 @@ import * as types from '../src/constants';
 const testAlertName = 'testName';
+const testMessage = 'This is a test message';
 
@@ -28,7 +29,8 @@ describe('actions', () => {
     const createAlertAction = 
-      createAlert(testAlertName);
+      createAlert(testAlertName, testMessage);
 
     assert.deepEqual(createAlertAction, {
       type: types.CREATE_ALERT,
-      alertName: testAlertName
+      alertName: testAlertName,
+      alertMessage: testMessage
     });
@@ -35,0 +37,0 @@ });

test/reducer.spec.js

@@ -14,8 +14,8 @@ import reducer from '../src/reducer';
 const anotherTestAlert = 'anotherTestAlert';
-const initialState = false;
+const initialState = {isVisible: false, message: ''};
 
 const defaultState = {
-  [testAlert]: true,
-  [anotherTestAlert]: false,
-  yetAnotherTestAlert: true
+  [testAlert]: { isVisible: true, message: testAlert},
+  [anotherTestAlert]: { isVisible: true, message: anotherTestAlert },
+  yetAnotherTestAlert: { isVisible: false, message: anotherTestAlert }
 };
@@ -38,3 +38,3 @@
   it('should delete an alert that is destroyed', () => {
-    const alerts = { [testAlert]: false };
+    const alerts = { [testAlert]: { isVisible: true, message: testAlert} };
     const destoryAlertAction = destroyAlert(testAlert);
@@ -49,12 +49,12 @@
     const alerts =  { 
-      [testAlert]: false,
-      [anotherTestAlert]: false 
+      [testAlert]: { isVisible: false, message: ''},
+      [anotherTestAlert]: { isVisible: false, message: ''} 
     }; 
 
-    const createAlertAction = createAlert(testAlert);
+    const createAlertAction = createAlert(testAlert, testAlert);
     const newState = reducer(alerts, createAlertAction);
 
     assert.deepEqual(newState, {
-      [testAlert]: true,
-      [anotherTestAlert]: false
+      [testAlert]: { isVisible: true, message: testAlert},
+      [anotherTestAlert]: { isVisible: false, message: ''}
     });
@@ -64,4 +64,4 @@ });
     const alerts =  { 
-      [testAlert]: true,
-      [anotherTestAlert]: true 
+      [testAlert]: { isVisible: true, message: testAlert},
+      [anotherTestAlert]: { isVisible: true, message: anotherTestAlert }
     };
@@ -74,4 +74,4 @@
     assert.deepEqual(newState, {
-      [testAlert]: false,
-      [anotherTestAlert]: true
+      [testAlert]: { isVisible: false, message: testAlert},
+      [anotherTestAlert]: { isVisible: true, message: anotherTestAlert }
     });
@@ -82,4 +82,4 @@ });
     const alerts =  { 
-      [testAlert]: true,
-      [anotherTestAlert]: true 
+      [testAlert]: { isVisible: true, message: testAlert},
+      [anotherTestAlert]: { isVisible: true, message: anotherTestAlert }
     };
@@ -90,5 +90,5 @@
 
-    assert.deepEqual(newState, {
-      [testAlert]: false,
-      [anotherTestAlert]: false
+    assert.deepEqual(newState, { 
+      [testAlert]: { isVisible: false, message: ''},
+      [anotherTestAlert]: { isVisible: false, message: '' }
     });
@@ -95,0 +95,0 @@ });

No alert changes

Improved metrics

Total package byte prevSize

22263

increased by5.75%

Lines of code

421

increased by0.72%

No dependency changes