How to use reflux - 10 common examples

/* @flow */
var Reflux = require('reflux');
var Actions = require('./actions');

var Store = Reflux.createStore({
  listenables: Actions,

  onChangeShowingProperty: function(item) {
    console.log('onChangeShowingProperty');
    this.trigger(item);
  },
});

module.exports = Store;

"use strict";
var reflux = require("reflux");

// Create actions
var actions = reflux.createActions([
  "transitionStart",
  "transitionEnd",

  "routeUpdate",

  "documentTitleUpdate"
]);
module.exports = actions;

// reflux actions
//
var Reflux = require('reflux');

var actions = Reflux.createActions([
  'loadCourse',
  'challengeCompleted',
  'codeEditUser',
  // replaces text in CodeMirror
  'codeEditOverride'
]);

module.exports = actions;

'use strict';
const Reflux = require('reflux');

const actions = Reflux.createActions([
  // UI actions
  'showHUD',
  // player actions
  'select',
  'play',
  'draw'
]);

module.exports = actions;

var React = require('react');
var Reflux = require('reflux');
var capitalize = require('capitalize');
var ConnectionStatusStore = require('../store');
//var ConnectionStatusActions = require('./actions');

var Component = React.createClass({
  mixins: [Reflux.connect(ConnectionStatusStore, 'status')],

  // TODO: Add reconneciton action.
  //onUpdateConnectionStatus: function () {
    //ConnectionStatusActions.refresh();
  //},

  render: function () {
    var className = this.props.className;
    className += this.state.status === 'connected' ? ' connected' : ' disconnected';

    return (
      <p>{capitalize(this.state.status)}</p>
    );
  }
});

// Includes
var Reflux = require('reflux');
var I = require('seamless-immutable');
var resource = require('../mixins/resource');

var PaymentOptionsStore = Reflux.createStore({
	// Public
  mixins: [resource('paymentOptions')],
  onSetPaymentOptions: function(args) {
    t.paymentOptions = I(args);
    t.trigger({ paymentOptions: t.paymentOptions });
  }
});

var t = module.exports = PaymentOptionsStore;

'use strict';

var Reflux = require('reflux'),
    Im = require('immutable'),
    accountDefault = require('../../constants/defaults').account,
    AuthAccountActions = require('../../actions/authentication/AuthAccountActions');

var AccountStore = Reflux.createStore({

  listenables: AuthAccountActions,

  init: function() {
    this.account = Im.Map(accountDefault);
  },

  getAccount: function() {
    return this.account.toJS();
  },

  /* Listen AuthAccountActions
   ===============================*/
  _mergeAccountData: function(resData) {
    this.account = this.account.merge(Im.Map(resData));
    this.trigger();

var React = require('react');

// reflux
var Reflux = require('reflux');
var ruleStore = require('../stores/rules');
var codeStore = require('../stores/code');

// components
var ChallengeEditor = require('./ChallengeEditor.jsx');
var Challenge = require('./Challenge.jsx');

var UI = React.createClass({
  mixins: [
    Reflux.connect(ruleStore),
    Reflux.listenTo(codeStore, 'onCodeStoreChange')
  ],

  getInitialState() {
    return {
      title: '',
      description: '',
      expressionChains: [],
      required: [],
      present: [],
      valid: true
    };
  },

  // codeStore can also emit an editorText string after a
  // codeEditOverride, so we typecheck before setting state

'use strict';

var React           = require('react');
var Reflux          = require('reflux');

var MailWindowStore = require('js/stores/windows/mail');

var MailWindow = React.createClass({
    mixins : [
        Reflux.connect(MailWindowStore, 'mailWindow')
    ],
    render : function() {
        if (this.state.mailWindow.show) {
            YAHOO.lacuna.Messaging.show();
        }

        // TODO: make this into a React component!!

        return <div></div>;
    }
});

module.exports = MailWindow;

Router = require('react-router'),
    { Link } = Router,
    // components
    Spinner = require('../commons/Spinner.jsx'),
    // stores
    AuthStore = require('../../stores/authentication/AuthStore'),
    ComponentMessageStore = require('../../stores/subs/ComponentMessageStore'),
    // actions
    AuthAccountActions = require('../../actions/authentication/AuthAccountActions');


var Login = React.createClass({

  mixins: [
    PureRenderMixin,
    Reflux.listenTo(AuthStore, 'resetForm'),
    Reflux.listenTo(ComponentMessageStore, 'onErrorMessage'),
  ],

  getInitialState: function() {
    return {
      loggedIn: false,
      errors: '',
      submitted: false
    };
  },

  resetForm: function() {
    var auth = AuthStore.getAuth();
    if(this.state.loggedIn !== auth.loggedIn){
      this.refs.email.getDOMNode().value = '';
      this.refs.password.getDOMNode().value = '';