openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreationView.jsx

   1 /*
   2  * Copyright © 2016-2018 European Support Limited
   3  *
   4  * Licensed under the Apache License, Version 2.0 (the "License");
   5  * you may not use this file except in compliance with the License.
   6  * You may obtain a copy of the License at
   7  *
   8  *      http://www.apache.org/licenses/LICENSE-2.0
   9  *
  10  * Unless required by applicable law or agreed to in writing, software
  11  * distributed under the License is distributed on an "AS IS" BASIS,
  12  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  13  * See the License for the specific language governing permissions and
  14  * limitations under the License.
  15  */
  16 import React from 'react';
  17 import PropTypes from 'prop-types';
  18 import i18n from 'nfvo-utils/i18n/i18n.js';
  19 import Input from 'nfvo-components/input/validation/Input.jsx';
  20 import Form from 'nfvo-components/input/validation/Form.jsx';
  21 import { LICENSE_MODEL_CREATION_FORM_NAME } from './LicenseModelCreationConstants.js';
  22
  23 const LicenseModelPropType = PropTypes.shape({
  24     id: PropTypes.string,
  25     vendorName: PropTypes.string,
  26     description: PropTypes.string
  27 });
  28
  29 class LicenseModelCreationView extends React.Component {
  30     static propTypes = {
  31         data: LicenseModelPropType,
  32         VLMNames: PropTypes.object,
  33         usersList: PropTypes.array,
  34         onDataChanged: PropTypes.func.isRequired,
  35         onSubmit: PropTypes.func.isRequired,
  36         onValidateForm: PropTypes.func.isRequired,
  37         onCancel: PropTypes.func.isRequired
  38     };
  39
  40     render() {
  41         let { data = {}, onDataChanged, genericFieldInfo } = this.props;
  42         let { vendorName, description } = data;
  43         return (
  44             <div className="license-model-modal">
  45                 {genericFieldInfo && (
  46                     <Form
  47                         ref="validationForm"
  48                         hasButtons={true}
  49                         onSubmit={() => this.submit()}
  50                         submitButtonText={i18n('Create')}
  51                         onReset={() => this.props.onCancel()}
  52                         labledButtons={true}
  53                         isValid={this.props.isFormValid}
  54                         formReady={this.props.formReady}
  55                         btnClassName="sdc-modal__footer"
  56                         className="license-model-form"
  57                         onValidateForm={() => this.validate()}>
  58                         <Input
  59                             value={vendorName}
  60                             label={i18n('Vendor Name')}
  61                             data-test-id="vendor-name"
  62                             onChange={vendorName =>
  63                                 onDataChanged(
  64                                     { vendorName },
  65                                     LICENSE_MODEL_CREATION_FORM_NAME
  66                                 )
  67                             }
  68                             onBlur={e =>
  69                                 this.validateIsNameUnique(e.target.value)
  70                             }
  71                             isValid={genericFieldInfo.vendorName.isValid}
  72                             errorText={genericFieldInfo.vendorName.errorText}
  73                             type="text"
  74                             isRequired={true}
  75                         />
  76                         <Input
  77                             isRequired={true}
  78                             value={description}
  79                             label={i18n('Description')}
  80                             data-test-id="vendor-description"
  81                             overlayPos="bottom"
  82                             onChange={description =>
  83                                 onDataChanged(
  84                                     { description },
  85                                     LICENSE_MODEL_CREATION_FORM_NAME
  86                                 )
  87                             }
  88                             isValid={genericFieldInfo.description.isValid}
  89                             errorText={genericFieldInfo.description.errorText}
  90                             type="textarea"
  91                             groupClassName="no-bottom-margin"
  92                         />
  93                     </Form>
  94                 )}
  95             </div>
  96         );
  97     }
  98
  99     submit() {
 100         const { data: licenseModel, usersList } = this.props;
 101         this.props.onSubmit(licenseModel, usersList);
 102     }
 103
 104     validateIsNameUnique(value) {
 105         this.props.isNameUnique(
 106             value,
 107             'vendorName',
 108             LICENSE_MODEL_CREATION_FORM_NAME
 109         );
 110     }
 111
 112     validate() {
 113         this.props.onValidateForm(LICENSE_MODEL_CREATION_FORM_NAME);
 114     }
 115 }
 116
 117 export default LicenseModelCreationView;