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

Merge branch 'develop' of https://github.com/ONLYOFFICE/AppServer into develop

Browse Source
This commit is contained in:
Alexey Safronov 2021-04-13 13:15:50 +03:00
commit 176a46de65
15 changed files with 523 additions and 375 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
products/ASC.Files/Client/public/locales/en/NewFilesPanel.json
View File

@ -1,5 +1,7 @@
{
"NewFiles": "New files",
"MarkAsRead": "Mark all as read",
"CloseButton": "Close"
"CloseButton": "Close",
"LoadingLabel": "Loading... Please wait..."
}

4
products/ASC.Files/Client/public/locales/ru/NewFilesPanel.json
View File

@ -1,5 +1,7 @@
{
"NewFiles": "Новые файлы",
"MarkAsRead": "Пометить всё прочтённым",
"CloseButton": "Закрыть"
"CloseButton": "Закрыть",
"LoadingLabel": "Загрузка... Пожалуйста подождите..."
}

64
products/ASC.Files/Client/src/components/Article/Body/index.js
View File

@ -5,7 +5,6 @@ import Loaders from "@appserver/common/components/Loaders";
import TreeFolders from "./TreeFolders";
import TreeSettings from "./TreeSettings";
import isEmpty from "lodash/isEmpty";
import { NewFilesPanel } from "../../panels";
import { setDocumentTitle } from "../../../helpers/utils";
import ThirdPartyList from "./ThirdPartyList";
import { inject, observer } from "mobx-react";
@ -23,10 +22,6 @@ class ArticleBodyContent extends React.Component {
selectedFolderTitle
? setDocumentTitle(selectedFolderTitle)
: setDocumentTitle();
this.state = {
showNewFilesPanel: false,
};
}
/*componentDidMount() {
@ -77,58 +72,33 @@ class ArticleBodyContent extends React.Component {
};
onShowNewFilesPanel = (folderId) => {
const { showNewFilesPanel } = this.state;
this.setState({
showNewFilesPanel: !showNewFilesPanel,
newFolderId: [folderId],
});
};
setNewFilesCount = (folderPath, filesCount) => {
const data = this.props.treeFolders;
const dataItem = data.find((x) => x.id === folderPath[0]);
dataItem.newItems = filesCount ? filesCount : dataItem.newItems - 1;
this.props.setTreeFolders(data);
this.props.setNewFilesPanelVisible(true);
this.props.setNewFilesIds([folderId]);
};
render() {
const { treeFolders, onTreeDrop, selectedTreeNode } = this.props;
const { showNewFilesPanel, newFolderId } = this.state;
return (
return isEmpty(treeFolders) ? (
<Loaders.TreeFolders />
) : (
<>
{showNewFilesPanel && (
<NewFilesPanel
visible={showNewFilesPanel}
onClose={this.onShowNewFilesPanel}
setNewFilesCount={this.setNewFilesCount}
folderId={newFolderId}
treeFolders={treeFolders}
/>
)}
{isEmpty(treeFolders) ? (
<Loaders.TreeFolders />
) : (
<>
<TreeFolders
selectedKeys={selectedTreeNode}
onSelect={this.onSelect}
data={treeFolders}
onBadgeClick={this.onShowNewFilesPanel}
onTreeDrop={onTreeDrop}
/>
<TreeSettings />
<ThirdPartyList />
</>
)}
<TreeFolders
selectedKeys={selectedTreeNode}
onSelect={this.onSelect}
data={treeFolders}
onBadgeClick={this.onShowNewFilesPanel}
onTreeDrop={onTreeDrop}
/>
<TreeSettings />
<ThirdPartyList />
</>
);
}
}
export default inject(
({ filesStore, treeFoldersStore, selectedFolderStore }) => {
({ filesStore, treeFoldersStore, selectedFolderStore, dialogsStore }) => {
const { fetchFiles, filter, setIsLoading } = filesStore;
const { treeFolders, setSelectedNode, setTreeFolders } = treeFoldersStore;
const selectedTreeNode =
@ -137,6 +107,8 @@ export default inject(
? treeFoldersStore.selectedTreeNode
: [selectedFolderStore.id + ""];
const { setNewFilesPanelVisible, setNewFilesIds } = dialogsStore;
return {
selectedFolderTitle: selectedFolderStore.title,
treeFolders,
@ -147,6 +119,8 @@ export default inject(
fetchFiles,
setSelectedNode,
setTreeFolders,
setNewFilesPanelVisible,
setNewFilesIds,
homepage: config.homepage,
};

5
products/ASC.Files/Client/src/components/FilesPanels/index.js
View File

@ -6,6 +6,7 @@ import {
OperationsPanel,
VersionHistoryPanel,
ChangeOwnerPanel,
NewFilesPanel,
} from "../panels";
import {
ThirdPartyMoveDialog,
@ -32,6 +33,7 @@ const Panels = (props) => {
downloadDialogVisible,
emptyTrashDialogVisible,
thirdPartyDialogVisible,
newFilesPanelVisible,
} = props;
return [
@ -60,6 +62,7 @@ const Panels = (props) => {
emptyTrashDialogVisible && <EmptyTrashDialog key="empty-trash-dialog" />,
downloadDialogVisible && <DownloadDialog key="download-dialog" />,
thirdPartyDialogVisible && <ThirdPartyDialog key="thirdparty-dialog" />,
newFilesPanelVisible && <NewFilesPanel key="new-files-panel" />,
];
};
@ -77,6 +80,7 @@ export default inject(
downloadDialogVisible,
emptyTrashDialogVisible,
thirdPartyDialogVisible,
newFilesPanelVisible,
connectItem, //TODO:
} = dialogsStore;
@ -98,6 +102,7 @@ export default inject(
downloadDialogVisible,
emptyTrashDialogVisible,
thirdPartyDialogVisible,
newFilesPanelVisible,
};
}
)(observer(Panels));

82
products/ASC.Files/Client/src/components/pages/Home/Section/Body/FilesRow/FilesRowContent.js
View File

@ -25,7 +25,6 @@ import CheckIcon from "../../../../../../../public/images/check.react.svg";
import CrossIcon from "../../../../../../../../../../public/images/cross.react.svg";
import { TIMEOUT } from "../../../../../../helpers/constants";
import { getTitleWithoutExst } from "../../../../../../helpers/files-helpers";
import { NewFilesPanel } from "../../../../../panels";
import { ConvertDialog } from "../../../../../dialogs";
import EditingWrapperComponent from "../EditingWrapperComponent";
import { isMobile } from "react-device-detect";
@ -125,9 +124,6 @@ class FilesRowContent extends React.PureComponent {
this.state = {
itemTitle: titleWithoutExt,
showNewFilesPanel: false,
newFolderId: [],
newItems: props.item.new || props.item.fileStatus === 2,
showConvertDialog: false,
//loading: false
};
@ -256,16 +252,6 @@ class FilesRowContent extends React.PureComponent {
};
// componentDidUpdate(prevProps) {
// const { item, newRowItems, setNewRowItems } = this.props;
// const itemId = item.id.toString();
// if (newRowItems.length && newRowItems.includes(itemId)) {
// const rowItems = newRowItems.filter((x) => x !== itemId);
// if (this.state.newItems !== 0) {
// this.setState({ newItems: 0 }, () => setNewRowItems(rowItems));
// }
// }
// if (fileAction) {
// if (fileActionId !== prevProps.fileActionId) {
// this.setState({ editingId: fileActionId });
@ -408,43 +394,30 @@ class FilesRowContent extends React.PureComponent {
};
onBadgeClick = () => {
const { showNewFilesPanel } = this.state;
const {
item,
treeFolders,
setTreeFolders,
selectedFolderPathParts,
newItems,
setNewRowItems,
markAsRead,
setNewFilesPanelVisible,
setNewFilesIds,
updateRootBadge,
updateFileBadge,
} = this.props;
if (item.fileExst) {
markAsRead([], [item.id])
.then(() => {
const data = treeFolders;
const dataItem = data.find(
(x) => x.id === selectedFolderPathParts[0]
);
dataItem.newItems = newItems ? dataItem.newItems - 1 : 0;
setTreeFolders(data);
setNewRowItems([`${item.id}`]);
updateRootBadge(selectedFolderPathParts[0], 1);
updateFileBadge(item.id);
})
.catch((err) => toastr.error(err));
} else {
const newFolderId = this.props.selectedFolderPathParts;
newFolderId.push(item.id);
this.setState({
showNewFilesPanel: !showNewFilesPanel,
newFolderId,
});
setNewFilesPanelVisible(true);
const newFolderIds = this.props.selectedFolderPathParts;
newFolderIds.push(item.id);
setNewFilesIds(newFolderIds);
}
};
onShowNewFilesPanel = () => {
const { showNewFilesPanel } = this.state;
this.setState({ showNewFilesPanel: !showNewFilesPanel });
};
setConvertDialogVisible = () =>
this.setState({ showConvertDialog: !this.state.showConvertDialog });
@ -545,13 +518,7 @@ class FilesRowContent extends React.PureComponent {
fileActionId,
fileActionExt,
} = this.props;
const {
itemTitle,
showNewFilesPanel,
newItems,
newFolderId,
showConvertDialog,
} = this.state;
const { itemTitle, showConvertDialog } = this.state;
const {
contentLength,
updated,
@ -581,6 +548,8 @@ class FilesRowContent extends React.PureComponent {
isTrashFolder || window.innerWidth <= 1024
? { noHover: true }
: { onClick: this.onFilesClick };
const newItems = item.new || fileStatus === 2;
const showNew = !!newItems;
return isEdit ? (
@ -603,13 +572,6 @@ class FilesRowContent extends React.PureComponent {
onConvert={this.onConvert}
/>
)}
{showNewFilesPanel && (
<NewFilesPanel
visible={showNewFilesPanel}
onClose={this.onShowNewFilesPanel}
folderId={newFolderId}
/>
)}
<SimpleFilesRowContent
sectionWidth={sectionWidth}
isMobile={isMobile}
@ -804,6 +766,7 @@ export default inject(
filesActionsStore,
mediaViewerDataStore,
versionHistoryStore,
dialogsStore,
},
{ item }
) => {
@ -820,8 +783,6 @@ export default inject(
const {
fetchFiles,
filter,
setNewRowItems,
newRowItems,
createFile,
updateFile,
renameFolder,
@ -829,15 +790,15 @@ export default inject(
openDocEditor,
setIsLoading,
isLoading,
updateFileBadge,
} = filesStore;
const {
treeFolders,
setTreeFolders,
isRecycleBinFolder,
isPrivacyFolder,
expandedKeys,
addExpandedKeys,
updateRootBadge,
} = treeFoldersStore;
const {
@ -865,6 +826,8 @@ export default inject(
markAsRead,
} = filesActionsStore;
const { setNewFilesPanelVisible, setNewFilesIds } = dialogsStore;
return {
isDesktop: isDesktopClient,
isTabletView,
@ -876,10 +839,8 @@ export default inject(
fileActionExt,
selectedFolderId: selectedFolderStore.id,
selectedFolderPathParts: selectedFolderStore.pathParts,
newItems: selectedFolderStore.new,
parentFolder: selectedFolderStore.parentId,
isLoading,
treeFolders,
isTrashFolder: isRecycleBinFolder,
isPrivacy: isPrivacyFolder,
filter,
@ -888,15 +849,12 @@ export default inject(
isVideo,
isImage,
isSound,
newRowItems,
expandedKeys,
setIsLoading,
fetchFiles,
setTreeFolders,
setSecondaryProgressBarData,
clearSecondaryProgressData,
setNewRowItems,
createFile,
createFolder,
updateFile,
@ -912,6 +870,10 @@ export default inject(
setIsVerHistoryPanel,
fetchFileVersions,
markAsRead,
setNewFilesPanelVisible,
setNewFilesIds,
updateRootBadge,
updateFileBadge,
};
}
)(withRouter(withTranslation("Home")(observer(FilesRowContent))));

7
products/ASC.Files/Client/src/components/pages/Home/Section/Body/FilesRow/SimpleFilesRow.js
View File

@ -288,7 +288,6 @@ const SimpleFilesRow = (props) => {
const getFilesContextOptions = useCallback(() => {
const isSharable = access !== 1 && access !== 0;
return contextOptions.map((option) => {
switch (option) {
case "open":
@ -417,7 +416,7 @@ const SimpleFilesRow = (props) => {
onClick: onClickDownloadAs,
disabled: false,
};
case "move":
case "move-to":
return {
key: option,
label: t("MoveTo"),
@ -433,7 +432,7 @@ const SimpleFilesRow = (props) => {
onClick: onMoveAction,
disabled: false,
};
case "copy":
case "copy-to":
return {
key: option,
label: t("Copy"),
@ -441,7 +440,7 @@ const SimpleFilesRow = (props) => {
onClick: onCopyAction,
disabled: false,
};
case "duplicate":
case "copy":
return {
key: option,
label: t("Duplicate"),

256
products/ASC.Files/Client/src/components/panels/NewFilesPanel/index.js
View File

@ -1,8 +1,9 @@
import React from "react";
import PropTypes from "prop-types";
import { withRouter } from "react-router";
import Backdrop from "@appserver/components/backdrop";
import Link from "@appserver/components/link";
import Loader from "@appserver/components/loader";
import Text from "@appserver/components/text";
import Heading from "@appserver/components/heading";
import Aside from "@appserver/components/aside";
import Row from "@appserver/components/row";
@ -24,22 +25,26 @@ import { inject, observer } from "mobx-react";
import { combineUrl } from "@appserver/common/utils";
import { AppServerConfig } from "@appserver/common/constants";
import config from "../../../../package.json";
class NewFilesPanelComponent extends React.Component {
class NewFilesPanel extends React.Component {
constructor(props) {
super(props);
this.state = { files: [] };
this.state = { files: [], readingFiles: [] };
}
componentDidMount() {
const { folderId, setIsLoading } = this.props;
const { newFilesIds, setIsLoading } = this.props;
setIsLoading(true);
getNewFiles(folderId[folderId.length - 1])
getNewFiles(newFilesIds[newFilesIds.length - 1])
.then((files) => this.setState({ files }))
.catch((err) => toastr.error(err))
.finally(() => setIsLoading(false));
}
onClose = () => {
this.props.setNewFilesPanelVisible(false);
};
getItemIcon = (item, isEdit) => {
const extension = item.fileExst;
const icon = extension
@ -59,57 +64,50 @@ class NewFilesPanelComponent extends React.Component {
};
onMarkAsRead = () => {
const { folderId, onClose } = this.props;
const markAsReadFiles = true;
const folderIds = [];
const fileIds = [];
const itemsIds = [];
for (let item of this.state.files) {
itemsIds.push(`${item.id}`);
if (item.fileExst) {
fileIds.push(item.id);
} else {
folderIds.push(item.id);
}
fileIds.push(`${item.id}`);
}
markAsRead(folderIds, fileIds)
.then(() => {
this.setNewFilesCount(folderId, markAsReadFiles);
this.props.setNewRowItems(itemsIds);
})
markAsRead([], fileIds)
.then(() => this.setNewBadgeCount())
.catch((err) => toastr.error(err))
.finally(() => onClose());
.finally(() => this.onClose());
};
onNewFilesClick = (item) => {
const { onClose, /*setIsLoading,*/ folderId, markAsRead } = this.props;
const folderIds = [];
const fileId = [];
const isFile = item.fileExst;
onNewFileClick = (item) => {
const {
updateFileBadge,
updateFolderBadge,
updateRootBadge,
markAsRead,
newFilesIds,
} = this.props;
const readingFiles = this.state.readingFiles;
isFile ? fileId.push(item.id) : folderIds.push(item.id);
markAsRead(folderIds, fileId)
markAsRead([], [item.id])
.then(() => {
this.setNewFilesCount(folderId, false, item);
this.onFilesClick(item);
// TODO: How update row folder badge count? Fetch?
if (readingFiles.includes(item.id)) return this.onFileClick(item);
updateRootBadge(+newFilesIds[0], 1);
updateFolderBadge(item.folderId, 1);
updateFileBadge(item.id);
readingFiles.push(item.id);
this.setState({ readingFiles });
this.onFileClick(item);
})
.catch((err) => toastr.error(err))
.finally(() => {
!isFile && onClose();
});
.catch((err) => toastr.error(err));
};
onFilesClick = (item) => {
console.log("ITEM", item);
return;
const { id, fileExst, viewUrl, fileType, providerKey } = item;
onFileClick = (item) => {
const { id, fileExst, webUrl, fileType, providerKey } = item;
const {
filter,
setMediaViewerData,
//setMediaViewerData,
fetchFiles,
addFileToRecentlyViewed,
} = this.props;
@ -142,74 +140,43 @@ class NewFilesPanelComponent extends React.Component {
return;
}
return window.open(viewUrl, "_blank");
return window.open(webUrl, "_blank");
}
};
setNewFilesCount = (folderPath, markAsReadAll, item) => {
const { treeFolders, setTreeFolders, folders, files } = this.props;
setNewBadgeCount = () => {
const {
newFilesIds,
updateFoldersBadge,
updateFilesBadge,
updateRootBadge,
updateFolderBadge,
pathParts,
} = this.props;
const data = treeFolders;
let dataItem;
const filesCount = this.state.files.length;
updateRootBadge(+newFilesIds[0], filesCount);
const loop = (index, newData) => {
dataItem = newData.find((x) => x.id === folderPath[index]);
if (index === folderPath.length - 1) {
const rootItem = data.find((x) => x.id === folderPath[0]);
const newFilesCounter = dataItem.newItems
? dataItem.newItems
: dataItem.new;
rootItem.newItems = markAsReadAll
? rootItem.newItems - newFilesCounter
: rootItem.newItems - 1;
dataItem.newItems = markAsReadAll ? 0 : newFilesCounter - 1;
this.props.setNewRowItems([`${item.id}`]);
return;
} else {
loop(index + 1, dataItem.folders);
if (newFilesIds.length <= 1) {
if (pathParts[0] === +newFilesIds[0]) {
updateFoldersBadge();
updateFilesBadge();
}
};
if (folderPath.length > 1) {
loop(0, data);
} else {
dataItem = data.find((x) => x.id === +folderPath[0]);
dataItem.newItems = markAsReadAll ? 0 : dataItem.newItems - 1;
if (item && (item.fileExst || item.contentLength)) {
const fileItem = files.find(
(x) => x.id === item.id && (x.fileExst || item.contentLength)
);
if (fileItem) {
fileItem.new = markAsReadAll ? 0 : fileItem.new - 1;
} else {
const filesFolder = folders.find((x) => x.id === item.folderId);
if (filesFolder) {
filesFolder.new = markAsReadAll ? 0 : filesFolder.new - 1;
}
}
this.props.setNewRowItems([`${item.id}`]);
} else if (item && !item.fileExst) {
const folderItem = folders.find((x) => x.id === item.id && !x.fileExst);
if (folderItem) {
folderItem.new = markAsReadAll ? 0 : folderItem.new - 1;
}
}
updateFolderBadge(+newFilesIds[newFilesIds.length - 1], filesCount);
}
setTreeFolders(data);
};
render() {
//console.log("NewFiles panel render");
const { t, visible, onClose } = this.props;
const { t, visible, onClose, isLoading } = this.props;
const { files } = this.state;
const zIndex = 310;
return (
<StyledAsidePanel visible={visible}>
<Backdrop
onClick={onClose}
onClick={this.onClose}
visible={visible}
zIndex={zIndex}
isAside={true}
@ -225,37 +192,45 @@ class NewFilesPanelComponent extends React.Component {
{t("NewFiles")}
</Heading>
</StyledHeaderContent>
<StyledBody className="files-operations-body">
<RowContainer useReactWindow>
{files.map((file) => {
const element = this.getItemIcon(file);
return (
<Row key={file.id} element={element}>
<Box
onClick={this.onNewFilesClick.bind(this, file)}
marginProp="auto 0"
>
<Link
containerWidth="100%"
type="page"
fontWeight="bold"
color="#333"
isTextOverflow
truncate
title={file.title}
fontSize="14px"
className="files-new-link"
{!isLoading ? (
<StyledBody className="files-operations-body">
<RowContainer useReactWindow>
{files.map((file) => {
const element = this.getItemIcon(file);
return (
<Row key={file.id} element={element}>
<Box
onClick={this.onNewFilesClick.bind(this, file)}
marginProp="auto 0"
>
{file.title}
</Link>
</Box>
</Row>
);
})}
</RowContainer>
</StyledBody>
<Link
containerWidth="100%"
type="page"
fontWeight="bold"
color="#333"
isTextOverflow
truncate
title={file.title}
fontSize="14px"
className="files-new-link"
>
{file.title}
</Link>
</Box>
</Row>
);
})}
</RowContainer>
</StyledBody>
) : (
<div key="loader" className="panel-loader-wrapper">
<Loader type="oval" size="16px" className="panel-loader" />
<Text as="span">{t("LoadingLabel")}</Text>
</div>
)}
<StyledFooter>
<Button
className="new_files_panel-button"
label={t("MarkAsRead")}
size="big"
primary
@ -265,7 +240,7 @@ class NewFilesPanelComponent extends React.Component {
className="sharing_panel-button"
label={t("CloseButton")}
size="big"
onClick={onClose}
onClick={this.onClose}
/>
</StyledFooter>
</StyledContent>
@ -275,13 +250,6 @@ class NewFilesPanelComponent extends React.Component {
}
}
NewFilesPanelComponent.propTypes = {
onClose: PropTypes.func,
visible: PropTypes.bool,
};
const NewFilesPanel = withTranslation("NewFilesPanel")(NewFilesPanelComponent);
export default inject(
({
filesStore,
@ -289,36 +257,50 @@ export default inject(
treeFoldersStore,
formatsStore,
filesActionsStore,
selectedFolderStore,
dialogsStore,
}) => {
const {
files,
folders,
fetchFiles,
filter,
addFileToRecentlyViewed,
setNewRowItems,
setIsLoading,
isLoading,
updateFileBadge,
updateFolderBadge,
} = filesStore;
const { treeFolders, setTreeFolders } = treeFoldersStore;
const { updateRootBadge } = treeFoldersStore;
const { setMediaViewerData } = mediaViewerDataStore;
const { getFileIcon, getFolderIcon } = formatsStore.iconFormatsStore;
const { markAsRead } = filesActionsStore;
const { pathParts } = selectedFolderStore;
const {
setNewFilesPanelVisible,
newFilesPanelVisible: visible,
newFilesIds,
} = dialogsStore;
return {
files,
folders,
treeFolders,
filter,
pathParts,
visible,
newFilesIds,
isLoading,
setIsLoading,
fetchFiles,
setTreeFolders,
setMediaViewerData,
addFileToRecentlyViewed,
setNewRowItems,
getFileIcon,
getFolderIcon,
markAsRead,
setNewFilesPanelVisible,
updateRootBadge,
updateFileBadge,
updateFolderBadge,
updateFoldersBadge,
updateFilesBadge,
};
}
)(withRouter(observer(NewFilesPanel)));
)(withRouter(withTranslation("NewFilesPanel")(observer(NewFilesPanel))));

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

@ -27,6 +27,7 @@ import { inject, observer } from "mobx-react";
import config from "../../../../package.json";
import i18n from "./i18n";
import { I18nextProvider } from "react-i18next";
import { isMobile } from "react-device-detect";
const SharingBodyStyle = { height: `calc(100vh - 156px)` };
@ -273,7 +274,7 @@ class SharingPanelComponent extends React.Component {
const fileId = returnValue[1];
if (folderId.length !== 0 || fileId.length !== 0) {
setIsLoading(true);
!isMobile && setIsLoading(true);
getShareUsers(folderId, fileId)
.then((shareDataItems) => {
const baseShareData = JSON.parse(JSON.stringify(shareDataItems));
@ -297,7 +298,7 @@ class SharingPanelComponent extends React.Component {
toastr.error(err);
this.onClose();
})
.finally(() => setIsLoading(false));
.finally(() => !isMobile && setIsLoading(false));
}
};
@ -507,12 +508,8 @@ class SharingPanelComponent extends React.Component {
/>
))
) : (
<div key="loader" className="sharing-panel-loader-wrapper">
<Loader
type="oval"
size="16px"
className="sharing-panel-loader"
/>
<div key="loader" className="panel-loader-wrapper">
<Loader type="oval" size="16px" className="panel-loader" />
<Text as="span">{t("LoadingLabel")}</Text>
</div>
)}

7
products/ASC.Files/Client/src/components/panels/StyledPanels.js
View File

@ -196,11 +196,11 @@ const StyledContent = styled.div`
}
}
.sharing-panel-loader-wrapper {
.panel-loader-wrapper {
margin-top: 8px;
padding-left: 32px;
}
.sharing-panel-loader {
.panel-loader {
display: inline;
margin-right: 10px;
}
@ -472,6 +472,9 @@ const StyledFooter = styled.div`
.sharing_panel-button {
margin-left: auto;
}
.new_files_panel-button {
margin-right: 8px;
}
`;
const StyledLinkRow = styled.div`

11
products/ASC.Files/Client/src/store/DialogsStore.js
View File

@ -12,10 +12,12 @@ class DialogsStore {
downloadDialogVisible = false;
emptyTrashDialogVisible = false;
thirdPartyDialogVisible = false;
newFilesPanelVisible = false;
removeItem = null;
connectItem = null;
destFolderId = null;
newFilesIds = null;
constructor() {
makeAutoObservable(this);
@ -78,6 +80,15 @@ class DialogsStore {
setDestFolderId = (destFolderId) => {
this.destFolderId = destFolderId;
};
setNewFilesPanelVisible = (newFilesPanelVisible) => {
if (!newFilesPanelVisible) this.setNewFilesIds(null);
this.newFilesPanelVisible = newFilesPanelVisible;
};
setNewFilesIds = (newFilesIds) => {
this.newFilesIds = newFilesIds;
};
}
export default new DialogsStore();

405
products/ASC.Files/Client/src/store/FilesStore.js
View File

@ -41,7 +41,6 @@ class FilesStore {
selection = [];
selected = "close";
filter = FilesFilter.getDefault(); //TODO: FILTER
newRowItems = [];
constructor(
authStore,
@ -234,10 +233,6 @@ class FilesStore {
this.filter = filter;
};
setNewRowItems = (newRowItems) => {
this.newRowItems = newRowItems;
};
setFilesOwner = (folderIds, fileIds, ownerId) => {
return api.files.setFileOwner(folderIds, fileIds, ownerId);
};
@ -366,129 +361,335 @@ class FilesStore {
this.selection = this.selection.filter((x) => x.id !== id);
};
removeOptions = (options, toRemoveArray) =>
options.filter((o) => !toRemoveArray.includes(o));
getFilesContextOptions = (item, canOpenPlayer) => {
const options = [];
const isVisitor =
(this.userStore.user && this.userStore.user.isVisitor) || false;
const isFile = !!item.fileExst || item.contentLength;
const isFavorite = item.fileStatus === 32;
const isFullAccess = item.access < 2;
const isThirdPartyFolder =
item.providerKey && this.selectedFolderStore.isRootFolder;
if (item.id <= 0) return [];
const withoutShare = false; //TODO: need this prop
const isThirdPartyItem = item.providerKey;
const hasNew = item.new > 0;
const canConvert = false; //TODO: fix of added convert check;
const isEncrypted = item.encrypted;
const isDocuSign = false; //TODO: need this prop;
const isEditing = false; //TODO: need this prop;
const {
isRecycleBinFolder,
isPrivacyFolder,
isRecentFolder,
isShareFolder,
isCommonFolder,
isFavoritesFolder,
isThirdPartyFolder,
} = this.treeFoldersStore;
if (isRecycleBinFolder) {
options.push("download");
isFile && options.push("download-as");
options.push("restore");
options.push("separator0");
options.push("delete");
} else if (isPrivacyFolder) {
if (isFile) {
options.push("sharing-settings");
options.push("separator0");
options.push("show-version-history");
options.push("separator1");
const { isDesktopClient } = this.settingsStore;
if (isFile) {
let fileOptions = [
//"open",
"edit",
"preview",
"view",
"separator0",
"sharing-settings",
"external-link",
"owner-change",
"link-for-portal-users",
"send-by-email",
"docu-sign",
"version", //category
"finalize-version",
"show-version-history",
"block-unblock-version", //need split
"separator1",
"open-location",
"mark-read",
"mark-as-favorite",
"download",
//"download-as",
"convert",
"move", //category
"move-to",
"copy-to",
"copy",
"restore",
"rename",
"separator2",
"remove-from-favorites",
"unsubscribe",
"delete",
];
if (!canConvert || isEncrypted) {
fileOptions = this.removeOptions(fileOptions, ["convert"]);
}
options.push("download");
options.push("move");
options.push("rename");
options.push("separator2");
options.push("delete");
if (!canOpenPlayer) {
fileOptions = this.removeOptions(fileOptions, ["view"]);
} else {
fileOptions = this.removeOptions(fileOptions, ["edit", "preview"]);
}
if (!isDocuSign) {
fileOptions = this.removeOptions(fileOptions, ["docu-sign"]);
}
if (isEditing) {
fileOptions = this.removeOptions(fileOptions, [
"finalize-version",
"move-to",
"delete",
]);
if (isThirdPartyFolder) {
fileOptions = this.removeOptions(fileOptions, ["rename"]);
}
}
if (isFavorite) {
fileOptions = this.removeOptions(fileOptions, ["mark-as-favorite"]);
} else {
fileOptions = this.removeOptions(fileOptions, [
"remove-from-favorites",
]);
if (isFavoritesFolder) {
fileOptions = this.removeOptions(fileOptions, ["mark-as-favorite"]);
}
}
if (isFavoritesFolder) {
fileOptions = this.removeOptions(fileOptions, ["move-to", "delete"]);
if (!isFavorite) {
fileOptions = this.removeOptions(fileOptions, ["separator2"]);
}
}
if (isEncrypted) {
fileOptions = this.removeOptions(fileOptions, [
"open",
"edit",
"link-for-portal-users",
"external-link",
"send-by-email",
"block-unblock-version", //need split
"version", //category
"finalize-version",
"copy-to",
"copy",
"mark-as-favorite",
]);
}
if (isRecycleBinFolder) {
fileOptions = this.removeOptions(fileOptions, [
"open",
"open-location",
"edit",
"link-for-portal-users",
"sharing-settings",
"external-link",
"send-by-email",
"block-unblock-version", //need split
"version", //category
"finalize-version",
"show-version-history",
"move", //category
"move-to",
"copy-to",
"mark-read",
"mark-as-favorite",
"remove-from-favorites",
"rename",
"separator0",
"separator1",
]);
} else {
fileOptions = this.removeOptions(fileOptions, ["restore"]);
}
if (!isFullAccess) {
fileOptions = this.removeOptions(fileOptions, [
"finalize-version",
"rename",
"block-unblock-version",
]);
}
if (isVisitor) {
fileOptions = this.removeOptions(fileOptions, [
"block-unblock-version",
"finalize-version",
"mark-as-favorite",
"remove-from-favorites",
]);
if (!isFullAccess) {
fileOptions = this.removeOptions(fileOptions, ["rename"]);
}
}
if (!this.canShareOwnerChange(item)) {
fileOptions = this.removeOptions(fileOptions, ["owner-change"]);
}
if (isThirdPartyItem) {
fileOptions = this.removeOptions(fileOptions, [
"owner-change",
"finalize-version",
"copy",
]);
}
if (!this.userAccess) {
fileOptions = this.removeOptions(fileOptions, [
"owner-change",
"move-to",
"delete",
]);
}
if (withoutShare) {
fileOptions = this.removeOptions(fileOptions, [
"sharing-settings",
"external-link",
]);
}
if (!hasNew) {
fileOptions = this.removeOptions(fileOptions, ["mark-read"]);
}
if (!isRecentFolder) {
fileOptions = this.removeOptions(fileOptions, ["open-location"]);
} else if (!isFavorite) {
fileOptions = this.removeOptions(fileOptions, ["separator2"]);
}
return fileOptions;
} else {
if (!isFile) {
options.push("open");
options.push("separator0");
let folderOptions = [
"open",
"separator0",
"sharing-settings",
"owner-change",
"link-for-portal-users",
"separator1",
"download",
"move", //category
"move-to",
"copy-to",
"mark-read",
"restore",
"rename",
"change-thirdparty-info",
"separator2",
"unsubscribe",
"delete",
];
if (isPrivacyFolder) {
folderOptions = this.removeOptions(folderOptions, ["copy"]);
}
//TODO: use canShare selector
if (
/*!(isRecentFolder || isFavoritesFolder || isVisitor) && */ this
.canShare
) {
options.push("sharing-settings");
if (isRecycleBinFolder) {
folderOptions = this.removeOptions(folderOptions, [
"open",
"link-for-portal-users",
"sharing-settings",
"move",
"move-to",
"copy-to",
"mark-read",
"rename",
"separator0",
"separator1",
]);
} else {
folderOptions = this.removeOptions(folderOptions, ["restore"]);
}
if (isFile && !isVisitor) {
options.push("send-by-email");
if (!isFullAccess) {
//TODO: if added Projects, add project folder check
folderOptions = this.removeOptions(folderOptions, [
"rename",
"change-thirdparty-info",
]);
}
this.canShareOwnerChange(item) && options.push("owner-change");
if (!this.canShareOwnerChange(item)) {
folderOptions = this.removeOptions(folderOptions, ["owner-change"]);
}
if (isFile) {
if (canOpenPlayer) {
options.push("view");
} else {
options.push("edit");
options.push("preview");
if (!isFullAccess) {
folderOptions = this.removeOptions(folderOptions, [
"owner-change",
"move-to",
"delete",
"change-thirdparty-info",
"separator2",
]);
if (isVisitor) {
folderOptions = this.removeOptions(folderOptions, ["rename"]);
}
}
options.push("link-for-portal-users");
if (!isVisitor) {
options.push("separator1");
if (withoutShare) {
folderOptions = this.removeOptions(folderOptions, ["sharing-settings"]);
}
if (isFile) {
options.push("show-version-history");
if (!isVisitor) {
if (isFullAccess && !item.providerKey && !canOpenPlayer) {
options.push("finalize-version");
options.push("block-unblock-version");
}
options.push("separator2");
if (!hasNew) {
folderOptions = this.removeOptions(folderOptions, ["mark-read"]);
}
if (isRecentFolder) {
options.push("open-location");
}
if (!isFavorite) {
options.push("mark-as-favorite");
}
if (!isCommonFolder) {
folderOptions = this.removeOptions(folderOptions, ["unsubscribe"]);
}
if (isThirdPartyItem) {
folderOptions = this.removeOptions(folderOptions, ["owner-change"]);
if (isShareFolder) {
folderOptions = this.removeOptions(folderOptions, [
"change-thirdparty-info",
]);
} else {
!isShareFolder && options.push("separator3");
}
}
if (isDesktopClient) {
folderOptions = this.removeOptions(folderOptions, [
"change-thirdparty-info",
]);
}
options.push("download");
folderOptions = this.removeOptions(folderOptions, [
"remove",
"move-to",
]);
if (!isVisitor) {
!isThirdPartyFolder && this.userAccess && options.push("move");
options.push("copy");
// if (isFile) {
// options.push("duplicate");
// }
this.userAccess && options.push("rename");
isThirdPartyFolder &&
this.userAccess &&
options.push("change-thirdparty-info");
if (this.userAccess) {
options.push("separator3");
options.push("delete");
if (!item) {
//For damaged items
folderOptions = this.removeOptions(folderOptions, [
"open",
"download",
"copy-to",
"rename",
]);
}
}
} else {
options.push("copy");
folderOptions = this.removeOptions(folderOptions, [
"change-thirdparty-info",
]);
}
}
if (isFavorite && !isRecycleBinFolder) {
!this.userAccess && options.push("separator3");
options.push("remove-from-favorites");
return folderOptions;
}
return options;
};
addFileToRecentlyViewed = (fileId) => {
@ -516,6 +717,28 @@ class FilesStore {
if (folderIndex !== -1) this.folders[folderIndex] = folder;
};
updateFolderBadge = (id, count) => {
const folder = this.folders.find((x) => x.id === id);
if (folder) folder.new -= count;
};
updateFileBadge = (id) => {
const file = this.files.find((x) => x.id === id);
if (file) file.fileStatus = 0;
};
updateFilesBadge = () => {
for (let file of this.files) {
file.fileStatus = 0;
}
};
updateFoldersBadge = () => {
for (let folder of this.folders) {
folder.new = 0;
}
};
updateFile = (fileId, title) => {
return api.files
.updateFile(fileId, title)

26
products/ASC.Files/Client/src/store/SelectedFolderStore.js
View File

@ -1,4 +1,4 @@
import { makeObservable, action, observable, computed } from "mobx";
import { makeAutoObservable } from "mobx";
class SelectedFolderStore {
folders = null;
@ -20,29 +20,7 @@ class SelectedFolderStore {
providerItem = null;
constructor() {
makeObservable(this, {
folders: observable,
parentId: observable,
filesCount: observable,
foldersCount: observable,
isShareable: observable,
new: observable,
id: observable,
title: observable,
access: observable,
shared: observable,
created: observable,
createdBy: observable,
updated: observable,
updatedBy: observable,
rootFolderType: observable,
pathParts: observable,
providerItem: observable,
isRootFolder: computed,
setSelectedFolder: action,
});
makeAutoObservable(this);
}
get isRootFolder() {

5
products/ASC.Files/Client/src/store/TreeFoldersStore.js
View File

@ -38,6 +38,11 @@ class TreeFoldersStore {
this.expandedKeys.push(item);
};
updateRootBadge = (id, count) => {
const rootItem = this.treeFolders.find((x) => x.id === id);
if (rootItem) rootItem.newItems -= count;
};
get myFolder() {
return this.treeFolders.find((x) => x.rootFolderName === "@my");
}

7
products/ASC.Files/Client/src/store/UploadDataStore.js
View File

@ -567,7 +567,6 @@ class UploadDataStore {
if (totalErrorsCount > 0) console.log("Errors: ", totalErrorsCount);
const uploadData = {
files: this.files,
filesSize: 0,
uploadStatus: null,
uploadedFiles: 0,
@ -578,6 +577,12 @@ class UploadDataStore {
setTimeout(() => {
!this.primaryProgressDataStore.alert &&
this.primaryProgressDataStore.clearPrimaryProgressData();
uploadData.files =
this.uploadPanelVisible || this.primaryProgressDataStore.alert
? this.files
: [];
this.setUploadData(uploadData);
}, TIMEOUT);
};

2
web/ASC.Web.Client/src/components/Layout/index.js
View File

@ -42,7 +42,7 @@ const StyledContainer = styled.div`
css`
overflow-y: hidden !important;
overflow-x: hidden !important;
width: 208px;
width: 192px;
`}
}