Przeglądaj źródła

success to show and hide bookmark button by modes

kaori 5 lat temu
rodzic
commit
ac9ecaee81
1 zmienionych plików z 28 dodań i 16 usunięć
  1. 28 16
      src/client/js/components/LikeButton.jsx

+ 28 - 16
src/client/js/components/LikeButton.jsx

@@ -8,6 +8,8 @@ import { withUnstatedContainers } from './UnstatedUtils';
 import { toastError } from '../util/apiNotification';
 import AppContainer from '../services/AppContainer';
 import PageContainer from '../services/PageContainer';
+import NavigationContainer from '../services/NavigationContainer';
+
 
 class LikeButton extends React.Component {
 
@@ -33,25 +35,35 @@ class LikeButton extends React.Component {
     }
   }
 
-
   render() {
-    const { appContainer, pageContainer, t } = this.props;
+    const {
+      appContainer, navigationContainer, pageContainer, t,
+    } = this.props;
     const { isGuestUser } = appContainer;
+    const { editorMode } = navigationContainer.state;
+
+    const isEditorMode = editorMode !== 'view';
+    console.log(`isEditorMode === ${isEditorMode}`);
+
 
     return (
       <div>
-        <button
-          type="button"
-          id="like-button"
-          onClick={this.handleClick}
-          className={`btn btn-like border-0
-          ${pageContainer.state.isLiked ? 'active' : ''} ${isGuestUser ? 'disabled' : ''}`}
-        >
-          <i className="icon-like mr-3"></i>
-          <span className="total-likes">
-            {pageContainer.state.sumOfLikers}
-          </span>
-        </button>
+        {!isEditorMode
+          && (
+          <button
+            type="button"
+            id="like-button"
+            onClick={this.handleClick}
+            className={`btn btn-like border-0
+            ${pageContainer.state.isLiked ? 'active' : ''} ${isGuestUser ? 'disabled' : ''}`}
+          >
+            <i className="icon-like mr-3"></i>
+            <span className="total-likes">
+              {pageContainer.state.sumOfLikers}
+            </span>
+          </button>
+          )
+        }
 
         {isGuestUser && (
         <UncontrolledTooltip placement="top" target="like-button" fade={false}>
@@ -67,12 +79,12 @@ class LikeButton extends React.Component {
 /**
  * Wrapper component for using unstated
  */
-const LikeButtonWrapper = withUnstatedContainers(LikeButton, [AppContainer, PageContainer]);
+const LikeButtonWrapper = withUnstatedContainers(LikeButton, [AppContainer, NavigationContainer, PageContainer]);
 
 LikeButton.propTypes = {
   appContainer: PropTypes.instanceOf(AppContainer).isRequired,
+  navigationContainer: PropTypes.instanceOf(NavigationContainer).isRequired,
   pageContainer: PropTypes.instanceOf(PageContainer).isRequired,
-
   t: PropTypes.func.isRequired,
   size: PropTypes.string,
 };