State Component

state-component-rename-dialog.jsx

import State from 'new-state-component'

const setName = name => prevState => ({ ...prevState, name })

const RenameDialog = ({ prevName, onRename }) => {
  return (
    <State initial={{ name: prevName }}>
    {(state, setState, memoize) => (
      <RenameDialogUI
        name={state.name}
        onChange={memoize('onChange', event => setState(setName(event.target.value)))}
        onSubmit={memoize('onSubmit', event => {
          event.preventDefault()
          onRename(state.name)
        })}
      />
    )}
    </State>
  )
}