Other upgrades for docusaurus v3 (#315)

* update other dependencies

* update docs and configs

* upgrade yarn

* exact node version

* ts fix

* disable env

.github/workflows/build.yml

@@ -10,10 +10,6 @@ concurrency:
   group: ${{ github.workflow }}-${{ github.ref }}
   cancel-in-progress: true
 
-env:
-  YARN_COMPRESSION_LEVEL: 0
-  YARN_ENABLE_GLOBAL_CACHE: true
-
 jobs:
   build-and-deploy:
     runs-on: ubuntu-latest
@@ -25,7 +21,7 @@ jobs:
 
       - uses: actions/setup-node@v3
         with:
-          node-version: '18'
+          node-version: '18.17.1'
           cache: 'yarn'
 
       - name: Install Dependencies 📦
@@ -60,7 +56,7 @@ jobs:
 
       - uses: actions/setup-node@v3
         with:
-          node-version: '18'
+          node-version: '18.17.1'
           cache: 'yarn'
           registry-url: 'https://registry.npmjs.org'
 

.github/workflows/e2e.yml

@@ -11,8 +11,6 @@ concurrency:
   cancel-in-progress: true
 
 env:
-  YARN_COMPRESSION_LEVEL: 0
-  YARN_ENABLE_GLOBAL_CACHE: true
   PERCY_POSTINSTALL_BROWSER: true
 
 jobs:
@@ -25,7 +23,7 @@ jobs:
 
       - uses: actions/setup-node@v3
         with:
-          node-version: '18'
+          node-version: '18.17.1'
           cache: 'yarn'
 
       - name: Install Dependencies 📦

.github/workflows/version.yml

@@ -9,10 +9,6 @@ concurrency:
   group: ${{ github.workflow }}-${{ github.ref }}
   cancel-in-progress: false
 
-env:
-  YARN_COMPRESSION_LEVEL: 0
-  YARN_ENABLE_GLOBAL_CACHE: true
-
 jobs:
   publish:
     name: Publish
@@ -26,7 +22,7 @@ jobs:
 
       - uses: actions/setup-node@v3
         with:
-          node-version: '18'
+          node-version: '18.17.1'
           cache: 'yarn'
           registry-url: https://registry.npmjs.org/
 
@@ -57,7 +53,7 @@ jobs:
 
       - uses: actions/setup-node@v3
         with:
-          node-version: '18'
+          node-version: '18.17.1'
           cache: 'yarn'
           registry-url: https://registry.npmjs.org/
 

.nvmrc

@@ -0,0 +1 @@
+18.17.1

.vscode/settings.json

@@ -38,5 +38,6 @@
   "editor.tabCompletion": "on",
   "editor.tabSize": 2,
   "editor.rulers": [80, 120],
-  "typescript.tsdk": "node_modules/typescript/lib"
+  "typescript.tsdk": "node_modules/typescript/lib",
+  "cSpell.words": ["Redoc", "redocusaurus"]
 }

.yarnrc.yml

@@ -1,11 +1,5 @@
-nodeLinker: node-modules
+compressionLevel: mixed
 
-plugins:
-  - path: .yarn/plugins/@yarnpkg/plugin-workspace-tools.cjs
-    spec: "@yarnpkg/plugin-workspace-tools"
-  - path: .yarn/plugins/@yarnpkg/plugin-typescript.cjs
-    spec: "@yarnpkg/plugin-typescript"
-  - path: .yarn/plugins/@yarnpkg/plugin-interactive-tools.cjs
-    spec: "@yarnpkg/plugin-interactive-tools"
+nodeLinker: node-modules
 
-yarnPath: .yarn/releases/yarn-3.4.1.cjs
+yarnPath: .yarn/releases/yarn-4.0.1.cjs

package.json

