feat: Sidebar enhancements

[canerakdas]

Description

This PR's main goal is to group the links in the sidebar to help developers find the content they're looking for more easily.

As a temporary solution, grouping for the Node.js docs is done using a static array. However, in the long term, we plan to add category information to pages in YAML format and remove this array as well

Validation

Before / After

---

---

Related Issues

Related to #646, nodejs/learn#6

Check List

• I have read the Contributing Guidelines and made commit messages that follow the guideline.
• I have run node --run test and all tests passed.
• I have check code formatting with node --run format & node --run lint.
• I've covered new added functionality with unit tests if necessary.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
api-docs-tooling	Ready	Preview	Apr 4, 2026 4:43pm

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 77.47%. Comparing base (2680e84) to head (b2612f4).

Additional details and impacted files

@@            Coverage Diff             @@
##             main     #745      +/-   ##
==========================================
+ Coverage   77.08%   77.47%   +0.38%     
==========================================
  Files         153      155       +2     
  Lines       13749    13941     +192     
  Branches     1111     1139      +28     
==========================================
+ Hits        10599    10801     +202     
+ Misses       3146     3136      -10     
  Partials        4        4              

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[Copilot]

Pull request overview

This PR enhances the web generator’s sidebar navigation by introducing grouped sidebar sections (via per-page categories with a temporary static fallback for Node.js docs), and adjusts the version selector styling/variant to align the sidebar UI.

Changes:

• Extend #theme/config pages entries to include an optional category field and update related typing/tests.
• Add a sidebar grouping utility (with a temporary SIDEBAR_GROUPS-based fallback) and wire it into the SideBar UI.
• Add a global CSS override to adjust the version select min-width.

Reviewed changes

Copilot reviewed 7 out of 8 changed files in this pull request and generated 5 comments.

Show a summary per file

File	Description
src/generators/web/utils/config.mjs	Emits pages tuples with an added optional category value.
src/generators/web/utils/tests/config.test.mjs	Updates tests/fixtures to validate the new pages tuple shape.
src/generators/web/ui/utils/sidebar.mjs	New grouping logic (category + fallback mapping) for sidebar navigation.
src/generators/web/ui/utils/tests/sidebar.test.mjs	Adds unit tests for sidebar grouping behavior.
src/generators/web/ui/types.d.ts	Updates #theme/config typings for the new pages tuple.
src/generators/web/ui/index.css	Adds global CSS override for the select combobox min-width.
src/generators/web/ui/components/SideBar/index.jsx	Uses grouped sidebar data and switches the version select away from the inline variant.
src/generators/web/constants.mjs	Adds temporary static SIDEBAR_GROUPS definition for Node.js docs grouping fallback.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[ovflowd]

We shouldn't hard code groups at all. Simply, add the logic for supporting frontmatter, accept that after this gets merged it won't work, but then upstream changes on nodejs/node to then add the proper groups to each file.

[avivkeller]

Hypothetically, as noted in #747, if we allow (as that PR does) users to add custom config options, which are passed to #theme/config, the config file can define a sidebar config, importable via import { sidebar } from `#theme/config`

[cursor]

PR Summary

Medium Risk
Updates the #theme/config contract for pages and changes sidebar grouping/ordering behavior, which can break custom sidebar overrides and affect navigation rendering.

Overview
Improves the web docs sidebar by grouping page links by category and generating navigation groups at runtime (buildSideBarGroups), with uncategorized pages collected into an "Others" group and index.html entries omitted.

Changes the generated #theme/config pages export from [name, path] to [weight, { heading, path, category? }], adds weight parsing/sorting (explicit weight first, ascending), and updates docs/types/tests accordingly. Also tweaks sidebar version selector styling and refactors version-compatibility/link logic into shared utilities with unit tests.

^{Reviewed by Cursor Bugbot for commit b2612f4. Bugbot is set up for automated code reviews on this repo. Configure here.}