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

Web: AutoBackup: Added common components for the storage module, refactoring.

Browse Source
This commit is contained in:
Tatiana Lopaeva 2021-10-02 18:04:25 +03:00
parent 33a06ab3e6
commit 4e2738d0eb
5 changed files with 173 additions and 214 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

123
web/ASC.Web.Client/src/components/pages/Settings/categories/data-management/sub-components-automatic-backup/amazonStorage.js
View File

@ -1,7 +1,7 @@
import React from "react";
import { withTranslation } from "react-i18next";
import TextInput from "@appserver/components/text-input";
import SaveCancelButtons from "@appserver/components/save-cancel-buttons";
import AmazonSettings from "../consumer-storage-settings/AmazonSettings";
class AmazonStorage extends React.Component {
constructor(props) {
@ -36,13 +36,15 @@ class AmazonStorage extends React.Component {
: "";
this.state = {
formSettings: {
bucket: this.defaultBucketValue,
forcePathStyle: this.defaultForcePathStyleValue,
region: this.defaultRegionValue,
serviceUrl: this.defaultServiceUrlValue,
sse: this.defaultSSEValue,
useHttp: this.defaultUseHttpValue,
isError: false,
},
formErrors: {},
isChangedInput: false,
};
this.isDisabled =
@ -74,25 +76,20 @@ class AmazonStorage extends React.Component {
}
onChange = (event) => {
const { formSettings } = this.state;
const { target } = event;
const value = target.value;
const name = target.name;
this.setState({ [name]: value, isChangedInput: true });
};
isInvalidForm = () => {
const { bucket, region } = this.state;
if (bucket || region) return false;
this.setState({
isError: true,
isChangedInput: true,
formSettings: { ...formSettings, [name]: value },
});
return true;
};
onSaveSettings = () => {
const { fillInputValueArray } = this.props;
const { fillInputValueArray, isInvalidForm } = this.props;
const { formSettings } = this.state;
const {
bucket,
forcePathStyle,
@ -100,9 +97,24 @@ class AmazonStorage extends React.Component {
serviceUrl,
sse,
useHttp,
} = this.state;
} = formSettings;
if (this.isInvalidForm()) return;
const isInvalid = isInvalidForm({
bucket,
region,
forcePathStyle,
serviceUrl,
sse,
useHttp,
});
const hasError = isInvalid[0];
const errors = isInvalid[1];
if (hasError) {
this.setState({ formErrors: errors });
return;
}
const valuesArray = [
bucket,
@ -148,87 +160,28 @@ class AmazonStorage extends React.Component {
};
render() {
const {
isChangedInput,
isError,
bucket,
forcePathStyle,
region,
serviceUrl,
sse,
useHttp,
} = this.state;
const { isChangedInput, formSettings, formErrors } = this.state;
const {
t,
isLoadingData,
isLoading,
isCopyingToLocal,
isChanged,
selectedId,
availableStorage,
} = this.props;
return (
<>
<TextInput
name="bucket"
className="backup_text-input"
scale={true}
value={bucket}
hasError={isError}
<AmazonSettings
formSettings={formSettings}
onChange={this.onChange}
isDisabled={isLoadingData || isLoading || this.isDisabled}
placeholder={this.defaultBucketPlaceholder || ""}
tabIndex={1}
/>
<TextInput
name="region"
className="backup_text-input"
scale={true}
value={region}
hasError={isError}
onChange={this.onChange}
isDisabled={isLoadingData || isLoading || this.isDisabled}
placeholder={this.defaultRegionPlaceholder || ""}
tabIndex={1}
/>
<TextInput
name="serviceUrl"
className="backup_text-input"
scale={true}
value={serviceUrl}
onChange={this.onChange}
isDisabled={isLoadingData || isLoading || this.isDisabled}
placeholder={this.defaultServiceUrlPlaceholder || ""}
tabIndex={1}
/>
<TextInput
name="forcePathStyle"
className="backup_text-input"
scale={true}
value={forcePathStyle}
onChange={this.onChange}
isDisabled={isLoadingData || isLoading || this.isDisabled}
placeholder={this.defaultForcePathStylePlaceholder || ""}
tabIndex={1}
/>
<TextInput
name="useHttp"
className="backup_text-input"
scale={true}
value={useHttp}
onChange={this.onChange}
isDisabled={isLoadingData || isLoading || this.isDisabled}
placeholder={this.defaultUseHttpPlaceholder || ""}
tabIndex={1}
/>
<TextInput
name="sse"
className="backup_text-input"
scale={true}
value={sse}
onChange={this.onChange}
isDisabled={isLoadingData || isLoading || this.isDisabled}
placeholder={this.defaultSSEPlaceholder || ""}
tabIndex={1}
isLoading={isLoading}
isLoadingData={isLoadingData}
isError={formErrors}
availableStorage={availableStorage}
selectedId={selectedId}
t={t}
/>
{(isChanged || isChangedInput) && (

54
web/ASC.Web.Client/src/components/pages/Settings/categories/data-management/sub-components-automatic-backup/googleCloudStorage.js
View File

@ -3,6 +3,7 @@ import { withTranslation } from "react-i18next";
import SaveCancelButtons from "@appserver/components/save-cancel-buttons";
import TextInput from "@appserver/components/text-input";
import GoogleCloudSettings from "../consumer-storage-settings/GoogleCloudSettings";
class GoogleCloudStorage extends React.Component {
constructor(props) {
@ -15,7 +16,10 @@ class GoogleCloudStorage extends React.Component {
: "";
this.state = {
formSettings: {
bucket: this.defaultBucketValue,
},
formErrors: {},
isError: false,
isChangedInput: false,
};
@ -36,27 +40,32 @@ class GoogleCloudStorage extends React.Component {
}
onChange = (event) => {
const { formSettings } = this.state;
const { target } = event;
const value = target.value;
const name = target.name;
this.setState({ [name]: value, isChangedInput: true });
};
isInvalidForm = () => {
const { bucket } = this.state;
if (bucket) return false;
this.setState({
isError: true,
isChangedInput: true,
formSettings: { ...formSettings, [name]: value },
});
return true;
};
onSaveSettings = () => {
const { fillInputValueArray } = this.props;
const { bucket } = this.state;
if (this.isInvalidForm()) return;
onSaveSettings = () => {
const { fillInputValueArray, isInvalidForm } = this.props;
const { formSettings } = this.state;
const { bucket } = formSettings;
const isInvalid = isInvalidForm({
bucket,
});
const hasError = isInvalid[0];
const errors = isInvalid[1];
if (hasError) {
this.setState({ formErrors: errors });
return;
}
const inputNumber = 1;
const valuesArray = [bucket];
@ -82,27 +91,26 @@ class GoogleCloudStorage extends React.Component {
};
render() {
const { bucket, isChangedInput, isError } = this.state;
const { bucket, isChangedInput, formErrors, formSettings } = this.state;
const {
t,
isLoadingData,
isLoading,
isCopyingToLocal,
isChanged,
availableStorage,
selectedId,
} = this.props;
return (
<>
<TextInput
name="bucket"
className="backup_text-input"
scale={true}
value={bucket}
hasError={isError}
<GoogleCloudSettings
formSettings={formSettings}
onChange={this.onChange}
isDisabled={isLoadingData || isLoading || this.isDisabled}
placeholder={this.placeholder}
tabIndex={1}
isLoading={isLoading}
isError={formErrors}
availableStorage={availableStorage}
selectedId={selectedId}
/>
{(isChanged || isChangedInput) && (

89
web/ASC.Web.Client/src/components/pages/Settings/categories/data-management/sub-components-automatic-backup/rackspaceStorage.js
View File

@ -1,8 +1,7 @@
import React from "react";
import { withTranslation } from "react-i18next";
import TextInput from "@appserver/components/text-input";
import SaveCancelButtons from "@appserver/components/save-cancel-buttons";
import RackspaceSettings from "../consumer-storage-settings/RackspaceSettings";
class RackspaceStorage extends React.Component {
constructor(props) {
@ -24,9 +23,12 @@ class RackspaceStorage extends React.Component {
: "";
this.state = {
formSettings: {
private_container: this.defaultPrivateValue,
public_container: this.defaultPublicValue,
region: this.defaultRegion,
},
formErrors: {},
isError: false,
isChangedInput: false,
};
@ -56,27 +58,35 @@ class RackspaceStorage extends React.Component {
}
onChange = (event) => {
const { formSettings } = this.state;
const { target } = event;
const value = target.value;
const name = target.name;
this.setState({ [name]: value, isChangedInput: true });
};
isInvalidForm = () => {
const { private_container, public_container, region } = this.state;
if (private_container || public_container || region) return false;
this.setState({
isError: true,
isChangedInput: true,
formSettings: { ...formSettings, [name]: value },
});
return true;
};
onSaveSettings = () => {
const { fillInputValueArray } = this.props;
const { private_container, public_container, region } = this.state;
if (this.isInvalidForm()) return;
onSaveSettings = () => {
const { fillInputValueArray, isInvalidForm } = this.props;
const { formSettings } = this.state;
const { private_container, public_container, region } = formSettings;
const isInvalid = isInvalidForm({
private_container,
region,
public_container,
});
const hasError = isInvalid[0];
const errors = isInvalid[1];
if (hasError) {
this.setState({ formErrors: errors });
return;
}
const valuesArray = [private_container, public_container, region];
@ -107,55 +117,28 @@ class RackspaceStorage extends React.Component {
};
render() {
const {
private_container,
public_container,
region,
isChangedInput,
isError,
} = this.state;
const { isChangedInput, formSettings, formErrors } = this.state;
const {
t,
isLoadingData,
isLoading,
isCopyingToLocal,
isChanged,
availableStorage,
selectedId,
} = this.props;
return (
<>
<TextInput
name="private_container"
className="backup_text-input"
scale={true}
value={private_container}
hasError={isError}
<RackspaceSettings
formSettings={formSettings}
onChange={this.onChange}
isDisabled={isLoadingData || isLoading || this.isDisabled}
placeholder={this.privatePlaceholder || ""}
tabIndex={1}
/>
<TextInput
name="public_container"
className="backup_text-input"
scale={true}
value={public_container}
hasError={isError}
onChange={this.onChange}
isDisabled={isLoadingData || isLoading || this.isDisabled}
placeholder={this.publicPlaceholder || ""}
tabIndex={1}
/>
<TextInput
name="region"
className="backup_text-input"
scale={true}
value={region}
hasError={isError}
onChange={this.onChange}
isDisabled={isLoadingData || isLoading || this.isDisabled}
placeholder={this.regionPlaceholder || ""}
tabIndex={1}
isLoading={isLoading}
isLoadingData={isLoadingData}
isError={formErrors}
availableStorage={availableStorage}
selectedId={selectedId}
t={t}
/>
{(isChanged || isChangedInput) && (

76
web/ASC.Web.Client/src/components/pages/Settings/categories/data-management/sub-components-automatic-backup/selectelStorage.js
View File

@ -1,8 +1,7 @@
import React from "react";
import { withTranslation } from "react-i18next";
import TextInput from "@appserver/components/text-input";
import SaveCancelButtons from "@appserver/components/save-cancel-buttons";
import SelectelSettings from "../consumer-storage-settings/SelectelSettings";
class SelectelStorage extends React.Component {
constructor(props) {
@ -19,8 +18,11 @@ class SelectelStorage extends React.Component {
: "";
this.state = {
formSettings: {
private_container: this.defaultPrivateValue,
public_container: this.defaultPublicValue,
},
formErrors: {},
isError: false,
isChangedInput: false,
};
@ -46,27 +48,34 @@ class SelectelStorage extends React.Component {
}
onChange = (event) => {
const { formSettings } = this.state;
const { target } = event;
const value = target.value;
const name = target.name;
this.setState({ [name]: value, isChangedInput: true });
};
isInvalidForm = () => {
const { private_container, public_container } = this.state;
if (private_container || public_container) return false;
this.setState({
isError: true,
isChangedInput: true,
formSettings: { ...formSettings, [name]: value },
});
return true;
};
onSaveSettings = () => {
const { fillInputValueArray } = this.props;
const { private_container, public_container } = this.state;
if (this.isInvalidForm()) return;
onSaveSettings = () => {
const { fillInputValueArray, isInvalidForm } = this.props;
const { formSettings } = this.state;
const { private_container, public_container } = formSettings;
const isInvalid = isInvalidForm({
private_container,
public_container,
});
const hasError = isInvalid[0];
const errors = isInvalid[1];
if (hasError) {
this.setState({ formErrors: errors });
return;
}
const valuesArray = [private_container, public_container];
@ -95,12 +104,7 @@ class SelectelStorage extends React.Component {
};
render() {
const {
private_container,
public_container,
isChangedInput,
isError,
} = this.state;
const { isChangedInput, formSettings, formErrors } = this.state;
const {
t,
isLoadingData,
@ -108,31 +112,21 @@ class SelectelStorage extends React.Component {
isCopyingToLocal,
isChanged,
availableStorage,
selectedId,
} = this.props;
return (
<>
<TextInput
name="private_container"
className="backup_text-input"
scale={true}
value={private_container}
hasError={isError}
<SelectelSettings
formSettings={formSettings}
onChange={this.onChange}
isDisabled={isLoadingData || isLoading || this.isDisabled}
placeholder={this.privatePlaceholder || ""}
tabIndex={1}
/>
<TextInput
name="public_container"
className="backup_text-input"
scale={true}
value={public_container}
hasError={isError}
onChange={this.onChange}
isDisabled={isLoadingData || isLoading || this.isDisabled}
placeholder={this.publicPlaceholder || ""}
tabIndex={1}
isLoading={isLoading}
isLoadingData={isLoadingData}
isError={formErrors}
availableStorage={availableStorage}
selectedId={selectedId}
t={t}
/>
{(isChanged || isChangedInput) && (

21
web/ASC.Web.Client/src/components/pages/Settings/categories/data-management/sub-components-automatic-backup/thirdPartyStorageModule.js
View File

@ -696,6 +696,23 @@ class ThirdPartyStorageModule extends React.PureComponent {
startBackup("5", storageParams);
setInterval();
};
isInvalidForm = (formSettings) => {
let errors = {};
let firstError = false;
for (let key in formSettings) {
const elem = formSettings[key];
errors[key] = !elem.trim();
if (!elem.trim() && !firstError) {
firstError = true;
}
}
return [firstError, errors];
};
render() {
const {
t,
@ -765,6 +782,7 @@ class ThirdPartyStorageModule extends React.PureComponent {
currentStorageId={
this.isSetDefaultIdStorage ? defaultSelectedId : ""
}
isInvalidForm={this.isInvalidForm}
/>
)}
@ -783,6 +801,7 @@ class ThirdPartyStorageModule extends React.PureComponent {
currentStorageId={
this.isSetDefaultIdStorage ? defaultSelectedId : ""
}
isInvalidForm={this.isInvalidForm}
/>
)}
@ -801,6 +820,7 @@ class ThirdPartyStorageModule extends React.PureComponent {
currentStorageId={
this.isSetDefaultIdStorage ? defaultSelectedId : ""
}
isInvalidForm={this.isInvalidForm}
/>
)}
@ -819,6 +839,7 @@ class ThirdPartyStorageModule extends React.PureComponent {
currentStorageId={
this.isSetDefaultIdStorage ? defaultSelectedId : ""
}
isInvalidForm={this.isInvalidForm}
/>
)}