invertase / invertase/tanstack-query-firebase

Pass doc ref in `useFirestoreDocumentMutation` callback (not the hook)?

Open
#44 0 comments 3 reactions 0 assignees View on GitHub
react-query-firebase
Dominant language
TypeScript
Stars
462
Forks
69
PR merge metrics
No merged PRs in 30d

Description

In a todo list app, one would use `useFirestoreDocumentMutation` to mark the individual items as TODOs. The current API takes a doc reference in the hook. If there are 100 todos, each one needs it's own hook of `useFirestoreDocumentMutation` so that would be 100 calls to `useFirestoreDocumentMutation`. Since each of these calls `react-query`'s `useMutation`, which in turn calls 6 hooks. This can be very costly, even though each one is doing the same thing (save for on a different doc).

Ideally, we would only need one call to `useFirestoreDocumentMutation` once, like this

```ts
const TodoList = ({ todos }) => {
const mutation = useFirestoreDocumentMutation()
return (


{todos.map((todo) => (

mutation([doc(db, 'todo', todo.id), { ...todo, completed: true }])
}
/>
))}

)
}
```

See [docs for useMutation](https://react-query.tanstack.com/reference/useMutation).

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.