Merge branch 'support/apply-nextjs-2' into support/import-scss-for-Editor

packages/app/src/components/Comments.tsx

@@ -0,0 +1,44 @@
+import React from 'react';
+
+import { PageComment } from '~/components/PageComment';
+import { useCommentPreviewOptions } from '~/stores/renderer';
+
+import { useIsTrashPage } from '../stores/context';
+
+import { CommentEditorLazyRenderer } from './PageComment/CommentEditorLazyRenderer';
+
+type CommentsProps = {
+  pageId?: string,
+}
+
+export const Comments = (props: CommentsProps): JSX.Element => {
+
+  const { pageId } = props;
+
+  const { data: rendererOptions } = useCommentPreviewOptions();
+  const { data: isDeleted } = useIsTrashPage();
+
+  // TODO: Implement or refactor Skelton if server-side rendering
+  if (rendererOptions == null || isDeleted == null) {
+    return <></>;
+  }
+
+  return (
+    // TODO: Check and refactor CSS import
+    <div className="page-comments-row mt-5 py-4 d-edit-none d-print-none">
+      <div className="container-lg">
+        <div className="page-comments">
+          <div id="page-comments-list" className="page-comments-list">
+            <PageComment pageId={pageId} isReadOnly={false} titleAlign="left" />
+          </div>
+          { !isDeleted && (
+            <div id="page-comment-write">
+              <CommentEditorLazyRenderer pageId={pageId} rendererOptions={rendererOptions} />
+            </div>
+          )}
+        </div>
+      </div>
+    </div>
+  );
+
+};

packages/app/src/components/PageComment.tsx

@@ -16,7 +16,6 @@ import { useSWRxPageComment } from '../stores/comment';
 
 import { Comment } from './PageComment/Comment';
 import { CommentEditorProps } from './PageComment/CommentEditor';
-import { CommentEditorLazyRenderer } from './PageComment/CommentEditorLazyRenderer';
 import { DeleteCommentModalProps } from './PageComment/DeleteCommentModal';
 import { ReplyComments } from './PageComment/ReplyComments';
 import { PageCommentSkelton } from './PageCommentSkelton';
@@ -142,6 +141,10 @@ export const PageComment: FC<PageCommentProps> = memo((props:PageCommentProps):
     );
   }
 
