marmelab / marmelab/react-admin
React-query admin wrapper and possibily undefined value with useGetOne
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 26.9k
- Forks
- 5.5k
- Avg merge
- 2d 3h
- Merged PRs (30d)
- 19
Description
According to the [React Query documentation](https://react-query.tanstack.com/guides/dependent-queries), we have the possibility to block the running query thanks to the `enabled` function if one of our parameter is not defined.
On the documentation sample, we can see `userId` can be set on the query definition without any issue.
We also have the possibility to use this option from the `useGetOne` hooks as you specified on the code doc block
https://github.com/marmelab/react-admin/blob/69d1cd1af77a432e2d1a3c2215ee93a2dedcd4be/packages/ra-core/src/dataProvider/useGetOne.ts#L26
However, the typing of the function requires the `id` to be a valid identifier:
https://github.com/marmelab/react-admin/blob/1ddb1672fe323baffb80567c890c759b3cea379c/packages/ra-core/src/types.ts#L139
Because of that, we have to cheat by casting the typing of the undefined value, for example:
```ts
const { data: userData } = useGetOne('users', { id: userId || '' }, { enabled: !!userId });
```
According to me, we should make that param optional to match the react-query implementation.
What do you think?
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with packages/ra-core/src/dataProvider/useGetOne.ts and the identifier type in packages/ra-core/src/types.ts, then compare their typings with React Query's enabled option. Confirm that the hook can represent an undefined id when the query is disabled, and verify the resulting type behavior with the relevant type checks or tests.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 2/5
- Estimated time
- 1-3 hours
- Activity status
- Stale
- Clarity
- Clearly specified
- Newbie friendliness
- 45/100