-
Notifications
You must be signed in to change notification settings - Fork 314
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
add loader inference #122
add loader inference #122
Conversation
app/routes/notes.tsx
Outdated
type LoaderData = { | ||
noteListItems: Awaited<ReturnType<typeof getNoteListItems>>; | ||
}; | ||
|
||
export const loader: LoaderFunction = async ({ request }) => { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
export const loader: LoaderFunction = async ({ request }) => { | |
export const loader = async ({ request }: LoaderArgs) => { |
What happens if you remove LoaderFunction
?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
yup, need to type the args and not the full function as LoaderFunction returns Promise<Response> | Response | Promise<AppData> | AppData
where AppData
is actually just any
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Yikes. I don't remember agreeing to that. How do we avoid that?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
FWIW, it does work. But is there any way we can avoid having to type the args? I'd much rather type the whole function and get type safety on what's returned as well as the args.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Though I could be convinced. I just don't remember signing up for this so I need to process it a bit...
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I hate the fact that we need to type args instead of the whole function, but I like the type inference so it's a hard one for me 😕
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Agreed, but I think the choice here was constrained by this being a breaking change if we changed the LoaderFunction
/ActionFunction
types. Seems like something we'll have to reconsider for v2.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Ok, after looking at it more, I realize that it's required for TypeScript to infer the return type. My mistake. Fixing now.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
If/when the satisfies
operator makes it into Typescript, we'll get the best of both worlds:
// syntax for `satisfies` TBD
const loader: satisfies LoaderFunction = () => { // TS will error if `loader` doesn't conform to `LoaderFunction`
return json({ hello: "world"}) // ... but will still infer the narrower return type here
// ^ use `{hello: "world"} as const` if you want `"world"` literal type instead of just `string`. standard TS thing
}
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Even better: microsoft/TypeScript#38511
I'm not getting the loader inference I expected.
data
ends up beingany
. Am I doing something wrong here @colinhacks?