From 879a027055df3d83e641e277ff3467853179f16b Mon Sep 17 00:00:00 2001 From: Tatiana Lopaeva Date: Tue, 15 Feb 2022 18:22:55 +0300 Subject: [PATCH] Web: Files: AutoBackup: Optimization modules. --- .../AmazonSettings.js | 12 +- .../DocumentsModule.js | 4 +- .../ThirdPartyModule.js | 4 +- .../ThirdPartyStorageModule.js | 116 +++++++++++------- 4 files changed, 77 insertions(+), 59 deletions(-) diff --git a/web/ASC.Web.Client/src/components/pages/Settings/categories/data-management/consumer-storage-settings/AmazonSettings.js b/web/ASC.Web.Client/src/components/pages/Settings/categories/data-management/consumer-storage-settings/AmazonSettings.js index 89cbf2c07e..5cb0c8ca8f 100644 --- a/web/ASC.Web.Client/src/components/pages/Settings/categories/data-management/consumer-storage-settings/AmazonSettings.js +++ b/web/ASC.Web.Client/src/components/pages/Settings/categories/data-management/consumer-storage-settings/AmazonSettings.js @@ -3,9 +3,9 @@ import TextInput from "@appserver/components/text-input"; const bucketInput = "bucket"; const regionInput = "region"; -const urlInput = "serviceUrl"; -const forcePathStyleInput = "forcePathStyle"; -const httpInput = "useHttp"; +const urlInput = "serviceurl"; +const forcePathStyleInput = "forcepathstyle"; +const httpInput = "usehttp"; const sseInput = "sse"; class AmazonSettings extends React.Component { static formNames = () => { @@ -80,7 +80,7 @@ class AmazonSettings extends React.Component { name={urlInput} className="backup_text-input" scale - value={formSettings.serviceUrl} + value={formSettings.serviceurl} onChange={onChange} isDisabled={isLoadingData || isLoading || this.isDisabled} placeholder={this.serviceUrlPlaceholder || ""} @@ -90,7 +90,7 @@ class AmazonSettings extends React.Component { name={forcePathStyleInput} className="backup_text-input" scale - value={formSettings.forcePathStyle} + value={formSettings.forcepathstyle} onChange={onChange} isDisabled={isLoadingData || isLoading || this.isDisabled} placeholder={this.forcePathStylePlaceholder || ""} @@ -100,7 +100,7 @@ class AmazonSettings extends React.Component { name={httpInput} className="backup_text-input" scale - value={formSettings.useHttp} + value={formSettings.usehttp} onChange={onChange} isDisabled={isLoadingData || isLoading || this.isDisabled} placeholder={this.useHttpPlaceholder || ""} diff --git a/web/ASC.Web.Client/src/components/pages/Settings/categories/data-management/sub-components-automatic-backup/DocumentsModule.js b/web/ASC.Web.Client/src/components/pages/Settings/categories/data-management/sub-components-automatic-backup/DocumentsModule.js index 25ccd04aca..12975f4e91 100644 --- a/web/ASC.Web.Client/src/components/pages/Settings/categories/data-management/sub-components-automatic-backup/DocumentsModule.js +++ b/web/ASC.Web.Client/src/components/pages/Settings/categories/data-management/sub-components-automatic-backup/DocumentsModule.js @@ -3,7 +3,7 @@ import { withTranslation } from "react-i18next"; import SelectFolderInput from "files/SelectFolderInput"; import ScheduleComponent from "./ScheduleComponent"; -class DocumentsModule extends React.Component { +class DocumentsModule extends React.PureComponent { constructor(props) { super(props); @@ -30,7 +30,6 @@ class DocumentsModule extends React.Component { onSelectFolder, isError, isLoadingData, - onSetLoadingData, isReset, isThirdPartyDefault, defaultSelectedFolder, @@ -47,7 +46,6 @@ class DocumentsModule extends React.Component { onClickInput={this.onClickInput} isPanelVisible={isPanelVisible} isError={isError} - onSetLoadingData={onSetLoadingData} foldersType="common" withoutProvider isSavingProcess={isLoadingData} diff --git a/web/ASC.Web.Client/src/components/pages/Settings/categories/data-management/sub-components-automatic-backup/ThirdPartyModule.js b/web/ASC.Web.Client/src/components/pages/Settings/categories/data-management/sub-components-automatic-backup/ThirdPartyModule.js index 3ca286668f..cffdaf542b 100644 --- a/web/ASC.Web.Client/src/components/pages/Settings/categories/data-management/sub-components-automatic-backup/ThirdPartyModule.js +++ b/web/ASC.Web.Client/src/components/pages/Settings/categories/data-management/sub-components-automatic-backup/ThirdPartyModule.js @@ -3,7 +3,7 @@ import { withTranslation } from "react-i18next"; import SelectFolderInput from "files/SelectFolderInput"; import ScheduleComponent from "./ScheduleComponent"; -class ThirdPartyModule extends React.Component { +class ThirdPartyModule extends React.PureComponent { constructor(props) { super(props); @@ -30,7 +30,6 @@ class ThirdPartyModule extends React.Component { onSelectFolder, isError, isLoadingData, - onSetLoadingData, isReset, isThirdPartyDefault, defaultSelectedFolder, @@ -47,7 +46,6 @@ class ThirdPartyModule extends React.Component { onClickInput={this.onClickInput} isPanelVisible={isPanelVisible} isError={isError} - onSetLoadingData={onSetLoadingData} foldersType="third-party" isSavingProcess={isLoadingData} id={passedId} diff --git a/web/ASC.Web.Client/src/components/pages/Settings/categories/data-management/sub-components-automatic-backup/ThirdPartyStorageModule.js b/web/ASC.Web.Client/src/components/pages/Settings/categories/data-management/sub-components-automatic-backup/ThirdPartyStorageModule.js index c39ef4ae67..a7ed0fed26 100644 --- a/web/ASC.Web.Client/src/components/pages/Settings/categories/data-management/sub-components-automatic-backup/ThirdPartyStorageModule.js +++ b/web/ASC.Web.Client/src/components/pages/Settings/categories/data-management/sub-components-automatic-backup/ThirdPartyStorageModule.js @@ -14,6 +14,7 @@ let googleStorageId = ThirdPartyStorages.GoogleId; class ThirdPartyStorageModule extends React.PureComponent { constructor(props) { super(props); + const { storageInfo } = this.props; this.state = { availableOptions: [], @@ -21,15 +22,18 @@ class ThirdPartyStorageModule extends React.PureComponent { selectedStorage: "", defaultSelectedStorage: "", selectedId: "", - isLoading: false, }; - } - componentDidMount() { - const { storageInfo } = this.props; storageInfo && this.getOptions(storageInfo); + this._isMount = false; + } + componentDidMount() { + this._isMount = true; } + componentWillUnmount() { + this._isMount = false; + } componentDidUpdate(prevProps) { const { isSuccessSave, isReset, storageInfo } = this.props; const { @@ -61,67 +65,86 @@ class ThirdPartyStorageModule extends React.PureComponent { let options = []; let availableStorage = {}; + let newState = {}; + for (let item = 0; item < storageBackup.length; item++) { - let obj = { - [storageBackup[item].id]: { - isSet: storageBackup[item].isSet, - properties: storageBackup[item].properties, - title: storageBackup[item].title, - id: storageBackup[item].id, + const backupElem = storageBackup[item]; + + const { isSet, properties, title, id, current } = backupElem; + + let tempObj = { + [id]: { + isSet: isSet, + properties: properties, + title: title, + id: id, }, }; + let titleObj = { - key: storageBackup[item].id, - label: storageBackup[item].title, + key: id, + label: title, disabled: false, }; + options.push(titleObj); + availableStorage = { ...availableStorage, ...tempObj }; - availableStorage = { ...availableStorage, ...obj }; - - if (storageBackup[item].current) { + if (current) { isSetDefaultIdStorage = true; - onSetStorageId(storageBackup[item].id); - this.setState({ - selectedStorage: storageBackup[item].title, - defaultSelectedStorage: storageBackup[item].title, - selectedId: storageBackup[item].id, - defaultSelectedId: storageBackup[item].id, - }); + onSetStorageId(id); + + newState = { + selectedStorage: title, + defaultSelectedStorage: title, + selectedId: id, + defaultSelectedId: id, + }; } - if (!isFirstSet && storageBackup[item].isSet) { + if (!isFirstSet && isSet) { isFirstSet = true; - firstSetId = storageBackup[item].id; + firstSetId = id; } } if (!isSetDefaultIdStorage && !isFirstSet) { - onSetStorageId(availableStorage[googleStorageId].id); - this.setState({ - selectedStorage: availableStorage[googleStorageId].title, - defaultSelectedStorage: availableStorage[googleStorageId].title, - selectedId: availableStorage[googleStorageId].id, - defaultSelectedId: availableStorage[googleStorageId].id, - }); + const currentStorage = availableStorage[googleStorageId]; + const { id, title } = currentStorage; + + onSetStorageId(id); + + newState = { + selectedStorage: title, + defaultSelectedStorage: title, + selectedId: id, + defaultSelectedId: id, + }; } if (!isSetDefaultIdStorage && isFirstSet) { - onSetStorageId(availableStorage[firstSetId].id); + const currentStorage = availableStorage[firstSetId]; + const { id, title } = currentStorage; - this.setState({ - selectedStorage: availableStorage[firstSetId].title, - defaultSelectedStorage: availableStorage[firstSetId].title, - selectedId: availableStorage[firstSetId].id, - defaultSelectedId: availableStorage[firstSetId].id, - }); + onSetStorageId(id); + + newState = { + selectedStorage: title, + defaultSelectedStorage: title, + selectedId: id, + defaultSelectedId: id, + }; } - this.setState({ + newState = { + ...newState, availableOptions: options, availableStorage: availableStorage, - isLoading: false, - }); + }; + + this._isMount + ? this.setState({ ...newState }) + : (this.state = { ...newState }); }; checkChanges = () => { @@ -160,7 +183,6 @@ class ThirdPartyStorageModule extends React.PureComponent { availableOptions, availableStorage, selectedStorage, - isLoading, selectedId, } = this.state; @@ -180,7 +202,7 @@ class ThirdPartyStorageModule extends React.PureComponent { options={availableOptions} selectedOption={{ key: 0, label: selectedStorage }} onSelect={this.onSelect} - isDisabled={isLoadingData || isLoading} + isDisabled={isLoadingData} noBorder={false} scaled scaledOptions @@ -188,19 +210,19 @@ class ThirdPartyStorageModule extends React.PureComponent { className="backup_combo" /> - {selectedId === GoogleId && !isLoading && ( + {selectedId === GoogleId && ( )} - {selectedId === RackspaceId && !isLoading && ( + {selectedId === RackspaceId && ( )} - {selectedId === SelectelId && !isLoading && ( + {selectedId === SelectelId && ( )} - {selectedId === AmazonId && !isLoading && ( + {selectedId === AmazonId && ( )}