From 8e9c0653dd6c6862123c9609ae34e1206d86456e Mon Sep 17 00:00:00 2001 From: talig Date: Wed, 20 Dec 2017 14:30:43 +0200 Subject: Add collaboration feature Issue-ID: SDC-767 Change-Id: I14fb4c1f54086ed03a56a7ff7fab9ecd40381795 Signed-off-by: talig --- .../src/nfvo-components/SubmitErrorResponse.jsx | 9 +- .../src/nfvo-components/datepicker/Datepicker.jsx | 29 ++-- .../src/nfvo-components/editor/TabulatedEditor.jsx | 10 +- .../fileupload/DraggableUploadFileBox.jsx | 7 +- openecomp-ui/src/nfvo-components/grid/GridItem.jsx | 4 +- .../src/nfvo-components/grid/GridSection.jsx | 9 +- openecomp-ui/src/nfvo-components/icon/Icon.jsx | 45 ----- .../src/nfvo-components/input/ExpandableInput.jsx | 7 +- .../src/nfvo-components/input/ToggleInput.jsx | 9 +- .../input/dualListbox/DualListboxView.jsx | 17 +- .../src/nfvo-components/input/validation/Form.jsx | 37 +++-- .../src/nfvo-components/input/validation/Input.jsx | 18 +- .../input/validation/InputOptions.jsx | 39 ++--- .../input/validation/InputWrapper.jsx | 10 +- .../src/nfvo-components/input/validation/Tabs.jsx | 3 +- .../input/validation/ValidationButtons.jsx | 15 +- .../listEditor/ListEditorItemView.jsx | 11 +- .../nfvo-components/listEditor/ListEditorView.jsx | 19 ++- .../listEditor/listEditor.stories.js | 10 +- openecomp-ui/src/nfvo-components/loader/Loader.jsx | 3 +- .../src/nfvo-components/modal/GlobalModal.js | 27 +-- .../src/nfvo-components/overlay/Overlay.jsx | 40 +++++ .../nfvo-components/panel/NavigationSideBar.jsx | 22 ++- .../panel/versionController/VersionController.jsx | 176 ++++++++------------ .../VersionControllerConstants.js | 23 +-- .../versionController/VersionControllerUtils.js | 52 ------ .../versionController/components/ActionButtons.jsx | 109 +++++++++++++ .../components/CommitCommentModal.jsx | 73 +++++++++ .../versionController/components/Permissions.jsx | 65 ++++++++ .../nfvo-components/progressBar/ProgressBar.jsx | 5 +- .../nfvo-components/table/SelectActionTableRow.jsx | 4 +- openecomp-ui/src/nfvo-components/tree/Tree.jsx | 181 +++++++++++++++++++++ .../src/nfvo-components/tree/Tree.stories.js | 119 ++++++++++++++ 33 files changed, 835 insertions(+), 372 deletions(-) delete mode 100644 openecomp-ui/src/nfvo-components/icon/Icon.jsx create mode 100644 openecomp-ui/src/nfvo-components/overlay/Overlay.jsx delete mode 100644 openecomp-ui/src/nfvo-components/panel/versionController/VersionControllerUtils.js create mode 100644 openecomp-ui/src/nfvo-components/panel/versionController/components/ActionButtons.jsx create mode 100644 openecomp-ui/src/nfvo-components/panel/versionController/components/CommitCommentModal.jsx create mode 100644 openecomp-ui/src/nfvo-components/panel/versionController/components/Permissions.jsx create mode 100644 openecomp-ui/src/nfvo-components/tree/Tree.jsx create mode 100644 openecomp-ui/src/nfvo-components/tree/Tree.stories.js (limited to 'openecomp-ui/src/nfvo-components') diff --git a/openecomp-ui/src/nfvo-components/SubmitErrorResponse.jsx b/openecomp-ui/src/nfvo-components/SubmitErrorResponse.jsx index 40daeff9c5..c15cd1d0e8 100644 --- a/openecomp-ui/src/nfvo-components/SubmitErrorResponse.jsx +++ b/openecomp-ui/src/nfvo-components/SubmitErrorResponse.jsx @@ -60,7 +60,7 @@ class SubmitErrorResponse extends Component { return (
- {errors.length && errors.map(error=>{return ();})} + {errors.length && errors.map((error, i) => {return ();})}
); @@ -71,7 +71,7 @@ class SubmitErrorResponse extends Component { return (
- {errors.validationData.length && errors.validationData.map(item =>{ return ();})} + {errors.validationData.length && errors.validationData.map((item, i) =>{ return ();})}
); @@ -90,11 +90,10 @@ class SubmitErrorResponse extends Component { const ComponentError = ({item}) => { - let i = 0; return (
{item.entityName}
- {item.errors.map(error => {return();})} + {item.errors.map((error, i) => {return();})}
); }; @@ -110,7 +109,7 @@ const UploadErrorList = ({items}) => { let errors = []; for (let item of generator) {errors.push( -
+
{item.header}
{item.list.map((error, i) => )}
diff --git a/openecomp-ui/src/nfvo-components/datepicker/Datepicker.jsx b/openecomp-ui/src/nfvo-components/datepicker/Datepicker.jsx index f4673c1c93..25e7e7e02d 100644 --- a/openecomp-ui/src/nfvo-components/datepicker/Datepicker.jsx +++ b/openecomp-ui/src/nfvo-components/datepicker/Datepicker.jsx @@ -1,4 +1,5 @@ import React from 'react'; +import PropTypes from 'prop-types'; import DatePicker from 'react-datepicker'; import moment from 'moment'; import SVGIcon from 'sdc-ui/lib/react/SVGIcon.js'; @@ -6,10 +7,10 @@ import SVGIcon from 'sdc-ui/lib/react/SVGIcon.js'; class CustomInput extends React.Component { static propTypes = { - placeHolderText: React.PropTypes.string, - onChange: React.PropTypes.func, - onClick: React.PropTypes.func, - value: React.PropTypes.string + placeHolderText: PropTypes.string, + onChange: PropTypes.func, + onClick: PropTypes.func, + value: PropTypes.string }; render() { @@ -32,16 +33,16 @@ const parseDate = (date, format) => { class Datepicker extends React.Component { static propTypes = { - date: React.PropTypes.oneOfType([React.PropTypes.string, React.PropTypes.number]), - format: React.PropTypes.string, - onChange: React.PropTypes.func, - selectsStart: React.PropTypes.bool, - selectsEnd: React.PropTypes.bool, - startDate: React.PropTypes.oneOfType([React.PropTypes.string, React.PropTypes.number]), - endDate: React.PropTypes.oneOfType([React.PropTypes.string, React.PropTypes.number]), - disabled: React.PropTypes.bool, - label: React.PropTypes.string, - isRequired: React.PropTypes.bool + date: PropTypes.oneOfType([PropTypes.string, PropTypes.number]), + format: PropTypes.string, + onChange: PropTypes.func, + selectsStart: PropTypes.bool, + selectsEnd: PropTypes.bool, + startDate: PropTypes.oneOfType([PropTypes.string, PropTypes.number]), + endDate: PropTypes.oneOfType([PropTypes.string, PropTypes.number]), + disabled: PropTypes.bool, + label: PropTypes.string, + isRequired: PropTypes.bool } render() { let {date, format, onChange, selectsStart = false, startDate = null, endDate = null, selectsEnd = false, diff --git a/openecomp-ui/src/nfvo-components/editor/TabulatedEditor.jsx b/openecomp-ui/src/nfvo-components/editor/TabulatedEditor.jsx index 2a0b7d4d2a..3c9ceed0d8 100644 --- a/openecomp-ui/src/nfvo-components/editor/TabulatedEditor.jsx +++ b/openecomp-ui/src/nfvo-components/editor/TabulatedEditor.jsx @@ -22,7 +22,8 @@ import NavigationSideBar from 'nfvo-components/panel/NavigationSideBar.jsx'; export default class TabulatedEditor extends React.Component { render() { - const {navigationBarProps, onToggle, onVersionSwitching, onCreate, onSave, onClose, onVersionControllerAction, onNavigate, children, meta} = this.props; + const {navigationBarProps, onToggle, onVersionSwitching, onMoreVersionsClick, onCreate, onSave, onClose, + onVersionControllerAction, onNavigate, children, meta, onManagePermissions, onOpenCommentCommitModal, onOpenPermissions, onOpenRevisionsModal} = this.props; let {versionControllerProps} = this.props; const {className = ''} = React.Children.only(children).props; const child = this.prepareChild(); @@ -42,7 +43,12 @@ export default class TabulatedEditor extends React.Component { onVersionSwitching(version, meta)} - callVCAction={(action, version) => onVersionControllerAction(action, version, meta)} + onMoreVersionsClick={onMoreVersionsClick} + onManagePermissions={onManagePermissions} + onOpenCommentCommitModal={onOpenCommentCommitModal} + onOpenPermissions={onOpenPermissions} + onOpenRevisionsModal={onOpenRevisionsModal} + callVCAction={(action, version, comment) => onVersionControllerAction(action, version, comment, meta)} onCreate={onCreate && this.handleCreate} onSave={onSave && this.handleSave}/>
diff --git a/openecomp-ui/src/nfvo-components/fileupload/DraggableUploadFileBox.jsx b/openecomp-ui/src/nfvo-components/fileupload/DraggableUploadFileBox.jsx index 629b9449a2..5b4e0a8bee 100644 --- a/openecomp-ui/src/nfvo-components/fileupload/DraggableUploadFileBox.jsx +++ b/openecomp-ui/src/nfvo-components/fileupload/DraggableUploadFileBox.jsx @@ -34,11 +34,10 @@ class DraggableUploadFileBox extends Component { render() { let {className, onClick, dataTestId, isReadOnlyMode} = this.props; return ( -
-
{i18n('Drag & drop for upload')}
+
+
{i18n('Drag & drop for upload')}
{i18n('or')}
- +
); } diff --git a/openecomp-ui/src/nfvo-components/grid/GridItem.jsx b/openecomp-ui/src/nfvo-components/grid/GridItem.jsx index 8819ab78a3..c62e042bf4 100644 --- a/openecomp-ui/src/nfvo-components/grid/GridItem.jsx +++ b/openecomp-ui/src/nfvo-components/grid/GridItem.jsx @@ -15,8 +15,8 @@ */ import React from 'react'; -const GridItem = ({colSpan = 1, children, stretch = false}) => ( -
+const GridItem = ({colSpan = 1, children, lastColInRow = false, stretch = false, className = ''}) => ( +
{children}
diff --git a/openecomp-ui/src/nfvo-components/grid/GridSection.jsx b/openecomp-ui/src/nfvo-components/grid/GridSection.jsx index de8a4f3e64..8f4a024fdb 100644 --- a/openecomp-ui/src/nfvo-components/grid/GridSection.jsx +++ b/openecomp-ui/src/nfvo-components/grid/GridSection.jsx @@ -14,11 +14,12 @@ * permissions and limitations under the License. */ import React from 'react'; +import PropTypes from 'prop-types'; import classnames from 'classnames'; -const GridSection = ({title, children, className, titleClassName}) => { +const GridSection = ({title, children, className = '', titleClassName, hasLastColSet = false}) => { return ( -
+
{title &&
{title}
}
{children} @@ -28,7 +29,9 @@ const GridSection = ({title, children, className, titleClassName}) => { }; GridSection.propTypes = { - title: React.PropTypes.string, + title: PropTypes.string, + titleClassName: PropTypes.string, + hasLastColSet: PropTypes.bool }; export default GridSection; diff --git a/openecomp-ui/src/nfvo-components/icon/Icon.jsx b/openecomp-ui/src/nfvo-components/icon/Icon.jsx deleted file mode 100644 index 125577664b..0000000000 --- a/openecomp-ui/src/nfvo-components/icon/Icon.jsx +++ /dev/null @@ -1,45 +0,0 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express - * or implied. See the License for the specific language governing - * permissions and limitations under the License. - */ -import React, { Component, PropTypes } from 'react'; - - -export default class Icon extends Component { - - static propTypes = { - image: PropTypes.string.isRequired, - onClick: PropTypes.func, - label: PropTypes.oneOfType([PropTypes.string, PropTypes.node]), - className: PropTypes.string, - iconClassName: PropTypes.string - }; - - static defaultProps = { - label: '', - className: '', - iconClassName: '' - }; - - render() { - let {image, onClick, label, className, iconClassName, ...other} = this.props; - let classes = `icon-component ${className} ${onClick ? 'clickable' : ''}`; - return ( -
- - {label} -
- ); - } -} diff --git a/openecomp-ui/src/nfvo-components/input/ExpandableInput.jsx b/openecomp-ui/src/nfvo-components/input/ExpandableInput.jsx index eab1d45ef4..82fbe1deed 100644 --- a/openecomp-ui/src/nfvo-components/input/ExpandableInput.jsx +++ b/openecomp-ui/src/nfvo-components/input/ExpandableInput.jsx @@ -14,6 +14,7 @@ * permissions and limitations under the License. */ import React from 'react'; +import PropTypes from 'prop-types'; import ReactDOM from 'react-dom'; import SVGIcon from 'sdc-ui/lib/react/SVGIcon.js'; import Input from 'nfvo-components/input/validation/InputWrapper.jsx'; @@ -76,9 +77,9 @@ class ExpandableInputOpened extends React.Component { class ExpandableInput extends React.Component { static propTypes = { - iconType: React.PropTypes.string, - onChange: React.PropTypes.func, - value: React.PropTypes.string + iconType: PropTypes.string, + onChange: PropTypes.func, + value: PropTypes.string }; state = {showInput: false}; diff --git a/openecomp-ui/src/nfvo-components/input/ToggleInput.jsx b/openecomp-ui/src/nfvo-components/input/ToggleInput.jsx index 23af72a26a..31a8a66d86 100644 --- a/openecomp-ui/src/nfvo-components/input/ToggleInput.jsx +++ b/openecomp-ui/src/nfvo-components/input/ToggleInput.jsx @@ -14,15 +14,16 @@ * permissions and limitations under the License. */ import React from 'react'; +import PropTypes from 'prop-types'; export default class ToggleInput extends React.Component { static propTypes = { - label: React.PropTypes.node, - value: React.PropTypes.bool, - onChange: React.PropTypes.func, - disabled: React.PropTypes.bool + label: PropTypes.node, + value: PropTypes.bool, + onChange: PropTypes.func, + disabled: PropTypes.bool } static defaultProps = { diff --git a/openecomp-ui/src/nfvo-components/input/dualListbox/DualListboxView.jsx b/openecomp-ui/src/nfvo-components/input/dualListbox/DualListboxView.jsx index a3be363ba4..a689c50778 100644 --- a/openecomp-ui/src/nfvo-components/input/dualListbox/DualListboxView.jsx +++ b/openecomp-ui/src/nfvo-components/input/dualListbox/DualListboxView.jsx @@ -14,6 +14,7 @@ * permissions and limitations under the License. */ import React from 'react'; +import PropTypes from 'prop-types'; import SVGIcon from 'sdc-ui/lib/react/SVGIcon.js'; import Input from 'nfvo-components/input/validation/InputWrapper.jsx'; @@ -21,17 +22,17 @@ class DualListboxView extends React.Component { static propTypes = { - availableList: React.PropTypes.arrayOf(React.PropTypes.shape({ - id: React.PropTypes.string.isRequired, - name: React.PropTypes.string.isRequired + availableList: PropTypes.arrayOf(PropTypes.shape({ + id: PropTypes.string.isRequired, + name: PropTypes.string.isRequired })), - filterTitle: React.PropTypes.shape({ - left: React.PropTypes.string, - right: React.PropTypes.string + filterTitle: PropTypes.shape({ + left: PropTypes.string, + right: PropTypes.string }), - selectedValuesList: React.PropTypes.arrayOf(React.PropTypes.string), + selectedValuesList: PropTypes.arrayOf(PropTypes.string), - onChange: React.PropTypes.func.isRequired + onChange: PropTypes.func.isRequired }; static defaultProps = { diff --git a/openecomp-ui/src/nfvo-components/input/validation/Form.jsx b/openecomp-ui/src/nfvo-components/input/validation/Form.jsx index 8d53322587..6df0bf9009 100644 --- a/openecomp-ui/src/nfvo-components/input/validation/Form.jsx +++ b/openecomp-ui/src/nfvo-components/input/validation/Form.jsx @@ -15,6 +15,7 @@ */ import React from 'react'; +import PropTypes from 'prop-types'; import ValidationButtons from './ValidationButtons.jsx'; class Form extends React.Component { @@ -31,18 +32,18 @@ class Form extends React.Component { }; static propTypes = { - isValid : React.PropTypes.bool, - formReady : React.PropTypes.bool, - isReadOnlyMode : React.PropTypes.bool, - hasButtons : React.PropTypes.bool, - onSubmit : React.PropTypes.func, - onReset : React.PropTypes.func, - labledButtons: React.PropTypes.bool, - submitButtonText: React.PropTypes.string, - cancelButtonText: React.PropTypes.string, - onValidChange : React.PropTypes.func, - onValidityChanged: React.PropTypes.func, - onValidateForm: React.PropTypes.func + isValid : PropTypes.bool, + formReady : PropTypes.bool, + isReadOnlyMode : PropTypes.bool, + hasButtons : PropTypes.bool, + onSubmit : PropTypes.func, + onReset : PropTypes.func, + labledButtons: PropTypes.bool, + submitButtonText: PropTypes.string, + cancelButtonText: PropTypes.string, + onValidChange : PropTypes.func, + onValidityChanged: PropTypes.func, + onValidateForm: PropTypes.func }; constructor(props) { @@ -124,13 +125,21 @@ class Form extends React.Component { export class TabsForm extends Form { render() { // eslint-disable-next-line no-unused-vars - let {isValid, formReady, onValidateForm, isReadOnlyMode, hasButtons, onSubmit, labledButtons, onValidChange, onValidityChanged, onDataChanged, children, ...formProps} = this.props; + let {submitButtonText, cancelButtonText, isValid, formReady, onValidateForm, isReadOnlyMode, hasButtons, onSubmit, labledButtons, onValidChange, onValidityChanged, onDataChanged, children, + ...formProps} = this.props; return (
this.form = form} onSubmit={event => this.handleFormValidation(event)}>
{children}
- {hasButtons && this.buttons = buttons} isReadOnlyMode={isReadOnlyMode}/>} + {hasButtons && + this.buttons = buttons} + isReadOnlyMode={isReadOnlyMode}/> + } ); } diff --git a/openecomp-ui/src/nfvo-components/input/validation/Input.jsx b/openecomp-ui/src/nfvo-components/input/validation/Input.jsx index eef8fee1ce..9f0e9acca8 100644 --- a/openecomp-ui/src/nfvo-components/input/validation/Input.jsx +++ b/openecomp-ui/src/nfvo-components/input/validation/Input.jsx @@ -17,7 +17,7 @@ import React from 'react'; import ReactDOM from 'react-dom'; import classNames from 'classnames'; import Checkbox from 'react-bootstrap/lib/Checkbox.js'; -import Radio from 'react-bootstrap/lib/Radio.js'; +import Radio from 'sdc-ui/lib/react/Radio.js'; import FormGroup from 'react-bootstrap/lib/FormGroup.js'; import FormControl from 'react-bootstrap/lib/FormControl.js'; import Overlay from 'react-bootstrap/lib/Overlay.js'; @@ -85,7 +85,7 @@ class Input extends React.Component { className={classNames({'required' : isRequired , 'has-error' : !isValid})} onChange={(e)=>this.onChangeCheckBox(e)} disabled={isReadOnlyMode || Boolean(disabled)} - checked={value} + checked={checked} data-test-id={this.props['data-test-id']}>{label}} {type === 'radio' && @@ -93,9 +93,10 @@ class Input extends React.Component { checked={checked} disabled={isReadOnlyMode || Boolean(disabled)} value={value} - onChange={(e)=>this.onChangeRadio(e)} + onChange={(isChecked)=>this.onChangeRadio(isChecked)} inputRef={(input) => this.input = input} - data-test-id={this.props['data-test-id']}>{label}} + label={label} + data-test-id={this.props['data-test-id']} />} {type === 'select' && this.optionSelect(e) } componentClass={type} @@ -156,16 +157,17 @@ class Input extends React.Component { onChangeCheckBox(e) { let {onChange} = this.props; + let checked = e.target.checked; this.setState({ - checked: e.target.checked + checked }); - onChange(e.target.checked); + onChange(checked); } - onChangeRadio(e) { + onChangeRadio(isChecked) { let {onChange} = this.props; this.setState({ - checked: e.target.checked + checked: isChecked }); onChange(this.state.value); } diff --git a/openecomp-ui/src/nfvo-components/input/validation/InputOptions.jsx b/openecomp-ui/src/nfvo-components/input/validation/InputOptions.jsx index 9b11d27c2b..11b07ba9da 100644 --- a/openecomp-ui/src/nfvo-components/input/validation/InputOptions.jsx +++ b/openecomp-ui/src/nfvo-components/input/validation/InputOptions.jsx @@ -14,6 +14,7 @@ * permissions and limitations under the License. */ import React from 'react'; +import PropTypes from 'prop-types'; import ReactDOM from 'react-dom'; import i18n from 'nfvo-utils/i18n/i18n.js'; import classNames from 'classnames'; @@ -26,27 +27,27 @@ export const other = {OTHER: 'Other'}; class InputOptions extends React.Component { static propTypes = { - values: React.PropTypes.arrayOf(React.PropTypes.shape({ - enum: React.PropTypes.string, - title: React.PropTypes.string + values: PropTypes.arrayOf(PropTypes.shape({ + enum: PropTypes.string, + title: PropTypes.string })), - isEnabledOther: React.PropTypes.bool, - label: React.PropTypes.string, - selectedValue: React.PropTypes.string, - multiSelectedEnum: React.PropTypes.oneOfType([ - React.PropTypes.string, - React.PropTypes.array + isEnabledOther: PropTypes.bool, + label: PropTypes.string, + selectedValue: PropTypes.string, + multiSelectedEnum: PropTypes.oneOfType([ + PropTypes.string, + PropTypes.array ]), - selectedEnum: React.PropTypes.string, - otherValue: React.PropTypes.string, - overlayPos: React.PropTypes.string, - onEnumChange: React.PropTypes.func, - onOtherChange: React.PropTypes.func, - onBlur: React.PropTypes.func, - isRequired: React.PropTypes.bool, - isMultiSelect: React.PropTypes.bool, - isValid: React.PropTypes.bool, - disabled: React.PropTypes.bool + selectedEnum: PropTypes.string, + otherValue: PropTypes.string, + overlayPos: PropTypes.string, + onEnumChange: PropTypes.func, + onOtherChange: PropTypes.func, + onBlur: PropTypes.func, + isRequired: PropTypes.bool, + isMultiSelect: PropTypes.bool, + isValid: PropTypes.bool, + disabled: PropTypes.bool }; state = { diff --git a/openecomp-ui/src/nfvo-components/input/validation/InputWrapper.jsx b/openecomp-ui/src/nfvo-components/input/validation/InputWrapper.jsx index 6c8115deee..e440fcda69 100644 --- a/openecomp-ui/src/nfvo-components/input/validation/InputWrapper.jsx +++ b/openecomp-ui/src/nfvo-components/input/validation/InputWrapper.jsx @@ -17,7 +17,7 @@ import React from 'react'; import ReactDOM from 'react-dom'; import classNames from 'classnames'; import Checkbox from 'react-bootstrap/lib/Checkbox.js'; -import Radio from 'react-bootstrap/lib/Radio.js'; +import Radio from 'sdc-ui/lib/react/Radio.js'; import FormGroup from 'react-bootstrap/lib/FormGroup.js'; import FormControl from 'react-bootstrap/lib/FormControl.js'; @@ -72,8 +72,8 @@ class InputWrapper extends React.Component { disabled={isReadOnlyMode || Boolean(disabled)} value={value} ref={(input) => this.inputWrapper = input} - onChange={(e)=>this.onChangeRadio(e)} - data-test-id={this.props['data-test-id']}>{label}} + onChange={(isChecked)=>this.onChangeRadio(isChecked)} label={label} + data-test-id={this.props['data-test-id']} />} {type === 'select' && this.optionSelect(e) } componentClass={type} @@ -119,10 +119,10 @@ class InputWrapper extends React.Component { onChange(e.target.checked); } - onChangeRadio(e) { + onChangeRadio(isChecked) { let {onChange} = this.props; this.setState({ - checked: e.target.checked + checked: isChecked }); onChange(this.state.value); } diff --git a/openecomp-ui/src/nfvo-components/input/validation/Tabs.jsx b/openecomp-ui/src/nfvo-components/input/validation/Tabs.jsx index 6f33536b04..0982c133e6 100644 --- a/openecomp-ui/src/nfvo-components/input/validation/Tabs.jsx +++ b/openecomp-ui/src/nfvo-components/input/validation/Tabs.jsx @@ -14,6 +14,7 @@ * permissions and limitations under the License. */ import React from 'react'; +import PropTypes from 'prop-types'; import ReactDOM from 'react-dom'; import {default as SDCTabs} from 'sdc-ui/lib/react/Tabs.js'; import Overlay from 'react-bootstrap/lib/Overlay.js'; @@ -25,7 +26,7 @@ export default class Tabs extends React.Component { static propTypes = { - children: React.PropTypes.node + children: PropTypes.node }; cloneTab(element) { diff --git a/openecomp-ui/src/nfvo-components/input/validation/ValidationButtons.jsx b/openecomp-ui/src/nfvo-components/input/validation/ValidationButtons.jsx index c3808dd2c3..151d3fe859 100644 --- a/openecomp-ui/src/nfvo-components/input/validation/ValidationButtons.jsx +++ b/openecomp-ui/src/nfvo-components/input/validation/ValidationButtons.jsx @@ -21,6 +21,7 @@ * labledButtons - whether or not to use labeled buttons or icons only */ import React from 'react'; +import PropTypes from 'prop-types'; import i18n from 'nfvo-utils/i18n/i18n.js'; import Button from 'sdc-ui/lib/react/Button.js'; import SVGIcon from 'sdc-ui/lib/react/SVGIcon.js'; @@ -28,10 +29,10 @@ import SVGIcon from 'sdc-ui/lib/react/SVGIcon.js'; class ValidationButtons extends React.Component { static propTypes = { - labledButtons: React.PropTypes.bool.isRequired, - isReadOnlyMode: React.PropTypes.bool, - submitButtonText: React.PropTypes.string, - cancelButtonText: React.PropTypes.string + labledButtons: PropTypes.bool.isRequired, + isReadOnlyMode: PropTypes.bool, + submitButtonText: PropTypes.string, + cancelButtonText: PropTypes.string }; state = { @@ -45,10 +46,10 @@ class ValidationButtons extends React.Component {
{!this.props.isReadOnlyMode ?
- - + +
- : + : }
); diff --git a/openecomp-ui/src/nfvo-components/listEditor/ListEditorItemView.jsx b/openecomp-ui/src/nfvo-components/listEditor/ListEditorItemView.jsx index bed304b756..60c559a3d1 100644 --- a/openecomp-ui/src/nfvo-components/listEditor/ListEditorItemView.jsx +++ b/openecomp-ui/src/nfvo-components/listEditor/ListEditorItemView.jsx @@ -14,6 +14,7 @@ * permissions and limitations under the License. */ import React from 'react'; +import PropTypes from 'prop-types'; import classnames from 'classnames'; import i18n from 'nfvo-utils/i18n/i18n.js'; import SVGIcon from 'sdc-ui/lib/react/SVGIcon.js'; @@ -22,11 +23,11 @@ import {actionTypes as modalActionTypes} from 'nfvo-components/modal/GlobalModal class ListEditorItem extends React.Component { static propTypes = { - onSelect: React.PropTypes.oneOfType([React.PropTypes.func, React.PropTypes.bool]), - onDelete: React.PropTypes.oneOfType([React.PropTypes.func, React.PropTypes.bool]), - onEdit: React.PropTypes.oneOfType([React.PropTypes.func, React.PropTypes.bool]), - children: React.PropTypes.node, - isReadOnlyMode: React.PropTypes.bool + onSelect: PropTypes.oneOfType([PropTypes.func, PropTypes.bool]), + onDelete: PropTypes.oneOfType([PropTypes.func, PropTypes.bool]), + onEdit: PropTypes.oneOfType([PropTypes.func, PropTypes.bool]), + children: PropTypes.node, + isReadOnlyMode: PropTypes.bool }; render() { diff --git a/openecomp-ui/src/nfvo-components/listEditor/ListEditorView.jsx b/openecomp-ui/src/nfvo-components/listEditor/ListEditorView.jsx index df7d69b4ff..16823b7dc5 100644 --- a/openecomp-ui/src/nfvo-components/listEditor/ListEditorView.jsx +++ b/openecomp-ui/src/nfvo-components/listEditor/ListEditorView.jsx @@ -14,6 +14,7 @@ * permissions and limitations under the License. */ import React from 'react'; +import PropTypes from 'prop-types'; import Button from 'sdc-ui/lib/react/Button.js'; import classnames from 'classnames'; import ExpandableInput from 'nfvo-components/input/ExpandableInput.jsx'; @@ -60,15 +61,15 @@ class ListEditorView extends React.Component { }; static propTypes = { - title: React.PropTypes.string, - plusButtonTitle: React.PropTypes.string, - children: React.PropTypes.node, - filterValue: React.PropTypes.string, - onFilter: React.PropTypes.func, - className: React.PropTypes.string, - isReadOnlyMode: React.PropTypes.bool, - placeholder: React.PropTypes.string, - twoColumns: React.PropTypes.bool + title: PropTypes.string, + plusButtonTitle: PropTypes.string, + children: PropTypes.node, + filterValue: PropTypes.string, + onFilter: PropTypes.func, + className: PropTypes.string, + isReadOnlyMode: PropTypes.bool, + placeholder: PropTypes.string, + twoColumns: PropTypes.bool }; render() { diff --git a/openecomp-ui/src/nfvo-components/listEditor/listEditor.stories.js b/openecomp-ui/src/nfvo-components/listEditor/listEditor.stories.js index 276b05e270..81125c84ba 100644 --- a/openecomp-ui/src/nfvo-components/listEditor/listEditor.stories.js +++ b/openecomp-ui/src/nfvo-components/listEditor/listEditor.stories.js @@ -2,7 +2,7 @@ import React from 'react'; import {storiesOf, action} from '@kadira/storybook'; import ListEditorView from './ListEditorView.jsx'; import ListEditorItemView from './ListEditorItemView.jsx'; -import ListEditorItemViewField from './ListEditorItemViewField.jsx'; +import ListEditorItemField from './ListEditorItemViewField.jsx'; import {text, number} from '@kadira/storybook-addon-knobs'; import {withKnobs} from '@kadira/storybook-addon-knobs'; @@ -13,12 +13,12 @@ function makeChildren({onEdit = false, onDelete = false} = {}) { key={index} onEdit={onEdit ? onEdit : undefined} onDelete={onDelete ? onDelete : undefined}> - +
{text('field 1', 'Lorum Ipsum')}
- - + +
{text('field 2', 'Lorum Ipsum')}
- + ) ) ); diff --git a/openecomp-ui/src/nfvo-components/loader/Loader.jsx b/openecomp-ui/src/nfvo-components/loader/Loader.jsx index 675b04c8ea..cbfed1b214 100644 --- a/openecomp-ui/src/nfvo-components/loader/Loader.jsx +++ b/openecomp-ui/src/nfvo-components/loader/Loader.jsx @@ -14,6 +14,7 @@ * permissions and limitations under the License. */ import React from 'react'; +import PropTypes from 'prop-types'; import {connect} from 'react-redux'; const mapStateToProps = ({loader}) => { @@ -25,7 +26,7 @@ const mapStateToProps = ({loader}) => { class Loader extends React.Component { static propTypes = { - isLoading: React.PropTypes.bool.isRequired + isLoading: PropTypes.bool.isRequired }; static defaultProps = { diff --git a/openecomp-ui/src/nfvo-components/modal/GlobalModal.js b/openecomp-ui/src/nfvo-components/modal/GlobalModal.js index 4e7a1a16a4..a47c42a1fb 100644 --- a/openecomp-ui/src/nfvo-components/modal/GlobalModal.js +++ b/openecomp-ui/src/nfvo-components/modal/GlobalModal.js @@ -15,6 +15,7 @@ */ import React from 'react'; +import PropTypes from 'prop-types'; import {connect} from 'react-redux'; import Modal from 'nfvo-components/modal/Modal.jsx'; @@ -25,7 +26,7 @@ import {actionTypes, typeEnum} from './GlobalModalConstants.js'; const typeClass = { - 'default': 'default', + 'default': 'primary', error: 'negative', warning: 'warning', success: 'positive' @@ -47,11 +48,11 @@ const ModalFooter = ({type, onConfirmed, onDeclined, onClose, confirmationButton return (
- {onConfirmed && } -