Migrate `ApiComponents` from `nodejs.dev`

[ovflowd]

Continuing the migration of components from nodejs.dev that we started here, we should start migrating the ApiComponents from the nodejs.dev repository.

This issue will keep track of these components and their development progress.

The Migration of each Component

• Each Component should go under components/Api folder on this repository
• Each Component has its sub-folder (e.g., components/Aüi/Banner)
• The folder structure should pretty much be the same (CSS components, React, and sub-components), but feel free to make changes if you see deemed
• Please add some if the Component still needs to get unit tests. At least to ensure the Component is rendering. If the Component has states/CTAs (Buttons/Triggers), please cover them too.
• The Storybook of each component should allow interaction with all possible states of the Component
• If the Component depends on Hooks, please migrate them too, with the following caveat:
  • If that component only uses the Hook, move it to the same folder of the Component
  • Otherwise, migrate it to the hooks folder of the repository.
• If the Component has a Gatsby-specific logic (e.g. Dark Theme Switcher), if it is straightforward enough (e.g. a dark theme switcher plugin for Next.js or it is simple enough to code by ourselves, e.g. a Hook that we manage together with a React Provider) then feel free to do it.
  • Otherwise, if you have questions, please ask them on this Issue or your Draft PR for the Component.

List of Components to Migrate

• Changes @vasanth9
  • This component should be renamed to components/Api/ApiChanges
• JsonLink @Ve33y
  • This component should be renamed to components/Api/ApiJsonLink
• SourceLink @yossipoli
  • This component should be renamed to components/Api/ApiSourceLink
• Stability @AugustinMauroy
  • This component should be renamed to components/Api/ApiStabilityIndex

Components to avoid migration for now

Note.: If you feel adventurous and want to migrate these components, feel free, as existing logic exists within our current Website codebase. But please keep in mind these require an understanding of Nextra and the current structure of the website (such as how we generate pagination, how we generate ToC and how we generate a list of blog posts)

• VersionSelector
  • This uses specific logic of the temporary API Docs Tooling System, and we're still determining how we will proceed with the new API Docs and what we provide or not. You can work on this Component, but I'd recommend not to.

[AugustinMauroy]

Hey guys 👋!
I would like take stability ?
Unless someone is interested

[ovflowd]

Sure thing.

[AugustinMauroy]

And about Stability overview ?

I know it's not migrating but creating.

[ovflowd]

That is not a component on nodejs.dev, so no need to migrate. We won't bring API pages now on the website redesign. Just migrating components so we have them.

[vasanth9]

Hey guys,
I would like to migrate ApiChanges

[yossipoli]

I would like to try the SourceLink