@@ -4,11 +4,11 @@
   "description": "Redoc for DocusaurusV2",
   "scripts": {
     "build": "yarn build:packages && yarn build:website",
-    "build:packages": "yarn workspaces foreach --exclude redocusaurus-website --exclude redocusaurus-monorepo -tpv run build",
+    "build:packages": "yarn workspaces foreach --from redocusaurus -tpvR run build",
     "build:website": "yarn workspace redocusaurus exec 'echo \\\"$npm_package_version\\\" > $PROJECT_CWD/website/version.json' && yarn workspace redocusaurus-website run build",
-    "clean": "yarn workspaces foreach --exclude redocusaurus-monorepo -Atv exec \"rm -rf build .docusaurus dist dist-jsx .tsbuild.info .tsbuild.jsx.info\"",
-    "dev": "yarn build:packages && yarn workspaces foreach --exclude redocusaurus-monorepo -piv run dev",
-    "dev:packages": "yarn workspaces foreach --exclude redocusaurus-website --exclude redocusaurus-monorepo -piv run dev",
+    "clean": "yarn workspaces foreach --all --exclude redocusaurus-monorepo -AtvR exec \"rm -rf build .docusaurus dist dist-jsx .tsbuild.info .tsbuild.jsx.info\"",
+    "dev": "yarn build:packages && yarn workspaces foreach --from redocusaurus-website -pivR run dev",
+    "dev:packages": "yarn workspaces foreach --from redocusaurus -pivR run dev",
     "dev:website": "yarn workspace redocusaurus-website run dev",
     "lint": "eslint . --ext .js,.jsx,.ts,.tsx",
     "lint:fix": "yarn lint --fix",
@@ -38,25 +38,25 @@
   "homepage": "https://github.com/rohit-gohri/redocusaurus#readme",
   "devDependencies": {
     "@changesets/changelog-github": "^0.4.8",
-    "@changesets/cli": "^2.26.0",
-    "@typescript-eslint/eslint-plugin": "^5.51.0",
-    "@typescript-eslint/parser": "^5.51.0",
+    "@changesets/cli": "^2.26.2",
+    "@typescript-eslint/eslint-plugin": "^6.9.1",
+    "@typescript-eslint/parser": "^6.9.1",
     "concurrently": "^7.6.0",
-    "eslint": "^8.33.0",
-    "eslint-config-airbnb-typescript": "^17.0.0",
-    "eslint-config-prettier": "^8.6.0",
-    "eslint-plugin-import": "^2.27.5",
-    "eslint-plugin-jsx-a11y": "^6.7.1",
-    "eslint-plugin-prettier": "^4.2.1",
-    "eslint-plugin-react": "^7.32.2",
+    "eslint": "^8.53.0",
+    "eslint-config-airbnb-typescript": "^17.1.0",
+    "eslint-config-prettier": "^9.0.0",
+    "eslint-plugin-import": "^2.29.0",
+    "eslint-plugin-jsx-a11y": "^6.8.0",
+    "eslint-plugin-prettier": "^5.0.1",
+    "eslint-plugin-react": "^7.33.2",
     "eslint-plugin-react-hooks": "^4.6.0",
     "husky": "^8.0.3",
     "lint-staged": "^13.1.1",
-    "prettier": "2.5.1",
-    "typescript": "^4.9.5"
+    "prettier": "3.0.3",
+    "typescript": "^5.2.2"
   },
   "engines": {
-    "node": ">=14"
+    "node": ">=18"
   },
   "workspaces": {
     "packages": [
@@ -79,5 +79,5 @@
     "printWidth": 80,
     "tabWidth": 2
   },
-  "packageManager": "yarn@3.4.1"
+  "packageManager": "yarn@4.0.1"
 }

packages/docusaurus-plugin-redoc/package.json

@@ -34,12 +34,19 @@
   },
   "devDependencies": {
     "@docusaurus/types": "^3.0.0",
-    "@docusaurus/utils": "^3.0.0"
+    "@docusaurus/utils": "^3.0.0",
+    "core-js": "^3.33.2",
+    "mobx": "^6.10.2",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-is": "^18.2.0",
+    "styled-components": "^6.1.0",
+    "typescript": "^5.2.2"
   },
   "peerDependencies": {
     "@docusaurus/utils": "^3.0.0"
   },
   "engines": {
-    "node": ">=14"
+    "node": ">=18"
   }
 }

packages/docusaurus-theme-redoc/package.json

@@ -36,27 +36,32 @@
     "clsx": "^1.2.1",
     "copyfiles": "^2.4.1",
     "lodash": "^4.17.21",
-    "mobx": "^6.8.0",
+    "mobx": "^6.10.2",
     "redoc": "2.1.3",
-    "styled-components": "^5.3.6"
+    "styled-components": "^6.1.0"
   },
   "devDependencies": {
     "@docusaurus/module-type-aliases": "^3.0.0",
     "@docusaurus/theme-classic": "^3.0.0",
     "@docusaurus/theme-common": "^3.0.0",
     "@docusaurus/types": "^3.0.0",
-    "@types/lodash": "^4.14.191",
+    "@types/lodash": "^4.14.200",
     "@types/react": "^18.2.34",
     "@types/react-dom": "^18.2.14",
+    "@types/react-is": "^18.2.3",
     "@types/react-router-dom": "^5.3.3",
-    "@types/styled-components": "^5.1.26",
+    "@types/styled-components": "^5.1.29",
+    "core-js": "^3.33.2",
     "nodemon": "^2.0.20",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-is": "^18.2.0",
     "typescript": "^5.2.2"
   },
   "peerDependencies": {
     "@docusaurus/theme-common": "^3.0.0"
   },
   "engines": {
-    "node": ">=14"
+    "node": ">=18"
   }
 }

packages/redocusaurus/package.json

@@ -50,5 +50,8 @@
   },
   "engines": {
     "node": ">=14"
+  },
+  "devDependencies": {
+    "typescript": "^5.2.2"
   }
 }

tsconfig.json

@@ -23,7 +23,6 @@
     "**/*.json",
     "**/dist/**/*",
     "**/dist-jsx/**/*",
-    "website/babel.config.js",
-    "website/docusaurus.config.js"
+    "website/babel.config.js"
   ]
 }

website/docs/getting-started/plugin-options.md

@@ -24,7 +24,7 @@ An object to pass as layout props. Useful to set title/description of the page.
 
 ### config (optional)
 
-:::caution
+:::warning
 Deprecated: Use `redocly.yaml` to specify theme. See [example](https://github.com/rohit-gohri/redocusaurus/blob/main/website/redocly.yaml).
 :::
 

website/docs/getting-started/theme-options.md

@@ -17,19 +17,19 @@ This value will be used as `colors.primary.main` in the `themes` option. Must be
 
 ### theme (optional, object)
 
-:::caution
+:::warning
 Deprecated: Use `redocly.yaml` to specify theme. See [example](https://github.com/rohit-gohri/redocusaurus/blob/main/website/redocly.yaml).
 :::
 
 Override the redoc theme object passed to Redoc. See the defaults [here](https://github.com/Redocly/redoc#redoc-theme-object).
 
-:::caution
+:::warning
 Note: You should not override any color using this property, as it will be the same value for dark and light themes.
 :::
 
 ### options (optional, object)
 
-:::caution
+:::warning
 Deprecated: Use `redocly.yaml` to specify `theme.options`. See [example](https://github.com/rohit-gohri/redocusaurus/blob/main/website/redocly.yaml).
 :::
 

website/docs/guides/build-time-rendering.md

@@ -4,7 +4,7 @@ description: Parse the OpenAPI schema at build time and skip the loading screen
 sidebar_position: 3
 ---
 
-:::caution
+:::warning
 **NOTE:** This is now enabled by default for everyone. Please [add your feedback here](https://github.com/rohit-gohri/redocusaurus/discussions/88).
 :::
 

website/docs/guides/schema-imports.mdx

@@ -5,6 +5,8 @@ sidebar_position: 1
 
 import ApiSchema from '@theme/ApiSchema';
 
+# Schema Imports
+
 You can import model definitions from your API schema and render them in your Docusaurus Docs. You'll need to create an `.mdx` file and import the React Component. Read more [here about MDX in Docusaurus](https://docusaurus.io/docs/markdown-features/react).
 
 # Import Schema Model in Docs

website/docusaurus.config.js → website/docusaurus.config.ts

@@ -1,9 +1,9 @@
-const  path = require('path');
+import path from 'path';
+import type { Config } from '@docusaurus/types';
+import type * as Preset from '@docusaurus/preset-classic';
+import type { PresetEntry } from 'redocusaurus';
 
-/**
- * @type {import('redocusaurus').PresetEntry}
- */
-const redocusaurus = [
+const redocusaurus: PresetEntry = [
   'redocusaurus',
   {
     debug: Boolean(process.env.DEBUG || process.env.CI),
@@ -54,36 +54,33 @@ if (process.env.VERCEL_URL) {
   process.env.DEPLOY_PRIME_URL = `https://${process.env.VERCEL_URL}`;
 }
 
-/**
- * @type {Partial<import('@docusaurus/types').DocusaurusConfig>}
- */
-const config = {
+const config: Config = {
+  title: 'Redocusaurus',
+  tagline: 'OpenAPI solution for Docusaurus docs with Redoc',
+  customFields: {
+    meta: {
+      description: 'Integrate Redoc easily into your Docusaurus Site',
+    },
+  },
+  url: process.env.DEPLOY_PRIME_URL || 'http://localhost:5000', // Your website URL
+  baseUrl: process.env.DEPLOY_BASE_URL || '/', // Base URL for your project */
+  favicon: 'img/favicon.ico',
   presets: [
-    /** ************ Your other presets' config  *********** */
     [
       '@docusaurus/preset-classic',
       {
         debug: Boolean(process.env.DEBUG || process.env.CI),
         theme: { customCss: [require.resolve('./src/custom.css')] },
         docs: {
           routeBasePath: '/docs',
-          editUrl: 'https://github.com/rohit-gohri/redocusaurus/edit/main/website/',
+          editUrl:
+            'https://github.com/rohit-gohri/redocusaurus/edit/main/website/',
         },
-      },  
+      } satisfies Preset.Options,
     ],
     // Redocusaurus Config
     redocusaurus,
   ],
-  title: 'Redocusaurus',
-  tagline: 'OpenAPI solution for Docusaurus docs with Redoc',
-  customFields: {
-    meta: {
-      description: 'Integrate Redoc easily into your Docusaurus Site',
-    },
-  },
-  url: process.env.DEPLOY_PRIME_URL || 'http://localhost:5000', // Your website URL
-  baseUrl: process.env.DEPLOY_BASE_URL || '/', // Base URL for your project */
-  favicon: 'img/favicon.ico',
   themeConfig: {
     navbar: {
       title: 'Redocusaurus',
@@ -197,7 +194,7 @@ const config = {
       ],
       copyright: `Copyright © ${new Date().getFullYear()} <a href="https://rohit.page" target="_blank" rel="noopener noreferrer">Rohit Gohri</a>. Built with <a href="https://github.com/facebook/docusaurus" target="_blank" rel="noopener noreferrer">Docusaurus</a>`,
     },
-  },
+  } satisfies Preset.ThemeConfig,
 };
 
-module.exports = config;
+export default config;

website/package.json

@@ -24,14 +24,16 @@
   "dependencies": {
     "@docusaurus/core": "^3.0.0",
     "@docusaurus/preset-classic": "^3.0.0",
+    "@docusaurus/theme-common": "^3.0.0",
+    "@docusaurus/utils": "^3.0.0",
     "clsx": "^1.2.1",
-    "react": "^18.0.0",
-    "react-dom": "^18.0.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
     "redocusaurus": "^1.6.4"
   },
   "devDependencies": {
-    "@percy/cli": "^1.18.0",
-    "@types/react": "^18.0.0"
+    "@percy/cli": "^1.27.4",
+    "@types/react": "^18.2.34"
   },
   "browserslist": {
     "production": [

website/src/pages/index.jsx

@@ -32,10 +32,7 @@ const sections = [
     description: (
       <>
         Support for
-        <a href="/docs/guides/build-time-rendering">
-          {' '}
-          Build Time Rendering!
-        </a>
+        <a href="/docs/guides/build-time-rendering"> Build Time Rendering!</a>
       </>
     ),
   },