Migrate ExternalLink component to @automattic/components

[chriskmnds]

What

Part of addressing #79004

Migrate the ExternalLink component to the @automattic/components package.

Why

We need to import and use the component outside of Calypso's environment. It is currently being utilized in the FEATURES_LIST definitions that are also being migrated to @automattic/calypso-products.

How

No response

[simison]

Would it make sense to just use ExternalLink from @wordpress/components instead?

https://wordpress.github.io/gutenberg/?path=/docs/components-externallink--docs

[chriskmnds]

Would it make sense to just use ExternalLink from @wordpress/components instead?

https://wordpress.github.io/gutenberg/?path=/docs/components-externallink--docs

Hey @simison ! Yes, I've been thinking about this very thing right now. The problem on our end was the ExternalLinkWithTracking component that's also extracted, which uses the A8C tracks event recorder.

I guess a better setup would be to keep only ExternalLinkWithTracking in @automattic/components and wrap it around the @wordpress/components one. There are also some styles added though to ExternalLink, so those will need to live somewhere (or trashed).

I'm going to go ahead with completing the migration, so that we at least get things using this new component that we already extracted in #88236 and flag it for a follow-up to consolidate or refactor further.

---

Or not! If I had known about the @wordpress/components one (and I should have, cause that's the one I had been using in my code elsewhere), I would have maybe gone for a different refactor. WDYT? 🤔 It's a 4-part migration that's already sitting in PRs:

1. ExternalLink to packages (Step 1): Add ExternalLink to components package #88236
2. ExternalLink to packages (Step 2): Temporarily shim old Calypso ExternalLink component #88290
3. ExternalLink to packages (Step 3): Update references to use new package component #89355
4. ExternalLink to packages (Step 4): Remove ExternalLink/WithTracking component shims #89359

[simison]

@chriskmnds what did the differences between a8c component and WP component end up being? If it's just some styling or a single feature, it might make sense to suggest it to upstream component.

See internal design system reference puPv3-ktX-p2

Thanks for persisting with the task!

[chriskmnds]

@chriskmnds what did the differences between a8c component and WP component end up being? If it's just some styling or a single feature, it might make sense to suggest it to upstream component.

See internal design system reference puPv3-ktX-p2

Thanks for persisting with the task!

@simison I didn't ship the last two PRs so there's still something to do with this. I'll check again and write back once I get unblocked from other things. If we can suggest upstream changes, also a "tracking" callback (maybe?), we might be able to completely rid of the others. but roughly thinking, I'd need to revisit.