Implementing Mulitple mutations to two different API's using React query

Question

const first = useMutation({
    mutationFn: (data) => {
      return Promise.all([
        (axios.put(
          "https://dummyjson.com/products/1",
          JSON.stringify({
            title: "iPhone Galaxy +1",
          })
        ),
        axios.post(
          "https://reqres.in/api/users",
          JSON.stringify({
            name: "morpheus",
            job: "leader",
          })
        )),
      ]);
    },
    onSuccess: (data) => {
      console.log(data);
    },

    onError: (error) => {
      console.log(error);
    },
  });

actually I want to perform two post requests to two different apis but the useMutation is posting only to the one api

In the above code only the second promise is resolved and the first one not getting resolved

---

Expected output: Both promises should be resolved and give the response from both the apis

Answer 1

You seem to have a typo in the code.

const array = [(a, b)]

This produces an array [b] because the , operator returns the item on the right. [(a, b)] is not the same as [a, b], the parens do have a meaning. If you check your code, you have the parens there

[
    (
        axios.put(),
        axios.post()
    ),
]

I removed the parameters of put and post to demonstrate. You should be observing two network requests but you're only waiting for the POST one because you're doing something like:

axios.get() // runs, but result is not used
const responses = Promise.all([axion.post()]) // only the post is consumed