redux-diff-logger - npm Package Compare versions

Comparing version 0.0.4 to 0.0.5

build/logger.js

@@ -15,7 +15,46 @@ // https://github.com/flitbit/diff#differences
 var dictionary = {
-  E: 'CHANGED:',
-  N: 'ADDED:',
-  D: 'DELETED'
+  E: {
+    color: '#2196F3',
+    text: 'CHANGED:'
+  },
+  N: {
+    color: '#4CAF50',
+    text: 'ADDED:'
+  },
+  D: {
+    color: '#F44336',
+    text: 'DELETED:'
+  },
+  A: {
+    color: '#2196F3',
+    text: 'ARRAY:'
+  }
 };
 
+function style(kind) {
+  return 'color: ' + dictionary[kind].color + '; font-weight: bold';
+}
+
+function render(diff) {
+  var kind = diff.kind;
+  var path = diff.path;
+  var lhs = diff.lhs;
+  var rhs = diff.rhs;
+  var index = diff.index;
+  var item = diff.item;
+
+  switch (kind) {
+    case 'E':
+      return path.join('.') + ' ' + lhs + ' → ' + rhs;
+    case 'N':
+      return path.join('.') + ' ' + rhs;
+    case 'D':
+      return '' + path.join('.');
+    case 'A':
+      return (path.join('.') + '[' + index + ']', item);
+    default:
+      return null;
+  }
+}
+
 function logger(_ref) {
@@ -38,7 +77,6 @@ var getState = _ref.getState;
           var kind = elem.kind;
-          var path = elem.path;
-          var lhs = elem.lhs;
-          var rhs = elem.rhs;
 
-          console.info(dictionary[kind], path.join('.'), lhs, ' → ', rhs);
+          var output = render(elem);
+
+          console.log('%c ' + dictionary[kind].text, style(kind), output);
         });
@@ -45,0 +83,0 @@

package.json

 {
   "name": "redux-diff-logger",
-  "version": "0.0.4",
+  "version": "0.0.5",
   "description": "Diff logger between states for redux",
@@ -10,4 +10,8 @@ "main": "build/logger.js",
     "lint": "$(npm bin)/eslint src",
-    "build": "$(npm bin)/babel src --out-dir build",
-    "prepublish": "npm run clean && npm run test && npm run build"
+    "build:module": "$(npm bin)/babel src --out-dir build",
+    "build:example": "$(npm bin)/webpack -p --config example/webpack.config.production.js",
+    "build": "npm run build:module && npm run build:example",
+    "prepublish": "npm run clean && npm run test && npm run build",
+    "deploy:ghpages": "$(npm bin)/gh-pages -d example/dist",
+    "deploy": "git add -A && git commit -am 'chore: update docs' && git push && npm run deploy:ghpages"
   },
@@ -36,8 +40,11 @@ "repository": {
     "babel": "^5.8.21",
+    "babel-core": "^5.8.22",
     "babel-eslint": "^4.0.5",
+    "babel-loader": "^5.3.2",
     "eslint": "^1.1.0",
     "eslint-config-airbnb": "0.0.7",
     "eslint-plugin-react": "^3.2.1",
-    "rimraf": "^2.4.2"
+    "rimraf": "^2.4.2",
+    "webpack": "^1.11.0"
   }
 }

README.md

 # Diff logger between states for redux
 
-![logger](http://s17.postimg.org/68pwjk0mn/fcomb_2015_08_10_12_28_18.png)
+![logger](http://i.imgur.com/xuHwmLp.png)
 
@@ -5,0 +5,0 @@ ### Install

src/logger.js

@@ -5,7 +5,41 @@ // https://github.com/flitbit/diff#differences
 const dictionary = {
-  E: 'CHANGED:',
-  N: 'ADDED:',
-  D: 'DELETED',
+  E: {
+    color: '#2196F3',
+    text: 'CHANGED:',
+  },
+  N: {
+    color: '#4CAF50',
+    text: 'ADDED:',
+  },
+  D: {
+    color: '#F44336',
+    text: 'DELETED:',
+  },
+  A: {
+    color: '#2196F3',
+    text: 'ARRAY:',
+  },
 };
 
+function style(kind) {
+  return `color: ${dictionary[kind].color}; font-weight: bold`;
+}
+
+function render(diff) {
+  const { kind, path, lhs, rhs, index, item } = diff;
+
+  switch (kind) {
+  case 'E':
+    return `${path.join('.')} ${lhs} → ${rhs}`;
+  case 'N':
+    return `${path.join('.')} ${rhs}`;
+  case 'D':
+    return `${path.join('.')}`;
+  case 'A':
+    return (`${path.join('.')}[${index}]`, item);
+  default:
+    return null;
+  }
+}
+
 function logger({ getState }) {
@@ -24,4 +58,6 @@ return (next) => (action) => {
       diff.forEach((elem) => {
-        const { kind, path, lhs, rhs } = elem;
-        console.info(dictionary[kind], path.join('.'), lhs, ' → ', rhs);
+        const { kind } = elem;
+        const output = render(elem);
+
+        console.log(`%c ${dictionary[kind].text}`, style(kind), output);
       });
@@ -28,0 +64,0 @@

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

214259

increased by5698.62%

Number of package files

24

increased by300%

Lines of code

1054

increased by1546.88%

Worsened metrics

Dev dependency count

9

increased by50%

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes