Skip to content
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

chore(Nav): convert demos to TS #9487

Merged
merged 11 commits into from
Oct 19, 2023
Merged

Conversation

adamviktora
Copy link
Contributor

@adamviktora adamviktora commented Aug 13, 2023

What: Closes #9376

I kept the js shortcuts instead of ts in the Nav.md file like this:

### Default nav

'''js file='./examples/Nav/NavDefault.tsx' isFullscreen
'''

Because if I type ts, I get this "cannot find a module" warning.

Screenshot 2023-08-13 at 10 42 29

This would require converting DashboardHeader.js and DashboardWrapper.js to TS, or at least creating a .d.ts file which would declare a module. I tried doing that but it lead to many changes through several files and still was getting some errors.

On the website, there still stays TS icon, although js is used.

Screenshot 2023-08-13 at 10 53 25

@patternfly-build
Copy link
Contributor

patternfly-build commented Aug 13, 2023

Copy link
Contributor

@thatblindgeye thatblindgeye left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

One other comment below. Also, in your attempt to resolve the ts file=... issue, were you running into errors only when trying to create a d.ts file, or even when updating the Dashboard___ files to tsx as well?

packages/react-core/src/demos/examples/Nav/NavDefault.tsx Outdated Show resolved Hide resolved
Copy link
Contributor

@thatblindgeye thatblindgeye left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Depending on whether we can get the Dashboard components updated to typescript without issue, it may make sense to try getting those in first just to avoid having to make another update for demos to update the js= to ts=.

Copy link
Contributor

@jenny-s51 jenny-s51 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice work on this @adamviktora - these conversions are looking great! Left a comment below

</PageSection>
<PageSection>
<Gallery hasGutter>
{Array.apply(0, Array(10)).map((_x: any, i: React.Key | null | undefined) => (
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

For readability, should we be more specific with these parameter names? Also wondering if the null | undefined types can be removed here

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah, good idea, I changed _x to _value and i to index. And you are right, the null and undefined were unnecessary.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Awesome, looks great @adamviktora ! Can we apply the same change to all remaining instances of Array.apply?

Copy link
Contributor Author

@adamviktora adamviktora Oct 18, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@jenny-s51 Done (at least in the Nav demos). Should I apply the change to all instances in the codebase?

Copy link
Contributor

@jenny-s51 jenny-s51 Oct 18, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looking good! For consistency that would be a good idea, but I'd say that is technically out of scope since it would involve updating other demos.

Could you file a standalone "tech debt" issue for that so we can merge this one in @adamviktora ?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Created the issue so we can merge: #9765

Copy link
Contributor

@jenny-s51 jenny-s51 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is looking great following the recent updates to the DashboardHeader/DashboardWrapper imports @adamviktora !

Left one more comment in the existing thread above - should be good to merge once that's fixed 👍

Copy link
Contributor

@jenny-s51 jenny-s51 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM @adamviktora 👏

@jenny-s51 jenny-s51 merged commit 1194a7e into patternfly:main Oct 19, 2023
10 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Convert navigation react demos to TS
4 participants