chore: upgrade docusaurus to 3.8 (#335)

* chore: upgrade docusaurus to 3.8

* chore: add the missing fonts

Author: sriramveeraghanta

babel.config.js

@@ -2,21 +2,27 @@ import { themes as prismThemes } from "prism-react-renderer";
 import type { Config } from "@docusaurus/types";
 import type * as Preset from "@docusaurus/preset-classic";
 
+// This runs in Node.js - Don't use client-side code here (browser APIs, JSX...)
+
 const config: Config = {
   title: "Plane",
   tagline: "An easy, flexible project management software",
   favicon: "https://media.docs.plane.so/favicon-32x32.png",
   trailingSlash: false,
   // Set the production url of your site here
   url: "https://docs.plane.so",
+  // Future flags, see https://docusaurus.io/docs/api/docusaurus-config#future
+  future: {
+    v4: true, // Improve compatibility with the upcoming Docusaurus v4
+  },
   // Set the /<baseUrl>/ pathname under which your site is served
   // For GitHub pages deployment, it is often '/<projectName>/'
   baseUrl: "/",
   // GitHub pages deployment config.
   // If you aren't using GitHub pages, you don't need these.
   organizationName: "makeplane", // Usually your GitHub org/user name.
   projectName: "docs", // Usually your repo name.
-
+  // Broken links
   onBrokenLinks: "throw",
   onBrokenMarkdownLinks: "warn",
   onBrokenAnchors: "warn",
@@ -38,11 +44,10 @@ const config: Config = {
           routeBasePath: "/",
           sidebarPath: "./sidebars.ts",
           include: ["**/*.md", "**/*.mdx"],
-          //sidebarCollapsible: false,
-          // Please change this to your repo.
-          // Remove this to remove the "edit this page" links.
-          //editUrl:
-          // 'https://github.com/makeplane/docs/edit/preview/',
+        },
+        blog: false,
+        theme: {
+          customCss: "./src/css/custom.css",
         },
         sitemap: {
           lastmod: "date",
@@ -51,10 +56,6 @@ const config: Config = {
           ignorePatterns: ["/tags/**"],
           filename: "sitemap.xml",
         },
-        blog: false,
-        theme: {
-          customCss: "./src/css/custom.css",
-        },
         gtag: {
           trackingID: "G-G578SD4VZD",
           anonymizeIP: true,
@@ -63,43 +64,14 @@ const config: Config = {
     ],
   ],
 
-  stylesheets: [
-    {
-      href: "https://fonts.googleapis.com/css2?family=Instrument+Sans:ital,wght@0,400..700;1,400..700&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=National+Park:[email protected]&family=Noto+Sans:ital,wght@0,100..900;1,100..900&family=Nunito+Sans:ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000&family=PT+Sans:ital,wght@0,400;0,700;1,400;1,700&family=Raleway:ital,wght@0,100..900;1,100..900&family=Roboto:ital,wght@0,100..900;1,100..900&family=Work+Sans:ital,wght@0,100..900;1,100..900&display=swap",
-      type: "text/css",
-    },
-  ],
-
-  scripts: [
-    {
-      src: "https://plausible.io/js/script.js",
-      defer: true,
-      "data-domain": "docs.plane.so",
-    },
-    {
-      src: "https://cdn.cr-relay.com/v1/site/b1fcbcbd-67f6-4736-940f-033731801664/signals.js",
-      async: true,
-    },
-  ],
-
-  plugins: [
-    [
-      "posthog-docusaurus",
-      {
-        apiKey: "phc_HskAKGRy7x0BEoWfyeHzYWWzcMmKG9DCail7ot7WQkA",
-        appUrl: "https://us.i.posthog.com", // optional
-        enableInDevelopment: false, // optional
-      },
-    ],
-    [
-      "@docusaurus/plugin-google-tag-manager",
-      {
-        containerId: "G-G578SD4VZD",
-      },
-    ],
-  ],
-
   themeConfig: {
+    image: "https://media.docs.plane.so/logo.svg",
+    docs: {
+      sidebar: {
+        hideable: false,
+        autoCollapseCategories: false,
+      },
+    },
     metadata: [
       {
         property: "og:image",
@@ -119,14 +91,6 @@ const config: Config = {
       disableSwitch: false,
       respectPrefersColorScheme: false,
     },
-    docs: {
-      sidebar: {
-        hideable: false,
-        autoCollapseCategories: false,
-      },
-    },
-    // Replace with your project's social card
-    image: "https://media.docs.plane.so/logo.svg",
     algolia: {
       appId: "AXICJJC8RP",
       apiKey: "23df4157dee1d9a8d435cadd6cae3f26",
@@ -163,56 +127,48 @@ const config: Config = {
         },
       ],
     },
-    // footer: {
-    //   style: 'dark',
-    //   links: [
-    //     {
-    //       title: 'Docs',
-    //       items: [
-    //         {
-    //           label: 'Tutorial',
-    //           to: '/docs/intro',
-    //         },
-    //       ],
-    //     },
-    //     {
-    //       title: 'Community',
-    //       items: [
-    //         {
-    //           label: 'Stack Overflow',
-    //           href: 'https://stackoverflow.com/questions/tagged/docusaurus',
-    //         },
-    //         {
-    //           label: 'Discord',
-    //           href: 'https://discordapp.com/invite/docusaurus',
-    //         },
-    //         {
-    //           label: 'Twitter',
-    //           href: 'https://twitter.com/docusaurus',
-    //         },
-    //       ],
-    //     },
-    //     {
-    //       title: 'More',
-    //       items: [
-    //         {
-    //           label: 'Blog',
-    //           to: '/blog',
-    //         },
-    //         {
-    //           label: 'GitHub',
-    //           href: 'https://github.com/facebook/docusaurus',
-    //         },
-    //       ],
-    //     },
-    //   ],
-    //   copyright: `Copyright © ${new Date().getFullYear()} My Project, Inc. Built with Docusaurus.`,
-    // },
+    footer: {},
     prism: {
       theme: prismThemes.github,
       darkTheme: prismThemes.dracula,
     },
   } satisfies Preset.ThemeConfig,
+
+  stylesheets: [
+    {
+      href: "https://fonts.googleapis.com/css2?family=Instrument+Sans:ital,wght@0,400..700;1,400..700&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=National+Park:[email protected]&family=Noto+Sans:ital,wght@0,100..900;1,100..900&family=Nunito+Sans:ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000&family=PT+Sans:ital,wght@0,400;0,700;1,400;1,700&family=Raleway:ital,wght@0,100..900;1,100..900&family=Roboto:ital,wght@0,100..900;1,100..900&family=Work+Sans:ital,wght@0,100..900;1,100..900&display=swap",
+      type: "text/css",
+    },
+  ],
+
+  scripts: [
+    {
+      src: "https://plausible.io/js/script.js",
+      defer: true,
+      "data-domain": "docs.plane.so",
+    },
+    {
+      src: "https://cdn.cr-relay.com/v1/site/b1fcbcbd-67f6-4736-940f-033731801664/signals.js",
+      async: true,
+    },
+  ],
+
+  plugins: [
+    [
+      "posthog-docusaurus",
+      {
+        apiKey: "phc_HskAKGRy7x0BEoWfyeHzYWWzcMmKG9DCail7ot7WQkA",
+        appUrl: "https://us.i.posthog.com", // optional
+        enableInDevelopment: false, // optional
+      },
+    ],
+    [
+      "@docusaurus/plugin-google-tag-manager",
+      {
+        containerId: "G-G578SD4VZD",
+      },
+    ],
+  ],
 };
 
 export default config;

docusaurus.config.ts

@@ -1,6 +1,6 @@
 {
   "name": "docs",
-  "version": "1.0.0",
+  "version": "3.0.0",
   "private": true,
   "author": "Plane",
   "license": "MIT",
@@ -23,32 +23,22 @@
     "format": "prettier --write ."
   },
   "dependencies": {
-    "@docusaurus/core": "3.5.2",
-    "@docusaurus/plugin-google-tag-manager": "3.5.2",
-    "@docusaurus/preset-classic": "3.5.2",
+    "@docusaurus/core": "3.8.1",
+    "@docusaurus/preset-classic": "3.8.1",
     "@mdx-js/react": "^3.0.0",
     "clsx": "^2.0.0",
     "posthog-docusaurus": "^2.0.4",
-    "prism-react-renderer": "2.3.0",
-    "react": "18.3.1",
-    "react-dom": "18.3.1",
-    "react-icons": "5.5.0"
+    "prism-react-renderer": "^2.3.0",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "react-icons": "^5.5.0"
   },
   "devDependencies": {
-    "@docusaurus/module-type-aliases": "3.5.2",
-    "@docusaurus/tsconfig": "3.5.2",
-    "@docusaurus/types": "3.5.2",
-    "prettier": "3.6.2",
-    "typescript": "5.8.3"
-  },
-  "resolutions": {
-    "path-to-regexp": "3.3.0",
-    "@babel/helpers": "7.26.10",
-    "@babel/runtime": "7.26.10",
-    "@babel/runtime-corejs3": "7.26.10",
-    "brace-expansion": "1.1.12",
-    "on-headers": "1.1.0",
-    "webpack-dev-server": "5.2.1"
+    "@docusaurus/module-type-aliases": "3.8.1",
+    "@docusaurus/tsconfig": "3.8.1",
+    "@docusaurus/types": "3.8.1",
+    "prettier": "^3.6.2",
+    "typescript": "~5.6.2"
   },
   "browserslist": {
     "production": [

package.json

@@ -1,21 +1,6 @@
 import type { SidebarsConfig } from "@docusaurus/plugin-content-docs";
 
-/**
- * Creating a sidebar enables you to:
- - create an ordered group of docs
- - render a sidebar for each doc of that group
- - provide next/previous navigation
-
- The sidebars can be generated from the filesystem, or explicitly defined here.
-
- Create as many sidebars as you want.
- */
 const sidebars: SidebarsConfig = {
-  // By default, Docusaurus generates a sidebar from the docs folder structure
-  // tutorialSidebar: [{type: 'autogenerated', dirName: '.'}],
-
-  // But you can create a sidebar manually
-
   tutorialSidebar: [
     {
       type: "category",
@@ -178,4 +163,5 @@ const sidebars: SidebarsConfig = {
     },
   ],
 };
+
 export default sidebars;

sidebars.ts

@@ -1,2 +1,3 @@
 export * from "./Card";
 export * from "./CardGroup";
+export * from "./Tags";