diff --git a/products/ASC.Files/Client/src/components/pages/Home/index.js b/products/ASC.Files/Client/src/components/pages/Home/index.js index 8db9c61af1..7226f99b74 100644 --- a/products/ASC.Files/Client/src/components/pages/Home/index.js +++ b/products/ASC.Files/Client/src/components/pages/Home/index.js @@ -4,8 +4,8 @@ import PropTypes from "prop-types"; import { withRouter } from "react-router"; import { isMobile } from "react-device-detect"; //import { RequestLoader } from "asc-web-components"; -import { PageLayout, utils, api, store } from "asc-web-common"; -import { withTranslation, I18nextProvider } from "react-i18next"; +import { PageLayout, utils, api, store, toastr } from "asc-web-common"; +import { withTranslation, I18nextProvider, Trans } from "react-i18next"; import { ArticleBodyContent, ArticleHeaderContent, @@ -39,6 +39,9 @@ import { getDragging, getSharePanelVisible, getFirstLoad, + isSecondaryProgressFinished, + getSelectionLength, + getSelectionTitle, } from "../../../store/files/selectors"; import { ConvertDialog } from "../../dialogs"; @@ -158,14 +161,67 @@ class PureHome extends React.Component { startUpload(files, folderId, t); }; + showOperationToast = (type, qty, title) => { + const { i18n } = this.props; + + switch (type) { + case "move": + if (qty > 1) { + return toastr.success( + + {{ qty }} elements has been moved + + ); + } + return toastr.success( + + {{ title }} moved + + ); + case "duplicate": + if (qty > 1) { + return toastr.success( + + {{ qty }} elements copied + + ); + } + return toastr.success( + + {{ title }} copied + + ); + default: + break; + } + }; + componentDidUpdate(prevProps) { - if (this.props.isLoading !== prevProps.isLoading) { - if (this.props.isLoading) { + const { + isLoading, + isProgressFinished, + secondaryProgressData, + selectionLength, + selectionTitle, + } = this.props; + if (isLoading !== prevProps.isLoading) { + if (isLoading) { utils.showLoader(); } else { utils.hideLoader(); } } + + if ( + isProgressFinished && + isProgressFinished !== prevProps.isProgressFinished + ) { + this.showOperationToast( + secondaryProgressData.icon, + selectionLength, + selectionTitle + ); + } } render() { @@ -280,6 +336,9 @@ function mapStateToProps(state) { dragging: getDragging(state), firstLoad: getFirstLoad(state), sharingPanelVisible: getSharePanelVisible(state), + isProgressFinished: isSecondaryProgressFinished(state), + selectionLength: getSelectionLength(state), + selectionTitle: getSelectionTitle(state), }; } diff --git a/products/ASC.Files/Client/src/store/files/selectors.js b/products/ASC.Files/Client/src/store/files/selectors.js index 340330174d..414c9ce8bd 100644 --- a/products/ASC.Files/Client/src/store/files/selectors.js +++ b/products/ASC.Files/Client/src/store/files/selectors.js @@ -588,6 +588,11 @@ export const getSelectionLength = (state) => { return state.files.selection.length; }; +export const getSelectionTitle = createSelector(getSelection, (selection) => { + if (selection.length === 0) return null; + return selection.find((el) => el.title).title; +}); + export const getViewAs = (state) => { return state.files.viewAs; }; @@ -1214,3 +1219,10 @@ export const getIconOfDraggedFile = (state) => { export const getSharePanelVisible = (state) => { return state.files.sharingPanelVisible; }; + +export const isSecondaryProgressFinished = createSelector( + getSecondaryProgressData, + (data) => { + return data && data.percent === 100; + } +);