IlyaSobolev/DocSpace-buildtools
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Web: Files: added file operations to contextMenu, refactoring

Browse Source
This commit is contained in:
Nikita Gopienko 2020-07-31 11:14:37 +03:00
parent 547852e678
commit 72bc996a1a
5 changed files with 103 additions and 64 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

117
products/ASC.Files/Client/src/components/pages/Home/Section/Body/index.js
View File

@ -36,11 +36,12 @@ import {
setDragItem,
setMediaViewerData,
setProgressBarData,
clearProgressData
clearProgressData,
setSelection
} from '../../../../../store/files/actions';
import { isFileSelected, getFileIcon, getFolderIcon, getFolderType, loopTreeFolders, isImage, isSound, isVideo } from '../../../../../store/files/selectors';
import store from "../../../../../store/store";
import { SharingPanel } from "../../../../panels";
import { SharingPanel, OperationsPanel } from "../../../../panels";
//import { getFilterByLocation } from "../../../../../helpers/converters";
//import config from "../../../../../../package.json";
@ -85,7 +86,8 @@ class SectionBodyContent extends React.Component {
this.state = {
editingId: null,
showSharingPanel: false,
currentItem: null
showMoveToPanel: false,
showCopyPanel: false
};
this.tooltipRef = React.createRef();
@ -143,6 +145,7 @@ class SectionBodyContent extends React.Component {
} */
shouldComponentUpdate(nextProps, nextState) {
const { showMoveToPanel, showCopyPanel } = this.state;
if (this.state.showSharingPanel !== nextState.showSharingPanel) {
return true;
}
@ -155,11 +158,15 @@ class SectionBodyContent extends React.Component {
return true;
}
if(showMoveToPanel !== nextState.showMoveToPanel || showCopyPanel !== nextState.showCopyPanel) {
return true;
}
return false;
}
onClickRename = (item) => {
const { id, fileExst } = item;
onClickRename = () => {
const { id, fileExst } = this.props.selection[0];
this.setState({ editingId: id }, () => {
this.props.setAction(
@ -199,7 +206,8 @@ class SectionBodyContent extends React.Component {
})
}
onClickDelete = (item) => {
onClickDelete = () => {
const item = this.props.selection[0];
item.fileExst
? this.onDeleteFile(item.id, item.folderId)
: this.onDeleteFolder(item.id, item.parentId);
@ -264,19 +272,11 @@ class SectionBodyContent extends React.Component {
})
}
onClickShare = item => {
let currentItem = item;
if (this.state.showSharingPanel) {
currentItem = null;
}
this.setState({
currentItem,
showSharingPanel: !this.state.showSharingPanel,
});
}
onClickShare = () => this.setState({showSharingPanel: !this.state.showSharingPanel});
onClickLinkForPortal = item => {
const { settings } = this.props;
onClickLinkForPortal = () => {
const { settings, selection } = this.props;
const item = selection[0];
const isFile = !!item.fileExst;
const { t } = this.props;
@ -291,8 +291,8 @@ class SectionBodyContent extends React.Component {
toastr.success(t("LinkCopySuccess"));
}
onClickDownload = item => {
return window.open(item.viewUrl, "_blank");
onClickDownload = () => {
return window.open(this.props.selection[0].viewUrl, "_blank");
}
onClickLinkEdit = e => {
@ -327,6 +327,20 @@ class SectionBodyContent extends React.Component {
.finally(() => onLoading(false));
}
onMoveAction = () => this.setState({ showMoveToPanel: !this.state.showMoveToPanel });
onCopyAction = () => this.setState({ showCopyPanel: !this.state.showCopyPanel });
onDuplicate = () => {
const { selection, selectedFolderId, setProgressBarData, t } = this.props;
const folderIds = [];
const fileIds = [];
selection[0].fileExst ? fileIds.push(selection[0].id) : folderIds.push(selection[0].id);
const conflictResolveType = 2; //Skip = 0, Overwrite = 1, Duplicate = 2
const deleteAfter = false;
setProgressBarData({ visible: true, percent: 0, label: t("CopyOperation")});
this.copyTo(selectedFolderId, folderIds, fileIds, conflictResolveType, deleteAfter);
}
getFilesContextOptions = (item, viewer) => {
const { t } = this.props;
@ -364,7 +378,7 @@ class SectionBodyContent extends React.Component {
{
key: "sharing-settings",
label: t("SharingSettings"),
onClick: this.onClickShare.bind(this, item),
onClick: this.onClickShare,
disabled: isSharable
},
isFile
@ -377,7 +391,7 @@ class SectionBodyContent extends React.Component {
{
key: "link-for-portal-users",
label: t("LinkForPortalUsers"),
onClick: this.onClickLinkForPortal.bind(this, item),
onClick: this.onClickLinkForPortal,
disabled: false
},
{
@ -407,7 +421,7 @@ class SectionBodyContent extends React.Component {
? {
key: "view",
label: t("View"),
onClick: this.onMediaFileClick.bind(this, item.id),
onClick: this.onMediaFileClick,
disabled: false
}
: null,
@ -415,20 +429,38 @@ class SectionBodyContent extends React.Component {
? {
key: "download",
label: t("Download"),
onClick: this.onClickDownload.bind(this, item),
onClick: this.onClickDownload,
disabled: false
}
: null,
{
key: "move",
label: t("MoveTo"),
onClick: this.onMoveAction,
disabled: false
},
{
key: "copy",
label: t("Copy"),
onClick: this.onCopyAction,
disabled: false
},
isFile && {
key: "duplicate",
label: t("Duplicate"),
onClick: this.onDuplicate,
disabled: false
},
{
key: "rename",
label: t("Rename"),
onClick: this.onClickRename.bind(this, item),
onClick: this.onClickRename,
disabled: false
},
{
key: "delete",
label: t("Delete"),
onClick: this.onClickDelete.bind(this, item),
onClick: this.onClickDelete,
disabled: false
},
];
@ -729,7 +761,8 @@ class SectionBodyContent extends React.Component {
this.props.setMediaViewerData(item);
}
onMediaFileClick = (id) => {
const item = { visible: true, id };
const itemId = typeof(id) !== "object" ? id : this.props.selection[0].id;
const item = { visible: true, id: itemId };
this.props.setMediaViewerData(item);
}
@ -996,6 +1029,8 @@ class SectionBodyContent extends React.Component {
}
}
onSelectItem = item => this.props.setSelection([item]);
render() {
const {
files,
@ -1014,10 +1049,12 @@ class SectionBodyContent extends React.Component {
mediaViewerVisible,
currentMediaFileId,
viewAs,
t
t,
loopFilesOperations
} = this.props;
const { editingId, showSharingPanel, currentItem } = this.state;
const { editingId, showSharingPanel, showMoveToPanel, showCopyPanel } = this.state;
const operationsPanelProps = { onLoading, isLoading, loopFilesOperations };
let items = [...folders, ...files];
@ -1059,6 +1096,23 @@ class SectionBodyContent extends React.Component {
this.renderEmptyFilterContainer()
) : (
<>
{showMoveToPanel && (
<OperationsPanel
{...operationsPanelProps}
isCopy={false}
visible={showMoveToPanel}
onClose={this.onMoveAction}
/>
)}
{showCopyPanel && (
<OperationsPanel
{...operationsPanelProps}
isCopy={true}
visible={showCopyPanel}
onClose={this.onCopyAction}
/>
)}
<CustomTooltip ref={this.tooltipRef}>{tooltipLabel}</CustomTooltip>
{viewAs === "tile"
@ -1176,6 +1230,7 @@ class SectionBodyContent extends React.Component {
{...checkedProps}
{...contextOptionsProps}
needForUpdate={this.needForUpdate}
onSelectItem={this.onSelectItem.bind(this, item)}
>
<FilesRowContent
item={item}
@ -1211,7 +1266,6 @@ class SectionBodyContent extends React.Component {
{showSharingPanel && (
<SharingPanel
onLoading={onLoading}
selectedItems={currentItem}
onClose={this.onClickShare}
visible={showSharingPanel}
/>
@ -1283,6 +1337,7 @@ export default connect(
setDragging,
setDragItem,
setMediaViewerData,
setProgressBarData
setProgressBarData,
setSelection
}
)(withRouter(withTranslation()(SectionBodyContent)));

1
products/ASC.Files/Client/src/components/pages/Home/Section/Header/index.js
View File

@ -524,7 +524,6 @@ class SectionHeaderContent extends React.Component {
{showSharingPanel && (
<SharingPanel
onLoading={onLoading}
selectedItems={selection}
onClose={this.onOpenSharingPanel}
visible={showSharingPanel}
/>

2
products/ASC.Files/Client/src/components/pages/Home/index.js
View File

@ -257,7 +257,7 @@ class PureHome extends React.Component {
let foldersCount = data.current.foldersCount;
loopTreeFolders(path, newTreeFolders, folders, foldersCount);
if (!isCopy) {
if (!isCopy || destFolderId === currentFolderId) {
fetchFiles(currentFolderId, filter, store.dispatch)
.then((data) => {
if (!isRecycleBinFolder) {

43
products/ASC.Files/Client/src/components/panels/SharingPanel/SharingPanel.js
View File

@ -103,19 +103,11 @@ class SharingPanelComponent extends React.Component {
}
}
if (!selectedItems.length) {
if (selectedItems.fileExst) {
fileIds.push(selectedItems.id);
for (let item of selectedItems) {
if (item.fileExst) {
fileIds.push(item.id);
} else {
folderIds.push(selectedItems.id);
}
} else {
for (let item of selectedItems) {
if (item.fileExst) {
fileIds.push(item.id);
} else {
folderIds.push(item.id);
}
folderIds.push(item.id);
}
}
@ -387,7 +379,7 @@ class SharingPanelComponent extends React.Component {
arrayItems = this.removeDuplicateShareData(arrayItems);
const baseShareData = JSON.parse(JSON.stringify(arrayItems));
const accessOptions = !this.props.selectedItems.length ? getAccessOption([this.props.selectedItems]) : getAccessOption(this.props.selectedItems);
const accessOptions = getAccessOption(this.props.selectedItems);
this.setState(
{ baseShareData, shareDataItems: arrayItems, accessOptions },
@ -409,20 +401,12 @@ class SharingPanelComponent extends React.Component {
const folderId = [];
const fileId = [];
if (!selectedItems.length) {
if (selectedItems.fileExst) {
fileId.push(selectedItems.id);
} else {
folderId.push(selectedItems.id);
}
} else {
for (let item of selectedItems) {
if (item.access === 1 || item.access === 0) {
if (item.fileExst) {
fileId.push(item.id);
} else {
folderId.push(item.id);
}
for (let item of selectedItems) {
if (item.access === 1 || item.access === 0) {
if (item.fileExst) {
fileId.push(item.id);
} else {
folderId.push(item.id);
}
}
}
@ -705,7 +689,10 @@ const SharingPanel = (props) => (
);
const mapStateToProps = (state) => {
return { isMyId: state.auth.user.id };
return {
isMyId: state.auth.user.id,
selectedItems: state.files.selection
};
};
export default connect(mapStateToProps)(withRouter(SharingPanel));

4
products/ASC.Files/Client/src/components/panels/SharingPanel/SharingRow.js
View File

@ -29,9 +29,7 @@ const SharingRow = (props) => {
onShowEmbeddingPanel,
} = props;
const linkVisible =
(selection && selection.length === 1 && item.shareLink) ||
(!selection.length && item.shareLink);
const linkVisible = selection && selection.length === 1 && item.shareLink;
const onCopyInternalLink = () => {
const internalLink = selection.webUrl ? selection.webUrl : selection[0].webUrl;