clean code

packages/app/src/components/Page/DisplaySwitcher.tsx

@@ -7,7 +7,6 @@ import dynamic from 'next/dynamic';
 import { useHackmdDraftUpdatedEffect } from '~/client/services/side-effects/hackmd-draft-updated';
 import { useHashChangedEffect } from '~/client/services/side-effects/hash-changed';
 import { usePageUpdatedEffect } from '~/client/services/side-effects/page-updated';
-import type { RendererConfig } from '~/interfaces/services/renderer';
 import { useIsEditable } from '~/stores/context';
 import { EditorMode, useEditorMode } from '~/stores/ui';
 
@@ -19,8 +18,6 @@ import type { PageSideContentsProps } from '../PageSideContents';
 import { UserInfo } from '../User/UserInfo';
 import type { UsersHomePageFooterProps } from '../UsersHomePageFooter';
 
-import { Page2 } from './Page2';
-
 const { isUsersHomePage } = pagePathUtils;
 
 
@@ -44,20 +41,20 @@ const IdenticalPathPage = (): JSX.Element => {
 
 
 type Props = {
-  rendererConfig: RendererConfig,
   pagePath: string,
   page?: IPagePopulatedToShowRevision,
   isIdenticalPathPage?: boolean,
   isNotFound?: boolean,
   isForbidden?: boolean,
   isNotCreatable?: boolean,
+  ssrBody?: JSX.Element,
 }
 
 const View = (props: Props): JSX.Element => {
   const {
-    rendererConfig,
     pagePath, page,
     isIdenticalPathPage, isNotFound, isForbidden, isNotCreatable,
+    ssrBody,
   } = props;
 
   const pageId = page?._id;
@@ -99,6 +96,16 @@ const View = (props: Props): JSX.Element => {
 
   const isUsersHomePagePath = isUsersHomePage(pagePath);
 
+  const contents = specialContents != null
+    ? <></>
+    : (() => {
+      const Page = dynamic(() => import('./Page').then(mod => mod.Page), {
+        ssr: false,
+        loading: () => ssrBody ?? <></>,
+      });
+      return <Page />;
+    })();
+
   return (
     <MainPane
       sideContents={sideContents}
@@ -110,7 +117,7 @@ const View = (props: Props): JSX.Element => {
       { specialContents == null && (
         <>
           { isUsersHomePagePath && <UserInfo author={page?.creator} /> }
-          <Page2 rendererConfig={rendererConfig} pagePath={pagePath} markdownForSSR={page?.revision.body} />
+          { contents }
         </>
       ) }
 

packages/app/src/components/Page/Page2.tsx

@@ -1,26 +0,0 @@
-import dynamic from 'next/dynamic';
-
-import type { RendererConfig } from '~/interfaces/services/renderer';
-import { generateSSRViewOptions } from '~/services/renderer/renderer';
-
-import RevisionRenderer from './RevisionRenderer';
-
-
-type Props = {
-  rendererConfig: RendererConfig,
-  pagePath: string,
-  markdownForSSR?: string,
-}
-
-export const Page2 = (props: Props): JSX.Element => {
-  const { rendererConfig, pagePath, markdownForSSR: markdown } = props;
-
-  const rendererOptions = generateSSRViewOptions(rendererConfig, pagePath);
-
-  const Page = dynamic(() => import('./Page').then(mod => mod.Page), {
-    ssr: false,
-    loading: () => <RevisionRenderer rendererOptions={rendererOptions} markdown={markdown ?? ''} />,
-  });
-
-  return <Page />;
-};

packages/app/src/pages/[[...path]].page.tsx

@@ -20,6 +20,7 @@ import { useRouter } from 'next/router';
 import superjson from 'superjson';
 
 import { useCurrentGrowiLayoutFluidClassName } from '~/client/services/layout';
+import RevisionRenderer from '~/components/Page/RevisionRenderer';
 import { DrawioViewerScript } from '~/components/Script/DrawioViewerScript';
 import type { CrowiRequest } from '~/interfaces/crowi-request';
 import type { EditorConfig } from '~/interfaces/editor-settings';
@@ -30,6 +31,7 @@ import type { IUserUISettings } from '~/interfaces/user-ui-settings';
 import type { PageModel, PageDocument } from '~/server/models/page';
 import type { PageRedirectModel } from '~/server/models/page-redirect';
 import type { UserUISettingsModel } from '~/server/models/user-ui-settings';
+import { generateSSRViewOptions } from '~/services/renderer/renderer';
 import { useEditingMarkdown } from '~/stores/editor';
 import { useHasDraftOnHackmd, usePageIdOnHackmd, useRevisionIdHackmdSynced } from '~/stores/hackmd';
 import { useSWRxCurrentPage, useSWRxIsGrantNormalized } from '~/stores/page';
@@ -291,6 +293,9 @@ const Page: NextPageWithLayout<Props> = (props: Props) => {
 
   const title = generateCustomTitleForPage(props, pagePath);
 
+  const rendererOptions = generateSSRViewOptions(props.rendererConfig, pagePath);
+  const ssrBody = <RevisionRenderer rendererOptions={rendererOptions} markdown={revisionBody ?? ''} />;
+
   return (
     <>
       <Head>
@@ -311,13 +316,13 @@ const Page: NextPageWithLayout<Props> = (props: Props) => {
         <div id="grw-fav-sticky-trigger" className="sticky-top"></div>
 
         <DisplaySwitcher
-          rendererConfig={props.rendererConfig}
           pagePath={pagePath}
           page={pageWithMeta?.data}
           isIdenticalPathPage={props.isIdenticalPathPage}
           isNotFound={props.isNotFound}
           isForbidden={props.isForbidden}
           isNotCreatable={props.isNotCreatable}
+          ssrBody={ssrBody}
         />
 
         <PageStatusAlert />