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

[BD-46] feat: defined types for Paragon export #2566

Open
wants to merge 16 commits into
base: master
Choose a base branch
from

Conversation

monteri
Copy link
Contributor

@monteri monteri commented Aug 21, 2023

Description

Define types for Paragon exports
Issue: #1964

Deploy Preview

Include a direct link to your changes in this PR's deploy preview here (e.g., a specific component page).

Merge Checklist

  • If your update includes visual changes, have they been reviewed by a designer? Send them a link to the Netlify deploy preview, if applicable.
  • Does your change adhere to the documented style conventions?
  • Do any prop types have missing descriptions in the Props API tables in the documentation site (check deploy preview)?
  • Were your changes tested using all available themes (see theme switcher in the header of the deploy preview, under the "Settings" icon)?
  • Were your changes tested in the example app?
  • Is there adequate test coverage for your changes?
  • Consider whether this change needs to reviewed/QA'ed for accessibility (a11y). If so, please add wittjeff and adamstankiewicz as reviewers on this PR.

Post-merge Checklist

  • Verify your changes were released to NPM at the expected version.
  • If you'd like, share your contribution in #show-and-tell.
  • 🎉 🙌 Celebrate! Thanks for your contribution.

@openedx-webhooks
Copy link

Thanks for the pull request, @monteri!

When this pull request is ready, tag your edX technical lead.

@openedx-webhooks openedx-webhooks added the blended PR is managed through 2U's blended developmnt program label Aug 21, 2023
@netlify
Copy link

netlify bot commented Aug 21, 2023

Deploy Preview for paragon-openedx ready!

Built without sensitive environment variables

Name Link
🔨 Latest commit 24efb89
🔍 Latest deploy log https://app.netlify.com/sites/paragon-openedx/deploys/64e32669ee1daf00089bb0ce
😎 Deploy Preview https://deploy-preview-2566--paragon-openedx.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

@codecov
Copy link

codecov bot commented Aug 21, 2023

Codecov Report

Patch coverage: 75.00% and project coverage change: +0.03% 🎉

Comparison is base (7e5b37d) 91.65% compared to head (24efb89) 91.69%.
Report is 11 commits behind head on master.

Additional details and impacted files
@@            Coverage Diff             @@
##           master    #2566      +/-   ##
==========================================
+ Coverage   91.65%   91.69%   +0.03%     
==========================================
  Files         236      236              
  Lines        4195     4227      +32     
  Branches     1012     1022      +10     
==========================================
+ Hits         3845     3876      +31     
- Misses        346      347       +1     
  Partials        4        4              
Files Changed Coverage Δ
src/Breadcrumb/index.jsx 100.00% <ø> (ø)
src/Card/CardStatus.jsx 100.00% <ø> (ø)
src/ChipCarousel/index.tsx 84.84% <ø> (ø)
src/ActionRow/index.tsx 93.33% <75.00%> (ø)

... and 3 files with indirect coverage changes

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

@bradenmacdonald
Copy link
Contributor

I'm really happy to see this PR! I can help test/review if you like - let me know how I can help.

I have a couple questions:

  1. How were these .d.ts files generated? Are they manually authored or generated from propTypes, etc.? How do we ensure they stay in sync with propTypes and the actual implementation?
  2. Don't we need to add exports.*.types: and typesVersions etc. to package.json for this to work? Something like this.

@PKulkoRaccoonGang
Copy link
Contributor

@bradenmacdonald Thank you for paying attention to this PR.
The initial idea was to rewrite the Paragon components into Typescript. After discussions with @adamstankiewicz, we decided this would be a fairly breaking change and wrote the types separately without changing the component file extensions.

  1. The .d.ts files were written by hand. Now we have type declarations for exported constants and propTypes. We did not consider the option of automatically generating types because the Paragon components use Bootstrap and we do not have access to the full props API. If you have any ideas on how to solve this problem it would be great 💯
  2. We tested type checking in MFE and it worked. Your proposal may solve a problem we were unaware of at the time of development.

@bradenmacdonald
Copy link
Contributor

@PKulkoRaccoonGang Thanks for the details!

@PKulkoRaccoonGang @adamstankiewicz What do you think about splitting this up into smaller PRs and trying to get them merged separately? I think we should really try to make at least the tests and the documentation site consume the TypeScript types, so that we have some way of checking that they're used and in sync.

Here's an example of what I mean: #3016 (I noticed that this PR doesn't include types for the <Icon> component, and the existing types were incorrect, so I fixed the types and made changes to the tests and the documentation site so that they're using the types. That way if the types change and introduce a bug, we should see errors when checking the tests or the docs site.)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
blended PR is managed through 2U's blended developmnt program raccoon-gang
Projects
Status: In review
Status: No status
Development

Successfully merging this pull request may close these issues.

4 participants