+  if (currentPage.revision == null) {
+    return <></>;
+  }
+
   const generateCommentElement = (comment: ICommentHasId) => (
     <Comment
       comment={comment}
@@ -170,7 +173,6 @@ export const PageComment: FC<PageCommentProps> = memo((props:PageCommentProps):
 
   return (
     <>
-      {/* TODO: Check the comment.html CSS */}
       <div className={`${styles['page-comment-styles']} page-comments-row comment-list`}>
         <div className="container-lg">
           <div className="page-comments">
@@ -221,13 +223,6 @@ export const PageComment: FC<PageCommentProps> = memo((props:PageCommentProps):
 
               })}
             </div>
-            {/* TODO: Check if identical-page */}
-            {(!isReadOnly) && (
-              <CommentEditorLazyRenderer
-                pageId={pageId}
-                rendererOptions={rendererOptions}
-              />
-            )}
           </div>
         </div>
       </div>

packages/app/src/components/PageContentFooter.tsx

@@ -15,7 +15,7 @@ export const PageContentFooter = memo((): JSX.Element => {
 
   const { data: page } = useSWRxCurrentPage();
 
-  if (page == null) {
+  if (page == null || page.revision == null) {
     return <></>;
   }
 

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

@@ -17,8 +17,8 @@ import Head from 'next/head';
 import { useRouter } from 'next/router';
 import superjson from 'superjson';
 
+import { Comments } from '~/components/Comments';
 import { PageAlerts } from '~/components/PageAlert/PageAlerts';
-import { PageComment } from '~/components/PageComment';
 // import { useTranslation } from '~/i18n';
 import { PageContentFooter } from '~/components/PageContentFooter';
 import { CrowiRequest } from '~/interfaces/crowi-request';
@@ -329,9 +329,44 @@ const GrowiPage: NextPage<Props> = (props: Props) => {
             </div> */}
           </div>
         </div>
-        <footer>
-          {/* <PageComments /> */}
-          <PageComment pageId={pageId} isReadOnly={false} titleAlign="left" />
+        {/* TODO: Check CSS import */}
+        <footer className="footer d-edit-none">
+          {/* TODO: Enable page_list.html */}
+          {/* TODO: Enable isIdenticalPathPage or useIdenticalPath */}
+          {/* { !props.isIdenticalPathPage && ( */}
+          <Comments pageId={pageId} />
+          {/* )} */}
+          {/* TODO: Create UsersHomePageFooter conponent */}
+          { isUsersHomePage(pageWithMeta?.data.path) && (
+            <div className="container-lg user-page-footer py-5">
+              <div className="grw-user-page-list-m d-edit-none">
+                <h2 id="bookmarks-list" className="grw-user-page-header border-bottom pb-2 mb-3">
+                  <i style={{ fontSize: '1.3em' }} className="fa fa-fw fa-bookmark-o"></i>
+                  Bookmarks
+                </h2>
+                <div id="user-bookmark-list" className="page-list">
+                  {/* TODO: No need page-list-container class ? */}
+                  <div className="page-list-container">
+                    {/* <BookmarkList userId={pageContainer.state.creator._id} /> */}
+                  </div>
+                </div>
+              </div>
+              <div className="grw-user-page-list-m mt-5 d-edit-none">
+                <h2 id="recently-created-list" className="grw-user-page-header border-bottom pb-2 mb-3">
+                  <i id="recent-created-icon" className="mr-1">
+                    {/* <RecentlyCreatedIcon /> */}
+                  </i>
+                  Recently Created
+                </h2>
+                <div id="user-created-list" className="page-list">
+                  {/* TODO: No need page-list-container class ? */}
+                  <div className="page-list-container">
+                    {/* <RecentCreated userId={pageContainer.state.creator._id} /> */}
+                  </div>
+                </div>
+              </div>
+            </div>
+          )}
           <PageContentFooter />
         </footer>
 

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

@@ -188,7 +188,7 @@ const AdminMarkdownSettingsPage: NextPage<Props> = (props: Props) => {
   const targetPage = getTargetPageToRender(adminPagesMap, pagePathKeys);
 
   useCurrentUser(props.currentUser != null ? JSON.parse(props.currentUser) : null);
-  // useIsMailerSetup(props.isMailerSetup);
+  useIsMailerSetup(props.isMailerSetup);
 
   // useSearchServiceConfigured(props.isSearchServiceConfigured);
   useIsSearchServiceReachable(props.isSearchServiceReachable);
@@ -271,12 +271,28 @@ const AdminMarkdownSettingsPage: NextPage<Props> = (props: Props) => {
 };
 
 
-function injectServerConfigurations(context: GetServerSidePropsContext, props: Props): void {
+async function injectServerConfigurations(context: GetServerSidePropsContext, props: Props): Promise<void> {
   const req: CrowiRequest = context.req as CrowiRequest;
   const { crowi } = req;
-  const { mailService } = crowi;
+  const {
+    appService, mailService, aclService, searchService, activityService,
+  } = crowi;
+
+  props.siteUrl = appService.getSiteUrl();
+  props.nodeVersion = crowi.runtimeVersions.versions.node ? crowi.runtimeVersions.versions.node.version.version : null;
+  props.npmVersion = crowi.runtimeVersions.versions.npm ? crowi.runtimeVersions.versions.npm.version.version : null;
+  props.yarnVersion = crowi.runtimeVersions.versions.yarn ? crowi.runtimeVersions.versions.yarn.version.version : null;
+  props.installedPlugins = pluginUtils.listPlugins();
+  props.envVars = await ConfigLoader.getEnvVarsForDisplay(true);
+  props.isAclEnabled = aclService.isAclEnabled();
+
+  props.isSearchServiceConfigured = searchService.isConfigured;
+  props.isSearchServiceReachable = searchService.isReachable;
 
   props.isMailerSetup = mailService.isMailerSetup;
+
+  props.auditLogEnabled = crowi.configManager.getConfig('crowi', 'app:auditLogEnabled');
+  props.auditLogAvailableActions = activityService.getAvailableActions(false);
 }
 
 /**
@@ -292,10 +308,6 @@ async function injectNextI18NextConfigurations(context: GetServerSidePropsContex
 
 export const getServerSideProps: GetServerSideProps = async(context: GetServerSidePropsContext) => {
   const req: CrowiRequest = context.req as CrowiRequest;
-  const { crowi } = req;
-  const {
-    appService, searchService, aclService,
-  } = crowi;
 
   const { user } = req;
   const result = await getServerSideCommonProps(context);
@@ -314,20 +326,6 @@ export const getServerSideProps: GetServerSideProps = async(context: GetServerSi
   injectServerConfigurations(context, props);
   injectNextI18NextConfigurations(context, props, ['admin']);
 
-  props.siteUrl = appService.getSiteUrl();
-  props.nodeVersion = crowi.runtimeVersions.versions.node ? crowi.runtimeVersions.versions.node.version.version : null;
-  props.npmVersion = crowi.runtimeVersions.versions.npm ? crowi.runtimeVersions.versions.npm.version.version : null;
-  props.yarnVersion = crowi.runtimeVersions.versions.yarn ? crowi.runtimeVersions.versions.yarn.version.version : null;
-  props.installedPlugins = pluginUtils.listPlugins();
-  props.envVars = await ConfigLoader.getEnvVarsForDisplay(true);
-  props.isAclEnabled = aclService.isAclEnabled();
-
-  props.isSearchServiceConfigured = searchService.isConfigured;
-  props.isSearchServiceReachable = searchService.isReachable;
-
-  props.auditLogEnabled = crowi.configManager.getConfig('crowi', 'app:auditLogEnabled');
-  props.auditLogAvailableActions = crowi.activityService.getAvailableActions(false);
-
   return {
     props,
   };

packages/app/src/server/views/layout-growi/widget/comments.html

@@ -1,14 +0,0 @@
-<div class="page-comments-row mt-5 py-4 d-edit-none d-print-none">
-  <div class="container-lg">
-
-    <div class="page-comments">
-      <div class="page-comments-list" id="page-comments-list"></div>
-
-      {% if page and not page.isDeleted() %}
-      <div id="page-comment-write"></div>
-      {% endif %}
-
-    </div>
-
-  </div>
-</div>