Share manage improve (#2718)

frontend/src/components/dialog/share-to-group.js

@@ -38,10 +38,11 @@ class GroupItem extends React.Component {
     let item = this.props.item;
     return (
       <tr onMouseEnter={this.onMouseEnter} onMouseLeave={this.onMouseLeave}>
-        <td>{item.group_info.name}</td>
+        <td className='name'>{item.group_info.name}</td>
         <td>
           <PermissionEditor 
             isTextMode={true}
+            isEditIconShow={this.state.isOperationShow}
             currentPermission={item.permission}
             permissions={this.props.permissions}
             onPermissionChangedHandler={this.onChangeUserPermission}
@@ -49,7 +50,7 @@ class GroupItem extends React.Component {
         </td>
         <td>
           <span
-            className={`sf2-icon-x3 sf2-x op-icon a-simulate ${this.state.isOperationShow ? '' : 'hide'}`}
+            className={`sf2-icon-x3 op-icon ${this.state.isOperationShow ? '' : 'hide'}`}
             onClick={this.deleteShareItem} 
             title={gettext('Delete')}
           >

frontend/src/components/dialog/share-to-user.js

@@ -37,10 +37,11 @@ class UserItem extends React.Component {
     let item = this.props.item;
     return (
       <tr onMouseEnter={this.onMouseEnter} onMouseLeave={this.onMouseLeave}>
-        <td>{item.user_info.nickname}</td>
+        <td className="name">{item.user_info.nickname}</td>
         <td>
           <PermissionEditor 
             isTextMode={true}
+            isEditIconShow={this.state.isOperationShow}
             currentPermission={item.permission}
             permissions={this.props.permissions}
             onPermissionChangedHandler={this.onChangeUserPermission}
@@ -48,7 +49,7 @@ class UserItem extends React.Component {
         </td>
         <td>
           <span
-            className={`sf2-icon-x3 sf2-x op-icon a-simulate ${this.state.isOperationShow ? '' : 'hide'}`}
+            className={`sf2-icon-x3 op-icon ${this.state.isOperationShow ? '' : 'hide'}`}
             onClick={this.deleteShareItem} 
             title={gettext('Delete')}
           >
@@ -287,6 +288,7 @@ class ShareToUser extends React.Component {
             <td>
               <PermissionEditor 
                 isTextMode={false}
+                isEditIconShow={this.state.isOperationShow}
                 currentPermission={this.state.permission}
                 permissions={this.permissions}
                 onPermissionChangedHandler={this.setPermission}

frontend/src/components/dirent-list-view/dirent-list-item.js

@@ -413,7 +413,7 @@ class DirentListItem extends React.Component {
           </td>
           <td className="icon">
             <div className="dir-icon">
-              <img src={dirent.type === 'dir' ? siteRoot + 'media/img/folder-192.png' : siteRoot + 'media/img/file/192/txt.png'} alt={gettext('file icon')}></img>
+              <img src={dirent.type === 'dir' ? siteRoot + 'media/img/folder-192.png' : siteRoot + 'media/img/file/192/txt.png'} alt=''></img>
               {dirent.is_locked && <img className="locked" src={siteRoot + 'media/img/file-locked-32.png'} alt={gettext('locked')}></img>}
             </div>
           </td>

frontend/src/components/permission-editor.js

@@ -1,10 +1,12 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { Utils } from '../utils/utils';
 import { Input } from 'reactstrap';
+import { Utils } from '../utils/utils';
+import { gettext } from '../utils/constants';
 
 const propTypes = {
   isTextMode: PropTypes.bool.isRequired, // there will be two mode. first: text and select. second: just select
+  isEditIconShow: PropTypes.bool.isRequired,
   currentPermission: PropTypes.string.isRequired,
   permissions: PropTypes.array.isRequired,
   onPermissionChangedHandler: PropTypes.func.isRequired,
@@ -75,7 +77,14 @@ class PermissionEditor extends React.Component {
         {(isTextMode && !this.state.isEditing) &&
           <div>
             {Utils.sharePerms(currentPermission)}
-            <span style={{fontSize: '0.875rem', marginLeft: '0.5rem'}} className="fa fa-pencil op-icon" onClick={this.onEidtPermission}></span>
+            {this.props.isEditIconShow && (
+              <span 
+                title={gettext('Edit')} 
+                style={{fontSize: '0.875rem', marginLeft: '0.5rem'}} 
+                className="fa fa-pencil op-icon" 
+                onClick={this.onEidtPermission}>
+              </span>
+            )}
           </div>
         }
       </div>

frontend/src/components/wiki-list-view/wiki-list-view.js

@@ -35,7 +35,7 @@ class WikiListView extends Component {
       return <p className="error text-center">{errorMsg}</p>;
     } else {
       return (
-        <table className="wiki-list-table">
+        <table>
           <thead>
             <tr>
               <th width="50%">{gettext('Name')}</th>