Upgrade Docusaurus to 3.10.2

docusaurus.config.ts

@@ -12,7 +12,12 @@ const config: Config = {
 
   // onBrokenLinks: "throw",
   onBrokenLinks: "ignore",
-  onBrokenMarkdownLinks: "warn",
+
+  markdown: {
+    hooks: {
+      onBrokenMarkdownLinks: "warn",
+    },
+  },
 
   plugins: [
     "docusaurus-plugin-sass",
@@ -56,6 +61,7 @@ const config: Config = {
           path: "blog", // Path to the existing blog folder
           routeBasePath: "blog", // Route for the existing blog
           include: ["*.md", "*.mdx"], // File types to include for the existing blog
+          onUntruncatedBlogPosts: 'ignore',
 
           feedOptions: {
             type: "all",

package.json

@@ -15,9 +15,10 @@
     "typecheck": "tsc"
   },
   "dependencies": {
-    "@docusaurus/core": "^3.1.1",
-    "@docusaurus/plugin-client-redirects": "^3.5.1",
-    "@docusaurus/preset-classic": "^3.1.1",
+    "@docusaurus/core": "^3.10.2",
+    "@docusaurus/module-type-aliases": "^3.10.2",
+    "@docusaurus/plugin-client-redirects": "^3.10.2",
+    "@docusaurus/preset-classic": "^3.10.2",
     "@easyops-cn/docusaurus-search-local": "^0.40.1",
     "@floating-ui/react": "^0.26.6",
     "@mdx-js/react": "^3.0.0",
@@ -35,8 +36,8 @@
     "sass": "^1.69.6"
   },
   "devDependencies": {
-    "@docusaurus/tsconfig": "^3.1.1",
-    "@docusaurus/types": "^3.1.1",
+    "@docusaurus/tsconfig": "^3.10.2",
+    "@docusaurus/types": "^3.10.2",
     "typescript": "~5.2.2"
   },
   "browserslist": {

src/hooks/useGetNewBlogList.ts

@@ -1,8 +1,8 @@
 import dayjs from "dayjs";
-import recentPosts from "../../.docusaurus/docusaurus-plugin-content-blog/default/blog-archive-80c.json";
+import recentPosts from "../../.docusaurus/docusaurus-plugin-content-blog/default/p/blog-archive-f05.json";
 
 export default function useGetNewBlogList(n: number = 4) {
-  let blogPosts = recentPosts.blogPosts;
+  let blogPosts = recentPosts.archive.blogPosts;
 
 
   blogPosts

src/theme/BlogPostItem/Content/index.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 import clsx from "clsx";
 import { blogPostContainerID } from "@docusaurus/utils-common";
-import { useBlogPost } from "@docusaurus/theme-common/internal";
+import { useBlogPost } from "@docusaurus/plugin-content-blog/client";
 import MDXContent from "@theme/MDXContent";
 import type { Props } from "@theme/BlogPostItem/Content";
 

src/theme/BlogPostItem/components/Authors/index.tsx

@@ -1,4 +1,4 @@
-import { useBlogPost } from "@docusaurus/theme-common/internal";
+import { useBlogPost } from "@docusaurus/plugin-content-blog/client";
 export default function BlogPostItemHeaderAuthors({
   styles,
 }: {

src/theme/BlogPostItem/components/Cover/index.tsx

@@ -1,4 +1,4 @@
-import { useBlogPost } from "@docusaurus/theme-common/internal";
+import { useBlogPost } from "@docusaurus/plugin-content-blog/client";
 import useBaseUrl from "@docusaurus/useBaseUrl";
 
 interface IProps {

src/theme/BlogPostItem/components/Desc/index.tsx

@@ -1,4 +1,4 @@
-import { useBlogPost } from "@docusaurus/theme-common/internal";
+import { useBlogPost } from "@docusaurus/plugin-content-blog/client";
 export default function Desc({ style }: { style?: React.CSSProperties }) {
   const { metadata } = useBlogPost();
   return (

src/theme/BlogPostItem/components/Info/index.tsx

@@ -2,7 +2,7 @@ import React from "react";
 import clsx from "clsx";
 import { translate } from "@docusaurus/Translate";
 import { usePluralForm } from "@docusaurus/theme-common";
-import { useBlogPost } from "@docusaurus/theme-common/internal";
+import { useBlogPost } from "@docusaurus/plugin-content-blog/client";
 import type { Props } from "@theme/BlogPostItem/Header/Info";
 
 // Very simple pluralization: probably good enough for now

src/theme/BlogPostItem/components/Tags/index.tsx

@@ -1,4 +1,4 @@
-import { useBlogPost } from "@docusaurus/theme-common/internal";
+import { useBlogPost } from "@docusaurus/plugin-content-blog/client";
 export default function Tags({ style }: { style?: React.CSSProperties }) {
   const {
     frontMatter: { tags },

src/theme/BlogPostItem/components/Title/index.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 import clsx from "clsx";
 import Link from "@docusaurus/Link";
-import { useBlogPost } from "@docusaurus/theme-common/internal";
+import { useBlogPost } from "@docusaurus/plugin-content-blog/client";
 import type { Props } from "@theme/BlogPostItem/Header/Title";
 import styles from "./styles.module.scss";
 

src/theme/BlogPostItem/index.tsx

@@ -1,4 +1,4 @@
-import { useBlogPost } from "@docusaurus/theme-common/internal";
+import { useBlogPost } from "@docusaurus/plugin-content-blog/client";
 import type { Props } from "@theme/BlogPostItem";
 
 import BlogPostItemContainer from "./Container";

src/theme/BlogPostItems/index.tsx

@@ -1,4 +1,4 @@
-import { BlogPostProvider } from "@docusaurus/theme-common/internal";
+import { BlogPostProvider } from "@docusaurus/plugin-content-blog/client";
 import BlogPostItem from "@theme/BlogPostItem";
 import type { Props } from "@theme/BlogPostItems";
 

src/theme/BlogPostPage/Metadata/index.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import {PageMetadata} from '@docusaurus/theme-common';
-import {useBlogPost} from '@docusaurus/theme-common/internal';
+import {useBlogPost} from '@docusaurus/plugin-content-blog/client';
 
 export default function BlogPostPageMetadata(): JSX.Element {
   const {assets, metadata} = useBlogPost();

src/theme/BlogPostPage/index.tsx

@@ -7,14 +7,14 @@ import {
 import {
   BlogPostProvider,
   useBlogPost,
-} from "@docusaurus/theme-common/internal";
+} from "@docusaurus/plugin-content-blog/client";
 import BlogLayout from "@theme/BlogLayout";
 import BlogPostItem from "@theme/BlogPostItem";
 import BlogPostPaginator from "@theme/BlogPostPaginator";
 import BlogPostPageMetadata from "@theme/BlogPostPage/Metadata";
 import TOC from "@theme/TOC";
 import type { Props } from "@theme/BlogPostPage";
-import Unlisted from "@theme/Unlisted";
+import ContentVisibility from "@theme/ContentVisibility";
 import type { BlogSidebar } from "@docusaurus/plugin-content-blog";
 
 function BlogPostPageContent({
@@ -25,7 +25,7 @@ function BlogPostPageContent({
   children: ReactNode;
 }): JSX.Element {
   const { metadata, toc } = useBlogPost();
-  const { nextItem, prevItem, frontMatter, unlisted } = metadata;
+  const { nextItem, prevItem, frontMatter } = metadata;
   const {
     hide_table_of_contents: hideTableOfContents,
     toc_min_heading_level: tocMinHeadingLevel,
@@ -45,7 +45,7 @@ function BlogPostPageContent({
           ) : undefined
         }
       >
-        {unlisted && <Unlisted />}
+        <ContentVisibility metadata={metadata} />
         <BlogPostItem>{children}</BlogPostItem>
         {(nextItem || prevItem) && (
           <BlogPostPaginator nextItem={nextItem} prevItem={prevItem} />

src/theme/BlogSidebar/Mobile/index.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import {useVisibleBlogSidebarItems} from '@docusaurus/theme-common/internal';
+import {useVisibleBlogSidebarItems} from '@docusaurus/plugin-content-blog/client';
 import {NavbarSecondaryMenuFiller} from '@docusaurus/theme-common';
 import type {Props} from '@theme/BlogSidebar/Mobile';
 import LinkWithBaseUrl from '@site/src/components/common/LinkWithBaseUrl';

src/theme/DocBreadcrumbs/index.tsx

@@ -2,8 +2,8 @@ import { translate } from "@docusaurus/Translate";
 import { ThemeClassNames } from "@docusaurus/theme-common";
 import {
   useHomePageRoute,
-  useSidebarBreadcrumbs,
 } from "@docusaurus/theme-common/internal";
+import { useSidebarBreadcrumbs } from "@docusaurus/plugin-content-docs/client";
 import HomeBreadcrumbItem from "@theme/DocBreadcrumbs/Items/Home";
 import clsx from "clsx";
 import { type ReactNode } from "react";

src/theme/DocItem/Content/index.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import clsx from 'clsx';
 import {ThemeClassNames} from '@docusaurus/theme-common';
-import {useDoc} from '@docusaurus/theme-common/internal';
+import {useDoc} from '@docusaurus/plugin-content-docs/client';
 import Heading from '@theme/Heading';
 import MDXContent from '@theme/MDXContent';
 import type {Props} from '@theme/DocItem/Content';

src/theme/DocItem/Footer/index.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import clsx from 'clsx';
 import {ThemeClassNames} from '@docusaurus/theme-common';
-import {useDoc, type DocContextValue} from '@docusaurus/theme-common/internal';
+import {useDoc, type DocContextValue} from '@docusaurus/plugin-content-docs/client';
 import LastUpdated from '@theme/LastUpdated';
 import EditThisPage from '@theme/EditThisPage';
 import TagsListInline, {

src/theme/DocItem/Layout/index.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 import clsx from "clsx";
 import { useWindowSize } from "@docusaurus/theme-common";
-import { useDoc } from "@docusaurus/theme-common/internal";
+import { useDoc } from "@docusaurus/plugin-content-docs/client";
 import DocItemPaginator from "@theme/DocItem/Paginator";
 import DocVersionBanner from "@theme/DocVersionBanner";
 import DocVersionBadge from "@theme/DocVersionBadge";
@@ -10,7 +10,7 @@ import DocItemTOCMobile from "@theme/DocItem/TOC/Mobile";
 import DocItemTOCDesktop from "@theme/DocItem/TOC/Desktop";
 import DocItemContent from "@theme/DocItem/Content";
 import DocBreadcrumbs from "@theme/DocBreadcrumbs";
-import Unlisted from "@theme/Unlisted";
+import ContentVisibility from "@theme/ContentVisibility";
 import type { Props } from "@theme/DocItem/Layout";
 
 import styles from "./styles.module.css";
@@ -41,13 +41,11 @@ function useDocTOC() {
 
 export default function DocItemLayout({ children }: Props): JSX.Element {
   const docTOC = useDocTOC();
-  const {
-    metadata: { unlisted },
-  } = useDoc();
+  const { metadata } = useDoc();
   return (
     <div className="row">
       <div className={clsx('col',!docTOC.hidden && styles.docItemCol)}>
-        {unlisted && <Unlisted />}
+        <ContentVisibility metadata={metadata} />
         <DocVersionBanner />
         <div className={styles.docItemContainer}>
           <article>

src/theme/DocItem/Metadata/index.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import {PageMetadata} from '@docusaurus/theme-common';
-import {useDoc} from '@docusaurus/theme-common/internal';
+import {useDoc} from '@docusaurus/plugin-content-docs/client';
 
 export default function DocItemMetadata(): JSX.Element {
   const {metadata, frontMatter, assets} = useDoc();

src/theme/DocItem/Paginator/index.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import {useDoc} from '@docusaurus/theme-common/internal';
+import {useDoc} from '@docusaurus/plugin-content-docs/client';
 import DocPaginator from '@theme/DocPaginator';
 
 /**

src/theme/DocItem/TOC/Desktop/index.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import {ThemeClassNames} from '@docusaurus/theme-common';
-import {useDoc} from '@docusaurus/theme-common/internal';
+import {useDoc} from '@docusaurus/plugin-content-docs/client';
 
 import TOC from '@theme/TOC';
 

src/theme/DocItem/TOC/Mobile/index.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import clsx from 'clsx';
 import {ThemeClassNames} from '@docusaurus/theme-common';
-import {useDoc} from '@docusaurus/theme-common/internal';
+import {useDoc} from '@docusaurus/plugin-content-docs/client';
 
 import TOCCollapsible from '@theme/TOCCollapsible';
 

src/theme/DocItem/index.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import {HtmlClassNameProvider} from '@docusaurus/theme-common';
-import {DocProvider} from '@docusaurus/theme-common/internal';
+import {DocProvider} from '@docusaurus/plugin-content-docs/client';
 import DocItemMetadata from '@theme/DocItem/Metadata';
 import DocItemLayout from '@theme/DocItem/Layout';
 import type {Props} from '@theme/DocItem';

src/theme/DocRoot/Layout/Main/index.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import clsx from 'clsx';
-import {useDocsSidebar} from '@docusaurus/theme-common/internal';
+import {useDocsSidebar} from '@docusaurus/plugin-content-docs/client';
 import type {Props} from '@theme/DocRoot/Layout/Main';
 
 import styles from './styles.module.css';

src/theme/DocRoot/Layout/Sidebar/index.tsx

@@ -1,7 +1,7 @@
 import React, {type ReactNode, useState, useCallback} from 'react';
 import clsx from 'clsx';
 import {prefersReducedMotion, ThemeClassNames} from '@docusaurus/theme-common';
-import {useDocsSidebar} from '@docusaurus/theme-common/internal';
+import {useDocsSidebar} from '@docusaurus/plugin-content-docs/client';
 import {useLocation} from '@docusaurus/router';
 import DocSidebar from '@theme/DocSidebar';
 import ExpandButton from '@theme/DocRoot/Layout/Sidebar/ExpandButton';

src/theme/DocRoot/Layout/index.tsx

@@ -1,5 +1,5 @@
 import React, {useState} from 'react';
-import {useDocsSidebar} from '@docusaurus/theme-common/internal';
+import {useDocsSidebar} from '@docusaurus/plugin-content-docs/client';
 import BackToTopButton from '@theme/BackToTopButton';
 import DocRootLayoutSidebar from '@theme/DocRoot/Layout/Sidebar';
 import DocRootLayoutMain from '@theme/DocRoot/Layout/Main';

src/theme/DocRoot/index.tsx

@@ -4,7 +4,7 @@ import {HtmlClassNameProvider, ThemeClassNames} from '@docusaurus/theme-common';
 import {
   DocsSidebarProvider,
   useDocRootMetadata,
-} from '@docusaurus/theme-common/internal';
+} from '@docusaurus/plugin-content-docs/client';
 import DocRootLayout from '@theme/DocRoot/Layout';
 import NotFoundContent from '@theme/NotFound/Content';
 import type {Props} from '@theme/DocRoot';

src/theme/MDXPage/index.tsx

@@ -7,17 +7,18 @@ import CommonLayout from "@site/src/components/common/Layout";
 import MDXContent from "@theme/MDXContent";
 import type { Props } from "@theme/MDXPage";
 import TOC from "@theme/TOC";
-import Unlisted from "@theme/Unlisted";
+import ContentVisibility from "@theme/ContentVisibility";
 import clsx from "clsx";
 import styles from "./styles.module.css";
 
 export default function MDXPage(props: Props): JSX.Element {
   const { content: MDXPageContent } = props;
 
   const {
-    metadata: { frontMatter, unlisted, description, title },
+    metadata,
     assets,
   } = MDXPageContent;
+  const { frontMatter, description, title } = metadata;
   const { wrapperClassName, hide_table_of_contents: hideTableOfContents } =
     frontMatter;
 
@@ -36,7 +37,7 @@ export default function MDXPage(props: Props): JSX.Element {
 
         <div className={styles.mdxPageWrapper}>
           <div style={{ flex: 1, minWidth: 0 }}>
-            {unlisted && <Unlisted />}
+            <ContentVisibility metadata={metadata} />
             <article className="markdown">
               <MDXContent>
                 <MDXPageContent />