2018-10-25 05:36:06 +00:00
|
|
|
import React from 'react';
|
|
|
|
import PropTypes from 'prop-types';
|
2024-09-23 01:48:43 +00:00
|
|
|
import { Modal, ModalHeader } from 'reactstrap';
|
|
|
|
import SelectDirentBody from './select-dirent-body';
|
2018-11-28 04:41:49 +00:00
|
|
|
import { gettext } from '../../utils/constants';
|
2018-10-25 05:36:06 +00:00
|
|
|
import { Utils } from '../../utils/utils';
|
|
|
|
|
|
|
|
const propTypes = {
|
2018-11-23 12:19:42 +00:00
|
|
|
path: PropTypes.string.isRequired,
|
2018-11-28 04:41:49 +00:00
|
|
|
repoID: PropTypes.string.isRequired,
|
2018-11-23 12:19:42 +00:00
|
|
|
dirent: PropTypes.object,
|
2018-11-27 06:47:19 +00:00
|
|
|
selectedDirentList: PropTypes.array,
|
2024-08-02 03:41:07 +00:00
|
|
|
isMultipleOperation: PropTypes.bool.isRequired,
|
2018-11-27 06:47:19 +00:00
|
|
|
onItemMove: PropTypes.func,
|
|
|
|
onItemsMove: PropTypes.func,
|
2018-10-25 05:36:06 +00:00
|
|
|
onCancelMove: PropTypes.func.isRequired,
|
|
|
|
};
|
|
|
|
|
|
|
|
class MoveDirent extends React.Component {
|
|
|
|
|
|
|
|
constructor(props) {
|
|
|
|
super(props);
|
|
|
|
this.state = {
|
2022-02-16 03:24:54 +00:00
|
|
|
repo: { repo_id: this.props.repoID },
|
|
|
|
selectedPath: this.props.path,
|
2024-08-05 02:48:16 +00:00
|
|
|
errMessage: '',
|
2018-10-25 05:36:06 +00:00
|
|
|
};
|
|
|
|
}
|
|
|
|
|
|
|
|
handleSubmit = () => {
|
2024-08-02 03:41:07 +00:00
|
|
|
if (this.props.isMultipleOperation) {
|
2018-11-23 12:19:42 +00:00
|
|
|
this.moveItems();
|
|
|
|
} else {
|
|
|
|
this.moveItem();
|
|
|
|
}
|
2023-09-13 00:40:50 +00:00
|
|
|
};
|
2018-11-23 12:19:42 +00:00
|
|
|
|
|
|
|
moveItems = () => {
|
2019-01-23 08:25:14 +00:00
|
|
|
let { repoID } = this.props;
|
|
|
|
let { repo, selectedPath } = this.state;
|
2018-11-23 12:19:42 +00:00
|
|
|
let message = gettext('Invalid destination path');
|
2020-11-02 05:56:35 +00:00
|
|
|
|
2018-11-27 06:47:19 +00:00
|
|
|
if (!repo || selectedPath === '') {
|
2024-09-23 01:48:43 +00:00
|
|
|
this.setErrMessage(message);
|
2018-11-23 12:19:42 +00:00
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
|
|
|
let selectedDirentList = this.props.selectedDirentList;
|
|
|
|
let direntPaths = [];
|
|
|
|
selectedDirentList.forEach(dirent => {
|
|
|
|
let path = Utils.joinPath(this.props.path, dirent.name);
|
|
|
|
direntPaths.push(path);
|
|
|
|
});
|
2020-11-02 05:56:35 +00:00
|
|
|
|
2018-12-22 03:17:03 +00:00
|
|
|
// move dirents to one of them. eg: A/B, A/C -> A/B
|
2018-11-27 06:47:19 +00:00
|
|
|
if (direntPaths.some(direntPath => { return direntPath === selectedPath;})) {
|
2024-09-23 01:48:43 +00:00
|
|
|
this.setErrMessage(message);
|
2018-11-23 12:19:42 +00:00
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
2018-12-22 03:17:03 +00:00
|
|
|
// move dirents to current path
|
2018-11-27 06:47:19 +00:00
|
|
|
if (selectedPath && selectedPath === this.props.path && (repo.repo_id === repoID)) {
|
2024-09-23 01:48:43 +00:00
|
|
|
this.setErrMessage(message);
|
2018-11-23 12:19:42 +00:00
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
2018-12-22 03:17:03 +00:00
|
|
|
// move dirents to one of their child. eg: A/B, A/D -> A/B/C
|
2018-11-23 12:19:42 +00:00
|
|
|
let moveDirentPath = '';
|
|
|
|
let isChildPath = direntPaths.some(direntPath => {
|
|
|
|
let flag = selectedPath.length > direntPath.length && selectedPath.indexOf(direntPath) > -1;
|
|
|
|
if (flag) {
|
|
|
|
moveDirentPath = direntPath;
|
|
|
|
}
|
|
|
|
return flag;
|
2018-11-27 06:47:19 +00:00
|
|
|
});
|
2018-11-23 12:19:42 +00:00
|
|
|
|
|
|
|
if (isChildPath) {
|
2024-08-23 09:09:56 +00:00
|
|
|
message = gettext('Can not move folder %(src)s to its subfolder %(des)s');
|
2018-11-23 12:19:42 +00:00
|
|
|
message = message.replace('%(src)s', moveDirentPath);
|
|
|
|
message = message.replace('%(des)s', selectedPath);
|
2024-09-23 01:48:43 +00:00
|
|
|
this.setErrMessage(message);
|
2018-11-23 12:19:42 +00:00
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
|
|
|
this.props.onItemsMove(repo, selectedPath);
|
|
|
|
this.toggle();
|
2023-09-13 00:40:50 +00:00
|
|
|
};
|
2018-11-23 12:19:42 +00:00
|
|
|
|
|
|
|
moveItem = () => {
|
2019-05-31 05:44:10 +00:00
|
|
|
let { repoID } = this.props;
|
2020-11-02 05:56:35 +00:00
|
|
|
let { repo, selectedPath } = this.state;
|
2018-11-27 06:47:19 +00:00
|
|
|
let direntPath = Utils.joinPath(this.props.path, this.props.dirent.name);
|
2018-10-25 05:36:06 +00:00
|
|
|
let message = gettext('Invalid destination path');
|
|
|
|
|
2018-11-23 12:19:42 +00:00
|
|
|
if (!repo || (repo.repo_id === repoID && selectedPath === '')) {
|
2024-09-23 01:48:43 +00:00
|
|
|
this.setErrMessage(message);
|
2018-10-25 05:36:06 +00:00
|
|
|
return;
|
|
|
|
}
|
2020-11-02 05:56:35 +00:00
|
|
|
|
2018-11-23 12:19:42 +00:00
|
|
|
// copy the dirent to itself. eg: A/B -> A/B
|
|
|
|
if (selectedPath && direntPath === selectedPath) {
|
2024-09-23 01:48:43 +00:00
|
|
|
this.setErrMessage(message);
|
2018-10-25 05:36:06 +00:00
|
|
|
return;
|
|
|
|
}
|
2020-11-02 05:56:35 +00:00
|
|
|
|
2018-11-23 12:19:42 +00:00
|
|
|
// copy the dirent to current path
|
2018-11-28 04:41:49 +00:00
|
|
|
if (selectedPath && this.props.path === selectedPath && repo.repo_id === repoID) {
|
2024-09-23 01:48:43 +00:00
|
|
|
this.setErrMessage(message);
|
2018-10-25 05:36:06 +00:00
|
|
|
return;
|
|
|
|
}
|
2020-11-02 05:56:35 +00:00
|
|
|
|
2018-11-23 12:19:42 +00:00
|
|
|
// copy the dirent to it's child. eg: A/B -> A/B/C
|
2024-07-23 15:08:53 +00:00
|
|
|
if (selectedPath && selectedPath.length > direntPath.length && selectedPath.indexOf(direntPath) > -1) {
|
2024-08-23 09:09:56 +00:00
|
|
|
message = gettext('Can not move folder %(src)s to its subfolder %(des)s');
|
2018-10-25 05:36:06 +00:00
|
|
|
message = message.replace('%(src)s', direntPath);
|
2018-11-23 12:19:42 +00:00
|
|
|
message = message.replace('%(des)s', selectedPath);
|
2024-09-23 01:48:43 +00:00
|
|
|
this.setErrMessage(message);
|
2018-10-25 05:36:06 +00:00
|
|
|
return;
|
|
|
|
}
|
2018-11-23 12:19:42 +00:00
|
|
|
|
2019-03-20 03:04:36 +00:00
|
|
|
this.props.onItemMove(repo, this.props.dirent, selectedPath, this.props.path);
|
2018-10-25 05:36:06 +00:00
|
|
|
this.toggle();
|
2023-09-13 00:40:50 +00:00
|
|
|
};
|
2018-10-25 05:36:06 +00:00
|
|
|
|
|
|
|
toggle = () => {
|
|
|
|
this.props.onCancelMove();
|
2023-09-13 00:40:50 +00:00
|
|
|
};
|
2018-10-25 05:36:06 +00:00
|
|
|
|
2024-09-23 01:48:43 +00:00
|
|
|
selectRepo = (repo) => {
|
|
|
|
this.setState({ repo });
|
2023-09-13 00:40:50 +00:00
|
|
|
};
|
2018-10-25 05:36:06 +00:00
|
|
|
|
2024-09-23 01:48:43 +00:00
|
|
|
setSelectedPath = (selectedPath) => {
|
|
|
|
this.setState({ selectedPath });
|
2023-09-13 00:40:50 +00:00
|
|
|
};
|
2018-10-25 05:36:06 +00:00
|
|
|
|
2024-09-23 01:48:43 +00:00
|
|
|
setErrMessage = (message) => {
|
|
|
|
this.setState({ errMessage: message });
|
2024-08-05 02:48:16 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
renderTitle = () => {
|
|
|
|
const { dirent, isMultipleOperation } = this.props;
|
2019-05-27 09:13:15 +00:00
|
|
|
let title = gettext('Move {placeholder} to');
|
2024-08-05 02:48:16 +00:00
|
|
|
|
|
|
|
if (isMultipleOperation) {
|
|
|
|
return gettext('Move selected item(s) to:');
|
2018-11-23 12:19:42 +00:00
|
|
|
} else {
|
2024-08-05 02:48:16 +00:00
|
|
|
return title.replace('{placeholder}', `<span class="op-target text-truncate mx-1">${Utils.HTMLescape(dirent.name)}</span>`);
|
2018-11-23 12:19:42 +00:00
|
|
|
}
|
2024-08-05 02:48:16 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
render() {
|
2024-09-23 01:48:43 +00:00
|
|
|
const { dirent, selectedDirentList, isMultipleOperation, path, repoID } = this.props;
|
2024-08-05 02:48:16 +00:00
|
|
|
const movedDirent = dirent || selectedDirentList[0];
|
2021-09-24 04:17:20 +00:00
|
|
|
const { permission } = movedDirent;
|
2021-09-13 02:37:07 +00:00
|
|
|
const { isCustomPermission } = Utils.getUserPermission(permission);
|
2024-08-05 02:48:16 +00:00
|
|
|
|
2018-10-25 05:36:06 +00:00
|
|
|
return (
|
2024-08-05 02:48:16 +00:00
|
|
|
<Modal className='custom-modal' isOpen={true} toggle={this.toggle}>
|
2024-03-07 07:37:09 +00:00
|
|
|
<ModalHeader toggle={this.toggle}>
|
2024-08-05 02:48:16 +00:00
|
|
|
{isMultipleOperation ? this.renderTitle() : <div dangerouslySetInnerHTML={{ __html: this.renderTitle() }} className='d-flex mw-100'></div>}
|
2024-03-07 07:37:09 +00:00
|
|
|
</ModalHeader>
|
2024-09-23 01:48:43 +00:00
|
|
|
<SelectDirentBody
|
|
|
|
path={path}
|
|
|
|
selectedPath={this.state.selectedPath}
|
|
|
|
repoID={repoID}
|
|
|
|
isSupportOtherLibraries={!isCustomPermission}
|
|
|
|
errMessage={this.state.errMessage}
|
|
|
|
onCancel={this.toggle}
|
|
|
|
selectRepo={this.selectRepo}
|
|
|
|
setSelectedPath={this.setSelectedPath}
|
|
|
|
setErrMessage={this.setErrMessage}
|
|
|
|
handleSubmit={this.handleSubmit}
|
|
|
|
/>
|
2018-10-25 05:36:06 +00:00
|
|
|
</Modal>
|
|
|
|
);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
MoveDirent.propTypes = propTypes;
|
|
|
|
|
|
|
|
export default MoveDirent;
|