set id to app.jsx from nologin

packages/app/src/client/app.jsx

@@ -21,33 +21,34 @@ import loggerFactory from '~/utils/logger';
 import { swrGlobalConfiguration } from '~/utils/swr-utils';
 
 import ErrorBoundary from '../components/ErrorBoudary';
-import RedirectedAlert from '../components/Page/RedirectedAlert';
-import TrashPageList from '../components/TrashPageList';
-import TrashPageAlert from '../components/Page/TrashPageAlert';
-import NotFoundPage from '../components/NotFoundPage';
-import NotFoundAlert from '../components/Page/NotFoundAlert';
+import Fab from '../components/Fab';
 import ForbiddenPage from '../components/ForbiddenPage';
-import PageStatusAlert from '../components/PageStatusAlert';
-import RecentCreated from '../components/RecentCreated/RecentCreated';
 import RecentlyCreatedIcon from '../components/Icons/RecentlyCreatedIcon';
-import MyDraftList from '../components/MyDraftList/MyDraftList';
-import BookmarkList from '../components/PageList/BookmarkList';
-import Fab from '../components/Fab';
 import InAppNotificationPage from '../components/InAppNotification/InAppNotificationPage';
+import MaintenanceModeContent from '../components/MaintenanceModeContent';
 import PersonalSettings from '../components/Me/PersonalSettings';
+import MyDraftList from '../components/MyDraftList/MyDraftList';
 import GrowiContextualSubNavigation from '../components/Navbar/GrowiContextualSubNavigation';
 import GrowiSubNavigationSwitcher from '../components/Navbar/GrowiSubNavigationSwitcher';
+import NotFoundPage from '../components/NotFoundPage';
 import Page from '../components/Page';
 import DisplaySwitcher from '../components/Page/DisplaySwitcher';
+import NotFoundAlert from '../components/Page/NotFoundAlert';
+import RedirectedAlert from '../components/Page/RedirectedAlert';
 import ShareLinkAlert from '../components/Page/ShareLinkAlert';
+import TrashPageAlert from '../components/Page/TrashPageAlert';
 import PageComment from '../components/PageComment';
 import CommentEditorLazyRenderer from '../components/PageComment/CommentEditorLazyRenderer';
 import PageContentFooter from '../components/PageContentFooter';
 import { defaultEditorOptions, defaultPreviewOptions } from '../components/PageEditor/OptionsSelector';
+import BookmarkList from '../components/PageList/BookmarkList';
+import PageStatusAlert from '../components/PageStatusAlert';
 import PageTimeline from '../components/PageTimeline';
+import RecentCreated from '../components/RecentCreated/RecentCreated';
 import { SearchPage } from '../components/SearchPage';
 import Sidebar from '../components/Sidebar';
 import TagPage from '../components/TagPage';
+import TrashPageList from '../components/TrashPageList';
 
 import { appContainer, componentMappings } from './base';
 import { toastError } from './util/apiNotification';
