Update mutation cache with fixedCacheKey from another mutation

[DaimonX]

Hello. Is it possible to manually update the cache with 'fixedCacheKey' via 'updateQueryData' from another mutation in pessimistic way ?

I have a situation where I'm uploading file (kinda csv) with thousands rows and columns to the server for validation of each cell. This part is done using the mutation endpoint (response is huge array with validated fields, values, and error messages):

uploadFile: build.mutation({
      query: ({ formData, userId }) => ({
        url: "uploadfile",
        method: "POST",
        body: formData
      })
})

And in my components im using it is like:

const [triggerUploadFile, {
      isLoading: pricatIsLoading,
      data: pricatUploadResponse
    }] = api.useUploadFileMutation({
      fixedCacheKey: 'shared-upload',
    });

//elsewhere in component

triggerUploadFile({formData, 'testId'})

After that im doing manual validation of each field through UI. And sending validation request for specific field which user want to revalidate and i dont want revalidate full file as i for sure now updates for specific field. I want just update it in cache at specific field.

I tried to do it inside another mutation validateField dispatching updateQueryData like

const patchResult = dispatch(api.util.updateQueryData(
    'uploadFile',
    'shared-upload',
    (uplodedFileDraft) => {return updateduplodedFileDraft}
)

inside update functiomn i see and can modify data but it does not updates my 'shared-upload' cahce.

Would be appreciated for any help and advice. Thank you.

[phryneas]

No, updateQueryData only updates query data. There is no mechanism to do this for mutations, because mutations are generally not really meant to stay around for long. In that case you probably have to copy data into a separate slice.

[DaimonX]

@phryneas Thanks for so fast response. What approach i can take for my case ? Is RTK fit here at all ? For now, I was able to achieve this by changing file uploading from mutation to query and it almost work. But now i see a warning because im using file as args

 A non-serializable value was detected in the state, in the path:
`onboardingAPI.queries.getUploadFile({"formData":{},"vendorId":"NAK-3549"}).originalArgs.formData

But at least it allow me update cache without reuploading whole file each time i update one field

[phryneas]

A mutation for a file upload is fine. But you are abusing RTK Query to hold data for you that is not a copy of a specific "on the server resource".

RTK Query is meant to be a cache of what is on the server, not for client state.

You would write a custom slice for that data and add extraReducers with a matcher for api.endpoints.yourMutation.matchFulfilled and hold that data there.

[DaimonX]

@phryneas hmm. Thanks, will try to do it as you suggest ❤️