feat(ipa): preliminary IPA metadata UI with frontmatter parsing and validation#38
feat(ipa): preliminary IPA metadata UI with frontmatter parsing and validation#38
Conversation
…mponent - Add `state: adopt|experimental` to frontmatter of all 37 IPA docs, replacing the previous :::info[State] admonition blocks - Add generic Badge component (src/components/ui/Badge/) — a reusable pill badge with color and dot props, six colour variants, dark mode support - Add IpaMetadata component (src/components/ipa/IpaMetadata/) — reads `state` from page frontmatter via useDoc() and renders a colour-coded pill above the page title - Swizzle DocItem/Content in wrap mode to inject IpaMetadata automatically on every doc page — no changes needed to individual IPA files
|
|
||
| /** | ||
| * @typedef {"adopt" | "experimental" | "deprecated" | "retired"} IpaState | ||
| * @typedef {"green" | "amber" | "blue" | "orange" | "red" | "muted"} TagColor |
There was a problem hiding this comment.
We have blue and red defined among the TagColors as well. Do we use them in the scope of this PR? If not, we can introduce them when they are in use
There was a problem hiding this comment.
Sounds good will remove them
yelizhenden-mdb
left a comment
There was a problem hiding this comment.
Can you remind me if we are planning to introduce state in the metadata per guideline? And, if it is the case, will this approach be deprecated, or can it be re-used?
Yes, each guideline will inherit the state of the IPA unless overwritten - so the IPA can be stable, and a new guideline can be marked as experimental. We can re-use the logic introduced here for that once we have a discussion about it on the design doc |
| --- | ||
| id: 1 | ||
| slug: /1 | ||
| state: adopt |
There was a problem hiding this comment.
Can we also update the guidance in https://mongodb.github.io/ipa/1 to cover the new state tagging? Currently it explicitly states to use admonitions
There was a problem hiding this comment.
All done let me know what you think
| adopt: { label: "Adopt", color: "green" }, | ||
| experimental: { label: "Experimental", color: "amber" }, | ||
| deprecated: { label: "Deprecated", color: "orange" }, | ||
| retired: { label: "Retired", color: "muted" }, |
There was a problem hiding this comment.
[Nit] I wonder if we should perhaps use red for retired, to make the tag a bit more noticeable? I think it's pretty low-contrast right now, so it might be easily missed
Context
This is preliminary work towards surfacing top-level IPA metadata in the UI.
The IPA state (
adopt,experimental,deprecated,retired) was previously embedded in the page body as an admonition block. This PR moves it into frontmatter, renders it visibly above the page title, and validates / normalizes IPA frontmatter during parsing.What this PR adds
Badgecomponent used to render the state consistentlyslugfromidBefore / After
Before
After
State previews
Adopt
Experimental
Deprecated
Retired
Notes
This is intentionally scoped as a first step towards richer IPA metadata in the UI. It now also includes parser-level validation and normalization so IPA frontmatter is both visible in the UI and enforced consistently.