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

refactoring. moved the onLoading function to redux

Browse Source
This commit is contained in:
Artem Tarasov 2020-08-24 17:25:41 +03:00
parent 35c1b08547
commit 5a494b3c2c
6 changed files with 70 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -9,7 +9,8 @@ import {
setTreeFolders,
setDragItem,
setDragging,
setNewTreeFilesBadge
setNewTreeFilesBadge,
setIsLoading
} from "../../../store/files/actions";
import store from "../../../store/store";
import isEqual from "lodash/isEqual";
@ -54,16 +55,16 @@ class ArticleBodyContent extends React.Component {
}
onSelect = data => {
const { selectedKeys, filter, onLoading } = this.props;
const { selectedKeys, filter, setIsLoading } = this.props;
if (selectedKeys[0] !== data[0]) {
onLoading(true);
setIsLoading(true);
const newFilter = filter.clone();
newFilter.page = 0;
newFilter.startIndex = 0;
fetchFiles(data[0], newFilter, store.dispatch)
.catch(err => toastr.error(err))
.finally(() => onLoading(false));
.finally(() => setIsLoading(false));
}
};
@ -86,7 +87,7 @@ class ArticleBodyContent extends React.Component {
filter,
setFilter,
setTreeFolders,
onLoading,
setIsLoading,
isLoading,
dragging,
setDragItem,
@ -111,7 +112,7 @@ class ArticleBodyContent extends React.Component {
visible={showNewFilesPanel}
onClose={this.onShowNewFilesPanel}
setNewFilesCount={this.setNewFilesCount}
onLoading={onLoading}
onLoading={setIsLoading}
folderId={newFolderId}
treeFolders={data}
setTreeFolders={setTreeFolders}
@ -127,7 +128,7 @@ class ArticleBodyContent extends React.Component {
setFilter={setFilter}
setTreeFolders={setTreeFolders}
expandedKeys={expandedKeys}
onLoading={onLoading}
onLoading={setIsLoading}
isLoading={isLoading}
dragging={dragging}
setDragging={setDragging}
@ -149,7 +150,7 @@ class ArticleBodyContent extends React.Component {
}
function mapStateToProps(state) {
const { treeFolders, selectedFolder, filter, selection, dragging, updateTreeNew } = state.files;
const { treeFolders, selectedFolder, filter, selection, dragging, updateTreeNew, isLoading } = state.files;
const currentFolderId = selectedFolder.id.toString();
const myFolderIndex = 0;
const shareFolderIndex = 1;
@ -184,10 +185,11 @@ function mapStateToProps(state) {
isAdmin: state.auth.user.isAdmin,
selection,
dragging,
updateTreeNew
updateTreeNew,
isLoading
};
}
export default connect(mapStateToProps, { setFilter, setTreeFolders, setDragItem, setDragging, setNewTreeFilesBadge })(
export default connect(mapStateToProps, { setFilter, setTreeFolders, setDragItem, setDragging, setNewTreeFilesBadge, setIsLoading })(
ArticleBodyContent
);

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

@ -28,7 +28,8 @@ import {
setNewTreeFilesBadge,
setProgressBarData,
setSelected,
setTreeFolders
setTreeFolders,
setIsLoading
} from "../../../store/files/actions";
import {
loopTreeFolders,
@ -52,7 +53,6 @@ class PureHome extends React.Component {
isHeaderVisible: false,
isHeaderIndeterminate: false,
isHeaderChecked: false,
isLoading: false,
overwriteSetting: false,
uploadOriginalFormatSetting: false,
@ -214,10 +214,6 @@ class PureHome extends React.Component {
}
};
onLoading = status => {
this.setState({ isLoading: status });
};
onChangeOverwrite = () =>
this.setState({ overwriteSetting: !this.state.overwriteSetting });
@ -405,12 +401,11 @@ class PureHome extends React.Component {
isHeaderIndeterminate,
isHeaderChecked,
selected,
isLoading,
overwriteSetting,
uploadOriginalFormatSetting,
hideWindowSetting
} = this.state;
const { t, progressData, viewAs, convertDialogVisible } = this.props;
const { t, progressData, viewAs, isLoading, convertDialogVisible, setIsLoading } = this.props;
const progressBarContent = (
<div>
@ -468,12 +463,12 @@ class PureHome extends React.Component {
</PageLayout.ArticleHeader>
<PageLayout.ArticleMainButton>
<ArticleMainButtonContent onLoading={this.onLoading} />
<ArticleMainButtonContent onLoading={setIsLoading} />
</PageLayout.ArticleMainButton>
<PageLayout.ArticleBody>
<ArticleBodyContent
onLoading={this.onLoading}
onLoading={setIsLoading}
isLoading={isLoading}
onTreeDrop={this.onDrop}
/>
@ -486,21 +481,21 @@ class PureHome extends React.Component {
onCheck={this.onSectionHeaderContentCheck}
onSelect={this.onSectionHeaderContentSelect}
onClose={this.onClose}
onLoading={this.onLoading}
onLoading={setIsLoading}
isLoading={isLoading}
loopFilesOperations={this.loopFilesOperations}
/>
</PageLayout.SectionHeader>
<PageLayout.SectionFilter>
<SectionFilterContent onLoading={this.onLoading} />
<SectionFilterContent onLoading={setIsLoading} />
</PageLayout.SectionFilter>
<PageLayout.SectionBody>
<SectionBodyContent
selected={selected}
isLoading={isLoading}
onLoading={this.onLoading}
onLoading={setIsLoading}
onChange={this.onRowChange}
loopFilesOperations={this.loopFilesOperations}
onDropZoneUpload={this.onDrop}
@ -508,7 +503,7 @@ class PureHome extends React.Component {
</PageLayout.SectionBody>
<PageLayout.SectionPaging>
<SectionPagingContent onLoading={this.onLoading} />
<SectionPagingContent onLoading={setIsLoading} />
</PageLayout.SectionPaging>
</PageLayout>
</>
@ -545,7 +540,8 @@ function mapStateToProps(state) {
selectedFolder,
selection,
treeFolders,
viewAs
viewAs,
isLoading
} = state.files;
const { id } = selectedFolder;
const indexOfTrash = 3;
@ -563,7 +559,8 @@ function mapStateToProps(state) {
selected,
selection,
treeFolders,
viewAs
viewAs,
isLoading
};
}
@ -580,6 +577,7 @@ export default connect(
setProgressBarData,
setSelected,
setTreeFolders,
startUpload
startUpload,
setIsLoading
}
)(withRouter(Home));

29
products/ASC.Files/Client/src/components/pages/Settings/index.js
View File

@ -8,6 +8,7 @@ import {
ArticleMainButtonContent
} from "../../Article";
import { SectionHeaderContent, SectionBodyContent } from "./Section";
import { setIsLoading } from '../../../store/files/actions';
import { withTranslation, I18nextProvider } from "react-i18next";
import { createI18N } from "../../../helpers/i18n";
@ -24,7 +25,6 @@ class PureSettings extends React.Component {
super(props)
this.state = {
isLoading: false,
intermediateVersion: false,
thirdParty: false,
originalCopy: false,
@ -37,10 +37,6 @@ class PureSettings extends React.Component {
}
}
onLoading = status => {
this.setState({ isLoading: status });
};
render() {
console.log('Settings render()');
const {
@ -54,8 +50,9 @@ class PureSettings extends React.Component {
updateOrCreate,
keepIntermediate,
} = this.state;
const { match, t } = this.props;
const { match, t, isLoading, setIsLoading } = this.props;
const { setting } = match.params;
console.log(setting)
return (
<PageLayout>
@ -64,13 +61,14 @@ class PureSettings extends React.Component {
</PageLayout.ArticleHeader>
<PageLayout.ArticleMainButton>
<ArticleMainButtonContent onLoading={this.onLoading} />
<ArticleMainButtonContent onLoading={setIsLoading} />
</PageLayout.ArticleMainButton>
<PageLayout.ArticleBody>
<ArticleBodyContent
onLoading={this.onLoading}
isLoading={this.state.isLoading}
onLoading={setIsLoading}
isLoading={isLoading}
/>
</PageLayout.ArticleBody>
@ -91,7 +89,7 @@ class PureSettings extends React.Component {
updateOrCreate={updateOrCreate}
keepIntermediate={keepIntermediate}
t={t}
onLoading={this.onLoading}
onLoading={setIsLoading}
isCheckedThirdParty={this.isCheckedThirdParty}
isCheckedIntermediate={this.isCheckedIntermediate}
/>
@ -113,7 +111,14 @@ const Settings = props => {
}
function mapStateToProps(state) {
return {};
return {
isLoading: state.files.isLoading
};
}
export default connect(mapStateToProps)(withRouter(Settings));
export default connect(
mapStateToProps,
{
setIsLoading
}
)(withRouter(Settings));

23
products/ASC.Files/Client/src/components/pages/VersionHistory/index.js
View File

@ -10,6 +10,7 @@ import {
ArticleBodyContent,
ArticleMainButtonContent
} from "../../Article";
import { setIsLoading } from "../../../store/files/actions";
import { SectionHeaderContent, SectionBodyContent } from "./Section";
import { createI18N } from "../../../helpers/i18n";
const i18n = createI18N({
@ -27,7 +28,6 @@ class PureVersionHistory extends React.Component {
const { fileId } = match.params;
this.state = {
isLoading: false,
fileId,
versions: null
};
@ -50,18 +50,14 @@ class PureVersionHistory extends React.Component {
.then(versions => this.setState({ versions }));
};
onLoading = status => {
this.setState({ isLoading: status });
};
render() {
const { versions } = this.state;
const { t, settings } = this.props;
const { t, settings, isLoading } = this.props;
return (
<>
<RequestLoader
visible={this.state.isLoading}
visible={isLoading}
zIndex={256}
loaderSize="16px"
loaderColor={"#999"}
@ -77,15 +73,15 @@ class PureVersionHistory extends React.Component {
<PageLayout.ArticleMainButton>
<ArticleMainButtonContent
onLoading={this.onLoading}
onLoading={setIsLoading}
startUpload={this.startUpload}
/>
</PageLayout.ArticleMainButton>
<PageLayout.ArticleBody>
<ArticleBodyContent
onLoading={this.onLoading}
isLoading={this.state.isLoading}
onLoading={setIsLoading}
isLoading={isLoading}
/>
</PageLayout.ArticleBody>
@ -96,7 +92,7 @@ class PureVersionHistory extends React.Component {
<PageLayout.SectionBody>
<SectionBodyContent
getFileVersions={this.getFileVersions}
onLoading={this.onLoading}
onLoading={setIsLoading}
versions={versions}
culture={settings.culture}
/>
@ -145,8 +141,9 @@ VersionHistory.propTypes = {
function mapStateToProps(state) {
return {
settings: state.auth.settings,
isLoaded: state.auth.isLoaded
isLoaded: state.auth.isLoaded,
isLoading: state.files.isLoading
};
}
export default connect(mapStateToProps)(withRouter(VersionHistory));
export default connect(mapStateToProps, { setIsLoading })(withRouter(VersionHistory));

8
products/ASC.Files/Client/src/store/files/actions.js
View File

@ -41,6 +41,7 @@ export const SET_NEW_TREE_FILES = "SET_NEW_TREE_FILES";
export const SET_NEW_ROW_ITEMS = "SET_NEW_ROW_ITEMS";
export const SET_SELECTED_SETTING = "SET_SELECTED_SETTING";
export const SET_EXPAND_SETTINGS_TREE = "SET_EXPAND_SETTINGS_TREE";
export const SET_IS_LOADING = "SET_IS_LOADING";
export function setFile(file) {
return {
@ -203,6 +204,13 @@ export function setExpandSettingsTree(setting) {
}
}
export function setIsLoading(isLoading) {
return {
type: SET_IS_LOADING,
isLoading
}
}
export function setFilterUrl(filter) {
const defaultFilter = FilesFilter.getDefault();
const params = [];

10
products/ASC.Files/Client/src/store/files/reducers.js
View File

@ -21,7 +21,8 @@ import {
SET_NEW_TREE_FILES,
SET_NEW_ROW_ITEMS,
SET_SELECTED_SETTING,
SET_EXPAND_SETTINGS_TREE
SET_EXPAND_SETTINGS_TREE,
SET_IS_LOADING
} from "./actions";
import { api } from "asc-web-common";
import { isFileSelected, skipFile, getFilesBySelected } from "./selectors";
@ -47,7 +48,8 @@ const initialState = {
updateTreeNew: false,
newRowItems: [],
selectedSetting: [],
expandedSetting: []
expandedSetting: [],
isLoading: false
};
const filesReducer = (state = initialState, action) => {
@ -153,6 +155,10 @@ const filesReducer = (state = initialState, action) => {
return Object.assign({}, state, {
expandedSetting: action.setting
})
case SET_IS_LOADING:
return Object.assign({}, state, {
isLoading: action.isLoading
})
default:
return state;
}