Eternal loading for deleted accounts - fixed

js-frontend/build/app.497ed0e9fa8411cbbf1d.js

@@ -1462,18 +1462,22 @@ webpackJsonp([0,3],{
 	        return _extends({}, state, hashMap);
 	      }
 	
+	    case _ACTION_TYPES2.default.ACCOUNT.SINGLE_START:
 	    case _ACTION_TYPES2.default.ACCOUNT.SINGLE_COMPLETE:
+	    case _ACTION_TYPES2.default.ACCOUNT.SINGLE_ERROR:
 	      {
+	        var _id2 = action.id;
 	        var _action$payload = action.payload;
 	
 	        var _payload = _action$payload === undefined ? {} : _action$payload;
 	
-	        var accountId = _payload.accountId;
+	        var error = action.error;
+	        // const { accountId } = payload;
 	
-	        if (!accountId) {
+	        var isError = action.type == _ACTION_TYPES2.default.ACCOUNT.SINGLE_ERROR;
-	          return state;
+	        var isStart = action.type == _ACTION_TYPES2.default.ACCOUNT.SINGLE_START;
-	        }
+	
-	        return _extends({}, state, _defineProperty({}, accountId, _payload));
+	        return _extends({}, state, _defineProperty({}, _id2, isStart ? { isLoading: true, 'title': 'Loading' } : isError ? error : _payload));
 	      }
 	    case _ACTION_TYPES2.default.ENTITIES.RECEIVED_LIST:
 	    default:
@@ -2659,9 +2663,9 @@ webpackJsonp([0,3],{
 	var accountRefCreateError = exports.accountRefCreateError = (0, _actions.makeActionCreator)(_ACTION_TYPES2.default.ACCOUNTS.CREATE_REF_ERROR, 'error');
 	var accountRefCreateFormUpdate = exports.accountRefCreateFormUpdate = (0, _actions.makeActionCreator)(_ACTION_TYPES2.default.ACCOUNTS.CREATE_REF_FORM_UPDATE, 'key', 'value');
 	
-	var accountRequested = exports.accountRequested = (0, _actions.makeActionCreator)(_ACTION_TYPES2.default.ACCOUNT.SINGLE_START);
+	var accountRequested = exports.accountRequested = (0, _actions.makeActionCreator)(_ACTION_TYPES2.default.ACCOUNT.SINGLE_START, 'id');
-	var accountComplete = exports.accountComplete = (0, _actions.makeActionCreator)(_ACTION_TYPES2.default.ACCOUNT.SINGLE_COMPLETE, 'payload');
+	var accountComplete = exports.accountComplete = (0, _actions.makeActionCreator)(_ACTION_TYPES2.default.ACCOUNT.SINGLE_COMPLETE, 'id', 'payload');
-	var accountError = exports.accountError = (0, _actions.makeActionCreator)(_ACTION_TYPES2.default.ACCOUNT.SINGLE_ERROR, 'error');
+	var accountError = exports.accountError = (0, _actions.makeActionCreator)(_ACTION_TYPES2.default.ACCOUNT.SINGLE_ERROR, 'id', 'error');
 	
 	function accountsList(customerId) {
 	  return function (dispatch) {
@@ -2678,20 +2682,23 @@ webpackJsonp([0,3],{
 	  };
 	}
 	
-	function readUntilChanged(initialData, customerId) {
+	function readUntilChanged(initialData, promisedFn, leftCalls) {
 	  var _this = this;
 	
+	  if (!leftCalls) {
+	    return Promise.reject('Data not changed');
+	  }
 	  var initialDataFlat = _root2.default['JSON'].stringify(initialData);
 	  return new Promise(function (rs, rj) {
 	    setTimeout(function () {
-	      api.apiRetrieveAccounts(customerId).then(function (data) {
+	      promisedFn().then(function (data) {
 	        debugger;
 	        if (initialDataFlat == _root2.default['JSON'].stringify(data)) {
-	          return readUntilChanged.call(_this, data, customerId).then(rs, rj); // Promise
+	          return readUntilChanged.call(_this, data, promisedFn, leftCalls - 1).then(rs, rj); // Promise
 	        }
 	        rs(data);
 	      }).catch(rj);
-	    }, 500);
+	    }, 500 * Math.pow(2, 4 - leftCalls));
 	  });
 	}
 	
@@ -2709,7 +2716,10 @@ webpackJsonp([0,3],{
 	        dispatch((0, _authenticate.authenticate)(true));
 	        return accountId;
 	      } else {
-	        return readUntilChanged(data, customerId).then(function () {
+	        return readUntilChanged(data, function () {
+	          return api.apiRetrieveAccounts(customerId);
+	        }, 4).then(function () {
+	          debugger;
 	          dispatch(accountCreateComplete({
 	            id: ''
 	          }));
@@ -2754,11 +2764,11 @@ webpackJsonp([0,3],{
 	
 	function fetchAccount(accountId) {
 	  return function (dispatch) {
-	    dispatch(accountRequested());
+	    dispatch(accountRequested(accountId));
 	    return api.apiRetrieveAccount(accountId).then(function (data) {
-	      dispatch(accountComplete(data));
+	      dispatch(accountComplete(accountId, data));
 	    }).catch(function (err) {
-	      dispatch(accountError(err));
+	      dispatch(accountError(accountId, err));
 	    });
 	  };
 	}
@@ -4186,12 +4196,20 @@ webpackJsonp([0,3],{
 	      if (!account || !accountId) {
 	        return _react2.default.createElement(
 	          "div",
-	          { title: "" + accountId },
+	          { className: "text-info", title: "" + accountId },
-	          accountId,
+	          "Loading.. ",
-	          " ",
 	          _react2.default.createElement(_reactLoader2.default, { loaded: false })
 	        );
-	        // {/*return (<Link to={ `/account/${accountId}` }>{ accountId } <Spinner loaded={false} /></Link>)*/}
+	      }
+	
+	      var errors = account.errors;
+	
+	      if (errors) {
+	        return _react2.default.createElement(
+	          "div",
+	          { className: "text-danger" },
+	          errors
+	        );
 	      }
 	
 	      var title = account.title;
@@ -7115,4 +7133,4 @@ webpackJsonp([0,3],{
 /***/ }
 
 });
-//# sourceMappingURL=app.d2fd5066a9f7115b01b3.js.map
+//# sourceMappingURL=app.497ed0e9fa8411cbbf1d.js.map

js-frontend/build/index.html

@@ -13,7 +13,7 @@
 
   <!-- Optional theme -->
   <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/latest/css/bootstrap-theme.min.css"><link href="/style.b588c60da106277d78c8.css" rel="stylesheet"></head>
-<body><div id="root"></div><script src="/manifest.7e5f85c8a08963380597.js"></script><script src="/vendor.85781b28c9410377534e.js"></script><script src="/style.b588c60da106277d78c8.js"></script><script src="/app.d2fd5066a9f7115b01b3.js"></script><script>
+<body><div id="root"></div><script src="/manifest.15c5d6172500c36b3280.js"></script><script src="/vendor.85781b28c9410377534e.js"></script><script src="/style.b588c60da106277d78c8.js"></script><script src="/app.497ed0e9fa8411cbbf1d.js"></script><script>
   (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
       (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
     m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
@@ -27,5 +27,5 @@
   
     ga('send', 'pageview');
   
-</script><!--{"files":{"publicPath":"/","chunks":{"manifest":{"size":0,"entry":"/manifest.7e5f85c8a08963380597.js","hash":"7e5f85c8a08963380597","css":[]},"vendor":{"size":1654379,"entry":"/vendor.85781b28c9410377534e.js","hash":"85781b28c9410377534e","css":[]},"style":{"size":122,"entry":"/style.b588c60da106277d78c8.js","hash":"b588c60da106277d78c8","css":["/style.b588c60da106277d78c8.css"]},"app":{"size":349426,"entry":"/app.d2fd5066a9f7115b01b3.js","hash":"d2fd5066a9f7115b01b3","css":[]}},"js":["/manifest.7e5f85c8a08963380597.js","/vendor.85781b28c9410377534e.js","/style.b588c60da106277d78c8.js","/app.d2fd5066a9f7115b01b3.js"],"css":["/style.b588c60da106277d78c8.css"]},"options":{"template":"/Users/andrew/dev/clients/ES/code/event-sourcing-examples/js-frontend/node_modules/html-webpack-plugin/lib/loader.js!/Users/andrew/dev/clients/ES/code/event-sourcing-examples/js-frontend/public/index.ejs","filename":"index.html","hash":false,"inject":false,"compile":true,"favicon":false,"minify":false,"cache":true,"showErrors":true,"chunks":"all","excludeChunks":[],"title":"Money Transfer App","xhtml":false,"description":"ES Money Transfer App","appMountId":"root","googleAnalytics":{"trackingId":"UA-XXXX-XX","pageViewOnLoad":true},"mobile":true}}--></body>
+</script><!--{"files":{"publicPath":"/","chunks":{"manifest":{"size":0,"entry":"/manifest.15c5d6172500c36b3280.js","hash":"15c5d6172500c36b3280","css":[]},"vendor":{"size":1654379,"entry":"/vendor.85781b28c9410377534e.js","hash":"85781b28c9410377534e","css":[]},"style":{"size":122,"entry":"/style.b588c60da106277d78c8.js","hash":"b588c60da106277d78c8","css":["/style.b588c60da106277d78c8.css"]},"app":{"size":350105,"entry":"/app.497ed0e9fa8411cbbf1d.js","hash":"497ed0e9fa8411cbbf1d","css":[]}},"js":["/manifest.15c5d6172500c36b3280.js","/vendor.85781b28c9410377534e.js","/style.b588c60da106277d78c8.js","/app.497ed0e9fa8411cbbf1d.js"],"css":["/style.b588c60da106277d78c8.css"]},"options":{"template":"/Users/andrew/dev/clients/ES/code/event-sourcing-examples/js-frontend/node_modules/html-webpack-plugin/lib/loader.js!/Users/andrew/dev/clients/ES/code/event-sourcing-examples/js-frontend/public/index.ejs","filename":"index.html","hash":false,"inject":false,"compile":true,"favicon":false,"minify":false,"cache":true,"showErrors":true,"chunks":"all","excludeChunks":[],"title":"Money Transfer App","xhtml":false,"description":"ES Money Transfer App","appMountId":"root","googleAnalytics":{"trackingId":"UA-XXXX-XX","pageViewOnLoad":true},"mobile":true}}--></body>
 </html>

js-frontend/build/manifest.15c5d6172500c36b3280.js

@@ -76,7 +76,7 @@
 /******/ 			script.charset = 'utf-8';
 /******/ 			script.async = true;
 /******/
-/******/ 			script.src = __webpack_require__.p + "" + {"0":"d2fd5066a9f7115b01b3","1":"b588c60da106277d78c8","2":"85781b28c9410377534e"}[chunkId] + ".js";
+/******/ 			script.src = __webpack_require__.p + "" + {"0":"497ed0e9fa8411cbbf1d","1":"b588c60da106277d78c8","2":"85781b28c9410377534e"}[chunkId] + ".js";
 /******/ 			head.appendChild(script);
 /******/ 		}
 /******/ 	};
@@ -92,4 +92,4 @@
 /******/ })
 /************************************************************************/
 /******/ ([]);
-//# sourceMappingURL=manifest.7e5f85c8a08963380597.js.map
+//# sourceMappingURL=manifest.15c5d6172500c36b3280.js.map

js-frontend/build/manifest.15c5d6172500c36b3280.js.map

@@ -1 +1 @@
-{"version":3,"sources":["webpack:///webpack/bootstrap b0451df0d1f510adc177?"],"names":[],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA,gBAAQ,oBAAoB;AAC5B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA,uBAAe;AACf;AACA;AACA;;AAEA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA,YAAI;AACJ;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,uDAA+C,iFAAiF;AAChI;AACA;AACA;;AAEA;AACA;;AAEA;AACA;;AAEA;AACA","file":"manifest.7e5f85c8a08963380597.js","sourcesContent":[" \t// install a JSONP callback for chunk loading\n \tvar parentJsonpFunction = window[\"webpackJsonp\"];\n \twindow[\"webpackJsonp\"] = function webpackJsonpCallback(chunkIds, moreModules) {\n \t\t// add \"moreModules\" to the modules object,\n \t\t// then flag all \"chunkIds\" as loaded and fire callback\n \t\tvar moduleId, chunkId, i = 0, callbacks = [];\n \t\tfor(;i < chunkIds.length; i++) {\n \t\t\tchunkId = chunkIds[i];\n \t\t\tif(installedChunks[chunkId])\n \t\t\t\tcallbacks.push.apply(callbacks, installedChunks[chunkId]);\n \t\t\tinstalledChunks[chunkId] = 0;\n \t\t}\n \t\tfor(moduleId in moreModules) {\n \t\t\tmodules[moduleId] = moreModules[moduleId];\n \t\t}\n \t\tif(parentJsonpFunction) parentJsonpFunction(chunkIds, moreModules);\n \t\twhile(callbacks.length)\n \t\t\tcallbacks.shift().call(null, __webpack_require__);\n \t\tif(moreModules[0]) {\n \t\t\tinstalledModules[0] = 0;\n \t\t\treturn __webpack_require__(0);\n \t\t}\n \t};\n\n \t// The module cache\n \tvar installedModules = {};\n\n \t// object to store loaded and loading chunks\n \t// \"0\" means \"already loaded\"\n \t// Array means \"loading\", array contains callbacks\n \tvar installedChunks = {\n \t\t3:0\n \t};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId])\n \t\t\treturn installedModules[moduleId].exports;\n\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\texports: {},\n \t\t\tid: moduleId,\n \t\t\tloaded: false\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.loaded = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n \t// This file contains only the entry chunk.\n \t// The chunk loading function for additional chunks\n \t__webpack_require__.e = function requireEnsure(chunkId, callback) {\n \t\t// \"0\" is the signal for \"already loaded\"\n \t\tif(installedChunks[chunkId] === 0)\n \t\t\treturn callback.call(null, __webpack_require__);\n\n \t\t// an array means \"currently loading\".\n \t\tif(installedChunks[chunkId] !== undefined) {\n \t\t\tinstalledChunks[chunkId].push(callback);\n \t\t} else {\n \t\t\t// start chunk loading\n \t\t\tinstalledChunks[chunkId] = [callback];\n \t\t\tvar head = document.getElementsByTagName('head')[0];\n \t\t\tvar script = document.createElement('script');\n \t\t\tscript.type = 'text/javascript';\n \t\t\tscript.charset = 'utf-8';\n \t\t\tscript.async = true;\n\n \t\t\tscript.src = __webpack_require__.p + \"\" + {\"0\":\"d2fd5066a9f7115b01b3\",\"1\":\"b588c60da106277d78c8\",\"2\":\"85781b28c9410377534e\"}[chunkId] + \".js\";\n \t\t\thead.appendChild(script);\n \t\t}\n \t};\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"/\";\n\n\n\n/** WEBPACK FOOTER **\n ** webpack/bootstrap b0451df0d1f510adc177\n **/"],"sourceRoot":""}
+{"version":3,"sources":["webpack:///webpack/bootstrap ee51b0824572a7d4b9ec?"],"names":[],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA,gBAAQ,oBAAoB;AAC5B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA,uBAAe;AACf;AACA;AACA;;AAEA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA,YAAI;AACJ;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,uDAA+C,iFAAiF;AAChI;AACA;AACA;;AAEA;AACA;;AAEA;AACA;;AAEA;AACA","file":"manifest.15c5d6172500c36b3280.js","sourcesContent":[" \t// install a JSONP callback for chunk loading\n \tvar parentJsonpFunction = window[\"webpackJsonp\"];\n \twindow[\"webpackJsonp\"] = function webpackJsonpCallback(chunkIds, moreModules) {\n \t\t// add \"moreModules\" to the modules object,\n \t\t// then flag all \"chunkIds\" as loaded and fire callback\n \t\tvar moduleId, chunkId, i = 0, callbacks = [];\n \t\tfor(;i < chunkIds.length; i++) {\n \t\t\tchunkId = chunkIds[i];\n \t\t\tif(installedChunks[chunkId])\n \t\t\t\tcallbacks.push.apply(callbacks, installedChunks[chunkId]);\n \t\t\tinstalledChunks[chunkId] = 0;\n \t\t}\n \t\tfor(moduleId in moreModules) {\n \t\t\tmodules[moduleId] = moreModules[moduleId];\n \t\t}\n \t\tif(parentJsonpFunction) parentJsonpFunction(chunkIds, moreModules);\n \t\twhile(callbacks.length)\n \t\t\tcallbacks.shift().call(null, __webpack_require__);\n \t\tif(moreModules[0]) {\n \t\t\tinstalledModules[0] = 0;\n \t\t\treturn __webpack_require__(0);\n \t\t}\n \t};\n\n \t// The module cache\n \tvar installedModules = {};\n\n \t// object to store loaded and loading chunks\n \t// \"0\" means \"already loaded\"\n \t// Array means \"loading\", array contains callbacks\n \tvar installedChunks = {\n \t\t3:0\n \t};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId])\n \t\t\treturn installedModules[moduleId].exports;\n\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\texports: {},\n \t\t\tid: moduleId,\n \t\t\tloaded: false\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.loaded = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n \t// This file contains only the entry chunk.\n \t// The chunk loading function for additional chunks\n \t__webpack_require__.e = function requireEnsure(chunkId, callback) {\n \t\t// \"0\" is the signal for \"already loaded\"\n \t\tif(installedChunks[chunkId] === 0)\n \t\t\treturn callback.call(null, __webpack_require__);\n\n \t\t// an array means \"currently loading\".\n \t\tif(installedChunks[chunkId] !== undefined) {\n \t\t\tinstalledChunks[chunkId].push(callback);\n \t\t} else {\n \t\t\t// start chunk loading\n \t\t\tinstalledChunks[chunkId] = [callback];\n \t\t\tvar head = document.getElementsByTagName('head')[0];\n \t\t\tvar script = document.createElement('script');\n \t\t\tscript.type = 'text/javascript';\n \t\t\tscript.charset = 'utf-8';\n \t\t\tscript.async = true;\n\n \t\t\tscript.src = __webpack_require__.p + \"\" + {\"0\":\"497ed0e9fa8411cbbf1d\",\"1\":\"b588c60da106277d78c8\",\"2\":\"85781b28c9410377534e\"}[chunkId] + \".js\";\n \t\t\thead.appendChild(script);\n \t\t}\n \t};\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"/\";\n\n\n\n/** WEBPACK FOOTER **\n ** webpack/bootstrap ee51b0824572a7d4b9ec\n **/"],"sourceRoot":""}

js-frontend/src/actions/entities.js

@@ -26,9 +26,9 @@ export const accountRefCreateComplete = makeActionCreator(T.ACCOUNTS.CREATE_REF_
 export const accountRefCreateError = makeActionCreator(T.ACCOUNTS.CREATE_REF_ERROR, 'error');
 export const accountRefCreateFormUpdate = makeActionCreator(T.ACCOUNTS.CREATE_REF_FORM_UPDATE,  'key', 'value');
 
-export const accountRequested = makeActionCreator(T.ACCOUNT.SINGLE_START);
+export const accountRequested = makeActionCreator(T.ACCOUNT.SINGLE_START, 'id');
-export const accountComplete = makeActionCreator(T.ACCOUNT.SINGLE_COMPLETE, 'payload');
+export const accountComplete = makeActionCreator(T.ACCOUNT.SINGLE_COMPLETE, 'id', 'payload');
-export const accountError = makeActionCreator(T.ACCOUNT.SINGLE_ERROR, 'error');
+export const accountError = makeActionCreator(T.ACCOUNT.SINGLE_ERROR, 'id', 'error');
 
 
 export function accountsList(customerId) {
@@ -45,20 +45,23 @@ export function accountsList(customerId) {
   };
 }
 
-function readUntilChanged(initialData, customerId) {
+function readUntilChanged(initialData, promisedFn, leftCalls) {
+  if (!leftCalls) {
+    return Promise.reject('Data not changed')
+  }
   const initialDataFlat = root['JSON'].stringify(initialData);
   return new Promise((rs, rj) => {
     setTimeout(() => {
-      api.apiRetrieveAccounts(customerId)
+      promisedFn()
         .then(data => {
           debugger;
           if (initialDataFlat == root['JSON'].stringify(data)) {
-            return readUntilChanged.call(this, data, customerId).then(rs, rj); // Promise
+            return readUntilChanged.call(this, data, promisedFn, leftCalls - 1).then(rs, rj); // Promise
           }
           rs(data);
         })
         .catch(rj)
-    }, 500);
+    }, 500 * Math.pow(2, 4 - leftCalls));
   })
 }
 
@@ -77,8 +80,9 @@ export function accountCreate(customerId, payload) {
           dispatch(authenticate(true));
           return accountId;
         } else {
-          return readUntilChanged(data, customerId)
+          return readUntilChanged(data, () => api.apiRetrieveAccounts(customerId), 4)
             .then(() => {
+              debugger;
               dispatch(accountCreateComplete({
                 id: ''
               }));
@@ -129,13 +133,13 @@ export function fetchOwnAccounts(customerId) {
 
 export function fetchAccount(accountId) {
   return dispatch => {
-    dispatch(accountRequested());
+    dispatch(accountRequested(accountId));
     return api.apiRetrieveAccount(accountId)
       .then(data => {
-        dispatch(accountComplete(data));
+        dispatch(accountComplete(accountId, data));
       })
       .catch(err => {
-        dispatch(accountError(err));
+        dispatch(accountError(accountId, err));
       });
   };
 }

js-frontend/src/components/AccountInfo.js

@@ -31,8 +31,12 @@ export class AccountInfo extends React.Component {
     const account = entities[accountId];
 
     if (!account || !accountId) {
-      return (<div title={ `${accountId}` }>{ accountId } <Spinner loaded={false} /></div>);
+      return (<div className="text-info" title={ `${accountId}` }>Loading.. <Spinner loaded={false} /></div>);
-      // {/*return (<Link to={ `/account/${accountId}` }>{ accountId } <Spinner loaded={false} /></Link>)*/}
+    }
+
+    const { errors } = account;
+    if (errors) {
+      return (<div className="text-danger">{ errors }</div>);
     }
 
     const { title, owner } = account;

js-frontend/src/reducers/data/entities.js

@@ -56,15 +56,18 @@ export const entities = (state = {...initialState}, action) => {
       };
     }
 
-    case T.ACCOUNT.SINGLE_COMPLETE: {
+
-      const { payload = {} } = action;
+    case T.ACCOUNT.SINGLE_START:
-      const { accountId } = payload;
+    case T.ACCOUNT.SINGLE_COMPLETE:
-      if (!accountId) {
+    case T.ACCOUNT.SINGLE_ERROR: {
-        return state;
+      const { id, payload = {}, error } = action;
-      }
+      // const { accountId } = payload;
+      const isError = ((action.type) == T.ACCOUNT.SINGLE_ERROR);
+      const isStart = ((action.type) == T.ACCOUNT.SINGLE_START);
+
       return {
         ...state,
-        [accountId]: payload
+        [id]: isStart ? { isLoading: true, 'title': 'Loading' } : (isError ? error : payload)
       };
     }
     case T.ENTITIES.RECEIVED_LIST: