Add/migrate new npm plugin (shows information for entities from npmjs.com)

[christoph-jerolimov]

Hey, I just made a Pull Request!

This PR adds a new workspace and plugin to show information from npm. From the plugin README:

Npm info card:

Npm release overview card:

Extended catalog entity overview tab (example):

New catalog entity npm release tab:

How to test the PR

The workspace contains a backstage app with working catalog entities:

cd workspaces/npm
yarn install
yarn dev

✔️ Checklist

• A changeset describing the change and affected packages. (more info)
• Added or updated documentation
• Tests for new functionality and regression tests for bug fixes
• Screenshots attached (for UI changes)
• All your commits have a Signed-off-by line in the message. (more info)

[backstage-goalie]

Unnecessary Changesets

The following package(s) are private and do not need a changeset:

• @backstage-community/plugin-npm

Changed Packages

Package Name	Package Path	Changeset Bump	Current Version
app	workspaces/npm/packages/app	none	v0.0.0
backend	workspaces/npm/packages/backend	none	v0.0.0
@backstage-community/plugin-npm	workspaces/npm/plugins/npm	major	v0.1.0

[christoph-jerolimov]

@BethGriggs @nickboldt @Fortune-Ndlovu @ciiay I created this plugin some time ago in the evening. I will check asynchronously if I'm allowed to mark it as an RH plugin (in the plugin package.json).

I will also add dynamic plugin support as a follow-up. Let me know if anything else is needed, missed or recommended. :)

[christoph-jerolimov]

I've added api reports (and docs) and knip reports. Let's see what's missing next. =)

[BethGriggs]

I believe the last thing to do is to create a changeset for @backstage-community/plugin-npm to do a patch bump - this is needed to start the release flow. You can generate the changeset using yarn changeset in the workspace.

[karthikjeeyar]

Tested locally, works well! 🎉

I have tested the components in overview page, npm releases tab (features like filters, sorting, etc) and added some comments and observations.

[christoph-jerolimov]

Thanks @BethGriggs and @karthikjeeyar for the review. I addressed all your comments.

1. Added a changeset
2. Removed the kubernetes frontend and backend
3. Links opens now in a new browser tab (I switched also from Link to a)
4. Added loading indicators
5. Shows API errors with an ErrorPanel (added another demo entity for the invalid package name case)

Here is a recording how the errors are displayed:

Screencast.from.2024-10-10.10-52-07.mp4

[karthikjeeyar]

/lgtm

[BethGriggs]

Refs: backstage/community#160