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

Convert EmbedPreview component to functional component #51325

Conversation

louwie17
Copy link
Contributor

@louwie17 louwie17 commented Jun 8, 2023

What?

This PR converts the EmbedPreview component to a functional component.

Why?

React class components are outdated and functional components are encouraged, this is part of the #22890 to convert all class components to functional components.

How?

Converts EmbedPreview component to a functional component.

Testing Instructions

  1. Open a Post or Page
  2. Add an Embed block
  3. Grab a link from YouTube or Tumblr or any of the sites listed here: https://wordpress.org/documentation/article/embeds/#list-of-sites-you-can-embed-from and add it to the Embed component
  4. Make sure it saves correctly and no new errors are shown in the console.
  5. Do a smoke test to make sure it continues to work as before ( changing the width in the toolbar, or changing the url, clicking around in the video/image to make sure things are interactive.

Testing Instructions for Keyboard

N/A

Screenshots or screencast

N/A

@louwie17 louwie17 requested a review from ajitbohra as a code owner June 8, 2023 09:06
@github-actions github-actions bot added the First-time Contributor Pull request opened by a first-time contributor to Gutenberg repository label Jun 8, 2023
@github-actions
Copy link

github-actions bot commented Jun 8, 2023

👋 Thanks for your first Pull Request and for helping build the future of Gutenberg and WordPress, @louwie17! In case you missed it, we'd love to have you join us in our Slack community, where we hold regularly weekly meetings open to anyone to coordinate with each other.

If you want to learn more about WordPress development in general, check out the Core Handbook full of helpful information.

Copy link
Contributor

@ntsekouras ntsekouras left a comment

Choose a reason for hiding this comment

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

Thanks for the PR @louwie17! This looks good except for my small comment.

packages/block-library/src/embed/embed-preview.js Outdated Show resolved Hide resolved
@mirka mirka added the [Package] Block library /packages/block-library label Jun 15, 2023
@t-hamano
Copy link
Contributor

Hi @louwie17,

I found this PR when trying to resolve some of the issues in #65179. If you have time to work on this issue, could you rebase this PR to resolve the conflicts?

Thank you!

Copy link

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

Unlinked Accounts

The following contributors have not linked their GitHub and WordPress.org accounts: @louwie17.

Contributors, please read how to link your accounts to ensure your work is properly credited in WordPress releases.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Unlinked contributors: louwie17.

Co-authored-by: ntsekouras <[email protected]>
Co-authored-by: kevin940726 <[email protected]>
Co-authored-by: t-hamano <[email protected]>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

@louwie17
Copy link
Contributor Author

Hi @louwie17,

I found this PR when trying to resolve some of the issues in #65179. If you have time to work on this issue, could you rebase this PR to resolve the conflicts?

@t-hamano I had forgotten about this PR, I should be able to resolve the conflicts.

@louwie17 louwie17 force-pushed the update/22890_embed_preview_to_functional_comp branch from e2c0b8e to f4349e4 Compare September 16, 2024 12:10
@louwie17
Copy link
Contributor Author

I found this PR when trying to resolve some of the issues in #65179. If you have time to work on this issue, could you rebase this PR to resolve the conflicts?

The PR is updated.

@ntsekouras, @kevin940726 sorry for the very long delay in addressing the PR feedback, but it has been addressed. This PR is ready for a re-review.

@t-hamano t-hamano added [Type] Code Quality Issues or PRs that relate to code quality [Block] Embed Affects the Embed Block labels Sep 16, 2024
@t-hamano t-hamano self-requested a review September 16, 2024 13:10
Copy link
Contributor

@t-hamano t-hamano left a comment

Choose a reason for hiding this comment

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

LGTM! Thanks for the update 👍

The overlay is also working correctly. That is, the first time the block is clicked, elements in the iframe document do not react the first time the block is clicked, but only when the block is selected:

a15cad4f5bfa3f44f1c9065f142ff9d5.mp4

@louwie17
Copy link
Contributor Author

Thanks for the quick review @t-hamano, I don't have permission to merge, so I will leave that up to you or any of the other reviewers :)

@t-hamano t-hamano merged commit edd4148 into WordPress:trunk Sep 16, 2024
67 of 69 checks passed
Copy link

Congratulations on your first merged pull request, @louwie17! We'd like to credit you for your contribution in the post announcing the next WordPress release, but we can't find a WordPress.org profile associated with your GitHub account. When you have a moment, visit the following URL and click "link your GitHub account" under "GitHub Username" to link your accounts:

https://profiles.wordpress.org/me/profile/edit/

And if you don't have a WordPress.org account, you can create one on this page:

https://login.wordpress.org/register

Kudos!

@github-actions github-actions bot added this to the Gutenberg 19.3 milestone Sep 16, 2024
@louwie17 louwie17 deleted the update/22890_embed_preview_to_functional_comp branch September 16, 2024 14:27
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Block] Embed Affects the Embed Block First-time Contributor Pull request opened by a first-time contributor to Gutenberg repository [Package] Block library /packages/block-library [Type] Code Quality Issues or PRs that relate to code quality
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants