pass isBtnDisabled to ThreeStrandedButton

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

@@ -145,6 +145,7 @@ const GrowiSubNavigation = (props) => {
     isForbidden: isPageForbidden, pageUser, isCreatable,
   } = pageContainer.state;
 
+  const { currentUser } = appContainer;
   const isPageNotFound = pageId == null;
   const isUserPage = pageUser != null;
   const isPageInTrash = isTrashPage(path);
@@ -195,7 +196,7 @@ const GrowiSubNavigation = (props) => {
             { !isPageNotFound && !isPageForbidden && <PageManagement /> }
           </div>
           <div className="mt-2">
-            { !isCreatable && <ThreeStrandedButton onThreeStrandedButtonClicked={onThreeStrandedButtonClicked} />}
+            { !isCreatable && <ThreeStrandedButton onThreeStrandedButtonClicked={onThreeStrandedButtonClicked} isBtnDisabled={currentUser == null} />}
           </div>
         </div>
 

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

@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
 import { withTranslation } from 'react-i18next';
 
 const ThreeStrandedButton = (props) => {
-  const { t } = props;
+  const { t, isBtnDisabled } = props;
 
   function threeStrandedButtonClickedHandler(viewType) {
     if (props.onThreeStrandedButtonClicked != null) {
@@ -17,6 +17,7 @@ const ThreeStrandedButton = (props) => {
         type="button"
         className="btn btn-outline-primary view-button"
         onClick={() => { threeStrandedButtonClickedHandler('view') }}
+        disabled={isBtnDisabled}
       >
         <i className="icon-control-play icon-fw" />
         { t('view') }
@@ -25,6 +26,7 @@ const ThreeStrandedButton = (props) => {
         type="button"
         className="btn btn-outline-primary edit-button"
         onClick={() => { threeStrandedButtonClickedHandler('edit') }}
+        disabled={isBtnDisabled}
       >
         <i className="icon-note icon-fw" />
         { t('Edit') }
@@ -33,6 +35,7 @@ const ThreeStrandedButton = (props) => {
         type="button"
         className="btn btn-outline-primary hackmd-button"
         onClick={() => { threeStrandedButtonClickedHandler('hackmd') }}
+        disabled={isBtnDisabled}
       >
         <i className="fa fa-fw fa-file-text-o" />
         { t('hackmd.hack_md') }
@@ -45,6 +48,7 @@ const ThreeStrandedButton = (props) => {
 ThreeStrandedButton.propTypes = {
   t: PropTypes.func.isRequired, //  i18next
   onThreeStrandedButtonClicked: PropTypes.func,
+  isBtnDisabled: PropTypes.bool,
 };
 
 export default withTranslation()(ThreeStrandedButton);