diff options
Diffstat (limited to 'openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/creation')
2 files changed, 110 insertions, 75 deletions
diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/creation/SoftwareProductComponentCreation.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/creation/SoftwareProductComponentCreation.js index 9f59cd5b27..d831765674 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/creation/SoftwareProductComponentCreation.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/creation/SoftwareProductComponentCreation.js @@ -14,36 +14,50 @@ * permissions and limitations under the License. */ -import {connect} from 'react-redux'; +import { connect } from 'react-redux'; import SoftwareProductComponentCreationView from './SoftwareProductComponentCreationView.jsx'; import SoftwareProductComponentsActionHelper from '../SoftwareProductComponentsActionHelper.js'; import ValidationHelper from 'sdc-app/common/helpers/ValidationHelper.js'; -import {forms} from '../SoftwareProductComponentsConstants.js'; +import { forms } from '../SoftwareProductComponentsConstants.js'; -export const mapStateToProps = ({softwareProduct}) => { - let {softwareProductComponents: {componentEditor: {data, genericFieldInfo, formReady}}} = softwareProduct; - let isFormValid = ValidationHelper.checkFormValid(genericFieldInfo); - return { - data, - genericFieldInfo, - formReady, - isFormValid - }; +export const mapStateToProps = ({ softwareProduct }) => { + let { + softwareProductComponents: { + componentEditor: { data, genericFieldInfo, formReady } + } + } = softwareProduct; + let isFormValid = ValidationHelper.checkFormValid(genericFieldInfo); + return { + data, + genericFieldInfo, + formReady, + isFormValid + }; }; - -const mapActionsToProps = (dispatch, {softwareProductId, version}) => { - return { - onDataChanged: (deltaData) => ValidationHelper.dataChanged(dispatch, {deltaData, formName: forms.CREATE_FORM}), - //onDataChanged: deltaData => SoftwareProductComponentsActionHelper.componentDataChanged(dispatch, {deltaData}), - onSubmit: (componentData) => { - return SoftwareProductComponentsActionHelper.createSoftwareProductComponent(dispatch, - {softwareProductId, componentData, version}); - }, - onCancel: () => SoftwareProductComponentsActionHelper.closeComponentCreationModal(dispatch), - onValidateForm: (formName) => ValidationHelper.validateForm(dispatch, formName) - }; - +const mapActionsToProps = (dispatch, { softwareProductId, version }) => { + return { + onDataChanged: deltaData => + ValidationHelper.dataChanged(dispatch, { + deltaData, + formName: forms.CREATE_FORM + }), + //onDataChanged: deltaData => SoftwareProductComponentsActionHelper.componentDataChanged(dispatch, {deltaData}), + onSubmit: componentData => { + return SoftwareProductComponentsActionHelper.createSoftwareProductComponent( + dispatch, + { softwareProductId, componentData, version } + ); + }, + onCancel: () => + SoftwareProductComponentsActionHelper.closeComponentCreationModal( + dispatch + ), + onValidateForm: formName => + ValidationHelper.validateForm(dispatch, formName) + }; }; -export default connect(mapStateToProps, mapActionsToProps)(SoftwareProductComponentCreationView); +export default connect(mapStateToProps, mapActionsToProps)( + SoftwareProductComponentCreationView +); diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/creation/SoftwareProductComponentCreationView.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/creation/SoftwareProductComponentCreationView.jsx index 42804ce5a6..0b33b4017f 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/creation/SoftwareProductComponentCreationView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/creation/SoftwareProductComponentCreationView.jsx @@ -21,59 +21,80 @@ import Form from 'nfvo-components/input/validation/Form.jsx'; import Input from 'nfvo-components/input/validation/Input.jsx'; import GridSection from 'nfvo-components/grid/GridSection.jsx'; import GridItem from 'nfvo-components/grid/GridItem.jsx'; -import {forms} from '../SoftwareProductComponentsConstants.js'; +import { forms } from '../SoftwareProductComponentsConstants.js'; class ComponentCreationView extends React.Component { - render() { - let {data = {}, onDataChanged, onCancel, genericFieldInfo} = this.props; - let {displayName, description} = data; - return( - <div> - { - genericFieldInfo && <Form - ref='validationForm' - hasButtons={true} - onSubmit={ () => this.submit() } - onReset={ () => onCancel() } - submitButtonText={i18n('Create')} - labledButtons={true} - isValid={this.props.isFormValid} - formReady={this.props.formReady} - onValidateForm={() => this.props.onValidateForm(forms.CREATE_FORM) } - className='entitlement-pools-form'> - <GridSection hasLastColSet> - <GridItem colSpan={4} lastColInRow> - <Input - data-test-id='name' - onChange={displayName => onDataChanged({displayName})} - label={i18n('Name')} - isRequired={true} - isValid={genericFieldInfo.displayName.isValid} - errorText={genericFieldInfo.displayName.errorText} - value={displayName} - type='text'/> - </GridItem> - <GridItem colSpan={4} lastColInRow> - <Input - label={i18n('Description')} - onChange={description => onDataChanged({description})} - value={description} - isValid={genericFieldInfo.description.isValid} - errorText={genericFieldInfo.description.errorText} - data-test-id='description' - type='textarea'/> - </GridItem> - </GridSection> - </Form> - } - </div> - ); - } + render() { + let { + data = {}, + onDataChanged, + onCancel, + genericFieldInfo + } = this.props; + let { displayName, description } = data; + return ( + <div> + {genericFieldInfo && ( + <Form + ref="validationForm" + hasButtons={true} + onSubmit={() => this.submit()} + onReset={() => onCancel()} + submitButtonText={i18n('Create')} + labledButtons={true} + isValid={this.props.isFormValid} + formReady={this.props.formReady} + onValidateForm={() => + this.props.onValidateForm(forms.CREATE_FORM) + } + className="entitlement-pools-form"> + <GridSection hasLastColSet> + <GridItem colSpan={4} lastColInRow> + <Input + data-test-id="name" + onChange={displayName => + onDataChanged({ displayName }) + } + label={i18n('Name')} + isRequired={true} + isValid={ + genericFieldInfo.displayName.isValid + } + errorText={ + genericFieldInfo.displayName.errorText + } + value={displayName} + type="text" + /> + </GridItem> + <GridItem colSpan={4} lastColInRow> + <Input + label={i18n('Description')} + onChange={description => + onDataChanged({ description }) + } + value={description} + isValid={ + genericFieldInfo.description.isValid + } + errorText={ + genericFieldInfo.description.errorText + } + data-test-id="description" + type="textarea" + /> + </GridItem> + </GridSection> + </Form> + )} + </div> + ); + } - submit() { - const {onSubmit, data} = this.props; - onSubmit(data); - } + submit() { + const { onSubmit, data } = this.props; + onSubmit(data); + } } export default ComponentCreationView; |