update at 2024-04-11 12:17:30

Author: imroc

src/theme/DocCategoryGeneratedIndexPage/index.tsx

@@ -0,0 +1,18 @@
+import React from 'react';
+import DocCategoryGeneratedIndexPage from '@theme-original/DocCategoryGeneratedIndexPage';
+import type DocCategoryGeneratedIndexPageType from '@theme/DocCategoryGeneratedIndexPage';
+import type { WrapperProps } from '@docusaurus/types';
+// highlight-add-line
+import Comment from '@site/src/components/Comment';
+
+type Props = WrapperProps<typeof DocCategoryGeneratedIndexPageType>;
+
+export default function DocCategoryGeneratedIndexPageWrapper(props: Props): JSX.Element {
+  return (
+    <>
+      <DocCategoryGeneratedIndexPage {...props} />
+      {/* highlight-add-line */}
+      <Comment />
+    </>
+  );
+}

src/theme/DocItem/Layout/index.tsx

@@ -1,70 +1,18 @@
 import React from 'react';
-import clsx from 'clsx';
-import { useWindowSize } from '@docusaurus/theme-common';
-import { useDoc } from '@docusaurus/theme-common/internal';
-import DocItemPaginator from '@theme/DocItem/Paginator';
-import DocVersionBanner from '@theme/DocVersionBanner';
-import DocVersionBadge from '@theme/DocVersionBadge';
-import DocItemFooter from '@theme/DocItem/Footer';
-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 type { Props } from '@theme/DocItem/Layout';
+import Layout from '@theme-original/DocItem/Layout';
+import type LayoutType from '@theme/DocItem/Layout';
+import type { WrapperProps } from '@docusaurus/types';
+// highlight-add-line
+import Comment from '@site/src/components/Comment';
 
-import styles from './styles.module.css';
-import Comment from '../../../components/Comment';
+type Props = WrapperProps<typeof LayoutType>;
 
-/**
- * Decide if the toc should be rendered, on mobile or desktop viewports
- */
-function useDocTOC() {
-  const { frontMatter, toc } = useDoc();
-  const windowSize = useWindowSize();
-
-  const hidden = frontMatter.hide_table_of_contents;
-  const canRender = !hidden && toc.length > 0;
-
-  const mobile = canRender ? <DocItemTOCMobile /> : undefined;
-
-  const desktop =
-    canRender && (windowSize === 'desktop' || windowSize === 'ssr') ? (
-      <DocItemTOCDesktop />
-    ) : undefined;
-
-  return {
-    hidden,
-    mobile,
-    desktop,
-  };
-}
-
-export default function DocItemLayout({ children }: Props): JSX.Element {
-  const docTOC = useDocTOC();
-  const { frontMatter } = useDoc();
-  const { hide_comment: hideComment } = frontMatter;
-  const {
-    metadata: { unlisted },
-  } = useDoc();
+export default function LayoutWrapper(props: Props): JSX.Element {
   return (
-    <div className="row">
-      <div className={clsx('col', !docTOC.hidden && styles.docItemCol)}>
-        {unlisted && <Unlisted />}
-        <DocVersionBanner />
-        <div className={styles.docItemContainer}>
-          <article>
-            <DocBreadcrumbs />
-            <DocVersionBadge />
-            {docTOC.mobile}
-            <DocItemContent>{children}</DocItemContent>
-            <DocItemFooter />
-          </article>
-          <DocItemPaginator />
-        </div>
-        {!hideComment && <Comment />}
-      </div>
-      {docTOC.desktop && <div className="col col--3">{docTOC.desktop}</div>}
-    </div>
+    <>
+      <Layout {...props} />
+      {/* highlight-add-line */}
+      <Comment />
+    </>
   );
 }