[JakeSCahill]

Shows the release that introduced a page's feature as a "Since X.Y.Z" badge in the sticky header, next to the Beta and Limited Availability badges. The tooltip reads "Introduced in version X.Y.Z.", or "Introduced in X.Y.Z." when the page sets :page-introduced-in-product:. The badge renders only when the page sets :page-introduced-in:, and never on Cloud pages. A leading v or trailing period in the value is stripped.

Generated Connect reference pages will set the attribute from the component spec (redpanda-data/connect, branch docs/introduced-in-attribute), replacing the "Introduced in version" sentence in the page body. Cloud pages don't set it, and the template hides the badge on Cloud anyway.

Verified with a local Antora build using this bundle: self-managed inputs/sap_hana and inputs/redpanda show the badge, and the Cloud inputs/redpanda page shows none. gulp lint passes.

Preview page: https://deploy-preview-452--docs-ui.netlify.app/introduced-in-test.html (sets :page-introduced-in: 4.43.0). The Limited Availability Test page is the control and shows no version badge.

More preview pages: https://deploy-preview-452--docs-ui.netlify.app/introduced-in-combo-test.html (with Beta and Limited Availability, product named) and https://deploy-preview-452--docs-ui.netlify.app/introduced-in-cloud-test.html (Cloud, no badge). Template tests: npm run test:introduced-in-badge, run in validate-build.

Merge this first, then redpanda-data/docs-extensions-and-macros#394 (keeps the version in the Markdown front matter), then connect, so no page loses its version before the badge and the Markdown copy have it.

[coderabbitai]

Important

Review skipped

Auto incremental reviews are disabled on this repository.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

Run configuration

• Source mode: Auto
• Repository: Unavailable
• Branch: Unavailable
• File: No configuration file from this repository applied
• Commit: Unavailable
• Layers: Organization UI
• Review profile: CHILL
• Plan: Advanced
• Run ID: 30ed4cc4-5711-4afc-ad02-84b311f0dfc8

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

No actionable comments were generated in the recent review.

ℹ️ Recent review info

⚙️ Run configuration

• Source mode: Auto
• Repository: Unavailable
• Branch: Unavailable
• File: No configuration file from this repository applied
• Commit: Unavailable
• Layers: Organization UI
• Review profile: CHILL
• Plan: Advanced
• Run ID: 1ba36e36-6dc7-410f-aee8-5b9c21263b37

📥 Commits

Reviewing files that changed from the base of the PR and between a33195a and 8899e03.

📒 Files selected for processing: 2

• src/css/doc.css
• src/partials/article.hbs

Included review availability: This review used your included allowance. Your plan provides up to 1 included review per hour; 0 remain after this review.

Walkthrough

Article pages with page.attributes.introduced-in now show a “Since” badge. The badge label and tooltip include the introduction version. Pages without the attribute do not show the badge. The badge has neutral styling for light and dark themes.

Priority: Normal

Estimated code review effort: 2 (Simple) | ~10 minutes

Suggested reviewers: michelerp

Merge Risk: Minimal · up to 8899e

The badge is conditionally rendered and styled for both themes; the change is mergeable.

Pre-merge checks: 5

Check name	Status	Explanation
Title check		The title clearly and concisely describes the main change: showing a page's introduction version as a badge in the sticky header.
Docstring Coverage		No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check. Docstring coverage is scoped to functions touched by this diff. Analyzed 0 functions across 0…
Linked Issues check		Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check		Check skipped because no linked issues were found for this pull request.
Description check		The description directly matches the changes. It explains the new “Since X.Y.Z” badge, tooltip behavior, Cloud-page exclusion, styling, testing, and merge dependencies.

Full details: Docstring Coverage

Explanation

No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check. Docstring coverage is scoped to functions touched by this diff. Analyzed 0 functions across 0 files. (2 skipped: 2 unsupported.)

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Commit to this branch
• Create a new PR

• Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

_{Comment @coderabbitai help to get the list of available commands.}

[netlify]

✅ Deploy Preview for docs-ui ready!

Name	Link
🔨 Latest commit	b2a0290
🔍 Latest deploy log	https://app.netlify.com/projects/docs-ui/deploys/6adf8a291868c9167850a0cd
😎 Deploy Preview	https://deploy-preview-452--docs-ui.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.
Lighthouse	1 paths audited Performance: 46 (🟢 up 1 from production) Accessibility: 89 (no change from production) Best Practices: 83 (no change from production) SEO: 89 (no change from production) PWA: - View the detailed breakdown and full score reports
🤖 Make changes	Run an agent on this branch

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[Feediver1]

Summary

Small, clean change. It adds the badge in the right place, it reuses the existing .status-badge and tippy setup, and when the attribute isn't set nothing renders. I found no blocking bugs. Most of the suggestions are about the planned follow-up, where Connect removes the "Introduced in version" sentence from the page body. That step should wait until a couple of design gaps are closed.

