Web: Settings: Manual/Auto: Splitted third-party storage module into components and separated of logic for repositories.

This commit is contained in:
Tatiana Lopaeva 2021-06-01 21:14:16 +03:00
parent d9bac1abdf
commit 1c3a37508d
7 changed files with 1604 additions and 314 deletions

View File

@ -142,7 +142,6 @@ class AutomaticBackup extends React.PureComponent {
.then((selectedSchedule) => { .then((selectedSchedule) => {
if (selectedSchedule) { if (selectedSchedule) {
// debugger;
const folderId = selectedSchedule.storageParams.folderId; const folderId = selectedSchedule.storageParams.folderId;
this.setState({ this.setState({
defaultSelectedFolder: folderId, defaultSelectedFolder: folderId,
@ -819,15 +818,40 @@ class AutomaticBackup extends React.PureComponent {
{isShowThirdPartyStorage && ( {isShowThirdPartyStorage && (
<> <>
<ThirdPartyStorageModule <ThirdPartyStorageModule
fillStorageFields={this.fillStorageFields}
onCancelModuleSettings={this.onCancelModuleSettings}
isCopyingToLocal={isCopyingToLocal} isCopyingToLocal={isCopyingToLocal}
isLoadingData={isLoadingData} isLoadingData={isLoadingData}
isDisableOptions={isDisableOptions} isDisableOptions={isDisableOptions}
isChanged={isChanged} weeklySchedule={weeklySchedule}
onSetDisableOptions={this.onSetDisableOptions} monthlySchedule={monthlySchedule}
weekOptions={weekOptions}
selectedWeekdayOption={selectedWeekdayOption}
weekdaysOptions={this.weekdaysOptions}
periodOptions={this.periodOptions}
lng={this.lng}
monthNumberOptionsArray={this.monthNumberOptionsArray}
timeOptionsArray={this.timeOptionsArray}
maxNumberCopiesArray={this.maxNumberCopiesArray}
defaultStorageType={defaultStorageType}
defaultSelectedFolder={defaultSelectedFolder}
defaultSelectedOption={defaultSelectedOption}
defaultHour={defaultHour}
defaultMaxCopies={defaultMaxCopies}
defaultPeriod={defaultPeriod}
defaultDay={defaultDay}
defaultSelectedWeekdayOption={defaultSelectedWeekdayOption}
defaultWeekly={defaultWeekly}
defaultDaily={defaultDaily}
defaultMonthly={defaultMonthly}
monthlySchedule={monthlySchedule}
dailySchedule={dailySchedule}
weeklySchedule={weeklySchedule}
isCopyingToLocal={isCopyingToLocal}
onCancelModuleSettings={this.onCancelModuleSettings}
changedDefaultOptions={this.changedDefaultOptions}
onSetDefaultOptions={this.onSetDefaultOptions}
onSetLoadingData={this.onSetLoadingData}
/> />
<ScheduleComponent {/* <ScheduleComponent
weeklySchedule={weeklySchedule} weeklySchedule={weeklySchedule}
monthlySchedule={monthlySchedule} monthlySchedule={monthlySchedule}
weekOptions={weekOptions} weekOptions={weekOptions}
@ -849,7 +873,7 @@ class AutomaticBackup extends React.PureComponent {
} }
onSelectWeedDay={this.onSelectWeedDay} onSelectWeedDay={this.onSelectWeedDay}
onSelectPeriod={this.onSelectPeriod} onSelectPeriod={this.onSelectPeriod}
/> /> */}
</> </>
)} )}
</StyledModules> </StyledModules>

View File

@ -310,7 +310,7 @@ class ManualBackup extends React.Component {
}); });
}; };
render() { render() {
const { t, commonThirdPartyList } = this.props; const { t } = this.props;
const { const {
downloadingProgress, downloadingProgress,
link, link,
@ -467,6 +467,7 @@ class ManualBackup extends React.Component {
{isCheckedThirdPartyStorage && ( {isCheckedThirdPartyStorage && (
<ThirdPartyStorageModule <ThirdPartyStorageModule
maxProgress={maxProgress} maxProgress={maxProgress}
isLoadingData={isLoadingData}
isManualBackup isManualBackup
setInterval={this.setInterval} setInterval={this.setInterval}
/> />

View File

@ -0,0 +1,323 @@
import React from "react";
import { withTranslation } from "react-i18next";
import Button from "@appserver/components/button";
import TextInput from "@appserver/components/text-input";
import SaveCancelButtons from "@appserver/components/save-cancel-buttons";
class AmazonStorage extends React.Component {
constructor(props) {
super(props);
const { t, availableStorage, selectedId, currentStorageId } = this.props;
this.defaultBucketValue =
currentStorageId && availableStorage && selectedId === currentStorageId
? availableStorage[currentStorageId].properties[0].value
: "";
this.defaultForcePathStyleValue =
currentStorageId && availableStorage && selectedId === currentStorageId
? availableStorage[currentStorageId].properties[1].value
: "";
this.defaultRegionValue =
currentStorageId && availableStorage && selectedId === currentStorageId
? availableStorage[currentStorageId].properties[2].value
: "";
this.defaultServiceUrlValue =
currentStorageId && availableStorage && selectedId === currentStorageId
? availableStorage[currentStorageId].properties[3].value
: "";
this.defaultSSEValue =
currentStorageId && availableStorage && selectedId === currentStorageId
? availableStorage[currentStorageId].properties[4].value
: "";
this.defaultUseHttpValue =
currentStorageId && availableStorage && selectedId === currentStorageId
? availableStorage[currentStorageId].properties[5].value
: "";
this.state = {
bucket: this.defaultBucketValue,
forcePathStyle: this.defaultForcePathStyleValue,
region: this.defaultRegionValue,
serviceUrl: this.defaultServiceUrlValue,
sse: this.defaultSSEValue,
useHttp: this.defaultUseHttpValue,
isError: false,
isChangedInput: false,
};
this.isDisabled =
availableStorage[selectedId] && !availableStorage[selectedId].isSet;
this.defaultBucketPlaceholder =
availableStorage[selectedId] &&
availableStorage[selectedId].properties[0].title;
this.defaultForcePathStylePlaceholder = t("ForcePathStyle");
this.defaultRegionPlaceholder =
availableStorage[selectedId] &&
availableStorage[selectedId].properties[2].title;
this.defaultServiceUrlPlaceholder = t("ServiceUrl");
this.defaultSSEPlaceholder = t("SSE");
this.defaultUseHttpPlaceholder = t("UseHttp");
this._isMounted = false;
}
componentDidMount() {
this._isMounted = true;
}
componentWillUnmount() {
this._isMounted = false;
}
onChange = (event) => {
const { target } = event;
const value = target.value;
const name = target.name;
this.setState({ [name]: value, isChangedInput: true });
};
isInvalidForm = () => {
const {
bucket,
forcePathStyle,
region,
serviceUrl,
sse,
useHttp,
} = this.state;
if (bucket || forcePathStyle || region || serviceUrl || sse || useHttp)
return false;
this.setState({
isError: true,
});
return true;
};
onSaveSettings = () => {
const { fillInputValueArray } = this.props;
const {
bucket,
forcePathStyle,
region,
serviceUrl,
sse,
useHttp,
} = this.state;
if (this.isInvalidForm()) return;
const valuesArray = [
bucket,
forcePathStyle,
region,
serviceUrl,
sse,
useHttp,
];
const inputNumber = valuesArray.length;
this.defaultBucketValue = bucket;
this.defaultForcePathStyleValue = forcePathStyle;
this.defaultRegionValue = region;
this.defaultServiceUrlValue = serviceUrl;
this.defaultSSEValue = sse;
this.defaultUseHttpValue = useHttp;
this.setState({
isChangedInput: false,
isError: false,
});
fillInputValueArray(inputNumber, valuesArray);
};
onCancelSettings = () => {
const { onCancelSettings } = this.props;
this.setState({
isChangedInput: false,
isError: false,
bucket: this.defaultBucketValue,
forcePathStyle: this.defaultForcePathStyleValue,
region: this.defaultRegionValue,
serviceUrl: this.defaultServiceUrlValue,
sse: this.defaultSSEValue,
useHttp: this.defaultUseHttpValue,
});
onCancelSettings();
};
onMakeCopy = () => {
const { fillInputValueArray } = this.props;
const {
bucket,
forcePathStyle,
region,
serviceUrl,
sse,
useHttp,
} = this.state;
if (this.isInvalidForm()) return;
const valuesArray = [
bucket,
forcePathStyle,
region,
serviceUrl,
sse,
useHttp,
];
const inputNumber = valuesArray.length;
this.setState({
isChangedInput: false,
isError: false,
});
fillInputValueArray(inputNumber, valuesArray);
};
render() {
const {
isChangedInput,
isError,
bucket,
forcePathStyle,
region,
serviceUrl,
sse,
useHttp,
} = this.state;
const {
t,
isLoadingData,
isLoading,
isManualBackup,
maxProgress,
isCopyingToLocal,
isChanged,
} = this.props;
return (
<>
<TextInput
name="bucket"
className="backup_text-input"
scale={true}
value={bucket}
hasError={isError}
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}
hasError={isError}
onChange={this.onChange}
isDisabled={isLoadingData || isLoading || this.isDisabled}
placeholder={this.defaultServiceUrlPlaceholder || ""}
tabIndex={1}
/>
<TextInput
name="forcePathStyle"
className="backup_text-input"
scale={true}
value={forcePathStyle}
hasError={isError}
onChange={this.onChange}
isDisabled={isLoadingData || isLoading || this.isDisabled}
placeholder={this.defaultForcePathStylePlaceholder || ""}
tabIndex={1}
/>
<TextInput
name="useHttp"
className="backup_text-input"
scale={true}
value={useHttp}
hasError={isError}
onChange={this.onChange}
isDisabled={isLoadingData || isLoading || this.isDisabled}
placeholder={this.defaultUseHttpPlaceholder || ""}
tabIndex={1}
/>
<TextInput
name="sse"
className="backup_text-input"
scale={true}
value={sse}
hasError={isError}
onChange={this.onChange}
isDisabled={isLoadingData || isLoading || this.isDisabled}
placeholder={this.defaultSSEPlaceholder || ""}
tabIndex={1}
/>
{!isManualBackup ? (
(isChanged || isChangedInput) && (
<SaveCancelButtons
className="team-template_buttons"
onSaveClick={this.onSaveSettings}
onCancelClick={this.onCancelSettings}
showReminder={false}
reminderTest={t("YouHaveUnsavedChanges")}
saveButtonLabel={t("SaveButton")}
cancelButtonLabel={t("CancelButton")}
isDisabled={
isCopyingToLocal ||
isLoadingData ||
isLoading ||
this.isDisabled
}
/>
)
) : (
<div className="manual-backup_buttons">
<Button
label={t("MakeCopy")}
onClick={this.onMakeCopy}
primary
isDisabled={!maxProgress || this.isDisabled}
size="medium"
tabIndex={10}
/>
{!maxProgress && (
<Button
label={t("Copying")}
onClick={() => console.log("click")}
isDisabled={true}
size="medium"
style={{ marginLeft: "8px" }}
tabIndex={11}
/>
)}
</div>
)}
</>
);
}
}
export default withTranslation("Settings")(AmazonStorage);

View File

@ -0,0 +1,174 @@
import React from "react";
import { withTranslation } from "react-i18next";
import Button from "@appserver/components/button";
import { startBackup } from "@appserver/common/api/portal";
import SaveCancelButtons from "@appserver/components/save-cancel-buttons";
import ScheduleComponent from "../sub-components-automatic-backup/scheduleComponent";
import TextInput from "@appserver/components/text-input";
import {
createBackupSchedule,
getBackupSchedule,
} from "@appserver/common/api/portal";
import toastr from "@appserver/components/toast/toastr";
import { saveToSessionStorage, getFromSessionStorage } from "../.././../utils";
class GoogleCloudStorage extends React.Component {
constructor(props) {
super(props);
const { availableStorage, selectedId, currentStorageId } = this.props;
this.defaultBucketValue =
currentStorageId && availableStorage && selectedId === currentStorageId
? availableStorage[currentStorageId].properties[0].value
: "";
this.state = {
bucket: this.defaultBucketValue,
isError: false,
isChangedInput: false,
};
this.isDisabled =
availableStorage[selectedId] && !availableStorage[selectedId].isSet;
this.placeholder =
availableStorage[selectedId] &&
availableStorage[selectedId].properties[0].title;
this._isMounted = false;
}
componentDidMount() {
this._isMounted = true;
}
componentWillUnmount() {
this._isMounted = false;
}
onChange = (event) => {
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,
});
return true;
};
onSaveSettings = () => {
const { fillInputValueArray } = this.props;
const { bucket } = this.state;
if (this.isInvalidForm()) return;
const inputNumber = 1;
const valuesArray = [bucket];
this.defaultBucketValue = bucket;
this.setState({
isChangedInput: false,
isError: false,
});
fillInputValueArray(inputNumber, valuesArray);
};
onCancelSettings = () => {
const { onCancelSettings } = this.props;
this.setState({
isChangedInput: false,
isError: false,
bucket: this.defaultBucketValue,
});
onCancelSettings();
};
onMakeCopy = () => {
const { fillInputValueArray } = this.props;
const { bucket } = this.state;
if (this.isInvalidForm()) return;
const inputNumber = 1;
const valuesArray = [bucket];
this.setState({
isChangedInput: false,
isError: false,
});
fillInputValueArray(inputNumber, valuesArray);
};
render() {
const { bucket, isChangedInput, isError } = this.state;
const {
t,
isLoadingData,
isLoading,
isManualBackup,
maxProgress,
isCopyingToLocal,
isChanged,
} = this.props;
console.log("isLoadingData", isLoadingData);
return (
<>
<TextInput
name="bucket"
className="backup_text-input"
scale={true}
value={bucket}
hasError={isError}
onChange={this.onChange}
isDisabled={isLoadingData || isLoading || this.isDisabled}
placeholder={this.placeholder}
tabIndex={1}
/>
{!isManualBackup ? (
(isChanged || isChangedInput) && (
<SaveCancelButtons
className="team-template_buttons"
onSaveClick={this.onSaveSettings}
onCancelClick={this.onCancelSettings}
showReminder={false}
reminderTest={t("YouHaveUnsavedChanges")}
saveButtonLabel={t("SaveButton")}
cancelButtonLabel={t("CancelButton")}
isDisabled={isCopyingToLocal || isLoadingData || isLoading}
/>
)
) : (
<div className="manual-backup_buttons">
<Button
label={t("MakeCopy")}
onClick={this.onMakeCopy}
primary
isDisabled={!maxProgress}
size="medium"
tabIndex={10}
/>
{!maxProgress && (
<Button
label={t("Copying")}
onClick={() => console.log("click")}
isDisabled={true}
size="medium"
style={{ marginLeft: "8px" }}
tabIndex={11}
/>
)}
</div>
)}
</>
);
}
}
export default withTranslation("Settings")(GoogleCloudStorage);

View File

@ -0,0 +1,222 @@
import React from "react";
import { withTranslation } from "react-i18next";
import Button from "@appserver/components/button";
import TextInput from "@appserver/components/text-input";
import SaveCancelButtons from "@appserver/components/save-cancel-buttons";
class RackspaceStorage extends React.Component {
constructor(props) {
super(props);
const { availableStorage, selectedId, currentStorageId } = this.props;
this.defaultPrivateValue =
currentStorageId && availableStorage && selectedId === currentStorageId
? availableStorage[currentStorageId].properties[0].value
: "";
this.defaultPublicValue =
currentStorageId && availableStorage && selectedId === currentStorageId
? availableStorage[currentStorageId].properties[1].value
: "";
this.defaultRegion =
currentStorageId && availableStorage && selectedId === currentStorageId
? availableStorage[currentStorageId].properties[2].value
: "";
this.state = {
private_container: this.defaultPrivateValue,
public_container: this.defaultPublicValue,
region: this.defaultRegion,
isError: false,
isChangedInput: false,
};
this.isDisabled =
availableStorage[selectedId] && !availableStorage[selectedId].isSet;
this.privatePlaceholder =
availableStorage[selectedId] &&
availableStorage[selectedId].properties[0].title;
this.publicPlaceholder =
availableStorage[selectedId] &&
availableStorage[selectedId].properties[1].title;
this.regionPlaceholder =
availableStorage[selectedId] &&
availableStorage[selectedId].properties[2].title;
this._isMounted = false;
}
componentDidMount() {
this._isMounted = true;
}
componentWillUnmount() {
this._isMounted = false;
}
onChange = (event) => {
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,
});
return true;
};
onSaveSettings = () => {
const { fillInputValueArray } = this.props;
const { private_container, public_container, region } = this.state;
if (this.isInvalidForm()) return;
const valuesArray = [private_container, public_container, region];
const inputNumber = valuesArray.length;
this.defaultPrivateValue = private_container;
this.defaultPublicValue = public_container;
this.defaultRegion = region;
this.setState({
isChangedInput: false,
isError: false,
});
fillInputValueArray(inputNumber, valuesArray);
};
onCancelSettings = () => {
const { onCancelSettings } = this.props;
this.setState({
isChangedInput: false,
isError: false,
private_container: this.defaultPrivateValue,
public_container: this.defaultPublicValue,
region: this.defaultRegion,
});
onCancelSettings();
};
onMakeCopy = () => {
const { fillInputValueArray } = this.props;
const { private_container, public_container, region } = this.state;
if (this.isInvalidForm()) return;
const valuesArray = [private_container, public_container, region];
const inputNumber = valuesArray.length;
this.setState({
isChangedInput: false,
isError: false,
});
fillInputValueArray(inputNumber, valuesArray);
};
render() {
const {
private_container,
public_container,
region,
isChangedInput,
isError,
} = this.state;
const {
t,
isLoadingData,
isLoading,
isManualBackup,
maxProgress,
isCopyingToLocal,
isChanged,
} = this.props;
return (
<>
<TextInput
name="private_container"
className="backup_text-input"
scale={true}
value={private_container}
hasError={isError}
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}
/>
{!isManualBackup ? (
(isChanged || isChangedInput) && (
<SaveCancelButtons
className="team-template_buttons"
onSaveClick={this.onSaveSettings}
onCancelClick={this.onCancelSettings}
showReminder={false}
reminderTest={t("YouHaveUnsavedChanges")}
saveButtonLabel={t("SaveButton")}
cancelButtonLabel={t("CancelButton")}
isDisabled={
isCopyingToLocal ||
isLoadingData ||
isLoading ||
this.isDisabled
}
/>
)
) : (
<div className="manual-backup_buttons">
<Button
label={t("MakeCopy")}
onClick={this.onMakeCopy}
primary
isDisabled={!maxProgress || this.isDisabled}
size="medium"
tabIndex={10}
/>
{!maxProgress && (
<Button
label={t("Copying")}
onClick={() => console.log("click")}
isDisabled={true}
size="medium"
style={{ marginLeft: "8px" }}
tabIndex={11}
/>
)}
</div>
)}
</>
);
}
}
export default withTranslation("Settings")(RackspaceStorage);

View File

@ -0,0 +1,199 @@
import React from "react";
import { withTranslation } from "react-i18next";
import Button from "@appserver/components/button";
import TextInput from "@appserver/components/text-input";
import SaveCancelButtons from "@appserver/components/save-cancel-buttons";
class SelectelStorage extends React.Component {
constructor(props) {
super(props);
const { availableStorage, selectedId, currentStorageId } = this.props;
this.defaultPrivateValue =
currentStorageId && availableStorage && selectedId === currentStorageId
? availableStorage[currentStorageId].properties[0].value
: "";
this.defaultPublicValue =
currentStorageId && availableStorage && selectedId === currentStorageId
? availableStorage[currentStorageId].properties[1].value
: "";
this.state = {
private_container: this.defaultPrivateValue,
public_container: this.defaultPublicValue,
isError: false,
isChangedInput: false,
};
this.isDisabled =
availableStorage[selectedId] && !availableStorage[selectedId].isSet;
this.privatePlaceholder =
availableStorage[selectedId] &&
availableStorage[selectedId].properties[0].title;
this.publicPlaceholder =
availableStorage[selectedId] &&
availableStorage[selectedId].properties[1].title;
this._isMounted = false;
}
componentDidMount() {
this._isMounted = true;
}
componentWillUnmount() {
this._isMounted = false;
}
onChange = (event) => {
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,
});
return true;
};
onSaveSettings = () => {
const { fillInputValueArray } = this.props;
const { private_container, public_container } = this.state;
if (this.isInvalidForm()) return;
const valuesArray = [private_container, public_container];
const inputNumber = valuesArray.length;
this.defaultPrivateValue = private_container;
this.defaultPublicValue = public_container;
this.setState({
isChangedInput: false,
isError: false,
});
fillInputValueArray(inputNumber, valuesArray);
};
onCancelSettings = () => {
const { onCancelSettings } = this.props;
this.setState({
isChangedInput: false,
isError: false,
private_container: this.defaultPrivateValue,
public_container: this.defaultPublicValue,
});
onCancelSettings();
};
onMakeCopy = () => {
const { fillInputValueArray } = this.props;
const { private_container, public_container } = this.state;
if (this.isInvalidForm()) return;
const valuesArray = [private_container, public_container];
const inputNumber = valuesArray.length;
this.setState({
isChangedInput: false,
isError: false,
});
fillInputValueArray(inputNumber, valuesArray);
};
render() {
const {
private_container,
public_container,
isChangedInput,
isError,
} = this.state;
const {
t,
isLoadingData,
isLoading,
isManualBackup,
maxProgress,
isCopyingToLocal,
isChanged,
} = this.props;
return (
<>
<TextInput
name="private_container"
className="backup_text-input"
scale={true}
value={private_container}
hasError={isError}
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}
/>
{!isManualBackup ? (
(isChanged || isChangedInput) && (
<SaveCancelButtons
className="team-template_buttons"
onSaveClick={this.onSaveSettings}
onCancelClick={this.onCancelSettings}
showReminder={false}
reminderTest={t("YouHaveUnsavedChanges")}
saveButtonLabel={t("SaveButton")}
cancelButtonLabel={t("CancelButton")}
isDisabled={
isCopyingToLocal ||
isLoadingData ||
isLoading ||
this.isDisabled
}
/>
)
) : (
<div className="manual-backup_buttons">
<Button
label={t("MakeCopy")}
onClick={this.onMakeCopy}
primary
isDisabled={!maxProgress || this.isDisabled}
size="medium"
tabIndex={10}
/>
{!maxProgress && (
<Button
label={t("Copying")}
onClick={() => console.log("click")}
isDisabled={true}
size="medium"
style={{ marginLeft: "8px" }}
tabIndex={11}
/>
)}
</div>
)}
</>
);
}
}
export default withTranslation("Settings")(SelectelStorage);