Add collaboration feature

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

diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/PacketsBytes.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/PacketsBytes.jsx
index d7ee91b..f5f28ae 100644 (file)
--- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/PacketsBytes.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/PacketsBytes.jsx
@@ -14,14 +14,15 @@
  * permissions and limitations under the License.
  */
 import React from 'react';
+import PropTypes from 'prop-types';
 import i18n from 'nfvo-utils/i18n/i18n.js';
 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';
 
-const PointerInput = ({label, value, onQDataChanged, qgenericFieldInfo, dataMap}) => {
+const PointerInput = ({label, value, onQDataChanged, qgenericFieldInfo, dataMap, lastColInRow}) => {
        return (
-               <GridItem>
+               <GridItem lastColInRow={lastColInRow}>
                        <Input
                                label={i18n(label)}
                                type='number'
@@ -35,31 +36,31 @@ const PointerInput = ({label, value, onQDataChanged, qgenericFieldInfo, dataMap}
 };
 
 PointerInput.PropTypes = {
-       label: React.PropTypes.string,
-       value: React.PropTypes.string
+       label: PropTypes.string,
+       value: PropTypes.string
 };
 
 const PacketsBytes = ({title, pointers = [], qgenericFieldInfo, dataMap, onQDataChanged}) => {
        return(
-               <GridSection title={title}>
+               <GridSection title={title} hasLastColSet>
                                <GridItem colSpan={2}>
                                        <div className='part-title-small packets'>{i18n('Packets')}</div>
                                </GridItem>
-                               <GridItem colSpan={2}>
+                               <GridItem colSpan={2} lastColInRow>
                                        <div className='part-title-small bytes'>{i18n('Bytes')}</div>
                                </GridItem>
-                               {pointers.map(pointer => {return (<PointerInput key={pointer.value} label={pointer.label} value={pointer.value}
-                                       qgenericFieldInfo={qgenericFieldInfo} onQDataChanged={onQDataChanged} dataMap={dataMap} />);})}
+                               {pointers.map((pointer, i) => {return (<PointerInput key={i} label={pointer.label} value={pointer.value}
+                                       qgenericFieldInfo={qgenericFieldInfo} onQDataChanged={onQDataChanged} dataMap={dataMap} lastColInRow={i === 3} />);})}
                </GridSection>
        );
 };
 
 PacketsBytes.PropTypes = {
-       title: React.PropTypes.string,
-       pointers: React.PropTypes.array,
-       onQDataChanged:  React.PropTypes.function,
-       dataMap: React.PropTypes.object,
-       qgenericFieldInfo: React.PropTypes.object
+       title: PropTypes.string,
+       pointers: PropTypes.array,
+       onQDataChanged:  PropTypes.function,
+       dataMap: PropTypes.object,
+       qgenericFieldInfo: PropTypes.object
 };
 
 export default PacketsBytes;