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.

Sign up for GitHub

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

Jump to bottom

TypeScript Conversion: media, units, react packages #12127

Merged
merged 17 commits into from
Aug 25, 2022
Merged

TypeScript Conversion: media, units, react packages #12127

merged 17 commits into from
Aug 25, 2022

Conversation

swissspidy
Copy link
Collaborator

@swissspidy swissspidy commented Aug 17, 2022 •
edited
Loading

Context

This is part of our ongoing effort to convert (parts of) our codebase to TypeScript. See #1715 for details.

Summary

This marks the first step of migrating the media package to TypeScript, unblocking better typing usage in all consumer packages relying on it.

Due to my struggles with Could not find a declaration file for module ... errors, I also ended up converting the units and react packages (which are dependencies) to React.

Figured I'll keep everything in this one PR since it seemed so intertwined.

Success story:

Relevant Technical Choices

To-do

  • It would be nice to eventually import a better Element type from a shared package (elements package?)
  • Be able to move custom typings to the top-level typings folder
  • Figure out better solution to address Could not find a declaration file for module ... errors so we can better convert packages one at a time.
  • Figure out better typings for UnitsProvider and useUnits and useContextSelector
  • Add some documentation for contributors

User-facing changes

N/A

Testing Instructions

  • This is a non-user-facing change and requires no QA

This PR can be tested by following these steps:

Reviews

Does this PR have a security-related impact?

No

Does this PR change what data or activity we track or use?

No

Does this PR have a legal-related impact?

No

Checklist

  • This PR addresses an existing issue and I have linked this PR to it in ZenHub
  • I have tested this code to the best of my abilities
  • I have verified accessibility to the best of my abilities (docs)
  • I have verified i18n and l10n (translation, right-to-left layout) to the best of my abilities
  • This code is covered by automated tests (unit, integration, and/or e2e) to verify it works as intended (docs)
  • I have added documentation where necessary
  • I have added a matching Type: XYZ label to the PR

Fixes #12087

@swissspidy swissspidy added Group: Media Type: Infrastructure Changes impacting testing infrastructure or build tooling labels Aug 17, 2022
@googleforcreators-bot
Copy link
Collaborator

googleforcreators-bot commented Aug 17, 2022 •
edited
Loading

Plugin builds for 5cee7a0 are ready 🛎️!

@swissspidy swissspidy marked this pull request as draft August 17, 2022 14:41
swissspidy
swissspidy commented Aug 18, 2022
View reviewed changes
packages/media/src/getCanvasBlob.ts
Comment on lines -20 to +21
resolve(blob, 'image/jpeg');
});
resolve(blob);
}, 'image/jpeg');
Copy link
Collaborator Author

Choose a reason for hiding this comment

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

We've never spotted this bug before

@timarney
Copy link
Contributor

Looking really solid

swissspidy
swissspidy commented Aug 18, 2022
View reviewed changes
packages/media/src/getResourceSize.ts
@@ -19,6 +19,14 @@
*/
import { FULLBLEED_HEIGHT, PAGE_WIDTH } from '@googleforcreators/units';
Copy link
Collaborator Author

Choose a reason for hiding this comment

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

So this Could not find a declaration file for module '@googleforcreators/units'. error has been nagging me for a while now and can't figure out why it's not working 🤔

Copy link
Contributor

Choose a reason for hiding this comment

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

Curious, what was the issue?

Copy link
Collaborator Author

Choose a reason for hiding this comment

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

That's the thing, I couldn't figure it out properly. Probably just some tsconfig misconfiguration somewhere, basically it did not like importing from this non-TS package. That's why I ended up just converting the units package to TypeScript 🙃

For next time it would be great to resolve though. If you have any ideas, PLMK

miina
miina reviewed Aug 19, 2022
View reviewed changes
Copy link
Contributor

@miina miina left a comment

Choose a reason for hiding this comment

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

Looking great!

packages/units/src/dimensions.ts Outdated Show resolved Hide resolved
packages/units/src/dimensions.ts Outdated Show resolved Hide resolved
packages/media/src/types.ts Outdated Show resolved Hide resolved
packages/media/src/types.ts Outdated Show resolved Hide resolved
packages/media/src/hasVideoGotAudio.ts Outdated Show resolved Hide resolved
packages/media/src/getTypeFromMime.ts Outdated Show resolved Hide resolved
packages/media/src/getCanvasBlob.ts Show resolved Hide resolved
@swissspidy swissspidy mentioned this pull request Aug 23, 2022
Closed
@swissspidy swissspidy changed the title Convert media package to TypeScript TypeScript Conversion: media, units, react packages Aug 23, 2022
@swissspidy swissspidy mentioned this pull request Aug 23, 2022
Closed
@swissspidy swissspidy requested review from barklund and removed request for spacedmonkey August 24, 2022 07:37
@swissspidy swissspidy marked this pull request as ready for review August 24, 2022 07:48
@swissspidy swissspidy added Type: Code Quality Things that need a refactor, rewrite or just some good old developer ❤️ Package: Units /packages/units Package: Media /packages/media Package: React /packages/react labels Aug 24, 2022
miina
miina approved these changes Aug 24, 2022
View reviewed changes
Copy link
Contributor

@miina miina left a comment

Choose a reason for hiding this comment

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

Looks good assuming the failing Karma tests are just flaky (re-running). Lots of files to go through so would be great if someone else would review as well.

packages/units/src/getBoundRect.ts Show resolved Hide resolved
packages/react/src/useContextSelector.ts Show resolved Hide resolved
packages/media/src/types.ts Outdated Show resolved Hide resolved
packages/media/src/getResourceSize.ts
@@ -19,6 +19,14 @@
*/
import { FULLBLEED_HEIGHT, PAGE_WIDTH } from '@googleforcreators/units';
Copy link
Contributor

Choose a reason for hiding this comment

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

Curious, what was the issue?

@swissspidy swissspidy merged commit 4be5e98 into main Aug 25, 2022
@swissspidy swissspidy deleted the fix/12087-typescript-media branch August 25, 2022 14:21
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@timarney timarney timarney approved these changes

@miina miina miina approved these changes

@merapi merapi Awaiting requested review from merapi

@barklund barklund Awaiting requested review from barklund

@spacedmonkey spacedmonkey Awaiting requested review from spacedmonkey

Assignees
No one assigned
Labels
Group: Media Package: Media /packages/media Package: React /packages/react Package: Units /packages/units Type: Code Quality Things that need a refactor, rewrite or just some good old developer ❤️ Type: Infrastructure Changes impacting testing infrastructure or build tooling
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

TypeScript: Convert media package
4 participants
@swissspidy @googleforcreators-bot @timarney @miina