Refactoring

This commit is contained in:
Vladislav Makhov 2020-09-09 10:32:51 +03:00
parent 657901777f
commit 1ff8b7b3a1
2 changed files with 71 additions and 51 deletions

View File

@ -103,70 +103,59 @@ class ConsumerModalDialog extends React.Component {
color="#316DAA"
isHovered={false}
target="_blank"
href={"http://support.onlyoffice.com/"}
href="http://support.onlyoffice.com/"
>
Support Team
</Link>
</Trans>
);
const getConsumerData = (key) => {
return consumers
.find((consumer) => consumer.name === selectedConsumer)[key];
}
const getConsumerName = () => {
return consumers
.find((consumer) => consumer.name === selectedConsumer)
.name;
};
const getInnerDescription = () => {
return consumers
.find((consumer) => consumer.name === selectedConsumer)
.instruction;
};
const getInputFields = () => {
return consumers
.find((consumer) => consumer.name === selectedConsumer)
.props
.map((prop, i) => (
<React.Fragment key={i}>
<Box
displayProp="flex"
flexDirection="column"
marginProp="0 0 16px 0"
>
<Box marginProp="0 0 4px 0">
<Text isBold={true}>
{prop.title}:
const setConsumerData = (key) => {
return key === "props"
?
consumers
.find((consumer) => consumer.name === selectedConsumer)[key]
.map((prop, i) => (
<React.Fragment key={i}>
<Box
displayProp="flex"
flexDirection="column"
marginProp="0 0 16px 0"
>
<Box marginProp="0 0 4px 0">
<Text isBold={true}>
{prop.title}:
</Text>
</Box>
<Box>
<TextInput
scale
name={prop.name}
placeholder={prop.title}
isAutoFocussed={i === 0 && true}
tabIndex={1}
value={Object.values(this.state)[i]}
isDisabled={isLoading}
onChange={onChangeHandler}
/>
</Box>
</Box>
<Box>
<TextInput
scale
name={prop.name}
placeholder={prop.title}
isAutoFocussed={i === 0 && true}
tabIndex={1}
value={Object.values(this.state)[i]}
isDisabled={isLoading}
onChange={onChangeHandler}
/>
</Box>
</Box>
</React.Fragment>
));
</React.Fragment>
))
:
consumers
.find((consumer) => consumer.name === selectedConsumer)[key]
};
return (
<ModalDialogContainer>
<ModalDialog
visible={dialogVisible}
headerContent={`${getConsumerName()}`}
headerContent={`${setConsumerData("name")}`}
bodyContent={[
<Text>{getInnerDescription()}</Text>,
<Text>{setConsumerData("instruction")}</Text>,
<Text>{bodyDescription}</Text>,
<React.Fragment>{getInputFields()}</React.Fragment>,
<React.Fragment>{setConsumerData("props")}</React.Fragment>,
<Text>{bottomDescription}</Text>,
]}
footerContent={[

View File

@ -8,7 +8,7 @@ import {
import { withTranslation } from "react-i18next";
import styled from "styled-components";
import { Box, Text, Link } from "asc-web-components";
import { Box, Text, Link, toastr } from "asc-web-components";
import { utils } from "asc-web-components";
import ConsumerItem from "./sub-components/consumerItem";
import ConsumerModalDialog from "./sub-components/consumerModalDialog";
@ -91,13 +91,45 @@ class ThirdPartyServices extends React.Component {
});
};
updateConsumerValues = (obj, isFill) => {
this.onChangeLoading(true);
const prop = [];
let i = 0;
let objLength = Object.keys(obj.props).length;
for (i = 0; i < objLength; i++) {
prop.push({
name: isFill ? Object.keys(obj)[i] : obj.props[i].name,
value: isFill ? Object.values(obj)[i] : ""
});
}
const data = {
name: isFill ? this.state.selectedConsumer : obj.name,
props: prop,
};
this.props.sendConsumerNewProps(data)
.then(() => {
this.onChangeLoading(false);
isFill
?
toastr.success("Consumer properties successfully update")
:
toastr.success("Consumer successfully deactivated")
})
.catch((error) => {
this.onChangeLoading(false);
toastr.error(error);
})
.finally(isFill && this.onModalClose());
}
render() {
const { t, i18n, consumers, sendConsumerNewProps } = this.props;
const { selectedConsumer, dialogVisible, isLoading } = this.state;
const {
onModalClose,
onModalOpen,
onToggleClick,
setConsumer,
onChangeLoading,
} = this;
@ -145,7 +177,6 @@ class ThirdPartyServices extends React.Component {
onChangeLoading={onChangeLoading}
onModalClose={onModalClose}
onModalOpen={onModalOpen}
onToggleClick={onToggleClick}
setConsumer={setConsumer}
sendConsumerNewProps={sendConsumerNewProps}
/>