var React = require('react');
var Marty = require('marty');
var RemoteFooStateMixin = Marty.createStateMixin({
listenTo: 'fooStore',
getState: function () {
return {
foo: this.app.fooStore.getRemoteFoo(this.props.params.id)
};
}
});
var RemoteFoo = React.createClass({
mixins: [RemoteFooStateMixin],
render: function () {
var body = this.state.foo.when({
pending: function () {
return 'pending';
},
failed: function (error) {
return 'error: ' + error.message;
},
done: function (foo) {
return foo.message;
}
});
return <div id={this.props.params.id} className='foo'>{body}</div>;
}
});
var React = require('react');
var Marty = require('marty');
var FooStore = require('../stores/fooStore');
var FooStateMixin = Marty.createStateMixin({
listenTo: FooStore,
getState: function () {
return {
foo: FooStore.for(this).getFoo(this.props.id)
};
}
});
var Foo = React.createClass({
mixins: [FooStateMixin],
render: function () {
var body = this.state.foo.when({
pending: function () {
return 'pending';
},
failed: function (error) {
return 'error: ' + error.message;
},
done: function (foo) {
return foo.message;
}
});
return <div id={this.props.id} className='foo'>{body}</div>;
}
});
var React = require('react');
var Marty = require('marty');
var ActionDetails = require('./actionDetails');
var ActionsColumn = require('./actionsColumn');
var StoreStore = require('../stores/storeStore');
var ActionStore = require('../stores/actionStore');
var DataFlowExplorerState = Marty.createStateMixin({
listenTo: [ActionStore, StoreStore],
getState: function () {
return {
actions: ActionStore.getAll(),
selectedAction: ActionStore.getSelectedAction()
};
}
});
var DataFlowExplorer = React.createClass({
mixins: [DataFlowExplorerState],
render: function () {
return (
<div className='data-flow-explorer hbox fill columns'>
<ActionsColumn ref="actions" actions={this.state.actions} />
<ActionDetails ref="details" action={this.state.selectedAction} />
</div>
);
}
});
module.exports = DataFlowExplorer;