feat(doc-kit): bump version, use virtualImports

.prettierignore

@@ -0,0 +1,6 @@
+# Gitignored
+node_modules
+out
+
+# The template uses intentional syntax (e.g. `{replaced_value}`)
+template.html

components/Footer/index.jsx

@@ -1,7 +1,10 @@
 import Footer from '@node-core/ui-components/Containers/Footer';
 import NavItem from '@node-core/ui-components/Containers/NavBar/NavItem';
 
-import { socialLinks, footerLinks } from './footer.json';
+import {
+  socialLinks,
+  footerLinks,
+} from '#site/navigation.json' with { type: 'json' };
 
 // The Node.js Project is legally obligated to include the following text.
 // It should not be modified unless explicitly requested by OpenJS staff.

components/Navigation/index.jsx

@@ -5,7 +5,7 @@ import GitHubIcon from '@node-core/ui-components/Icons/Social/GitHub';
 
 import SearchBox from '@node-core/doc-kit/src/generators/web/ui/components/SearchBox';
 import { useTheme } from '@node-core/doc-kit/src/generators/web/ui/hooks/useTheme.mjs';
-
+import { topNavigation } from '#site/navigation.json' with { type: 'json' };
 import Logo from '#theme/Logo';
 
 /**
@@ -18,23 +18,11 @@ export default ({ metadata }) => {
     <NavBar
       Logo={Logo}
       sidebarItemTogglerAriaLabel="Toggle navigation menu"
-      navItems={[
-        { link: '/learn', text: 'Learn' },
-        { link: '/about', text: 'About' },
-        { link: '/download', text: 'Download' },
-        { link: '/blog', text: 'Blog' },
-        { link: 'https://nodejs.org/docs/latest/api/', text: 'Docs' },
-        {
-          link: 'https://github.com/nodejs/node/blob/main/CONTRIBUTING.md',
-          text: 'Contribute',
-          target: '_blank',
-        },
-        {
-          link: 'https://training.linuxfoundation.org/openjs/',
-          text: 'Courses',
-          target: '_blank',
-        },
-      ]}
+      navItems={Object.values(topNavigation).map(({ link, label, target }) => ({
+        link,
+        text: label,
+        target,
+      }))}
     >
       <SearchBox pathname={metadata.path} />
       <ThemeToggle

components/Sidebar/index.jsx

@@ -1,27 +1,5 @@
 import SideBar from '@node-core/ui-components/Containers/Sidebar';
-import { relative } from '@node-core/doc-kit/src/utils/url.mjs';
-import { pages } from '#theme/config';
-
-/** @type {Array<[string, string]>} */
-const categories = [
-  ['getting-started', 'Getting Started'],
-  ['command-line', 'Command Line'],
-  ['http', 'HTTP'],
-  ['manipulating-files', 'Manipulating Files'],
-  ['asynchronous-work', 'Asynchronous Work'],
-  ['typescript', 'TypeScript'],
-  ['modules', 'Modules'],
-  ['diagnostics', 'Diagnostics'],
-  ['test-runner', 'Test Runner'],
-];
-
-/** @type {Map<string, Array<{ heading: string, path: string }>>} */
-const byDir = new Map();
-for (const [heading, path] of pages) {
-  const dir = path.split('/')[1];
-  if (!byDir.has(dir)) byDir.set(dir, []);
-  byDir.get(dir).push({ heading, path });
-}
+import sidebarGroups from '#learn/navigation.json' with { type: 'json' };
 
 /** @param {string} url */
 const redirect = url => (window.location.href = url);
@@ -31,26 +9,12 @@ const PrefetchLink = props => <a {...props} rel="prefetch" />;
 /**
  * Sidebar component for MDX documentation with page navigation
  */
-export default ({ metadata }) => {
-  const { path: currentPath, basename } = metadata;
-  const pathname = `${basename}.html`;
-
-  const groups = categories.map(([dir, title]) => ({
-    groupName: title,
-    items: byDir.get(dir).map(({ heading, path }) => ({
-      label: heading,
-      link:
-        currentPath === path ? pathname : `${relative(path, currentPath)}.html`,
-    })),
-  }));
-
-  return (
-    <SideBar
-      pathname={pathname}
-      groups={groups}
-      onSelect={redirect}
-      as={PrefetchLink}
-      title="Navigation"
-    />
-  );
-};
+export default ({ metadata }) => (
+  <SideBar
+    pathname={`/learn${metadata.path}`}
+    groups={sidebarGroups}
+    onSelect={redirect}
+    as={PrefetchLink}
+    title="Navigation"
+  />
+);

doc-kit.config.mjs

@@ -1,5 +1,7 @@
 import web from '@node-core/doc-kit/src/generators/web/index.mjs';
 import { join } from 'node:path';
