openecomp-ui/src/sdc-app/onboarding/softwareProduct/validation/SoftwareProductValidationView.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 Configuration from 'sdc-app/config/Configuration.js';
  19 import i18n from 'nfvo-utils/i18n/i18n.js';
  20 import { Button } from 'onap-ui-react';
  21 import { Tab, Tabs } from 'onap-ui-react';
  22 import { tabsMapping } from './SoftwareProductValidationConstants.js';
  23 import VspValidationInputs from './inputs/VspValidationInputs.js';
  24 import VspValidationSetup from './setup/VspValidationSetup.js';
  25
  26 class SoftwareProductValidation extends Component {
  27     static propTypes = {
  28         onErrorThrown: PropTypes.func,
  29         softwareProductValidation: PropTypes.object,
  30         onTestSubmit: PropTypes.func,
  31         setVspTestsMap: PropTypes.func,
  32         setActiveTab: PropTypes.func,
  33         setComplianceChecked: PropTypes.func,
  34         setCertificationChecked: PropTypes.func
  35     };
  36
  37     constructor(props) {
  38         super(props);
  39         this.state = {
  40             complianceCheckList: null,
  41             certificationCheckList: null,
  42             flatTestsMap: {},
  43             generalInfo: {},
  44             activeTab: tabsMapping.SETUP,
  45             goToValidationInput: false
  46         };
  47     }
  48
  49     setMapAndGeneralData(element, testScenario) {
  50         let flatTestMap = this.state.flatTestsMap;
  51         let generalInputData = this.state.generalInfo;
  52         flatTestMap[element.testCaseName] = {
  53             title: element.description,
  54             parameters: element.inputs,
  55             endpoint: element.endpoint,
  56             testCaseName: element.testCaseName,
  57             testSuiteName: element.testSuiteName,
  58             scenario: testScenario
  59         };
  60         generalInputData[element.testCaseName] = {};
  61         element.inputs.forEach(key => {
  62             generalInputData[element.testCaseName][key.name] = {
  63                 isValid: true,
  64                 errorText: ''
  65             };
  66         });
  67
  68         this.setState({
  69             flatTestsMap: flatTestMap,
  70             generalInfo: generalInputData
  71         });
  72     }
  73
  74     buildChildElements(setItem, testScenario) {
  75         let parentElement = {};
  76         parentElement.value = setItem.name;
  77         parentElement.label = setItem.description
  78             ? setItem.description
  79             : setItem.name;
  80         parentElement.children = [];
  81         if (setItem.children !== undefined) {
  82             setItem.children.forEach(element => {
  83                 let childElement = this.buildChildElements(
  84                     element,
  85                     testScenario
  86                 );
  87                 if (childElement.children.length !== 0) {
  88                     parentElement.children.push(childElement);
  89                 }
  90             });
  91         }
  92         if (setItem.tests !== undefined) {
  93             setItem.tests.forEach(element => {
  94                 if (element.inputs) {
  95                     parentElement.children.push({
  96                         value: element.testCaseName,
  97                         label: element.testCaseName
  98                     });
  99                     this.setMapAndGeneralData(element, testScenario);
 100                 }
 101             });
 102         }
 103         return parentElement;
 104     }
 105
 106     buildCheckboxParentNode(parentNode, data) {
 107         parentNode.value = data.description;
 108         parentNode.label = 'All';
 109         parentNode.children = [];
 110         let scenario = data.name;
 111         data.children.forEach(element => {
 112             let childElement = this.buildChildElements(element, scenario);
 113             if (childElement.children.length !== 0) {
 114                 parentNode.children.push(childElement);
 115             }
 116         });
 117         if (data.tests !== undefined) {
 118             data.tests.forEach(element => {
 119                 parentNode.children.push({
 120                     value: element.testCaseName,
 121                     label: element.description
 122                         ? element.description
 123                         : element.testCaseName
 124                 });
 125                 this.setMapAndGeneralData(element, scenario);
 126             });
 127         }
 128         return parentNode;
 129     }
 130
 131     prepareDataForCheckboxes(res) {
 132         let complianceData = {};
 133         let certificationData = {};
 134         let complianceList = [];
 135         let certificationList = [];
 136         let { setVspTestsMap } = this.props;
 137         if (Object.keys(res).length !== 0 && res.children) {
 138             let allTestScenario = Configuration.get('allTestScenario');
 139             res.children.forEach(element => {
 140                 if (element.name === 'certification') {
 141                     certificationData = element;
 142                 } else if (element.name === allTestScenario) {
 143                     complianceData = element;
 144                 }
 145             });
 146
 147             let complianceParentNode = {};
 148             if (
 149                 Object.keys(complianceData).length !== 0 &&
 150                 complianceData.children !== undefined
 151             ) {
 152                 complianceParentNode = this.buildCheckboxParentNode(
 153                     complianceParentNode,
 154                     complianceData
 155                 );
 156                 if (complianceParentNode.children.length !== 0) {
 157                     complianceList.push(complianceParentNode);
 158                 }
 159             }
 160
 161             let certificationParentNode = {};
 162             if (
 163                 Object.keys(certificationData).length !== 0 &&
 164                 certificationData.children !== undefined
 165             ) {
 166                 certificationParentNode = this.buildCheckboxParentNode(
 167                     certificationParentNode,
 168                     certificationData
 169                 );
 170                 if (certificationParentNode.children.length !== 0) {
 171                     certificationList.push(certificationParentNode);
 172                 }
 173             }
 174         }
 175         this.setState({
 176             certificationCheckList: certificationList,
 177             complianceCheckList: complianceList
 178         });
 179         setVspTestsMap(this.state.flatTestsMap);
 180     }
 181
 182     resetState() {
 183         this.setState({
 184             complianceCheckList: [],
 185             certificationCheckList: [],
 186             flatTestsMap: {},
 187             activeTab: tabsMapping.SETUP,
 188             goToValidationInput: false
 189         });
 190     }
 191
 192     componentWillMount() {}
 193
 194     shouldComponentUpdate() {
 195         return true;
 196     }
 197
 198     componentDidMount() {
 199         let { softwareProductValidation } = this.props;
 200         if (softwareProductValidation.vspChecks !== undefined) {
 201             this.prepareDataForCheckboxes(softwareProductValidation.vspChecks);
 202         }
 203     }
 204
 205     componentWillUnmount() {
 206         this.resetState();
 207     }
 208
 209     componentWillReceiveProps(nextProps) {
 210         if (
 211             nextProps.softwareProductValidation.vspChecks !==
 212             this.props.softwareProductValidation.vspChecks
 213         ) {
 214             let { softwareProductValidation, setActiveTab } = nextProps;
 215             if (softwareProductValidation.vspChecks !== undefined) {
 216                 this.prepareDataForCheckboxes(
 217                     softwareProductValidation.vspChecks
 218                 );
 219             }
 220             this.setState({
 221                 activeTab: tabsMapping.SETUP,
 222                 goToValidationInput: false
 223             });
 224             setActiveTab({ activeTab: tabsMapping.SETUP });
 225         }
 226     }
 227
 228     prepareDataForValidationInputsSection() {
 229         let {
 230             softwareProductId,
 231             version,
 232             onTestSubmit,
 233             onErrorThrown,
 234             setTestsRequest,
 235             setGeneralInfo
 236         } = this.props;
 237         return {
 238             softwareProductId,
 239             version,
 240             onTestSubmit,
 241             onErrorThrown,
 242             setTestsRequest,
 243             setGeneralInfo
 244         };
 245     }
 246
 247     prepareDataForCheckboxTreeSection() {
 248         let {
 249             softwareProductValidation,
 250             setComplianceChecked,
 251             setCertificationChecked
 252         } = this.props;
 253         let complianceCheckList = this.state.complianceCheckList;
 254         let certificationCheckList = this.state.certificationCheckList;
 255         return {
 256             softwareProductValidation,
 257             setComplianceChecked,
 258             setCertificationChecked,
 259             complianceCheckList,
 260             certificationCheckList
 261         };
 262     }
 263
 264     handleTabPress(key) {
 265         let { setActiveTab } = this.props;
 266         switch (key) {
 267             case tabsMapping.SETUP:
 268                 this.setState({ activeTab: tabsMapping.SETUP });
 269                 setActiveTab({ activeTab: tabsMapping.SETUP });
 270                 return;
 271             case tabsMapping.INPUTS:
 272             default:
 273                 setActiveTab({ activeTab: tabsMapping.INPUTS });
 274                 this.setState({
 275                     goToValidationInput: true,
 276                     activeTab: tabsMapping.INPUTS
 277                 });
 278                 return;
 279         }
 280     }
 281
 282     fetchDefaultValue(value) {
 283         let { softwareProductId, version } = this.props;
 284         let versionName = parseFloat(version.name).toFixed(1),
 285             versionNumber =
 286                 versionName > 1 ? (versionName - 1).toFixed(1) : versionName,
 287             versionUUID = version.id;
 288         value =
 289             value === '$vspid'
 290                 ? softwareProductId
 291                 : value === '$vspPreviousVersion' ? versionNumber : value;
 292         value = value === '$vspVersionUUID' ? versionUUID : value || '';
 293         return value;
 294     }
 295
 296     formTestsRequest(item, testsRequest) {
 297         let { vspTestsMap } = this.props.softwareProductValidation;
 298         testsRequest[item] = {
 299             parameters: {},
 300             scenario: vspTestsMap[item]['scenario'],
 301             testCaseName: vspTestsMap[item]['testCaseName'],
 302             testSuiteName: vspTestsMap[item]['testSuiteName'],
 303             endpoint: vspTestsMap[item]['endpoint']
 304         };
 305         vspTestsMap[item].parameters.forEach(parameter => {
 306             testsRequest[item].parameters[
 307                 parameter.name
 308             ] = this.fetchDefaultValue(parameter.defaultValue);
 309         });
 310         return testsRequest;
 311     }
 312
 313     onGoToInputs() {
 314         let {
 315             setActiveTab,
 316             softwareProductValidation,
 317             setTestsRequest
 318         } = this.props;
 319         setActiveTab({ activeTab: tabsMapping.INPUTS });
 320         let testsRequest = {};
 321         if (softwareProductValidation.complianceChecked) {
 322             softwareProductValidation.complianceChecked.forEach(item => {
 323                 testsRequest = this.formTestsRequest(item, testsRequest);
 324             });
 325         }
 326         if (softwareProductValidation.certificationChecked) {
 327             softwareProductValidation.certificationChecked.forEach(item => {
 328                 testsRequest = this.formTestsRequest(item, testsRequest);
 329             });
 330         }
 331         setTestsRequest(testsRequest, this.state.generalInfo);
 332         this.setState({
 333             goToValidationInput: true,
 334             activeTab: tabsMapping.INPUTS
 335         });
 336     }
 337
 338     onGoToSetup() {
 339         let { setActiveTab } = this.props;
 340         setActiveTab({ activeTab: tabsMapping.SETUP });
 341         this.setState({
 342             goToValidationInput: false,
 343             activeTab: tabsMapping.SETUP
 344         });
 345     }
 346
 347     render() {
 348         let { softwareProductValidation } = this.props;
 349         let isNextDisabled =
 350             (softwareProductValidation.certificationChecked === undefined ||
 351                 softwareProductValidation.certificationChecked.length === 0) &&
 352             (softwareProductValidation.complianceChecked === undefined ||
 353                 softwareProductValidation.complianceChecked.length === 0);
 354
 355         return (
 356             <div className="vsp-validation-view">
 357                 <div className="validation-view-controllers">
 358                     {this.state.activeTab === tabsMapping.SETUP && (
 359                         <Button
 360                             btnType="secondary"
 361                             data-test-id="go-to-vsp-validation-inputs"
 362                             disabled={isNextDisabled}
 363                             className="change-tabs-btn"
 364                             onClick={() => this.onGoToInputs()}>
 365                             {i18n('NEXT')}
 366                         </Button>
 367                     )}
 368                     {this.state.activeTab === tabsMapping.INPUTS && (
 369                         <Button
 370                             btnType="secondary"
 371                             data-test-id="go-to-vsp-validation-setup"
 372                             className="change-tabs-btn"
 373                             onClick={() => this.onGoToSetup()}>
 374                             {i18n('BACK')}
 375                         </Button>
 376                     )}
 377                 </div>
 378                 <Tabs
 379                     className="validation-tabs"
 380                     type="header"
 381                     activeTab={this.state.activeTab}
 382                     onTabClick={key => this.handleTabPress(key)}>
 383                     <Tab
 384                         tabId={tabsMapping.SETUP}
 385                         title={i18n('Setup')}
 386                         disabled={this.state.goToValidationInput}>
 387                         <div className="validation-view-tab">
 388                             {this.state.complianceCheckList &&
 389                                 this.state.certificationCheckList && (
 390                                     <VspValidationSetup
 391                                         {...this.prepareDataForCheckboxTreeSection()}
 392                                     />
 393                                 )}
 394                         </div>
 395                     </Tab>
 396                     <Tab
 397                         tabId={tabsMapping.INPUTS}
 398                         title={i18n('Inputs')}
 399                         disabled={!this.state.goToValidationInput}>
 400                         <div className="validation-view-tab">
 401                             <VspValidationInputs
 402                                 {...this.prepareDataForValidationInputsSection()}
 403                             />
 404                         </div>
 405                     </Tab>
 406                 </Tabs>
 407             </div>
 408         );
 409     }
 410 }
 411
 412 export default SoftwareProductValidation;