How to create mutation key based on mutation params

[ForeshadowRU]

I have a list of files that will be downloaded on click

In order to download it a mutation is triggered

export const useOrganizationDocument = () => {
   return useMutation([QueryKeys.DOWNLOAD_DOCUMENT], (params) => {
       return axios.get(`api/documents/${params.id}`, {responseType: 'blob'} );
   }, {
      onSuccess: (data) => {
        downloadAsFile(URL.createObjectURL(data.response), data.filename);
      }
   })

}

If I use isLoading param of that mutation is spins on all files of the list.
I want to add params.id as query key, but I am outside of scope for that.
Is there any workaround?

[TkDodo]

a mutations doesn't really need a key. what are you using the key for ?

[ForeshadowRU]

for separate loading states on each file

[ForeshadowRU]

if there is single query key all download buttons starts showing their loading states if you try to download single one of them

[TkDodo]

can you show a codesandbox or stackblitz reproduction of that? If each instance of the download button calls useOrganizationDocument() separately, this shouldn't happen.

[ForeshadowRU]

Ok, i'll post it asap

[sccolbert]

I second this. Frankly, I don't understand @TkDodo comment:

a mutations doesn't really need a key. what are you using the key for ?

If a mutation doesn't need a key, why does mutationKey exist?

In practice, the mutation key is critical for the useIsMutating hook, and sometimes, you don't know what you will be mutating until you receive the arguments to the mutation function.

I would suggest changing mutationKey (and for consistency queryKey) to take an array or a function that returns an array, that can compute the mutation/query key from the arguments passed to the mutation/query function.