statically render DescendantsPageListModal

packages/app/src/components/DescendantsPageListModal.tsx

@@ -2,6 +2,7 @@
 import React, { useState, useMemo } from 'react';
 
 import { useTranslation } from 'next-i18next';
+import dynamic from 'next/dynamic';
 import {
   Modal, ModalHeader, ModalBody,
 } from 'reactstrap';
@@ -11,12 +12,20 @@ import { useDescendantsPageListModal } from '~/stores/modal';
 
 import { CustomNavTab } from './CustomNavigation/CustomNav';
 import CustomTabContent from './CustomNavigation/CustomTabContent';
-import { DescendantsPageList } from './DescendantsPageList';
+import { DescendantsPageListProps } from './DescendantsPageList';
 import ExpandOrContractButton from './ExpandOrContractButton';
 import PageListIcon from './Icons/PageListIcon';
 import TimeLineIcon from './Icons/TimeLineIcon';
-import { PageTimeline } from './PageTimeline';
 
+const DescendantsPageList = (props: DescendantsPageListProps): JSX.Element => {
+  const DescendantsPageList = dynamic<DescendantsPageListProps>(() => import('./DescendantsPageList').then(mod => mod.DescendantsPageList), { ssr: false });
+  return <DescendantsPageList {...props}/>;
+};
+
+const PageTimeline = (): JSX.Element => {
+  const PageTimeline = dynamic(() => import('./PageTimeline').then(mod => mod.PageTimeline), { ssr: false });
+  return <PageTimeline />;
+};
 
 export const DescendantsPageListModal = (): JSX.Element => {
   const { t } = useTranslation();

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

@@ -44,16 +44,14 @@ import loggerFactory from '~/utils/logger';
 
 // import GrowiSubNavigation from '../client/js/components/Navbar/GrowiSubNavigation';
 // import GrowiSubNavigationSwitcher from '../client/js/components/Navbar/GrowiSubNavigationSwitcher';
+import { DescendantsPageListModal } from '../components/DescendantsPageListModal';
 import ForbiddenPage from '../components/ForbiddenPage';
 import { BasicLayout } from '../components/Layout/BasicLayout';
 import GrowiContextualSubNavigation from '../components/Navbar/GrowiContextualSubNavigation';
 import { NotCreatablePage } from '../components/NotCreatablePage';
 import DisplaySwitcher from '../components/Page/DisplaySwitcher';
-
 // import { serializeUserSecurely } from '../server/models/serializers/user-serializer';
 // import PageStatusAlert from '../client/js/components/PageStatusAlert';
-
-
 import {
   useCurrentUser, useCurrentPagePath,
   useIsLatestRevision,
@@ -119,11 +117,6 @@ const PutbackPageModal = (): JSX.Element => {
   return <PutbackPageModal />;
 };
 
-const DescendantsPageListModal = (): JSX.Element => {
-  const DescendantsPageListModal = dynamic(() => import('../components/DescendantsPageListModal').then(mod => mod.DescendantsPageListModal), { ssr: false });
-  return <DescendantsPageListModal />;
-};
-
 type Props = CommonProps & {
   currentUser: IUser,