[refactor] lib container view (#6766)

* [refactor] lib container view * optimize codes
haiwen · Sep 13, 2024 · 453c84f · 453c84f
1 parent 3dae590
commit 453c84f
Show file tree

Hide file tree

Showing 7 changed files with 266 additions and 515 deletions.
diff --git a/...end/src/components/dirent-detail/index.js → ...ponents/dirent-detail/detail-container.js b/...end/src/components/dirent-detail/index.js → ...ponents/dirent-detail/detail-container.js
@@ -5,7 +5,7 @@ import DirentDetail from './dirent-details';
 import ObjectUtils from '../../metadata/metadata-view/utils/object-utils';
 import { MetadataContext } from '../../metadata';
 
-const Index = React.memo(({ repoID, path, dirent, currentRepoInfo, repoTags, fileTags, onClose, onFileTagChanged }) => {
+const DetailContainer = React.memo(({ repoID, path, dirent, currentRepoInfo, repoTags, fileTags, onClose, onFileTagChanged }) => {
 
   useEffect(() => {
     // init context
@@ -45,7 +45,7 @@ const Index = React.memo(({ repoID, path, dirent, currentRepoInfo, repoTags, fil
   return !isChanged;
 });
 
-Index.propTypes = {
+DetailContainer.propTypes = {
   repoID: PropTypes.string,
   path: PropTypes.string,
   dirent: PropTypes.object,
@@ -56,4 +56,4 @@ Index.propTypes = {
   onFileTagChanged: PropTypes.func,
 };
 
-export default Index;
+export default DetailContainer;
diff --git a/frontend/src/components/dirent-detail/dirent-details/index.js b/frontend/src/components/dirent-detail/dirent-details/index.js
@@ -101,15 +101,15 @@ class DirentDetails extends React.Component {
           {this.renderImage()}
           {dirent && direntDetail && (
             <div className="detail-content">
-              {dirent.type !== 'file' ? (
+              {dirent.type !== 'file' ?
                 <DirDetails
                   repoID={repoID}
                   repoInfo={this.props.currentRepoInfo}
                   dirent={dirent}
                   direntDetail={direntDetail}
                   path={this.props.dirent ? path + '/' + dirent.name : path}
                 />
-              ) : (
+                :
                 <FileDetails
                   repoID={repoID}
                   repoInfo={this.props.currentRepoInfo}
@@ -120,7 +120,7 @@ class DirentDetails extends React.Component {
                   fileTagList={dirent ? dirent.file_tags : fileTags}
                   onFileTagChanged={this.props.onFileTagChanged}
                 />
-              )}
+              }
             </div>
           )}
         </Body>

diff --git a/...onents/dirent-detail/lib-details/index.js → ...c/components/dirent-detail/lib-details.js b/...onents/dirent-detail/lib-details/index.js → ...c/components/dirent-detail/lib-details.js
@@ -1,15 +1,15 @@
 import React, { useEffect, useMemo, useState } from 'react';
 import PropTypes from 'prop-types';
 import { Formatter } from '@seafile/sf-metadata-ui-component';
-import { Utils } from '../../../utils/utils';
-import { gettext } from '../../../utils/constants';
-import { seafileAPI } from '../../../utils/seafile-api';
-import toaster from '../../toast';
-import { Detail, Header, Body } from '../detail';
-import Repo from '../../../models/repo';
-import Loading from '../../loading';
-import DetailItem from '../detail-item';
-import { CellType } from '../../../metadata/metadata-view/_basic';
+import { Utils } from '../../utils/utils';
+import { gettext } from '../../utils/constants';
+import { seafileAPI } from '../../utils/seafile-api';
+import toaster from '../toast';
+import { Detail, Header, Body } from './detail';
+import Repo from '../../models/repo';
+import Loading from '../loading';
+import DetailItem from './detail-item';
+import { CellType } from '../../metadata/metadata-view/_basic';
 
 const LibDetail = React.memo(({ currentRepoInfo, onClose }) => {
   const [isLoading, setLoading] = useState(true);
@@ -36,9 +36,9 @@ const LibDetail = React.memo(({ currentRepoInfo, onClose }) => {
     <Detail>
       <Header title={currentRepoInfo.repo_name} icon={smallIconUrl} onClose={onClose} />
       <Body>
-        {isLoading ? (
+        {isLoading ?
           <div className="w-100 h-100 d-flex algin-items-center justify-content-center"><Loading /></div>
-        ) : (
+          :
           <div className="detail-content">
             <DetailItem field={filesField} value={repo.file_count || 0} className="sf-metadata-property-detail-formatter">
               <Formatter field={filesField} value={repo.file_count || 0} />
@@ -62,7 +62,7 @@ const LibDetail = React.memo(({ currentRepoInfo, onClose }) => {
               <Formatter field={mtimeField} value={repo.last_modified} />
             </DetailItem>
           </div>
-        )}
+        }
       </Body>
     </Detail>
   );

diff --git a/frontend/src/components/toolbar/selected-dirents-toolbar.js b/frontend/src/components/toolbar/selected-dirents-toolbar.js
@@ -42,7 +42,7 @@ const propTypes = {
   isGroupOwnedRepo: PropTypes.bool.isRequired,
 };
 
-class MultipleDirOperationToolbar extends React.Component {
+class SelectedDirentsToolbar extends React.Component {
 
   constructor(props) {
     super(props);
@@ -471,6 +471,6 @@ class MultipleDirOperationToolbar extends React.Component {
   }
 }
 
-MultipleDirOperationToolbar.propTypes = propTypes;
+SelectedDirentsToolbar.propTypes = propTypes;
 
-export default MultipleDirOperationToolbar;
+export default SelectedDirentsToolbar;
diff --git a/frontend/src/models/index.js b/frontend/src/models/index.js
@@ -0,0 +1,6 @@
+import Dirent from './dirent';
+import FileTag from './file-tag';
+import RepoTag from './repo-tag';
+import RepoInfo from './repo-info';
+
+export { Dirent, FileTag, RepoTag, RepoInfo };