Fire multiple requests for a mutation.

[binchik]

Hello, big thanks for redux-query. I'm converting my project from redux-saga to it. Already have most of the requests handled by redux-query.

I have to do two POST requests sometimes. For example the first one would upload an image and return its id, and the second one would attach that id to the second request's body. What would be the best way to go about this?

[ryanashcraft]

@binchik Glad you get value out of redux-query! By the way, I wouldn't think of redux-query as a full on replacement of redux-saga, you can use both together!

Anyways, take a look at the promise-chain notes in the README in the mutateAsync section: https://github.com/amplitude/redux-query#mutateasync

Here's an illustrative example for your situation. (Warning this might have typos – I haven't run this or anything).

// Query configs

const uploadImageQueryConfig = imageData => ({
  url: '/image/upload',
  body: { imageData },
  update: {},
});

const somethingElseQueryConfig = id => ({
  url: '/image/something-else',
  body: { id },
  update: {
    myEntity: (oldValue, newValue) => newValue,
  },
});

// Redux actions

const uploadImageAction = imageData => mutateAsync(uploadImageQueryConfig(imageData));

const somethingElseAction = id => mutateAsync(somethingElseQueryConfig(id));

// react-redux container

const mapDispatchToProps = dispatch => {
  return {
    uploadImage: imageData => {
      dispatch(imageData).then(result => {
        if (result.status === 200) {
          dispatch(somethingElseAction(result.body.id));
        }
      });
    },
  };
}

[binchik]

@ryanashcraft Thaks, this is awesome.