import React from 'react' import { taskCreator, transact } from 'react-transact' import { connect } from 'react-redux' const changeMessage = taskCreator( 'MESSAGE_ERROR', 'MESSAGE_CHANGED', (message) => message ) const Stateful = transact()( connect( state => ({ message: state.message}) )( class extends React.Component { render() { const { message, transact } = this.props return ( <div className="content"> <p>You said: "{ message }"</p> <p> Say something else: </p> <form onSubmit={(evt) => { evt.preventDefault() transact.run(changeMessage(this.refs.input.value)) }}> <input ref="input"/> <button>Go</button> </form>
import React from 'react' import { connect } from 'react-redux' import { transact, taskCreator } from 'react-transact' import { scan } from 'ramda' const say = taskCreator('ERROR', 'ECHO', (what) => what) const repeat = taskCreator('ERROR', 'ECHO', (what) => { return `${what} ${what}` }) const delay = (ms) => (x) => new Promise((res) => { setTimeout(() => res(x), ms) }) const Echo = transact((state, props) => ( scan( (acc, task) => { return acc.chain(task).map(delay(500)) }, say(props.params.what), [ repeat, repeat, repeat, repeat, repeat ] ) ))( connect(state => ({ what: state.what