Skip to content

usePacedMutation: No way to sync/clear mutations store after optimistic insert with server-generated IDs #893

Description

@em2724

Description:

When using usePacedMutation with the following requirements:

  • Optimistic UI updates (via onMutate)
  • No refetch after mutation completion
  • Server-generated IDs (temp ID → real ID swap on POST response)

There's no way to clear the mutations store after writing the real ID to the synced store, which causes the temp ID item to remain in the UI alongside the real ID item.

Current Behavior:

usePacedMutations({
  onMutate: ({ data }) => {
    // Optimistically insert with temp ID
    collection.insert(data); // tempId: "temp-123"
  },
  mutationFn: async ({ transaction }) => {
    const response = await axios.post('/item', transaction.mutations[0].changes);
    const realId = response.data.id;
    
    // Write real ID to synced store
    collection.utils.writeInsert({
      ...transaction.mutations[0].changes,
      id: realId // realId: "server-456"
    });
    
    // Problem: mutations store still contains tempId item
    // Result: UI now shows BOTH temp and real items
  }
});

Expected Behavior:

After mutationFn completes and writes to the synced store, the temporary mutation should be removed from the mutations store automatically, or there should be a way to trigger a sync/clear to reconcile the stores.

Note:

With the collection API, returning { refetch: false } from an operation handler triggers a sync, but there's no equivalent way to achieve this from the usePacedMutation mutationFn callback.

Additional Context:

This is how I came across this issue. I've added a comment in discussion #824 that describes in full how I'm trying to achieve a queue strategy across multiple operation types.

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions