refactor(metadata): update code structure (#6765)

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

@@ -1,11 +1,11 @@
 import React, { Fragment } from 'react';
 import PropTypes from 'prop-types';
 import { Link } from '@gatsbyjs/reach-router';
+import DirOperationToolBar from '../../components/toolbar/dir-operation-toolbar';
+import MetadataViewName from '../../metadata/components/metadata-view-name';
 import { siteRoot, gettext } from '../../utils/constants';
 import { Utils } from '../../utils/utils';
-import DirOperationToolBar from '../../components/toolbar/dir-operation-toolbar';
 import { PRIVATE_FILE_TYPE } from '../../constants';
-import MetadataViewId2Name from '../../metadata/metadata-view-id-2-name';
 
 const propTypes = {
   currentRepoInfo: PropTypes.object.isRequired,
@@ -138,7 +138,7 @@ class DirPath extends React.Component {
         return (
           <Fragment key={index}>
             <span className="path-split">/</span>
-            <span className="path-item"><MetadataViewId2Name id={item} /></span>
+            <span className="path-item"><MetadataViewName id={item} /></span>
           </Fragment>
         );
       }

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

@@ -8,8 +8,8 @@ import SeahubPopover from '../common/seahub-popover';
 import ListTagPopover from '../popover/list-tag-popover';
 import ViewModes from '../../components/view-modes';
 import ReposSortMenu from '../../components/repos-sort-menu';
+import MetadataViewToolBar from '../../metadata/components/view-toolbar';
 import { PRIVATE_FILE_TYPE } from '../../constants';
-import MetadataViewToolBar from '../../metadata/metadata-view/components/view-toolbar';
 
 const propTypes = {
   repoID: PropTypes.string.isRequired,

frontend/src/components/dirent-detail/detail-container.js

@@ -2,7 +2,7 @@ import React, { useEffect } from 'react';
 import PropTypes from 'prop-types';
 import LibDetail from './lib-details';
 import DirentDetail from './dirent-details';
-import ObjectUtils from '../../metadata/metadata-view/utils/object-utils';
+import ObjectUtils from '../../metadata/utils/object-utils';
 import { MetadataContext } from '../../metadata';
 
 const DetailContainer = React.memo(({ repoID, path, dirent, currentRepoInfo, repoTags, fileTags, onClose, onFileTagChanged }) => {

frontend/src/components/dirent-detail/detail-item/index.js

@@ -2,7 +2,7 @@ import React, { useMemo } from 'react';
 import PropTypes from 'prop-types';
 import classnames from 'classnames';
 import { Icon } from '@seafile/sf-metadata-ui-component';
-import { CellType, COLUMNS_ICON_CONFIG } from '../../../metadata/metadata-view/_basic';
+import { CellType, COLUMNS_ICON_CONFIG } from '../../../metadata/constants';
 
 import './index.css';
 
@@ -37,4 +37,3 @@ DetailItem.propTypes = {
 };
 
 export default DetailItem;
-

frontend/src/components/dirent-detail/dirent-details/dir-details.js

@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
 import { Formatter } from '@seafile/sf-metadata-ui-component';
 import { getDirentPath } from './utils';
 import DetailItem from '../detail-item';
-import { CellType } from '../../../metadata/metadata-view/_basic';
+import { CellType } from '../../../metadata/constants';
 import { gettext } from '../../../utils/constants';
 import { MetadataDetails, useMetadata } from '../../../metadata';
 

frontend/src/components/dirent-detail/dirent-details/file-details.js

@@ -5,13 +5,13 @@ import { Formatter } from '@seafile/sf-metadata-ui-component';
 import classnames from 'classnames';
 import { getDirentPath } from './utils';
 import DetailItem from '../detail-item';
-import { CellType } from '../../../metadata/metadata-view/_basic';
+import { CellType } from '../../../metadata/constants';
 import { gettext } from '../../../utils/constants';
 import EditFileTagPopover from '../../popover/edit-filetag-popover';
 import FileTagList from '../../file-tag-list';
 import { Utils } from '../../../utils/utils';
 import { MetadataDetails, useMetadata } from '../../../metadata';
-import ObjectUtils from '../../../metadata/metadata-view/utils/object-utils';
+import ObjectUtils from '../../../metadata/utils/object-utils';
 
 const FileDetails = React.memo(({ repoID, repoInfo, dirent, path, direntDetail, onFileTagChanged, repoTags, fileTagList }) => {
   const [isEditFileTagShow, setEditFileTagShow] = useState(false);

frontend/src/components/dirent-detail/dirent-details/index.js

@@ -8,7 +8,7 @@ import Dirent from '../../../models/dirent';
 import { Detail, Header, Body } from '../detail';
 import DirDetails from './dir-details';
 import FileDetails from './file-details';
-import ObjectUtils from '../../../metadata/metadata-view/utils/object-utils';
+import ObjectUtils from '../../../metadata/utils/object-utils';
 
 import './index.css';
 

frontend/src/components/dirent-detail/embedded-file-details/file-details.js

@@ -2,7 +2,7 @@ import React, { useMemo } from 'react';
 import PropTypes from 'prop-types';
 import { Formatter } from '@seafile/sf-metadata-ui-component';
 import DetailItem from '../detail-item';
-import { CellType } from '../../../metadata/metadata-view/_basic';
+import { CellType } from '../../../metadata/constants';
 import { gettext } from '../../../utils/constants';
 import { Utils } from '../../../utils/utils';
 import { MetadataDetails, useEnableMetadata } from '../../../metadata';

frontend/src/components/dirent-detail/lib-details.js

@@ -9,7 +9,7 @@ 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 { CellType } from '../../metadata/constants';
 
 const LibDetail = React.memo(({ currentRepoInfo, onClose }) => {
   const [isLoading, setLoading] = useState(true);

frontend/src/metadata/api.js

@@ -1,9 +1,10 @@
 import axios from 'axios';
 import cookie from 'react-cookies';
 import { siteRoot } from '../utils/constants';
-import { VIEW_TYPE_DEFAULT_BASIC_FILTER, VIEW_TYPE_DEFAULT_SORTS } from './metadata-view/_basic';
+import { VIEW_TYPE_DEFAULT_BASIC_FILTER, VIEW_TYPE_DEFAULT_SORTS } from './constants';
 
 class MetadataManagerAPI {
+
   init({ server, username, password, token }) {
     this.server = server;
     this.username = username;

frontend/src/metadata/metadata-view/components/cell-editor/collaborator-editor/delete-collaborator/index.js → frontend/src/metadata/components/cell-editors/collaborator-editor/delete-collaborator/index.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { IconBtn } from '@seafile/sf-metadata-ui-component';
-import { useCollaborators } from '../../../../../hooks';
+import { useCollaborators } from '../../../../hooks';
 
 import './index.css';
 

frontend/src/metadata/metadata-view/components/cell-editor/collaborator-editor/index.js → frontend/src/metadata/components/cell-editors/collaborator-editor/index.js

@@ -2,11 +2,11 @@ import React, { forwardRef, useMemo, useImperativeHandle, useCallback, useState,
 import PropTypes from 'prop-types';
 import classnames from 'classnames';
 import { SearchInput, Icon } from '@seafile/sf-metadata-ui-component';
-import { isFunction } from '../../../_basic';
-import { KeyCodes } from '../../../../../constants';
-import { gettext } from '../../../../../utils/constants';
-import { useCollaborators } from '../../../../hooks';
 import DeleteCollaborator from './delete-collaborator';
+import { Utils } from '../../../../utils/utils';
+import { KeyCodes } from '../../../../constants';
+import { gettext } from '../../../../utils/constants';
+import { useCollaborators } from '../../../hooks';
 
 import './index.css';
 
@@ -158,7 +158,7 @@ const CollaboratorEditor = forwardRef(({
     } else if (event.keyCode === KeyCodes.DownArrow) {
       onDownArrow(event);
     } else if (event.keyCode === KeyCodes.Tab) {
-      if (isFunction(onPressTab)) {
+      if (Utils.isFunction(onPressTab)) {
         onPressTab(event);
       }
     } else if (event.keyCode === KeyCodes.Esc) {
@@ -268,4 +268,3 @@ CollaboratorEditor.propTypes = {
 };
 
 export default CollaboratorEditor;
-

frontend/src/metadata/metadata-view/components/cell-editor/editor-container/index.js → frontend/src/metadata/components/cell-editors/editor-container/index.js

@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
 import NormalEditorContainer from './normal-editor-container';
 import PopupEditorContainer from './popup-editor-container';
 import PreviewEditorContainer from './preview-editor-container';
-import { CellType } from '../../../_basic';
+import { CellType } from '../../../constants';
 
 const POPUP_EDITOR_COLUMN_TYPES = [
   CellType.DATE,

frontend/src/metadata/metadata-view/components/cell-editor/editor-container/normal-editor-container.js → frontend/src/metadata/components/cell-editors/editor-container/normal-editor-container.js

@@ -2,13 +2,13 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import classnames from 'classnames';
 import { ClickOutside } from '@seafile/sf-metadata-ui-component';
-import { isFunction, Z_INDEX, getCellValueByColumn, PRIVATE_COLUMN_KEYS } from '../../../_basic';
-import { isCtrlKeyHeldDown, isKeyPrintable } from '../../../utils/keyboard-utils';
-import { isCellValueChanged } from '../../../utils/cell-comparer';
-import { EVENT_BUS_TYPE } from '../../../constants';
-import { getEventClassName } from '../../../utils';
 import Editor from '../editor';
-import { canEditCell } from '../../../utils/column-utils';
+import { Utils } from '../../../../utils/utils';
+import { getEventClassName } from '../../../utils/common';
+import { isCellValueChanged, getCellValueByColumn } from '../../../utils/cell';
+import { canEditCell } from '../../../utils/column';
+import { isCtrlKeyHeldDown, isKeyPrintable } from '../../../utils/keyboard-utils';
+import { EVENT_BUS_TYPE, metadataZIndexes, PRIVATE_COLUMN_KEYS } from '../../../constants';
 
 class NormalEditorContainer extends React.Component {
 
@@ -42,11 +42,11 @@ class NormalEditorContainer extends React.Component {
   }
 
   isKeyExplicitlyHandled = (key) => {
-    return isFunction(this['onPress' + key]);
+    return Utils.isFunction(this['onPress' + key]);
   };
 
   checkAndCall = (methodName, args) => {
-    if (isFunction(this[methodName])) {
+    if (Utils.isFunction(this[methodName])) {
       this[methodName](args);
     }
   };
@@ -66,7 +66,7 @@ class NormalEditorContainer extends React.Component {
     // Track which keys are currently down for shift clicking etc
     this._keysDown = this._keysDown || {};
     this._keysDown[e.keyCode] = true;
-    if (isFunction(this.props.onGridKeyDown)) {
+    if (Utils.isFunction(this.props.onGridKeyDown)) {
       this.props.onGridKeyDown(e);
     }
   };
@@ -98,7 +98,7 @@ class NormalEditorContainer extends React.Component {
       onOverrideKeyDown: this.onKeyDown,
       modifyColumnData,
     };
-    return (<Editor { ...editorProps } />);
+    return (<Editor {...editorProps} />);
   };
 
   onPressEnter = () => {
@@ -155,14 +155,14 @@ class NormalEditorContainer extends React.Component {
   };
 
   editorHasResults = () => {
-    if (isFunction(this.getEditor().hasResults)) {
+    if (Utils.isFunction(this.getEditor().hasResults)) {
       return this.getEditor().hasResults();
     }
     return false;
   };
 
   editorIsSelectOpen = () => {
-    if (isFunction(this.getEditor().isSelectOpen)) {
+    if (Utils.isFunction(this.getEditor().isSelectOpen)) {
       return this.getEditor().isSelectOpen();
     }
     return false;
@@ -211,7 +211,7 @@ class NormalEditorContainer extends React.Component {
       const original = this.getEditor().getOldValue();
       oldValue = original[Object.keys(original)[0]];
     }
-    const oldRowData = PRIVATE_COLUMN_KEYS.includes(columnKey) ? { [columnName]: oldValue } : { [columnName]: oldValue } ;
+    const oldRowData = PRIVATE_COLUMN_KEYS.includes(columnKey) ? { [columnName]: oldValue } : { [columnName]: oldValue };
     const originalOldRowData = { [columnKey]: originalOldCellValue }; // { [column.key]: cellValue }
     return { oldRowData, originalOldRowData };
   };
@@ -252,7 +252,7 @@ class NormalEditorContainer extends React.Component {
   };
 
   isNewValueValid = (value) => {
-    if (isFunction(this.getEditor().validate)) {
+    if (Utils.isFunction(this.getEditor().validate)) {
       const isValid = this.getEditor().validate(value);
       this.setState({ isInvalid: !isValid });
       return isValid;
@@ -315,7 +315,7 @@ class NormalEditorContainer extends React.Component {
 
   render() {
     const { width, height, left, top } = this.props;
-    const style = { position: 'absolute', height, width, left, top, zIndex: Z_INDEX.EDITOR_CONTAINER };
+    const style = { position: 'absolute', height, width, left, top, zIndex: metadataZIndexes.EDITOR_CONTAINER };
     return (
       <ClickOutside onClickOutside={this.onClickOutside}>
         <div

frontend/src/metadata/metadata-view/components/cell-editor/editor-container/popup-editor-container.js → frontend/src/metadata/components/cell-editors/editor-container/popup-editor-container.js

@@ -2,16 +2,14 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import classnames from 'classnames';
 import { ClickOutside } from '@seafile/sf-metadata-ui-component';
-import { CellType, isFunction, Z_INDEX, getCellValueByColumn, getColumnOptionNameById, PRIVATE_COLUMN_KEYS,
-  getColumnOptionNamesByIds,
-} from '../../../_basic';
-import { isCellValueChanged } from '../../../utils/cell-comparer';
-import { EVENT_BUS_TYPE } from '../../../constants';
 import Editor from '../editor';
-import { canEditCell, getColumnOriginName } from '../../../utils/column-utils';
+import { Utils } from '../../../../utils/utils';
+import { isCellValueChanged, getCellValueByColumn, getColumnOptionNameById, getColumnOptionNamesByIds } from '../../../utils/cell';
+import { canEditCell, getColumnOriginName } from '../../../utils/column';
+import { CellType, EVENT_BUS_TYPE, metadataZIndexes, PRIVATE_COLUMN_KEYS } from '../../../constants';
 
 const NOT_SUPPORT_EDITOR_COLUMN_TYPES = [
-  CellType.CTIME, CellType.MTIME, CellType.CREATOR, CellType.LAST_MODIFIER, CellType.FILE_NAME
+  CellType.CTIME, CellType.MTIME, CellType.CREATOR, CellType.LAST_MODIFIER, CellType.FILE_NAME,
 ];
 
 class PopupEditorContainer extends React.Component {
@@ -29,7 +27,7 @@ class PopupEditorContainer extends React.Component {
       isInvalid: false,
       style: {
         position: 'absolute',
-        zIndex: Z_INDEX.EDITOR_CONTAINER,
+        zIndex: metadataZIndexes.EDITOR_CONTAINER,
         left,
         top,
         ...additionalStyles
@@ -87,7 +85,7 @@ class PopupEditorContainer extends React.Component {
       editorProps.format = column?.data?.format;
     }
 
-    return (<Editor { ...editorProps } />);
+    return (<Editor {...editorProps} />);
   };
 
   getEditorContainer = () => {
@@ -183,7 +181,7 @@ class PopupEditorContainer extends React.Component {
   };
 
   isNewValueValid = (value) => {
-    if (isFunction(this.getEditor().validate)) {
+    if (Utils.isFunction(this.getEditor().validate)) {
       const isValid = this.getEditor().validate(value);
       this.setState({ isInvalid: !isValid });
       return isValid;
@@ -249,4 +247,3 @@ PopupEditorContainer.propTypes = {
 };
 
 export default PopupEditorContainer;
-

frontend/src/metadata/metadata-view/components/cell-editor/editor.js → frontend/src/metadata/components/cell-editors/editor.js

@@ -1,15 +1,15 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { SfCalendar } from '@seafile/sf-metadata-ui-component';
-import { CellType } from '../../_basic';
 import FileNameEditor from './file-name-editor';
 import TextEditor from './text-editor';
 import NumberEditor from './number-editor';
 import SingleSelectEditor from './single-select-editor';
 import MultipleSelectEditor from './multiple-select-editor';
 import CollaboratorEditor from './collaborator-editor';
 import LongTextEditor from './long-text-editor';
-import { lang } from '../../../../utils/constants';
+import { lang } from '../../../utils/constants';
+import { CellType } from '../../constants';
 
 // eslint-disable-next-line react/display-name
 const Editor = React.forwardRef((props, ref) => {

frontend/src/metadata/metadata-view/components/cell-editor/file-name-editor.js → frontend/src/metadata/components/cell-editors/file-name-editor.js

@@ -1,11 +1,11 @@
 import React, { useEffect, useMemo, useState } from 'react';
 import PropTypes from 'prop-types';
 import { ModalPortal } from '@seafile/sf-metadata-ui-component';
-import { PRIVATE_COLUMN_KEY } from '../../_basic';
-import { Utils } from '../../../../utils/utils';
-import ImageDialog from '../../../../components/dialog/image-dialog';
-import { EVENT_BUS_TYPE } from '../../../../components/common/event-bus-type';
-import { siteRoot, thumbnailSizeForOriginal } from '../../../../utils/constants';
+import { Utils } from '../../../utils/utils';
+import ImageDialog from '../../../components/dialog/image-dialog';
+import { EVENT_BUS_TYPE } from '../../../components/common/event-bus-type';
+import { siteRoot, thumbnailSizeForOriginal } from '../../../utils/constants';
+import { PRIVATE_COLUMN_KEY } from '../../constants';
 
 const FileNameEditor = ({ column, record, table, onCommitCancel }) => {
   const [imageIndex, setImageIndex] = useState(0);

frontend/src/metadata/metadata-view/components/cell-editor/long-text-editor/api.js → frontend/src/metadata/components/cell-editors/long-text-editor/api.js

@@ -1,6 +1,6 @@
 import moment from 'moment';
-import { seafileAPI } from '../../../../../utils/seafile-api';
-import { Utils } from '../../../../../utils/utils';
+import { seafileAPI } from '../../../../utils/seafile-api';
+import { Utils } from '../../../../utils/utils';
 
 const getImageFileNameWithTimestamp = () => {
   var d = Date.now();

frontend/src/metadata/metadata-view/components/cell-editor/long-text-editor/index.js → frontend/src/metadata/components/cell-editors/long-text-editor/index.js

@@ -1,12 +1,11 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { LongTextEditorDialog, getPreviewContent } from '@seafile/seafile-editor';
+import toaster from '../../../../components/toast';
 import LongtextAPI from './api';
-import { getValidLongTextValue, isLongTextValueExceedLimit, LONG_TEXT_EXCEED_LIMIT_MESSAGE,
-  LONG_TEXT_EXCEED_LIMIT_SUGGEST,
-} from '../../../_basic';
-import toaster from '../../../../../components/toast';
-import { lang, serviceURL } from '../../../../../utils/constants';
+import { getValidLongTextValue, isLongTextValueExceedLimit } from '../../../utils/column';
+import { lang, serviceURL } from '../../../../utils/constants';
+import { LONG_TEXT_EXCEED_LIMIT_MESSAGE, LONG_TEXT_EXCEED_LIMIT_SUGGEST } from '../../../constants';
 
 import './index.css';
 

frontend/src/metadata/metadata-view/components/cell-editor/multiple-select-editor/delete-options/index.js → frontend/src/metadata/components/cell-editors/multiple-select-editor/delete-options/index.js

@@ -1,7 +1,7 @@
 import React, { useMemo } from 'react';
 import PropTypes from 'prop-types';
 import { IconBtn } from '@seafile/sf-metadata-ui-component';
-import { gettext } from '../../../../utils';
+import { gettext } from '../../../../../utils/constants';
 import { DELETED_OPTION_TIPS, DELETED_OPTION_BACKGROUND_COLOR } from '../../../../constants';
 
 import './index.css';