react-router
react-router copied to clipboard
[Feature]: Adding generic type to DeferredData used by defer
What is the new or updated feature that you are suggesting?
When using defer in loader:
const loader = (client: QueryClient) => {
return async () => {
return defer({
todos: fetch('https://jsonplaceholder.typicode.com/todos/1')
});
};
};
The data property returned by defer is Record<string, unknown> and cannot be typed properly:
return defer({ todos: fetch('http://jsonplaceholder.com')}) as { data: { todos: { userId: number; id: number; title: string; } }}
will result an error Types of property 'data' are incompatible.
Allowing this syntax would solve it:
defer<{ userId: number; id: number; title: string; }>(fetch('https://jsonplaceholder.typicode.com/todos/1'));
and the return type of defer will be:
{ data: T } (where T is the generic)
Why should this feature be included?
Allowing proper typing for defer result.
https://github.com/remix-run/react-router/pull/9642
I'm going to close this out and include it with https://github.com/remix-run/react-router/issues/9641
I'm going to close this out and include it with #9641
Jumping between #9642 and this, it seems like the issue is unresolved?
FWIW, DeferredData typing is causing me similar typing trouble, and it would be helpful to understand if it something you acknowledge and plan to address, and if so where progress can be tracked (this issue would be a reasonable place in my opinion).
I must have pasted the wrong link - defer types should be done when we do the types for json, useLoaderData, etc. in this proposal: https://github.com/remix-run/react-router/discussions/9854