@@ -94,6 +95,8 @@ Object.assign(componentMappings, {
 
   'grw-page-status-alert-container': <PageStatusAlert />,
 
+  'maintenance-mode-content': <MaintenanceModeContent />,
+
   'trash-page-alert': <TrashPageAlert />,
 
   'trash-page-list-container': <TrashPageList />,
@@ -178,6 +181,7 @@ const renderMainComponents = () => {
 
 // extract context before rendering main components
 const elem = document.getElementById('growi-context-extractor');
+console.log('elem_hoge', elem);
 if (elem != null) {
   ReactDOM.render(
     <SWRConfig value={swrGlobalConfiguration}>

packages/app/src/client/nologin.jsx

@@ -10,7 +10,6 @@ import CompleteUserRegistrationForm from '~/components/CompleteUserRegistrationF
 
 import InstallerForm from '../components/InstallerForm';
 import LoginForm from '../components/LoginForm';
-import MaintenanceModeContent from '../components/MaintenanceModeContent';
 import PasswordResetExecutionForm from '../components/PasswordResetExecutionForm';
 import PasswordResetRequestForm from '../components/PasswordResetRequestForm';
 
@@ -91,19 +90,6 @@ if (loginFormElem) {
 const appContainer = new AppContainer();
 appContainer.initApp();
 
-// render MaintenanceModeContent
-const maintenanceModeContentElm = document.getElementById('maintenance-mode-content');
-if (maintenanceModeContentElm) {
-
-  ReactDOM.render(
-    <I18nextProvider i18n={i18n}>
-      <Provider inject={[appContainer]}>
-        <MaintenanceModeContent />
-      </Provider>
-    </I18nextProvider>,
-    maintenanceModeContentElm,
-  );
-}
 
 // render PasswordResetRequestForm
 const passwordResetRequestFormElem = document.getElementById('password-reset-request-form');

packages/app/src/client/services/ContextExtractor.tsx

@@ -1,6 +1,15 @@
 import React, { FC, useEffect, useState } from 'react';
+
 import { pagePathUtils } from '@growi/core';
 
+import { IUserUISettings } from '~/interfaces/user-ui-settings';
+import {
+  useIsDeviceSmallerThanMd, useIsDeviceSmallerThanLg,
+  usePreferDrawerModeByUser, usePreferDrawerModeOnEditByUser, useSidebarCollapsed, useCurrentSidebarContents, useCurrentProductNavWidth,
+  useSelectedGrant, useSelectedGrantGroupId, useSelectedGrantGroupName,
+} from '~/stores/ui';
+import { useSetupGlobalSocket, useSetupGlobalAdminSocket } from '~/stores/websocket';
+
 import {
   useSiteUrl,
   useCurrentCreatedAt, useDeleteUsername, useDeletedAt, useHasChildren, useHasDraftOnHackmd,
@@ -10,13 +19,6 @@ import {
   useSlackChannels, useNotFoundTargetPathOrId, useIsSearchPage, useIsForbidden, useIsIdenticalPath,
   useIsAclEnabled, useIsSearchServiceConfigured, useIsSearchServiceReachable, useIsEnabledAttachTitleHeader, useIsNotFoundPermalink,
 } from '../../stores/context';
-import {
-  useIsDeviceSmallerThanMd, useIsDeviceSmallerThanLg,
-  usePreferDrawerModeByUser, usePreferDrawerModeOnEditByUser, useSidebarCollapsed, useCurrentSidebarContents, useCurrentProductNavWidth,
-  useSelectedGrant, useSelectedGrantGroupId, useSelectedGrantGroupName,
-} from '~/stores/ui';
-import { useSetupGlobalSocket, useSetupGlobalAdminSocket } from '~/stores/websocket';
-import { IUserUISettings } from '~/interfaces/user-ui-settings';
 
 const { isTrashPage: _isTrashPage } = pagePathUtils;
 

packages/app/src/components/MaintenanceModeContent.tsx

@@ -1,22 +1,24 @@
 import React from 'react';
 
-import PropTypes from 'prop-types';
 import { useTranslation } from 'react-i18next';
 
-import AppContainer from '~/client/services/AppContainer';
 import { toastError } from '~/client/util/apiNotification';
+import { apiv3Post } from '~/client/util/apiv3-client';
+import { useCurrentUser } from '~/stores/context';
 
-import { withUnstatedContainers } from './UnstatedUtils';
 
-const MaintenanceModeContent = (props) => {
+const MaintenanceModeContent = () => {
   const { t } = useTranslation();
-  const { appContainer } = props;
 
-  const isUserLoggedIn = appContainer.currentUser != null;
+  const { data: currentUser } = useCurrentUser();
+
+  console.log('currentUser', currentUser);
+
+  // const isUserLoggedIn = currentUser != null;
 
   const logoutHandler = async() => {
     try {
-      appContainer.apiv3Post('/logout');
+      apiv3Post('/logout');
       window.location.reload();
     }
     catch (err) {
@@ -31,7 +33,7 @@ const MaintenanceModeContent = (props) => {
         <i className="icon-arrow-right"></i>
         <a className="btn btn-link" href="/admin">{ t('maintenance_mode.admin_page') }</a>
       </p>
-      {isUserLoggedIn
+      {currentUser != null
         ? (
           <p>
             <i className="icon-arrow-right"></i>
@@ -41,7 +43,7 @@ const MaintenanceModeContent = (props) => {
         : (
           <p>
             <i className="icon-arrow-right"></i>
-            <a className="btn btn-link" href="/login">{ t('maintenance_mode.login') }</a>
+            <a href="/login">{ t('maintenance_mode.login') }</a>
           </p>
         )
       }
@@ -50,8 +52,5 @@ const MaintenanceModeContent = (props) => {
 
 };
 
-MaintenanceModeContent.propTypes = {
-  appContainer: PropTypes.instanceOf(AppContainer).isRequired,
-};
 
-export default withUnstatedContainers(MaintenanceModeContent, [AppContainer]);
+export default MaintenanceModeContent;

packages/app/src/server/views/maintenance-mode.html

@@ -3,13 +3,12 @@
 {% block html_title %}{{ customizeService.generateCustomTitleForFixedPageName(t('maintenance_mode.maintenance_mode')) }}{% endblock %}
 
 
+
 {#
   # Remove default contents
   #}
  {% block html_head_loading_legacy %}
  {% endblock %}
- {% block html_head_loading_app %}
- {% endblock %}
  {% block layout_head_nav %}
  {% endblock %}
  {% block sidebar %}
@@ -19,9 +18,6 @@
  {% block fixed-controls %}
  {% endblock %}
 
- {% block html_additional_headers %}
- <script src="{{ webpack_asset('js/nologin.js') }}" defer></script>
-{% endblock %}
 
 {% block layout_main %}
 <div id="main" class="main">