openecomp-ui/src/sdc-app/onboarding/softwareProduct/validation/inputs/VspValidationInputsView.jsx

   1 /**
   2  * Copyright (c) 2019 Vodafone Group
   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, { Component } from 'react';
  17 import PropTypes from 'prop-types';
  18 import UUID from 'uuid-js';
  19 import i18n from 'nfvo-utils/i18n/i18n.js';
  20 import { Button } from 'onap-ui-react';
  21 import GridSection from 'nfvo-components/grid/GridSection.jsx';
  22 import GridItem from 'nfvo-components/grid/GridItem.jsx';
  23 import Input from 'nfvo-components/input/validation/Input.jsx';
  24 import Form from 'nfvo-components/input/validation/Form.jsx';
  25
  26 class VspInputs extends React.Component {
  27     constructor(props) {
  28         super(props);
  29         this.state = {};
  30     }
  31
  32     shouldComponentUpdate() {
  33         return true;
  34     }
  35
  36     changeInputs(e, check, parameterName) {
  37         let { testsRequest, generalInfo, setTestsRequest } = this.props;
  38         if (e instanceof File) {
  39             var timestamp = new Date().getTime();
  40             var fileExtension = (
  41                 e.name.match(/[^\\\/]\.([^.\\\/]+)$/) || [null]
  42             ).pop();
  43             var fileName = fileExtension
  44                 ? timestamp + '.' + fileExtension
  45                 : timestamp;
  46             testsRequest[check].parameters[parameterName] =
  47                 'file://' + fileName;
  48
  49             testsRequest[check].files = testsRequest[check].files
  50                 ? testsRequest[check].files
  51                 : [];
  52             testsRequest[check].files.push({ file: e, name: fileName });
  53         } else {
  54             testsRequest[check].parameters[parameterName] = e;
  55         }
  56
  57         generalInfo[check][parameterName] = { isValid: true, errorText: '' };
  58         setTestsRequest(testsRequest, generalInfo);
  59     }
  60
  61     renderInputs(check, indexKey) {
  62         let { vspTestsMap, testsRequest, generalInfo } = this.props;
  63         return (
  64             <div key={indexKey} className="div-clear-both">
  65                 <GridSection
  66                     title={i18n('{title} Inputs :', {
  67                         title: vspTestsMap[check].title.split(/\r?\n/)[0]
  68                     })}>
  69                     {vspTestsMap[check].parameters.map((parameter, index) => {
  70                         parameter.metadata = parameter.metadata
  71                             ? parameter.metadata
  72                             : {};
  73                         if (
  74                             !this.props.filterField(parameter) ||
  75                             parameter.metadata.hidden
  76                         ) {
  77                             return;
  78                         }
  79                         if (
  80                             parameter.type === 'text' ||
  81                             parameter.type === 'string' ||
  82                             parameter.type === 'json'
  83                         ) {
  84                             return (
  85                                 <GridItem key={index}>
  86                                     <Input
  87                                         data-test-id={
  88                                             check +
  89                                             '_' +
  90                                             parameter.name +
  91                                             '_input'
  92                                         }
  93                                         isRequired={!parameter.isOptional}
  94                                         label={parameter.description}
  95                                         isValid={
  96                                             generalInfo[check][parameter.name]
  97                                                 .isValid
  98                                         }
  99                                         errorText={
 100                                             generalInfo[check][parameter.name]
 101                                                 .errorText
 102                                         }
 103                                         type={
 104                                             parameter.metadata.choices
 105                                                 ? 'select'
 106                                                 : 'text'
 107                                         }
 108                                         value={
 109                                             testsRequest[check].parameters[
 110                                                 parameter.name
 111                                             ] || ''
 112                                         }
 113                                         onChange={e => {
 114                                             this.changeInputs(
 115                                                 e.target ? e.target.value : e,
 116                                                 check,
 117                                                 parameter.name
 118                                             );
 119                                         }}
 120                                         disabled={
 121                                             parameter.metadata.disabled || false
 122                                         }>
 123                                         {parameter.metadata.choices && (
 124                                             <option key="placeholder" value="">
 125                                                 {i18n('Select...')}
 126                                             </option>
 127                                         )}
 128                                         {parameter.metadata.choices &&
 129                                             parameter.metadata.choices.map(
 130                                                 selectOption => (
 131                                                     <option
 132                                                         key={selectOption.key}
 133                                                         value={
 134                                                             selectOption.key
 135                                                         }>
 136                                                         {selectOption.label}
 137                                                     </option>
 138                                                 )
 139                                             )}
 140                                     </Input>
 141                                 </GridItem>
 142                             );
 143                         } else if (parameter.type === 'binary') {
 144                             return (
 145                                 <GridItem key={index}>
 146                                     <Input
 147                                         label={parameter.description}
 148                                         type="file"
 149                                         isRequired={!parameter.isOptional}
 150                                         isValid={
 151                                             generalInfo[check][parameter.name]
 152                                                 .isValid
 153                                         }
 154                                         errorText={
 155                                             generalInfo[check][parameter.name]
 156                                                 .errorText
 157                                         }
 158                                         onChange={e => {
 159                                             this.changeInputs(
 160                                                 e.target ? e.target.value : e,
 161                                                 check,
 162                                                 parameter.name
 163                                             );
 164                                         }}
 165                                     />
 166                                 </GridItem>
 167                             );
 168                         }
 169                     })}
 170                 </GridSection>
 171             </div>
 172         );
 173     }
 174
 175     render() {
 176         let {
 177             complianceChecked,
 178             vspTestsMap,
 179             certificationChecked
 180         } = this.props;
 181         return (
 182             <div>
 183                 {complianceChecked.map((complianceCheck, index) => {
 184                     if (vspTestsMap[complianceCheck].parameters.length === 0) {
 185                         return <div />;
 186                     } else {
 187                         return this.renderInputs(complianceCheck, index);
 188                     }
 189                 })}
 190                 {certificationChecked.map((certificateCheck, index) => {
 191                     if (vspTestsMap[certificateCheck].parameters.length === 0) {
 192                         return <div />;
 193                     } else {
 194                         return this.renderInputs(certificateCheck, index);
 195                     }
 196                 })}
 197             </div>
 198         );
 199     }
 200 }
 201
 202 class VspValidationInputs extends Component {
 203     static propTypes = {
 204         softwareProductValidation: PropTypes.object
 205     };
 206
 207     constructor(props) {
 208         super(props);
 209         this.state = {};
 210     }
 211
 212     shouldComponentUpdate() {
 213         return true;
 214     }
 215     filterField(parameter) {
 216         if (
 217             parameter.name === 'host-username' ||
 218             parameter.name === 'vsp' ||
 219             parameter.name === 'vsp-zip' ||
 220             parameter.name === 'host-password' ||
 221             parameter.name === 'host-url'
 222         ) {
 223             return false;
 224         } else {
 225             return true;
 226         }
 227     }
 228     validateInputs() {
 229         let areInputsValid = true;
 230         let { softwareProductValidation, setGeneralInfo } = this.props;
 231         let generalInfo = softwareProductValidation.generalInfo;
 232         Object.keys(softwareProductValidation.testsRequest).forEach(
 233             testCaseName => {
 234                 let requestParameters =
 235                     softwareProductValidation.testsRequest[testCaseName]
 236                         .parameters;
 237                 let validationParameters =
 238                     softwareProductValidation.vspTestsMap[testCaseName]
 239                         .parameters;
 240                 Object.keys(requestParameters).forEach(parameterName => {
 241                     let parameter = validationParameters.find(
 242                         o => o.name === parameterName
 243                     );
 244                     let isParameterValid = true;
 245                     let errorText = '';
 246                     if (!this.filterField(parameter)) {
 247                         // Not required any action
 248                     } else {
 249                         if (
 250                             (parameter.type === 'text' ||
 251                                 parameter.type === 'string') &&
 252                             parameter.metadata.choices
 253                         ) {
 254                             if (
 255                                 !parameter.isOptional &&
 256                                 !requestParameters[parameterName]
 257                             ) {
 258                                 isParameterValid = false;
 259                                 errorText = i18n('Field is required');
 260                             }
 261                         } else if (
 262                             parameter.type === 'text' ||
 263                             parameter.type === 'string' ||
 264                             parameter.type === 'json' ||
 265                             parameter.type === 'binary'
 266                         ) {
 267                             if (
 268                                 !parameter.isOptional &&
 269                                 !requestParameters[parameterName]
 270                             ) {
 271                                 isParameterValid = false;
 272                                 errorText = i18n('Field is required');
 273                             } else if (
 274                                 (!parameter.isOptional &&
 275                                     !requestParameters[parameterName]) ||
 276                                 (parameter.metadata.maxLength &&
 277                                     requestParameters[parameterName].length >
 278                                         parseInt(
 279                                             parameter.metadata.maxLength
 280                                         )) ||
 281                                 (parameter.metadata.minLength &&
 282                                     requestParameters[parameterName].length <
 283                                         parseInt(
 284                                             parameter.metadata.minLength
 285                                         ) &&
 286                                     requestParameters[parameterName].length > 0)
 287                             ) {
 288                                 isParameterValid = false;
 289                                 errorText = i18n(
 290                                     'Value Should Be Minimum of {minLength} characters and a Maximum of {maxLength} characters',
 291                                     {
 292                                         minLength: parameter.metadata.minLength,
 293                                         maxLength: parameter.metadata.maxLength
 294                                     }
 295                                 );
 296                             }
 297                         }
 298                     }
 299                     generalInfo[testCaseName][
 300                         parameterName
 301                     ].isValid = isParameterValid;
 302                     generalInfo[testCaseName][
 303                         parameterName
 304                     ].errorText = errorText;
 305                     areInputsValid = areInputsValid && isParameterValid;
 306                 });
 307             }
 308         );
 309         if (!areInputsValid) {
 310             setGeneralInfo(generalInfo);
 311         }
 312         return areInputsValid;
 313     }
 314
 315     performVSPTests() {
 316         let tests = [];
 317         let {
 318             version,
 319             onTestSubmit,
 320             status,
 321             softwareProductId,
 322             softwareProductValidation
 323         } = this.props;
 324
 325         Object.keys(softwareProductValidation.testsRequest).forEach(key => {
 326             var testReq = softwareProductValidation.testsRequest[key];
 327             this.removeParameterFromTest(testReq);
 328             tests.push(testReq);
 329         });
 330         if (this.validateInputs()) {
 331             var requestId = UUID.create()
 332                 .toString()
 333                 .split('-')[0];
 334             onTestSubmit(softwareProductId, version, status, tests, requestId);
 335         }
 336     }
 337     removeParameterFromTest(testReq) {
 338         delete testReq.parameters['host-username'];
 339         delete testReq.parameters['host-password'];
 340         delete testReq.parameters['host-url'];
 341     }
 342     prepareDataForVspInputs() {
 343         let { setTestsRequest } = this.props;
 344         let {
 345             complianceChecked,
 346             certificationChecked,
 347             vspTestsMap,
 348             testsRequest,
 349             generalInfo
 350         } = this.props.softwareProductValidation;
 351         return {
 352             setTestsRequest,
 353             complianceChecked,
 354             certificationChecked,
 355             vspTestsMap,
 356             testsRequest,
 357             generalInfo
 358         };
 359     }
 360
 361     render() {
 362         return (
 363             <div className="vsp-validation-view">
 364                 <Form
 365                     hasButtons={false}
 366                     formReady={null}
 367                     isValid={true}
 368                     onSubmit={() => this.performVSPTests()}
 369                     isReadOnlyMode={false}>
 370                     <VspInputs
 371                         {...this.prepareDataForVspInputs()}
 372                         filterField={this.filterField}
 373                     />
 374                     <Button
 375                         size="default"
 376                         data-test-id="proceed-to-validation-results-btn"
 377                         disabled={false}
 378                         type="submit"
 379                         className="proceed-to-validation-monitor-btn">
 380                         {i18n('Submit')}
 381                     </Button>
 382                 </Form>
 383             </div>
 384         );
 385     }
 386 }
 387
 388 export default VspValidationInputs;