Bikeshedding some behavioral programming into React

bp.js

<Behavior
  threads={[
    function* ({ fetchSavedAudiences, onSelectSearch }) {
      const value = yield { wait: onSelectSearch }
      const audiences = yield { request: fetchSavedAudiences(value) }
      this.setState({ audiences })
    },
    function* ({ onSelectChange }) {
      const selectedAudience = yield { wait: onSelectChange }
      this.setState({ selectedAudience })
    },
    function* ({ fetchSavedAudiences, onSelectSearch }) {
      // Show loader while fetching
      yield { wait: onSelectSearch }
      this.setState({ loading: true })

      const response = yield { wait: fetchSavedAudiences }
      this.setState({ loading: false })
    }
    function* () {
      // avoid race-condition of old fetchSavedAudiences
      // requests taking longer than the latest ones
      const response = yield { wait: fetchSavedAudiences }

    }
  ]}
>
  ({
    onSelectChange,
    onSelectSearch,
    audiences,
    selectedAudience,
  }) => (
    <>
      <div>
        <Audience
          audience={selectedAudience}
        />
      </div>
      <Select
        onChange={onSelectChange}
        onSearch={onSelectSearch}
      >
        {audiences}
      </Select>
    </>
  )
</Behavior>