openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/PacketsBytes.jsx

   1 /*!
   2  * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
   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
  13  * or implied. See the License for the specific language governing
  14  * permissions and limitations under the License.
  15  */
  16 import React from 'react';
  17 import i18n from 'nfvo-utils/i18n/i18n.js';
  18 import Input from 'nfvo-components/input/validation/Input.jsx';
  19 import GridSection from 'nfvo-components/grid/GridSection.jsx';
  20 import GridItem from 'nfvo-components/grid/GridItem.jsx';
  21
  22 const PointerInput = ({label, value, onQDataChanged, qgenericFieldInfo, dataMap}) => {
  23         return (
  24                 <GridItem>
  25                         <Input
  26                                 label={i18n(label)}
  27                                 type='number'
  28                                 data-test-id={`${value}`}
  29                                 isValid={qgenericFieldInfo[value].isValid}
  30                                 errorText={qgenericFieldInfo[value].errorText}
  31                                 value={dataMap[value]}
  32                                 onChange={val => onQDataChanged({[value]: val})} />
  33                 </GridItem>
  34         );
  35 };
  36
  37 PointerInput.PropTypes = {
  38         label: React.PropTypes.string,
  39         value: React.PropTypes.string
  40 };
  41
  42 const PacketsBytes = ({title, pointers = [], qgenericFieldInfo, dataMap, onQDataChanged}) => {
  43         return(
  44                 <GridSection title={title}>
  45                                 <GridItem colSpan={2}>
  46                                         <div className='part-title-small packets'>{i18n('Packets')}</div>
  47                                 </GridItem>
  48                                 <GridItem colSpan={2}>
  49                                         <div className='part-title-small bytes'>{i18n('Bytes')}</div>
  50                                 </GridItem>
  51                                 {pointers.map(pointer => {return (<PointerInput key={pointer.value} label={pointer.label} value={pointer.value}
  52                                         qgenericFieldInfo={qgenericFieldInfo} onQDataChanged={onQDataChanged} dataMap={dataMap} />);})}
  53                 </GridSection>
  54         );
  55 };
  56
  57 PacketsBytes.PropTypes = {
  58         title: React.PropTypes.string,
  59         pointers: React.PropTypes.array,
  60         onQDataChanged:  React.PropTypes.function,
  61         dataMap: React.PropTypes.object,
  62         qgenericFieldInfo: React.PropTypes.object
  63 };
  64
  65 export default PacketsBytes;