+import { populateI18n, createGroupings } from './utils/index.mjs';
+import sidebarGroups from './navigation.json' with { type: 'json' };
 
 /** @type {import('@node-core/doc-kit/src/utils/configuration/types.d.ts').Configuration} */
 export default {
@@ -8,12 +10,28 @@ export default {
     input: ['pages/**/*.md'],
   },
   web: {
-    title: '',
+    // Important Configuration
+    project: 'Node.js',
+    title: '{project} Learn',
     pageURL: 'https://nodejs.org/learn{path}.html',
     editURL: 'https://github.com/nodejs/learn/edit/main/pages{path}.md',
+
+    // Imports
     imports: {
       ...web.defaultConfiguration.imports,
       '#theme/Layout': join(import.meta.dirname, 'components/Layout/index.jsx'),
     },
+    virtualImports: {
+      '#site/navigation.json': JSON.stringify(
+        populateI18n(
+          await fetch(
+            'https://raw.githubusercontent.com/nodejs/nodejs.org/refs/heads/main/apps/site/navigation.json'
+          ).then(r => r.json())
+        )
+      ),
+      '#learn/navigation.json': JSON.stringify(
+        await createGroupings(sidebarGroups)
+      ),
+    },
   },
 };

navigation.json

@@ -0,0 +1,104 @@
+[
+  [
+    "Getting Started",
+    [
+      "/getting-started/introduction-to-nodejs.md",
+      "/getting-started/how-much-javascript-do-you-need-to-know-to-use-nodejs.md",
+      "/getting-started/differences-between-nodejs-and-the-browser.md",
+      "/getting-started/the-v8-javascript-engine.md",
+      "/getting-started/an-introduction-to-the-npm-package-manager.md",
+      "/getting-started/ecmascript-2015-es6-and-beyond.md",
+      "/getting-started/debugging.md",
+      "/getting-started/fetch.md",
+      "/getting-started/websocket.md",
+      "/getting-started/nodejs-the-difference-between-development-and-production.md",
+      "/getting-started/profiling.md",
+      "/getting-started/nodejs-with-webassembly.md",
+      "/getting-started/security-best-practices.md",
+      "/getting-started/userland-migrations.md"
+    ]
+  ],
+  [
+    "Command Line",
+    [
+      "/command-line/run-nodejs-scripts-from-the-command-line.md",
+      "/command-line/how-to-use-the-nodejs-repl.md",
+      "/command-line/output-to-the-command-line-using-nodejs.md",
+      "/command-line/accept-input-from-the-command-line-in-nodejs.md",
+      "/command-line/how-to-read-environment-variables-from-nodejs.md"
+    ]
+  ],
+  [
+    "HTTP",
+    [
+      "/http/anatomy-of-an-http-transaction.md",
+      "/http/enterprise-network-configuration.md"
+    ]
+  ],
+  [
+    "Manipulating Files",
+    [
+      "/manipulating-files/nodejs-file-stats.md",
+      "/manipulating-files/nodejs-file-paths.md",
+      "/manipulating-files/reading-files-with-nodejs.md",
+      "/manipulating-files/writing-files-with-nodejs.md",
+      "/manipulating-files/working-with-file-descriptors-in-nodejs.md",
+      "/manipulating-files/working-with-folders-in-nodejs.md",
+      "/manipulating-files/working-with-different-filesystems.md"
+    ]
+  ],
+  [
+    "Asynchronous Work",
+    [
+      "/asynchronous-work/javascript-asynchronous-programming-and-callbacks.md",
+      "/asynchronous-work/asynchronous-flow-control.md",
+      "/asynchronous-work/discover-promises-in-nodejs.md",
+      "/asynchronous-work/discover-javascript-timers.md",
+      "/asynchronous-work/overview-of-blocking-vs-non-blocking.md",
+      "/asynchronous-work/event-loop-timers-and-nexttick.md",
+      "/asynchronous-work/the-nodejs-event-emitter.md",
+      "/asynchronous-work/understanding-processnexttick.md",
+      "/asynchronous-work/understanding-setimmediate.md",
+      "/asynchronous-work/dont-block-the-event-loop.md"
+    ]
+  ],
+  [
+    "TypeScript",
+    [
+      "/typescript/introduction.md",
+      "/typescript/run-natively.md",
+      "/typescript/transpile.md",
+      "/typescript/run.md",
+      "/typescript/publishing-a-ts-package.md"
+    ]
+  ],
+  [
+    "Modules",
+    [
+      "/modules/how-to-use-streams.md",
+      "/modules/backpressuring-in-streams.md",
+      "/modules/publishing-a-package.md",
+      "/modules/publishing-node-api-modules.md",
+      "/modules/abi-stability.md"
+    ]
+  ],
+  [
+    "Diagnostics",
+    [
+      "/diagnostics/user-journey.md",
+      "/diagnostics/memory/index.md",
+      "/diagnostics/live-debugging/index.md",
+      "/diagnostics/poor-performance/index.md",
+      "/diagnostics/flame-graphs.md"
+    ]
+  ],
+  [
+    "Test Runner",
+    [
+      "/test-runner/introduction.md",
+      "/test-runner/using-test-runner.md",
+      "/test-runner/mocking.md",
+      "/test-runner/collecting-code-coverage.md"
+    ]
+  ]
+]

package.json

@@ -9,7 +9,7 @@
   },
   "devDependencies": {
     "@eslint/js": "^10.0.1",
-    "@node-core/doc-kit": "1.3.1",
+    "@node-core/doc-kit": "1.3.2",
     "@node-core/remark-lint": "^1.3.0",
     "eslint": "^10.1.0",
     "eslint-plugin-mdx": "^3.7.0",