handle system loading state

src/js/core/Store.js

@@ -5,6 +5,8 @@ import { diff } from 'deep-diff';
 
 import EventEmitter from './EventEmitter.js';
 
+import actions from '../actions/appActions.js';
+
 const DATA = 'data';
 
 export default class Store extends EventEmitter {
@@ -17,24 +19,28 @@ export default class Store extends EventEmitter {
     this._cbs = {};
   }
 
-  // Register an async function callback.
+  // Register an async function callback, handle loading state.
   // TODO: unit-test.
   cb(fn) {
     let id = _.uniqueId();
+    actions.emit('system.loading', true);
     return this._cbs[id] = (...args) => {
       // Still running?
-      if (!(id in this._cbs)) return console.log(`stop ${id}`);
+      if (!(id in this._cbs)) return;
       fn.apply(this, args);
       delete this._cbs[id];
+      if (!(Object.keys(this._cbs).length)) {
+        actions.emit('system.loading', false);
+      }
     };
   };
 
   // Cleanup callbacks because a View has changed thus long-running
   //  functions need to end. Unreference any onChange events too.
   clean(onChange) {
-    console.log('cleaning up');
     for (let id in this._cbs) delete this._cbs[id];
     if (_.isFunction(onChange)) this.offAny(onChange);
+    actions.emit('system.loading', false);
   }
 
   // Set a value on a key. Pass falsy value as 3rd param to not emit changes.

src/js/mixins/Page.js

@@ -28,7 +28,9 @@ export default {
   },
 
   _onChange(store, val, key) {
-    this.setState(this._getData(store));
+    if (this.isMounted()) { // not ideal
+      this.setState(this._getData(store));
+    }
   },
 
   getInitialState() {
@@ -46,7 +48,6 @@ export default {
   componentWillUnmount() {
     let key;
     for (key in stores) {
-      console.log('cleanup');
       stores[key].clean(this._onChange); 
     }
   }

src/js/stores/appStore.js

@@ -15,10 +15,10 @@ class AppStore extends Store {
   // Initial payload.
   constructor() {
     super({
-      system: {
-        loading: false
+      'system': {
+        'loading': false,
       },
-      user: {}
+      'user': {}
     });
 
     // Listen to all app actions.

src/js/stores/projectsStore.js

@@ -64,15 +64,12 @@ class ProjectsStore extends Store {
   onProjectsLoad() {
     let list = this.get('list');
 
-    let done = (err) => {
-      // actions.emit('system.loading', false);
-    };
+    // Empty callback.
+    let done = () => { };
 
     // Quit if we have no projects.
     if (!list.length) return done();
 
-    // actions.emit('system.loading', true);
-
     // Wait for the user to get resolved.
     this.get('user', this.cb((user) => { // async
       // For all projects.