'How can I wait for all mutations(react-relay) to be performed?

I use mutations many times.
I want to return the values after all of these mutations are finished.

The result value is returned before the mutations are finished.

module Mutation = {
  module Create = %relay(`
    mutation Sth_Create_Mutation($filename: String!) {
      createSthPresignedUrl(filename: $filename)
    }
  `)
}

let useImageUpload = () => {
  let (images, setImages) = React.useState(() => [])
  let (presignedUrls, setPresignedUrls) = React.useState(() => [])
  let (mutateCreate, _) = Mutation.Create.use()

  let handleImageUploadSubmit = () => {
    images->Array.forEach(image => {
      let inputCreate = Mutation.Create.makeVariables(~filename=image->Webapi.File.name)
      mutateCreate(
        ~variables=inputCreate,
        ~onCompleted=(result, _) => {
          result.createSthUrl->Js.log
          setPresignedUrls(prev => prev->Array.concat([result.createSthUrl]))
        },
        (),
      )->ignore
    })
    presignedUrls // this return [ ]
  }

  let component = <Container setImages />
  (handleImageUploadSubmit, component)
}


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source