What it does

• src/partials/article.hbs: when the page sets :page-introduced-in:, the sticky header shows a status-badge--since pill with the text "Since X" and the tooltip "Introduced in version X." It sits after the Beta, Preview and LA badges and before the ADP and availability badges.
• src/css/doc.css: adds light and dark styles for the neutral badge.
• preview-src/: adds a test page and a nav entry.

Verification

• Attribute name: the template reads page.attributes.introduced-in, which is :page-introduced-in: in AsciiDoc. No page in docs, cloud-docs or rp-connect-docs sets it today (I grepped origin/main in each). That's expected, because the generator change is still open (connect docs/introduced-in-attribute). For now rp-connect-docs has 81 pages that carry the literal sentence Introduced in version X. inside ifndef::env-cloud[].
• When the attribute is absent: the {{#if}} guard means no markup renders. The deploy preview confirms this: introduced-in-test.html renders <span class="status-badge status-badge--since" data-tippy-content="Introduced in version 4.43.0.">Since 4.43.0</span>, and the LA control page has no --since badge.
• Preview page: the bundle is built from src/ only, and preview-src is used just by the preview and lint tasks. The test page doesn't ship.
• Contrast: light mode is #374151 on #f3f4f6, about 9:1. Dark mode uses the same #cbd5e1 on translucent slate as the existing Preview dark badge. Both pass WCAG AA.
• I couldn't run a local preview:build because my clone's node_modules doesn't have prismjs, so I checked against the Netlify deploy preview.

Blocking issues

None.

Suggestions

1. Make the template hide the badge on Cloud. The comment says only self-managed pages set the attribute, but nothing enforces that. Cloud pages pull Connect component pages in with include::connect:components:…[tag=single-source]. Attribute entries inside an included body still end up in the document's attributes, so if the generator ever writes :page-introduced-in: inside the single-source tag (or outside an ifndef::env-cloud[]), Cloud will show a Connect version that doesn't apply to it. Cloud already sets page-cloud: true, and line 5 already uses that flag for latest-banner. One more condition closes the gap:

   {{#if (and page.attributes.introduced-in (not page.attributes.cloud))}}

2. Keep the version in the page body as well as the header. Merging this first, then DEM and connect, so that connect drops the body sentence means the version only exists in article.hbs chrome. The Markdown export (markdown-dropdown), Kapa/LLM ingestion and anything else that reads page.contents then lose it, and "which version added sap_hana?" stops having a source. Either keep the body sentence, or check that the Markdown/LLM pipeline emits page-introduced-in (for example as front matter) before connect removes it.
3. Badge text (UX review). "Since 4.43.0" passes the label bar: a short noun phrase, a numeral, no punctuation. Two gaps:
   • The tooltip doesn't say which product the number belongs to. On Connect pages the badge sits next to the version selector, which uses a different scheme (for example, 26.x for Redpanda). Suggested tooltip: "Introduced in Redpanda Connect 4.43.0." Since this partial is shared across components, an optional :page-introduced-in-product: attribute could supply the name, with the current text as the fallback.
   • The tooltip mostly repeats the label. Naming the product fixes that too, because the tooltip then adds a new fact.
4. Accessibility. The badge is a non-focusable <span>, so keyboard users can't open the tooltip, and screen readers only announce "Since 4.43.0". The other badges have the same issue, so this isn't a regression. If you take suggestion 3, an aria-label with the full tooltip text (or the visible text "Since Connect 4.43.0") gives assistive tech the context.
5. Normalize or document the value format. The value goes in as-is, so v4.43.0 renders as "Since v4.43.0", and a trailing period produces "4.43.0.." in the tooltip. Either note in the comment that the value is a bare X.Y.Z, or strip a leading v in a helper.
6. Consider a cutoff for old versions. The generator will set the attribute on every connector, including ones from 3.x and 4.0. A permanent "Since 3.36.0" pill tells readers very little and adds width to a header that already wraps at 1024px or less. The generator could skip versions older than N releases.
7. Small cleanups:
   • The dark rule nearly duplicates html[data-theme="dark"] .status-badge--preview (0.1/0.25 vs 0.15/0.3 alpha). Sharing a selector would stop them drifting apart.
   • Update the comments that list the badges: doc.css "Status badges (Beta, Limited Availability)" and article.hbs:27 "Beta, Preview, Limited Availability".
   • The test page could also cover the badge together with :page-beta: or :page-limited-availability:, and an empty :page-introduced-in:, to check the layout when several badges show.
8. Unrelated diff locally: compared with origin/main, my checkout of the branch also shows .github/CODEOWNERS and blobl-editor/wasm/go.* changes. GitHub's file list shows only the 4 intended files, so this is probably a stale base. Worth a rebase before merge to be sure.

What works well

• Minimal footprint: it reuses .status-badge, the [data-tippy-content] help cursor and the existing tooltip setup, with no new JS.
• white-space: nowrap from the base class keeps the pill on one line, and the existing sticky-header flex-wrap handles narrow widths.
• The dark-mode colors match the existing neutral (Preview) badge palette.
• The merge order in the description (UI first, then content) avoids a gap where pages have lost the sentence but have no badge yet.
• The preview page and its control are easy to check.

[JakeSCahill]

@Feediver1 thanks. Changes are in d48ffd9 (main merged in first, at da3013d).

1. Cloud: the badge now renders only when page.attributes.cloud is unset, as you suggested. New preview page introduced-in-cloud-test.html sets both attributes and shows no badge.
2. Body vs header: the Markdown export is covered by docs-extensions-and-macros#394, which adds page-introduced-in to the front matter allowlist. Connect should drop the body sentence only after that merges. I'll add that to the merge order in the description.
3. Product name: new optional :page-introduced-in-product:. With it the tooltip reads "Introduced in Redpanda Connect 4.43.0."; without it, "Introduced in version 4.43.0." The Connect component title is just "Connect", so setting it once in rp-connect-docs antora.yml is the follow-up.
4. Accessibility: the visible "Since X" is now aria-hidden and a visually hidden span carries the full tooltip text. I didn't make the badge focusable. That should be done for all the badges at once, not just this one.
5. Format: new normalize-version helper strips a leading v and trailing periods. The comment says the value is a bare X.Y.Z.
6. Cutoff for old versions: that's a policy call for the generator (connect#4968), not the template, which has no idea what's "old". Left for Jake. At 600px the header wraps cleanly with Beta, LA and Since all showing.
7. Cleanups: the dark rule now shares the Preview selector. Both badge comments now list every badge. New preview page introduced-in-combo-test.html shows Beta, LA and Since together with a v-prefixed value. The empty-value case is in the new template tests, tests/introduced-in-badge, which run in validate-build.
8. Stale base: GitHub's diff was always the 4 files. Main is merged in now.

Checked on the deploy preview in Chrome: tooltip text, badge order, dark colors, no badge on the Cloud or LA pages, no horizontal scroll at 600px. The tests pass on Node 18, and 5 of the 7 fail against the previous template.

[Feediver1]

Re-review: Show the version a page was introduced in as a badge in the sticky header

Reviewed at head d48ffd96. Last review was at 0662dbb7.

Verdict: ✅ No blockers. Ready for approval.

Suggestions from the last review

1. Hide the badge on Cloud: fixed. The badge is now gated on (and page.attributes.introduced-in (not page.attributes.cloud)), and introduced-in-cloud-test.html sets both attributes and shows no badge.
2. Keep the version outside the header: covered. docs-extensions-and-macros#394 (merged 10/24) adds page-introduced-in to the Markdown front matter. The description's merge order still has connect dropping the body sentence last.
3. Name the product: fixed. The new optional :page-introduced-in-product: gives "Introduced in Redpanda Connect 4.43.0.", and the fallback is "Introduced in version 4.43.0." Setting it in rp-connect-docs antora.yml is a follow-up.
4. Accessibility: fixed for screen readers. The visible "Since X" is aria-hidden, and a visually hidden span carries the full text. Keyboard focus for every badge is deferred, which is reasonable because it affects all of them.
5. Value format: fixed. normalize-version trims whitespace, drops a leading v (only before a digit) and trailing periods, and returns '' for no value or an object. A value that's empty after normalizing renders nothing, because {{#with ''}} skips its block.
6. Cutoff for old versions: deferred to the generator (connect#4968). Agreed, since the template can't know what counts as old.
7. Cleanups: done. The dark rule shares the Preview selector, both badge comments list every badge, and the combo preview page shows Beta, LA and Since together.
8. Stale base: main is merged in.

What I verified

• Read the diff 0662dbb7...d48ffd96, ignoring the main merge.
• Checked that the and, not and new normalize-version helpers exist in src/helpers/. Handlebars escapes the product name and the version in both the tooltip and the screen-reader text.
• Ran tests/introduced-in-badge locally on Node 22: 7/7 pass. All CI checks pass, and the branch merges cleanly.

Nit

• The screen-reader text drops the tooltip's trailing period ("Introduced in version 4.43.0" vs "…4.43.0."). That's harmless, but the two strings are built separately, so they could drift. A small inline partial would keep them the same.

[JakeSCahill]

@Feediver1 Fixed in 5fcf35d. The tooltip and the screen reader text now come from one inline partial, so both end with the period. The tests assert the two strings match, and they failed before the change.