-
-
Notifications
You must be signed in to change notification settings - Fork 2.5k
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
Refactor Props
of Image
and Picture
component to support type checking
#5788
Conversation
🦋 Changeset detectedLatest commit: c245aca The changes in this PR will be included in the next version bump. Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
Props
of Image
and Picture
component for better type checkingProps
of Image
and Picture
component to support type checking
|
||
interface LocalImageProps | ||
extends Omit<TransformOptions, 'src'>, |
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.
For some reason, when generics are used directly inside the astro component, its props type become Record<string, any>
. When extracted to another file, it works as expected
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.
Our language server doesn't support generics at the moment, but it will soon. Your workaround seems valid, though!
cc @Princesseuh for a TS review 😄
@@ -59,6 +32,7 @@ const { image, sources } = await getPicture({ | |||
fit, | |||
background, | |||
position, | |||
alt, |
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.
Ommiting alt
was a mistake I guess?
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.
Looks good to me, thanks for the PR!
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.
looks good to me!
This code actually was on par with other types back in the day, looks like it shows it's age now with all the improvements to the language server having much stronger support across the board
|
||
export interface ImageComponentLocalImageProps | ||
extends Omit<TransformOptions, 'src'>, | ||
Omit<ImgHTMLAttributes, 'src' | 'width' | 'height'> { |
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.
Should be astroHTML.JSX.ImgHTMLAttributes
too?
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.
Maybe HTMLAttributes<'img'>
from astro/types
?
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.
Maybe
HTMLAttributes<'img'>
fromastro/types
?
Sounds good to 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.
Should be
astroHTML.JSX.ImgHTMLAttributes
too?
Probably not? I don't think we want astro directives here
Left a few comments! Let me know if you'd rather I push this PR over the line myself, as you've done plenty work already! |
Co-authored-by: Erika <[email protected]>
Thanks! Your suggestions where helpful enough, I just need approval now 🙂 |
Changes
Image
andPicture
components.alt
prop to thegetPicture
functionTesting
Tested locally. There's only a small runtime change (see
alt
prop passed to thegetPicture
function). All tests should passDocs
N/A