optimistic-gold

createOptimisticAction rollback too returning in the mutationFn does nothing

and onUpdate handlers doesnt fire

export const updateRating = createOptimisticAction<{
  id: number,
  rating: number
}>({
  onMutate: ({ id, rating }) => {
    // if rating === -2
    if (rating < -1) return productsCollection.delete(id)

    productsCollection.update(id, (draft) => {
      draft.triedNote = rating < 0 ? undefined : rating
      draft.triedAt = new Date()
    })
  },
  mutationFn: async ({ id, rating }, params) => {
    const tried = await updateCollection({ id, rating })
    const product = productsCollection.get(id)

    return {
      ...product,
      triedNote: tried.note,
      triedAt: tried.createdAt,
    }
  },
})

export const updateRating = createOptimisticAction<{
  id: number,
  rating: number
}>({
  onMutate: ({ id, rating }) => {
    // if rating === -2
    if (rating < -1) return productsCollection.delete(id)

    productsCollection.update(id, (draft) => {
      draft.triedNote = rating < 0 ? undefined : rating
      draft.triedAt = new Date()
    })
  },
  mutationFn: async ({ id, rating }, params) => {
    const tried = await updateCollection({ id, rating })
    const product = productsCollection.get(id)

    return {
      ...product,
      triedNote: tried.note,
      triedAt: tried.createdAt,
    }
  },
})

18 Replies

graceful-blue•3w ago

onUpdate only calls when you do mutations outside of an explicit transaction like this. The documentation is poor still for this but you also need to await a call to either invalidate tags or collection.utils.refetch() Nothing needs returned from the mutationFn either

optimistic-goldOP•3w ago

So how do I avoid the rollback ?

graceful-blue•3w ago

It's rolling back because the optimistic state is dropped when you return from the mutationFn

optimistic-goldOP•3w ago

The example in the doc has a return I was thinking that it would validate if the transaction match the servers data

graceful-blue•3w ago

If you've refetched your collection then your optimistic state will be replaced with the new server state Yeah the doc needs updated...

optimistic-goldOP•3w ago

There’s no other way to do it than writeUpdate ? That would be great to do something that add the data without refetching and without calling writeUpdate I think

graceful-blue•3w ago

How would that work? Just by applying the return value?

optimistic-goldOP•3w ago

Transaction are only for optimistic update ?

graceful-blue•3w ago

Yes

optimistic-goldOP•3w ago

If I do a writeUpdate in the mutationFn that fine ?

graceful-blue•3w ago

A transaction is tracking the syncing of the mutation to the server and the sync back of the new server data Yup! That or just refetch everything!

optimistic-goldOP•3w ago

But refetch can be extensive for network sometimes

graceful-blue•3w ago

Sure, that's why the direct write APIs exist

optimistic-goldOP•3w ago

Yea but that a bit redundant

graceful-blue•3w ago

Redundancy is good 😂

optimistic-goldOP•3w ago

I’m gonna do a writeUpdate in the mutationFn so Not saying is not

graceful-blue•3w ago

Refetch is the default as it's automatic and works great for most use cases. Direct writes is for everything else

optimistic-goldOP•3w ago

Ok ok Thx

Gaming

Programming

createOptimisticAction rollback too returning in the mutationFn does nothing

Did you find this page helpful?