docs: Update docusaurus to v3

docsite/docusaurus.config.ts

@@ -1,11 +1,9 @@
-// @ts-check
-// Note: type annotations allow type checking and IDEs autocompletion
+import type * as Preset from '@docusaurus/preset-classic';
+import type { Config } from '@docusaurus/types';
+import * as themes from 'prism-react-renderer';
+//import sidebars from './sidebars';
 
-const lightCodeTheme = require('prism-react-renderer/themes/github');
-const darkCodeTheme = require('prism-react-renderer/themes/dracula');
-
-/** @type {import('@docusaurus/types').Config} */
-const config = {
+const config: Config = {
   title: 'Multi-Scrobbler',
   tagline: 'Scrobble all the things',
   favicon: 'img/favicon.ico',
@@ -38,10 +36,9 @@ const config = {
   presets: [
     [
       'classic',
-      /** @type {import('@docusaurus/preset-classic').Options} */
-      ({
+      {
         docs: {
-          sidebarPath: require.resolve('./sidebars.js'),
+          sidebarPath: './sidebars.ts',
           // Please change this to your repo.
           // Remove this to remove the "edit this page" links.
           editUrl:
@@ -57,23 +54,32 @@ const config = {
         blog: false,
 
         theme: {
-          customCss: require.resolve('./src/css/custom.css'),
+          customCss: './src/css/custom.css',
         },
-      }),
+      } satisfies Preset.Options,
     ],
   ],
-  themes: ["docusaurus-json-schema-plugin"],
-  plugins: [
+  themes: [
+      "docusaurus-json-schema-plugin",
     [
-      require.resolve("@cmfcmf/docusaurus-search-local"),
+      "@easyops-cn/docusaurus-search-local",
+      /** @type {import("@easyops-cn/docusaurus-search-local").PluginOptions} */
       {
+        // ... Your options.
+        // `hashed` is recommended as long-term-cache of index file is possible.
+        hashed: true,
         indexBlog: false,
+        // For Docs using Chinese, The `language` is recommended to set to:
+        // ```
+        // language: ["en", "zh"],
+        // ```
       },
     ],
   ],
+  plugins: [
+  ],
   themeConfig:
-    /** @type {import('@docusaurus/preset-classic').ThemeConfig} */
-    ({
+    {
       // Replace with your project's social card
       image: 'img/docusaurus-social-card.jpg',
       navbar: {
@@ -151,10 +157,10 @@ const config = {
         copyright: `Copyright © ${new Date().getFullYear()} Multi-Scrobbler. Built with Docusaurus.`,
       },
       prism: {
-        theme: lightCodeTheme,
-        darkTheme: darkCodeTheme,
+        theme: themes.themes.github,
+        darkTheme: themes.themes.dracula,
       },
-    }),
+    } satisfies Preset.ThemeConfig,
 };
 
 if (process.env.ANALYTICS !== undefined && process.env.ANALYTICS !== '') {
@@ -167,4 +173,4 @@ if (process.env.ANALYTICS !== undefined && process.env.ANALYTICS !== '') {
   config.scripts.push(script)
 }
 
-module.exports = config;
+export default config;

docsite/package.json

@@ -15,20 +15,22 @@
     "typecheck": "tsc"
   },
   "dependencies": {
-    "@cmfcmf/docusaurus-search-local": "^1.1.0",
-    "@docusaurus/core": "2.4.1",
-    "@docusaurus/preset-classic": "2.4.1",
-    "@mdx-js/react": "^1.6.22",
-    "clsx": "^1.2.1",
-    "docusaurus-json-schema-plugin": "^1.6.1",
-    "prism-react-renderer": "^1.3.5",
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2"
+    "@docusaurus/core": "^3.4.0",
+    "@docusaurus/preset-classic": "^3.4.0",
+    "@easyops-cn/docusaurus-search-local": "^0.44.3",
+    "@mdx-js/react": "^3.0.0",
+    "clsx": "^2.0.0",
+    "docusaurus-json-schema-plugin": "^1.12.1",
+    "prism-react-renderer": "^2.3.0",
+    "react": "^18.0.0",
+    "react-dom": "^18.0.0"
   },
   "devDependencies": {
-    "@docusaurus/module-type-aliases": "2.4.1",
-    "@tsconfig/docusaurus": "^1.0.5",
-    "typescript": "^4.7.4"
+    "@docusaurus/module-type-aliases": "^3.4.0",
+    "@docusaurus/tsconfig": "^3.4.0",
+    "@docusaurus/types": "^3.4.0",
+    "@types/react": "^18.2.29",
+    "typescript": "~5.2.2"
   },
   "browserslist": {
     "production": [
@@ -37,12 +39,12 @@
       "not op_mini all"
     ],
     "development": [
-      "last 1 chrome version",
-      "last 1 firefox version",
-      "last 1 safari version"
+      "last 3 chrome version",
+      "last 3 firefox version",
+      "last 5 safari version"
     ]
   },
   "engines": {
-    "node": ">=16.14"
+    "node": ">=18.0"
   }
 }

docsite/sidebars.ts

@@ -1,3 +1,5 @@
+import type { SidebarsConfig } from '@docusaurus/plugin-content-docs';
+
 /**
  * Creating a sidebar enables you to:
  - create an ordered group of docs
@@ -9,10 +11,7 @@
  Create as many sidebars as you want.
  */
 
-// @ts-check
-
-/** @type {import('@docusaurus/plugin-content-docs').SidebarsConfig} */
-const sidebars = {
+const sidebars: SidebarsConfig = {
   // By default, Docusaurus generates a sidebar from the docs folder structure
   tutorialSidebar: [
       {type: 'autogenerated', dirName: '.'},
@@ -37,4 +36,4 @@ const sidebars = {
    */
 };
 
-module.exports = sidebars;
+export default sidebars;

docsite/src/pages/playground.tsx

@@ -17,7 +17,9 @@ function PlaygroundComponent(): JSX.Element {
         >
             <BrowserOnly fallback={<div>Loading...</div>}>
                 {() => {
+                    // required to keep SSR from trying to render monaco/etc...
                     const PlaygroundInnerComponent =
+                        // eslint-disable-next-line @typescript-eslint/no-var-requires
                         require("@site/src/components/PlaygroundInner").default
                     return <PlaygroundInnerComponent />
                 }}

docsite/tsconfig.json

@@ -1,6 +1,6 @@
 {
   // This file is not used in compilation. It is here just for a nice editor experience.
-  "extends": "@tsconfig/docusaurus/tsconfig.json",
+  "extends": "@docusaurus/tsconfig",
   "compilerOptions": {
     "baseUrl": ".",
     "resolveJsonModule": true,