title: Creating a Redux Observable Epic with multiple API Calls - Passing the results of the first into the second
body: <p>This isn't the first time a question like this has been asked, but for some reason I'm having a real hard time wrapping my head around Observables and RxJs, so I thought I'd ask for some clarification.</p>
  <p>I am trying to write an epic which will do the following:</p>
  <ol>
  <li>Receive a string</li>
  <li>Make an API call based on that string</li>
  <li>Make three more (independent) API calls based on the results of the first, and write them into state.</li>
  </ol>
  <p>I have read about <code>concatMap</code> and <code>forkJoin</code> which seem like they could be useful, as <code>concatMap</code> should allow me to execute multiple actions consecutively, and forkJoin becuase it can be used for returning the results of the final 3 API calls as a single array.</p>
  <p>Here's some code to try and give an idea of what I want. Apologies for the repetitive question, but I'd be grateful for an answer.</p>
  <pre class="lang-js prettyprint-override"><code>export const apiFetchEpic = (
    action$: any,
    state$: any,
    { apiClient }: IDependencies,
  ) =&gt;
    action$.pipe(
      ofType(API_FETCH),
      debounce(() =&gt; timer(300)),
      withLatestFrom(state$),
      mergeMap(
        ([
          {
            payload: { config, uri },
          },
        ]: [{ payload: IApiFetchActionProps }, any]) =&gt; {
          return from(apiClient.get(uri, config)).pipe(
            mergeMap(res =&gt;
              of(
                apiSetAction(res), // &lt;-- I need the results of this to be passed into the next calls
                apiCompleteAction({ uri }),
              ),
            ),
            catchError(error =&gt;
              of(apiCompleteAction({ uri }), apiErrorAction(error)),
            ),
          )
        },
      ),
    )
  </code></pre>