remove NavigationContainer

src/client/js/components/Navbar/GrowiSubNavigation.jsx

@@ -153,6 +153,10 @@ const GrowiSubNavigation = (props) => {
     );
   }
 
+  function onThreeStrandedButtonClicked(viewType) {
+    navigationContainer.setEditorMode(viewType);
+  }
+
   return (
     <div className={`grw-subnav d-flex align-items-center justify-content-between ${isCompactMode ? 'grw-subnav-compact d-print-none' : ''}`}>
 
@@ -194,7 +198,7 @@ const GrowiSubNavigation = (props) => {
             { !isPageInTrash && <PageReactionButtons appContainer={appContainer} pageContainer={pageContainer} /> }
           </div>
           <div className="mt-2">
-            <ThreeStrandedButton />
+            <ThreeStrandedButton onThreeStrandedButtonClicked={onThreeStrandedButtonClicked} />
           </div>
         </div>
 

src/client/js/components/Navbar/ThreeStrandedButton.jsx

@@ -1,15 +1,14 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { withTranslation } from 'react-i18next';
-import { withUnstatedContainers } from '../UnstatedUtils';
-
-import NavigationContainer from '../../services/NavigationContainer';
 
 const ThreeStrandedButton = (props) => {
-  const { t, navigationContainer } = props;
+  const { t } = props;
 
   function threeStrandedButtonClickedHandler(viewType) {
-    navigationContainer.setEditorMode(viewType);
+    if (props.onThreeStrandedButtonClicked != null) {
+      props.onThreeStrandedButtonClicked(viewType);
+    }
   }
 
   return (
@@ -31,16 +30,10 @@ const ThreeStrandedButton = (props) => {
 
 };
 
-/**
- * Wrapper component for using unstated
- */
-const ThreeStrandedButtonWrapper = withUnstatedContainers(ThreeStrandedButton, [NavigationContainer]);
-
 ThreeStrandedButton.propTypes = {
   t: PropTypes.func.isRequired, //  i18next
 
-  navigationContainer: PropTypes.object.isRequired,
   onThreeStrandedButtonClicked: PropTypes.func,
 };
 
-export default withTranslation()(ThreeStrandedButtonWrapper);
+export default withTranslation()(ThreeStrandedButton);

src/client/js/services/NavigationContainer.js

@@ -19,7 +19,7 @@ export default class NavigationContainer extends Container {
     const { localStorage } = window;
 
     this.state = {
-      editorMode: null,
+      editorMode: 'view',
 
       isDeviceSmallerThanMd: null,
       preferDrawerModeByUser: localStorage.preferDrawerModeByUser === 'true',