feat: refresh metadata view (#7110)

* feat: refresh metadata view

* feat: optimize code

* feat: optimize tip

---------

Co-authored-by: 杨国璇 <ygx@192.168.1.2>
Co-authored-by: 杨国璇 <ygx@Hello-word.local>

frontend/src/components/cur-dir-path/dir-path.js

@@ -1,5 +1,6 @@
 import React, { Fragment } from 'react';
 import PropTypes from 'prop-types';
+import { UncontrolledTooltip } from 'reactstrap';
 import { Link } from '@gatsbyjs/reach-router';
 import DirOperationToolBar from '../../components/toolbar/dir-operation-toolbar';
 import MetadataViewName from '../../metadata/components/metadata-view-name';
@@ -7,6 +8,8 @@ import TagViewName from '../../tag/components/tag-view-name';
 import { siteRoot, gettext } from '../../utils/constants';
 import { Utils } from '../../utils/utils';
 import { PRIVATE_FILE_TYPE } from '../../constants';
+import { debounce } from '../../metadata/utils/common';
+import { EVENT_BUS_TYPE } from '../../metadata/constants';
 
 const propTypes = {
   currentRepoInfo: PropTypes.object.isRequired,
@@ -115,6 +118,10 @@ class DirPath extends React.Component {
     });
   };
 
+  handelRefresh = debounce(() => {
+    window.sfMetadataContext.eventBus.dispatch(EVENT_BUS_TYPE.RELOAD_DATA);
+  }, 200);
+
   turnPathToLink = (path) => {
     path = path[path.length - 1] === '/' ? path.slice(0, path.length - 1) : path;
     let pathList = path.split('/');
@@ -149,6 +156,12 @@ class DirPath extends React.Component {
           <Fragment key={index}>
             <span className="path-split">/</span>
             <span className="path-item"><MetadataViewName id={item} /></span>
+            <div className="path-item-refresh" id="sf-metadata-view-refresh" onClick={this.handelRefresh}>
+              <i className="sf3-font sf3-font-refresh"></i>
+              <UncontrolledTooltip target="sf-metadata-view-refresh" placement="bottom">
+                {gettext('Refresh the page')}
+              </UncontrolledTooltip>
+            </div>
           </Fragment>
         );
       }

frontend/src/css/lib-content-view.css

@@ -273,6 +273,28 @@
   background: #efefef;
 }
 
+.dir-view-path .path-item-refresh {
+  height: 24px;
+  width: 24px;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  margin-left: 2px;
+  border-radius: 3px;
+}
+
+.dir-view-path .path-item-refresh:hover {
+  background: #efefef;
+}
+
+.dir-view-path .sf3-font-refresh {
+  transform: rotateY(180deg);
+  color: #666;
+  cursor: pointer;
+  font-size: 14px;
+  display: inline-block;
+}
+
 .dir-view-path .path-item-dropdown-toggle {
   color: #666;
 }

frontend/src/metadata/third-party/trello-smooth-dnd/utils.js

@@ -207,23 +207,6 @@ export const removeClass = (element, cls) => {
   }
 };
 
-export const debounce = (fn, delay, immediate) => {
-  let timer = null;
-  return (...params) => {
-    if (timer) {
-      clearTimeout(timer);
-    }
-    if (immediate && !timer) {
-      fn.call(this, ...params);
-    } else {
-      timer = setTimeout(() => {
-        timer = null;
-        fn.call(this, ...params);
-      }, delay);
-    }
-  };
-};
-
 export const removeChildAt = (parent, index) => {
   return parent.removeChild(parent.children[index]);
 };

frontend/src/metadata/utils/common.js

@@ -59,11 +59,20 @@ export const isEmptyObject = (obj) => {
   return true;
 };
 
-export const debounce = (fn, wait) => {
+export const debounce = (fn, delay, immediate) => {
-  let timeout = null;
+  let timer = null;
-  return function () {
+  return (...params) => {
-    if (timeout !== null) clearTimeout(timeout);
+    if (timer) {
-    timeout = setTimeout(fn, wait);
+      clearTimeout(timer);
+    }
+    if (immediate && !timer) {
+      fn.call(this, ...params);
+    } else {
+      timer = setTimeout(() => {
+        timer = null;
+        fn.call(this, ...params);
+      }, delay);
+    }
   };
 };
 

frontend/src/tag/views/tag-files/tag-file/index.js

@@ -105,7 +105,7 @@ const TagFile = ({ isSelected, repoID, file, onSelectFile, reSelectFiles, openIm
       </td>
       <td className="pl-2 pr-2">
         <div className="dir-icon">
-          <img src={displayIcon} onError={onIconLoadError} className="thumbnail cursor-pointer" alt="" />
+          <img src={displayIcon} onError={onIconLoadError} className="thumbnail cursor-pointer" alt="" onClick={handelClickFileName} />
         </div>
       </td>
       <td className="name">

media/css/sf_font3/iconfont.css

@@ -1,11 +1,11 @@
 @font-face {
   font-family: "sf3-font"; /* Project id 1230969 */
-  src: url('iconfont.eot?t=1732504469237'); /* IE9 */
+  src: url('iconfont.eot?t=1732614348756'); /* IE9 */
-  src: url('iconfont.eot?t=1732504469237#iefix') format('embedded-opentype'), /* IE6-IE8 */
+  src: url('iconfont.eot?t=1732614348756#iefix') format('embedded-opentype'), /* IE6-IE8 */
-       url('iconfont.woff2?t=1732504469237') format('woff2'),
+       url('iconfont.woff2?t=1732614348756') format('woff2'),
-       url('iconfont.woff?t=1732504469237') format('woff'),
+       url('iconfont.woff?t=1732614348756') format('woff'),
-       url('iconfont.ttf?t=1732504469237') format('truetype'),
+       url('iconfont.ttf?t=1732614348756') format('truetype'),
-       url('iconfont.svg?t=1732504469237#sf3-font') format('svg');
+       url('iconfont.svg?t=1732614348756#sf3-font') format('svg');
 }
 
 .sf3-font {

seahub/repo_metadata/apis.py

@@ -1691,8 +1691,6 @@ class MetadataTagFiles(APIView):
 
         if not tag_files_record_ids:
             return Response({ 'metadata': [], 'results': [] })
-        
-        print(tag_files_record_ids)
 
         tag_files_sql = 'SELECT `%s`, `%s`, `%s`, `%s`, `%s`, `%s` FROM %s WHERE `%s` IN (%s)' % (METADATA_TABLE.columns.id.name, METADATA_TABLE.columns.file_name.name, \
                                                                                     METADATA_TABLE.columns.parent_dir.name, METADATA_TABLE.columns.size.name, \