remove NavigationContainer

packages/app/src/client/admin.jsx

@@ -25,8 +25,6 @@ import ExportArchiveDataPage from '../components/Admin/ExportArchiveDataPage';
 import FullTextSearchManagement from '../components/Admin/FullTextSearchManagement';
 import AdminNavigation from '../components/Admin/Common/AdminNavigation';
 
-import NavigationContainer from '~/client/services/NavigationContainer';
-
 import AdminSocketIoContainer from '~/client/services/AdminSocketIoContainer';
 import AdminHomeContainer from '~/client/services/AdminHomeContainer';
 import AdminCustomizeContainer from '~/client/services/AdminCustomizeContainer';
@@ -57,7 +55,6 @@ appContainer.initContents();
 const { i18n } = appContainer;
 
 // create unstated container instance
-const navigationContainer = new NavigationContainer(appContainer);
 const adminAppContainer = new AdminAppContainer(appContainer);
 const adminImportContainer = new AdminImportContainer(appContainer);
 const adminSocketIoContainer = new AdminSocketIoContainer(appContainer);
@@ -71,7 +68,6 @@ const adminMarkDownContainer = new AdminMarkDownContainer(appContainer);
 const adminUserGroupDetailContainer = new AdminUserGroupDetailContainer(appContainer);
 const injectableContainers = [
   appContainer,
-  navigationContainer,
   adminAppContainer,
   adminImportContainer,
   adminSocketIoContainer,

packages/app/src/client/app.jsx

@@ -42,7 +42,6 @@ import GrowiSubNavigation from '../components/Navbar/GrowiSubNavigation';
 import GrowiSubNavigationSwitcher from '../components/Navbar/GrowiSubNavigationSwitcher';
 
 import ContextExtractor from '~/client/services/ContextExtractor';
-import NavigationContainer from '~/client/services/NavigationContainer';
 import PageContainer from '~/client/services/PageContainer';
 import PageHistoryContainer from '~/client/services/PageHistoryContainer';
 import RevisionComparerContainer from '~/client/services/RevisionComparerContainer';
@@ -62,7 +61,6 @@ const { i18n } = appContainer;
 const socketIoContainer = appContainer.getContainer('SocketIoContainer');
 
 // create unstated container instance
-const navigationContainer = new NavigationContainer(appContainer);
 const pageContainer = new PageContainer(appContainer);
 const pageHistoryContainer = new PageHistoryContainer(appContainer, pageContainer);
 const revisionComparerContainer = new RevisionComparerContainer(appContainer, pageContainer);
@@ -72,7 +70,7 @@ const tagContainer = new TagContainer(appContainer);
 const personalContainer = new PersonalContainer(appContainer);
 const pageAccessoriesContainer = new PageAccessoriesContainer(appContainer);
 const injectableContainers = [
-  appContainer, socketIoContainer, navigationContainer, pageContainer, pageHistoryContainer, revisionComparerContainer,
+  appContainer, socketIoContainer, pageContainer, pageHistoryContainer, revisionComparerContainer,
   commentContainer, editorContainer, tagContainer, personalContainer, pageAccessoriesContainer,
 ];
 

packages/app/src/client/legacy/crowi.js

@@ -16,8 +16,6 @@ window.Crowi = Crowi;
  */
 Crowi.setCaretLineData = function(line) {
   const { appContainer } = window;
-  const navigationContainer = appContainer.getContainer('NavigationContainer');
-  // navigationContainer.setEditorMode('edit');
   const pageEditorDom = document.querySelector('#page-editor');
   pageEditorDom.setAttribute('data-caret-line', line);
 };
@@ -228,18 +226,13 @@ window.addEventListener('hashchange', (e) => {
   Crowi.unblinkSelectedSection(Crowi.findHashFromUrl(e.oldURL));
   Crowi.blinkSelectedSection(Crowi.findHashFromUrl(e.newURL));
   Crowi.modifyScrollTop();
-  // const { appContainer } = window;
-  // const navigationContainer = appContainer.getContainer('NavigationContainer');
-
 
   // hash on page
   if (window.location.hash) {
     if (window.location.hash === '#edit') {
-      // navigationContainer.setEditorMode('edit');
       Crowi.setCaretLineAndFocusToEditor();
     }
     else if (window.location.hash === '#hackmd') {
-      // navigationContainer.setEditorMode('hackmd');
     }
   }
 });

packages/app/src/client/services/NavigationContainer.js

@@ -1,159 +0,0 @@
-import { Container } from 'unstated';
-import loggerFactory from '~/utils/logger';
-
-const logger = loggerFactory('growi:services:NavigationContainer');
-
-/**
- * Service container related to options for Application
- * @extends {Container} unstated Container
- */
-
-const SCROLL_THRES_SKIP = 200;
-const WIKI_HEADER_LINK = 120;
-
-export default class NavigationContainer extends Container {
-
-  constructor(appContainer) {
-    super();
-
-    this.appContainer = appContainer;
-    this.appContainer.registerContainer(this);
-
-    const { localStorage } = window;
-
-    this.state = {
-      // editorMode: 'view',
-
-      // isScrollTop: true,
-    };
-
-    // this.setEditorMode = this.setEditorMode.bind(this);
-    // this.initScrollEvent();
-  }
-
-  /**
-   * Workaround for the mangling in production build to break constructor.name
-   */
-  static getClassName() {
-    return 'NavigationContainer';
-  }
-
-  getPageContainer() {
-    return this.appContainer.getContainer('PageContainer');
-  }
-
-  initScrollEvent() {
-    // window.addEventListener('scroll', () => {
-    //   const currentYOffset = window.pageYOffset;
-
-    //   // original throttling
-    //   if (SCROLL_THRES_SKIP < currentYOffset) {
-    //     return;
-    //   }
-
-    //   this.setState({
-    //     isScrollTop: currentYOffset === 0,
-    //   });
-    // });
-  }
-
-  // setEditorMode(editorMode) {
-  //   const { isNotCreatable } = this.getPageContainer().state;
-
-  //   if (this.appContainer.currentUser == null) {
-  //     logger.warn('Please login or signup to edit the page or use hackmd.');
-  //     return;
-  //   }
-
-  //   if (isNotCreatable) {
-  //     logger.warn('This page could not edit.');
-  //     return;
-  //   }
-
-  //   this.setState({ editorMode });
-  //   if (editorMode === 'view') {
-  //     $('body').removeClass('on-edit');
-  //     $('body').removeClass('builtin-editor');
-  //     $('body').removeClass('hackmd');
-  //     $('body').removeClass('pathname-sidebar');
-  //     window.history.replaceState(null, '', window.location.pathname);
-  //   }
-
-  //   if (editorMode === 'edit') {
-  //     $('body').addClass('on-edit');
-  //     $('body').addClass('builtin-editor');
-  //     $('body').removeClass('hackmd');
-  //     // editing /Sidebar
-  //     if (window.location.pathname === '/Sidebar') {
-  //       $('body').addClass('pathname-sidebar');
-  //     }
-  //     window.location.hash = '#edit';
-  //   }
-
-  //   if (editorMode === 'hackmd') {
-  //     $('body').addClass('on-edit');
-  //     $('body').addClass('hackmd');
-  //     $('body').removeClass('builtin-editor');
-  //     $('body').removeClass('pathname-sidebar');
-  //     window.location.hash = '#hackmd';
-  //   }
-
-  //   this.updateDrawerMode({ ...this.state, editorMode }); // generate newest state object
-  // }
-
-  /**
-   * Update drawer related state by specified 'newState' object
-   * @param {object} newState A newest state object
-   *
-   * Specify 'newState' like following code:
-   *
-   *   { ...this.state, overwriteParam: overwriteValue }
-   *
-   * because updating state of unstated container will be delayed unless you use await
-   */
-  // updateDrawerMode(newState) {
-  //   const {
-  //     editorMode, isDeviceSmallerThanMd, preferDrawerModeByUser, preferDrawerModeOnEditByUser,
-  //   } = newState;
-
-  //   // get preference on view or edit
-  //   const preferDrawerMode = editorMode !== 'view' ? preferDrawerModeOnEditByUser : preferDrawerModeByUser;
-
-  //   const isDrawerMode = isDeviceSmallerThanMd || preferDrawerMode;
-  //   const isDrawerOpened = false; // close Drawer anyway
-
-  //   this.setState({ isDrawerMode, isDrawerOpened });
-  // }
-
-  /**
-   * Function that implements the click event for realizing smooth scroll
-   * @param {array} elements
-   */
-  // addSmoothScrollEvent(elements = {}) {
-  //   elements.forEach(link => link.addEventListener('click', (e) => {
-  //     // modify location.hash without scroll
-  //     e.preventDefault();
-  //     window.history.pushState({}, '', link.href);
-
-  //     // smooth scroll
-  //     const href = link.getAttribute('href').replace('#', '');
-  //     const targetDom = document.getElementById(href);
-  //     this.smoothScrollIntoView(targetDom, WIKI_HEADER_LINK);
-  //   }));
-  // }
-
-  // smoothScrollIntoView(element = null, offsetTop = 0) {
-  //   const targetElement = element || window.document.body;
-
-  //   // get the distance to the target element top
-  //   const rectTop = targetElement.getBoundingClientRect().top;
-
-  //   const top = window.pageYOffset + rectTop - offsetTop;
-
-  //   window.scrollTo({
-  //     top,
-  //     behavior: 'smooth',
-  //   });
-  // }
-
-}

packages/app/src/components/Hotkeys/Subscribers/EditPage.jsx

@@ -1,8 +1,6 @@
 import React, { useEffect } from 'react';
 import PropTypes from 'prop-types';
 
-import NavigationContainer from '~/client/services/NavigationContainer';
-import { withUnstatedContainers } from '../../UnstatedUtils';
 import { EditorMode, useEditorMode } from '~/stores/ui';
 
 const EditPage = (props) => {
@@ -25,14 +23,11 @@ const EditPage = (props) => {
 };
 
 EditPage.propTypes = {
-  navigationContainer: PropTypes.instanceOf(NavigationContainer).isRequired,
   onDeleteRender: PropTypes.func.isRequired,
 };
 
-const EditPageWrapper = withUnstatedContainers(EditPage, [NavigationContainer]);
-
-EditPageWrapper.getHotkeyStrokes = () => {
+EditPage.getHotkeyStrokes = () => {
   return [['e']];
 };
 
-export default EditPageWrapper;
+export default EditPage;

packages/app/src/components/Navbar/GlobalSearch.jsx

@@ -4,7 +4,6 @@ import { withTranslation } from 'react-i18next';
 
 import { withUnstatedContainers } from '../UnstatedUtils';
 import AppContainer from '~/client/services/AppContainer';
-import NavigationContainer from '~/client/services/NavigationContainer';
 
 import SearchForm from '../SearchForm';
 
@@ -97,7 +96,6 @@ class GlobalSearch extends React.Component {
 GlobalSearch.propTypes = {
   t: PropTypes.func.isRequired, // i18next
   appContainer: PropTypes.instanceOf(AppContainer).isRequired,
-  navigationContainer: PropTypes.instanceOf(NavigationContainer).isRequired,
 
   dropup: PropTypes.bool,
 };
@@ -105,6 +103,6 @@ GlobalSearch.propTypes = {
 /**
  * Wrapper component for using unstated
  */
-const GlobalSearchWrapper = withUnstatedContainers(GlobalSearch, [AppContainer, NavigationContainer]);
+const GlobalSearchWrapper = withUnstatedContainers(GlobalSearch, [AppContainer]);
 
 export default withTranslation()(GlobalSearchWrapper);

packages/app/src/components/Navbar/GrowiNavbarBottom.jsx

@@ -1,18 +1,12 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 
-import NavigationContainer from '~/client/services/NavigationContainer';
 import { usePageCreateModalOpened, useIsDeviceSmallerThanMd, useDrawerOpened } from '~/stores/ui';
 
-import { withUnstatedContainers } from '../UnstatedUtils';
 import GlobalSearch from './GlobalSearch';
 
 const GrowiNavbarBottom = (props) => {
 
-  const {
-    navigationContainer,
-  } = props;
-
   const { data: isDrawerOpened, mutate: mutateDrawerOpened } = useDrawerOpened();
   const { data: isDeviceSmallerThanMd } = useIsDeviceSmallerThanMd();
   const { mutate: mutatePageCreateModalOpened } = usePageCreateModalOpened();
@@ -71,8 +65,5 @@ const GrowiNavbarBottom = (props) => {
   );
 };
 
-GrowiNavbarBottom.propTypes = {
-  navigationContainer: PropTypes.instanceOf(NavigationContainer).isRequired,
-};
 
-export default withUnstatedContainers(GrowiNavbarBottom, [NavigationContainer]);
+export default GrowiNavbarBottom;

packages/app/src/components/Navbar/PersonalDropdown.jsx

@@ -11,7 +11,6 @@ import { scheduleToPutUserUISettings } from '~/client/services/user-ui-settings'
 import AppContainer from '~/client/services/AppContainer';
 
 import { withUnstatedContainers } from '../UnstatedUtils';
-import NavigationContainer from '~/client/services/NavigationContainer';
 import { usePreferDrawerModeByUser, usePreferDrawerModeOnEditByUser } from '~/stores/ui';
 
 import {

packages/app/src/components/Navbar/SubNavButtons.jsx

@@ -1,7 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import AppContainer from '~/client/services/AppContainer';
-import NavigationContainer from '~/client/services/NavigationContainer';
 import PageContainer from '~/client/services/PageContainer';
 import { EditorMode, useEditorMode } from '~/stores/ui';
 import { withUnstatedContainers } from '../UnstatedUtils';
@@ -12,7 +11,7 @@ import PageManagement from '../Page/PageManagement';
 
 const SubnavButtons = (props) => {
   const {
-    appContainer, navigationContainer, pageContainer, isCompactMode,
+    appContainer, pageContainer, isCompactMode,
   } = props;
 
   const { data: editorMode } = useEditorMode();
@@ -52,12 +51,11 @@ const SubnavButtons = (props) => {
 /**
  * Wrapper component for using unstated
  */
-const SubnavButtonsWrapper = withUnstatedContainers(SubnavButtons, [AppContainer, NavigationContainer, PageContainer]);
+const SubnavButtonsWrapper = withUnstatedContainers(SubnavButtons, [AppContainer, PageContainer]);
 
 
 SubnavButtons.propTypes = {
   appContainer: PropTypes.instanceOf(AppContainer).isRequired,
-  navigationContainer: PropTypes.instanceOf(NavigationContainer).isRequired,
   pageContainer: PropTypes.instanceOf(PageContainer).isRequired,
 
   isCompactMode: PropTypes.bool,

packages/app/src/components/Sidebar/SidebarNav.tsx

@@ -18,13 +18,11 @@ const PrimaryItem: FC<PrimaryItemProps> = (props: PrimaryItemProps) => {
     contents, iconName, onItemSelected,
   } = props;
 
-  // TODO: migrate from NavigationContainer
   const { data: currentContents, mutate } = useCurrentSidebarContents();
 
   const isSelected = contents === currentContents;
 
   const itemSelectedHandler = useCallback(() => {
-    // const { navigationContainer, onItemSelected } = this.props;
     if (onItemSelected != null) {
       onItemSelected(contents);
     }