[Recompose] Refactor React Render Props to Streaming Props with RxJS and Recompose

Posted 2020-10-19 Answer1215

This lesson takes the concept of render props and migrates it over to streaming props by keeping the same example and simple refactoring the Togglecomponent which handles the render prop.

 

const ToggleStream = componentFromStream(props$ => {
  const {
    handler: toggle,
    stream: toggle$
  } = createEventHandler()

  const on$ = Observable.merge(
    toggle$,
    Observable.interval(1000)
  )
    .startWith(true)
    .scan(bool => !bool)

  return props$.combineLatest(on$, (props, on) =>
    props.render({
      on,
      toggle
    })
  )
})