Global event system for React.js

EventSystem.js

var EventSystem = (function() {
  var self = this;

  self.queue = {};

  return {
    publish: function (event, data) {
      var queue = self.queue[event];

      if (typeof queue === 'undefined') {
        return false;
      }

      while(queue.length > 0) {
        (queue.shift())(data);
      }

      return true;
    },
    subscribe: function(event, callback) {
      if (typeof self.queue[event] === 'undefined') {
        self.queue[event] = [];
      }

      self.queue[event].push(callback);
    }
  };
}());

sample-usage-to-publish.js

var RiskList = React.createClass({
  getInitialState: function() {
    return { risks: [] };
  },
  componentDidMount: function() {
    // someting
  },
  render: function() {
    EventSystem.publish('risk.count.update', this.state.risks.length);
    // something
  }
}

sample-usage-to-subscribe.js

var RiskPage = React.createClass({
  updateRiskCount: function(count) {
    this.setState({
      riskCount: count
    });
  },
  componentDidMount: function() {
    EventSystem.subscribe('risk.count.update', this.updateRiskCount);
  },
  getInitialState: function() {
    return {
      riskCount: 0
    };
  },
  render: function() {
    // something
  }
});

Is this working for anyone?

nice simple event dispatcher. unsubscribe must be implemented indeed to avoid leaks

It works fine, is simple and enough for most requirements. One doesn't always need a bloated package.
Added unsubscribe and changed to class. Easily addable to browserify:

https://gist.github.com/simonberger/13d3a416cdf3e72b5a46b031a9fb997d