delete /components/MaintenaceMode.tsx

packages/app/src/components/MaintenanceMode.tsx

@@ -1,65 +0,0 @@
-import React, { FC, useCallback } from 'react';
-
-import { useTranslation } from 'next-i18next';
-
-import { toastError } from '~/client/util/apiNotification';
-import { apiv3Post } from '~/client/util/apiv3-client';
-import { useCurrentUser } from '~/stores/context';
-
-export const MaintenanceMode: FC = () => {
-  const { t } = useTranslation();
-
-  const { data: currentUser } = useCurrentUser();
-
-  const logoutHandler = useCallback(async() => {
-    try {
-      await apiv3Post('/logout');
-      window.location.reload();
-    }
-    catch (err) {
-      toastError(err);
-    }
-  }, []);
-
-  return (
-    <div id="content-main" className="content-main container-lg">
-      <div className="container">
-        <div className="row justify-content-md-center">
-          <div className="col-md-6 mt-5">
-            <div className="text-center">
-              <h1><i className="icon-exclamation large"></i></h1>
-              <h1 className="text-center">{ t('maintenance_mode.maintenance_mode') }</h1>
-              <h3>{ t('maintenance_mode.growi_is_under_maintenance') }</h3>
-              <hr />
-              <div className="text-left">
-                {currentUser?.admin
-                && (
-                  <p>
-                    <i className="icon-arrow-right"></i>
-                    <a className="btn btn-link" href="/admin/home">{ t('maintenance_mode.admin_page') }</a>
-                  </p>
-                )}
-                {currentUser != null
-                  ? (
-                    <p>
-                      <i className="icon-arrow-right"></i>
-                      <a className="btn btn-link" onClick={logoutHandler} id="maintanounse-mode-logout">{ t('maintenance_mode.logout') }</a>
-                    </p>
-                  )
-                  : (
-                    <p>
-                      <i className="icon-arrow-right"></i>
-                      <a className="btn btn-link" href="/login">{ t('maintenance_mode.login') }</a>
-                    </p>
-                  )
-                }
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  );
-};
-
-MaintenanceMode.displayName = 'MaintenanceMode';

packages/app/src/pages/maintenance.page.tsx

@@ -2,9 +2,11 @@ import {
   IUser, IUserHasId,
 } from '@growi/core';
 import { NextPage, GetServerSideProps, GetServerSidePropsContext } from 'next';
+import { useTranslation } from 'next-i18next';
 import { serverSideTranslations } from 'next-i18next/serverSideTranslations';
-import dynamic from 'next/dynamic';
 
+import { toastError } from '~/client/util/apiNotification';
+import { apiv3Post } from '~/client/util/apiv3-client';
 import { CrowiRequest } from '~/interfaces/crowi-request';
 import { useCurrentUser } from '~/stores/context';
 
@@ -12,20 +14,64 @@ import {
   CommonProps, getServerSideCommonProps, getNextI18NextConfig,
 } from './utils/commons';
 
+
 type Props = CommonProps & {
   currentUser: IUser,
 };
 
 const MaintenancePage: NextPage<CommonProps> = (props: Props) => {
 
-  const MaintenaceMode = dynamic(() => import('~/components/MaintenanceMode').then(mod => mod.MaintenanceMode), { ssr: false });
-
+  const { t } = useTranslation();
   useCurrentUser(props.currentUser ?? null);
 
+  const logoutHandler = async() => {
+    try {
+      await apiv3Post('/logout');
+      window.location.reload();
+    }
+    catch (err) {
+      toastError(err);
+    }
+  };
+
   return (
-    <>
-      <MaintenaceMode />
-    </>
+    <div id="content-main" className="content-main container-lg">
+      <div className="container">
+        <div className="row justify-content-md-center">
+          <div className="col-md-6 mt-5">
+            <div className="text-center">
+              <h1><i className="icon-exclamation large"></i></h1>
+              <h1 className="text-center">{ t('maintenance_mode.maintenance_mode') }</h1>
+              <h3>{ t('maintenance_mode.growi_is_under_maintenance') }</h3>
+              <hr />
+              <div className="text-left">
+                {props.currentUser?.admin
+              && (
+                <p>
+                  <i className="icon-arrow-right"></i>
+                  <a className="btn btn-link" href="/admin/home">{ t('maintenance_mode.admin_page') }</a>
+                </p>
+              )}
+                {props.currentUser != null
+                  ? (
+                    <p>
+                      <i className="icon-arrow-right"></i>
+                      <a className="btn btn-link" onClick={logoutHandler} id="maintanounse-mode-logout">{ t('maintenance_mode.logout') }</a>
+                    </p>
+                  )
+                  : (
+                    <p>
+                      <i className="icon-arrow-right"></i>
+                      <a className="btn btn-link" href="/login">{ t('maintenance_mode.login') }</a>
+                    </p>
+                  )
+                }
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
   );
 };