build: docusaurus 3.5 upgrade (#622)

docusaurus.config.ts

@@ -230,6 +230,8 @@ const config: Config = {
           blogSidebarTitle: 'Latest posts',
           blogTitle: `Electron's blog`,
           blogDescription: `Keep up to date with what's going on with the Electron project`,
+          onInlineAuthors: 'ignore',
+          onUntruncatedBlogPosts: 'ignore',
         },
         theme: {
           customCss: [require.resolve('./src/css/custom.scss')],

package.json

@@ -27,16 +27,14 @@
     "lint": "npx tsc --noEmit && prettier . --check && npm run lint:eslint && npm run lint:markdown",
     "lint:fix": "prettier . --write && npm run lint:eslint --fix && npm run lint:markdown --fix",
     "pre-build": "npx tsx ./scripts/pre-build.ts",
-    "prepare": "husky install",
-    "heroku-cleanup": "npx patch-package",
-    "postinstall": "patch-package"
+    "prepare": "husky install"
   },
   "dependencies": {
-    "@docusaurus/core": "3.4.0",
-    "@docusaurus/plugin-google-analytics": "3.4.0",
-    "@docusaurus/preset-classic": "3.4.0",
-    "@docusaurus/remark-plugin-npm2yarn": "3.4.0",
-    "@docusaurus/theme-mermaid": "3.4.0",
+    "@docusaurus/core": "3.5.1",
+    "@docusaurus/plugin-google-analytics": "3.5.1",
+    "@docusaurus/preset-classic": "3.5.1",
+    "@docusaurus/remark-plugin-npm2yarn": "3.5.1",
+    "@docusaurus/theme-mermaid": "3.5.1",
     "@electron/fiddle-core": "^1.3.3",
     "@mdx-js/react": "^3.0.0",
     "adm-zip": "^0.5.14",
@@ -55,9 +53,9 @@
   "devDependencies": {
     "@crowdin/cli": "^3.9.3",
     "@crowdin/crowdin-api-client": "^1.21.1",
-    "@docusaurus/module-type-aliases": "3.4.0",
-    "@docusaurus/tsconfig": "3.4.0",
-    "@docusaurus/types": "3.4.0",
+    "@docusaurus/module-type-aliases": "3.5.1",
+    "@docusaurus/tsconfig": "3.5.1",
+    "@docusaurus/types": "3.5.1",
     "@electron/docs-parser": "^1.0.1",
     "@electron/lint-roller": "^2.3.0",
     "@tsconfig/docusaurus": "^2.0.3",
@@ -93,9 +91,8 @@
     "markdownlint-cli2": "^0.13.0",
     "mdast-util-from-markdown": "^2.0.1",
     "mdast-util-frontmatter": "^2.0.1",
+    "mdast-util-mdx": "^3.0.0",
     "mdast-util-to-string": "^2.0.0",
-    "patch-package": "^8.0.0",
-    "postinstall-postinstall": "^2.1.0",
     "prettier": "^2.8.0",
     "remark": "^15.0.0",
     "remark-gfm": "^4.0.0",

src/theme/DocSidebarItem/Link/index.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import clsx from 'clsx';
 import { ThemeClassNames } from '@docusaurus/theme-common';
-import { isActiveSidebarItem } from '@docusaurus/theme-common/internal';
+import { isActiveSidebarItem } from '@docusaurus/plugin-content-docs/client';
 import Link from '@docusaurus/Link';
 import isInternalUrl from '@docusaurus/isInternalUrl';
 import IconExternalLink from '@theme/Icon/ExternalLink';

src/theme/README.md

@@ -11,15 +11,6 @@ guide in the Docusaurus documentation.
 
 ## List of Swizzled components
 
-### `BlogSidebar` (unsafe)
-
-To enhance the functionality of our blog sidebar, we [patched Docusaurus](https://github.com/electron/website/pull/587/files#diff-e196318ff66c78116a07aaa92f5eb7191cf888f36bd942e609a12ff75167f9ed)
-to extract the publication date of each blog post from its YAML frontmatter
-in the sidebar prop passed to `BlogSidebar` component. Utilizing this
-date, we can then group the posts by year, in both desktop and mobile.
-This improves the navigational experience for users by making it easier
-for them to find content from specific years.
-
 ### `DocSidebarItem` (unsafe)
 
 Electron has a lot of platform-specific APIs, and guides to go along with them.

src/transformers/api-structure-previews.ts

@@ -7,6 +7,7 @@ import type { InlineCode, Link, LinkReference, Nodes, Text } from 'mdast';
 import { gfmTableToMarkdown } from 'mdast-util-gfm-table';
 import { frontmatterToMarkdown } from 'mdast-util-frontmatter';
 import { toMarkdown } from 'mdast-util-to-markdown';
+import { mdxToMarkdown } from 'mdast-util-mdx';
 import { MdxJsxFlowElement } from 'mdast-util-mdx-jsx';
 import type { VFile } from 'vfile';
 import {
@@ -63,7 +64,11 @@ async function transformer(tree: Parent, file: VFile) {
     // It's not ideal to go from the parsed Markdown back to text
     // just to be parsed again to be rendered, but it is what it is
     const content = toMarkdown(tree as Nodes, {
-      extensions: [gfmTableToMarkdown(), frontmatterToMarkdown(['yaml'])],
+      extensions: [
+        gfmTableToMarkdown(),
+        frontmatterToMarkdown(['yaml']),
+        mdxToMarkdown(),
+      ],
     });
 
     // Put the node back, because we need it