Active item bug repair (#3260)

* repair interactive bug

* modify active color

* repair bug

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

@@ -303,10 +303,14 @@ class DirentListView extends React.Component {
       this.handleContextClick(event, id, menuList);
     } else {
       if (this.props.selectedDirentList.length === 1) {
-        let dirent = this.props.selectedDirentList[0];
-        let id = 'dirent-item-menu';
-        let menuList = this.getDirentItemMenuList(dirent, true);
-        this.handleContextClick(event, id, menuList, dirent);
+        this.props.onDirentClick(null);
+        event.preventDefault();
+        event.persist();
+        setTimeout(() => {
+          let id = "dirent-container-menu"
+          let menuList = [TextTranslation.NEW_FOLDER, TextTranslation.NEW_FILE];
+          this.handleContextClick(event, id, menuList);
+        }, 0);
       } else {
         let id = 'dirents-menu';
         let menuList = [TextTranslation.MOVE, TextTranslation.COPY, TextTranslation.DOWNLOAD, TextTranslation.DELETE];
@@ -366,12 +370,11 @@ class DirentListView extends React.Component {
   }
 
   onItemContextMenu = (event, dirent) => {
-    if (this.props.selectedDirentList.length === 0) {
+    this.props.onDirentClick(dirent);
     let id = 'dirent-item-menu';
     let menuList = this.getDirentItemMenuList(dirent, true);
     this.handleContextClick(event, id, menuList, dirent);
   }
-  }
 
   setDirentItemRef = (index) => item => {
     this.direntItems[index] = item;

frontend/src/components/tree-view/tree-view.js

@@ -137,9 +137,6 @@ class TreeView extends React.Component {
   }
   
   handleContextClick = (event, node) => {
-    if (this.props.selectedDirentList.length) {
-      return;
-    }
     event.preventDefault();
     event.stopPropagation();
 

frontend/src/pages/lib-content-view/lib-content-view.js

@@ -749,12 +749,20 @@ class LibContentView extends React.Component {
       dirent.isSelected = false;
       return dirent;
     });
+    if (dirent) {
       dirent.isSelected = true;
       this.setState({
         direntList: direntList,
         isDirentSelected: true,
         selectedDirentList: [dirent],
-    })
+      });
+    } else {
+      this.setState({
+        direntList: direntList,
+        isDirentSelected: false,
+        selectedDirentList: [],
+      });
+    }
   }
 
   onItemClick = (dirent) => {

media/css/seahub_react.css

@@ -908,7 +908,7 @@ table td {
 }
 
 .tr-active {
-    background-color: #eee !important;
+    background-color: #f2f4f6 !important;
 }
 
 /* table-item reanme-component */