Browse Source

add validation like a ShareLink icon

kaoritokashiki 5 năm trước cách đây
mục cha
commit
40302d64e4
1 tập tin đã thay đổi với 42 bổ sung11 xóa
  1. 42 11
      src/client/js/components/Page/PageManagement.jsx

+ 42 - 11
src/client/js/components/Page/PageManagement.jsx

@@ -1,5 +1,6 @@
 import React, { useState } from 'react';
 import PropTypes from 'prop-types';
+import { UncontrolledTooltip } from 'reactstrap';
 import { withTranslation } from 'react-i18next';
 
 import { isTopPage } from '@commons/util/path-utils';
@@ -112,19 +113,49 @@ const PageManagement = (props) => {
     );
   }
 
+  function renderCurrentUser() {
+    return (
+      <>
+        <a
+          role="button"
+          className={`nav-link dropdown-toggle dropdown-toggle-no-caret ${currentUser == null && 'dropdown-toggle-disabled'}`}
+          href="#"
+          data-toggle={`${currentUser == null ? 'tooltip' : 'dropdown'}`}
+          data-placement="top"
+          data-container="body"
+          title={t('Not available for guest')}
+        >
+          <i className="icon-options-vertical"></i>
+        </a>
+      </>
+    );
+  }
+
+  function renderGuestUser() {
+    return (
+      <>
+        <a
+          role="button"
+          className="nav-link dropdown-toggle dropdown-toggle-no-caret dropdown-toggle-disabled"
+          data-toggle={`${currentUser == null ? 'tooltip' : 'dropdown'}`}
+          id="icon-options-guest-tltips"
+          // data-placement="top"
+          // data-container="body"
+          // title={t('Not available for guest')}
+        >
+          <i className="icon-options-vertical"></i>
+        </a>
+        {/* <UncontrolledTooltip placement="top" id="icon-options-guest-tltips">
+          {t('Not available for guest')}
+        </UncontrolledTooltip> */}
+      </>
+    );
+  }
+
+
   return (
     <>
-      <a
-        role="button"
-        className={`nav-link dropdown-toggle dropdown-toggle-no-caret ${currentUser == null && 'dropdown-toggle-disabled'}`}
-        href="#"
-        data-toggle={`${currentUser == null ? 'tooltip' : 'dropdown'}`}
-        data-placement="top"
-        data-container="body"
-        title={t('Not available for guest')}
-      >
-        <i className="icon-options-vertical"></i>
-      </a>
+      {currentUser == null ? renderGuestUser() : renderCurrentUser()}
       <div className="dropdown-menu dropdown-menu-right">
         {!isTopPagePath && renderDropdownItemForNotTopPage()}
         <button className="dropdown-item" type="button" onClick={openPageTemplateModalHandler}>