diff options
Diffstat (limited to 'openecomp-ui/src')
101 files changed, 1595 insertions, 1577 deletions
diff --git a/openecomp-ui/src/nfvo-components/datepicker/Datepicker.jsx b/openecomp-ui/src/nfvo-components/datepicker/Datepicker.jsx index b4bc8be9ec..33db247aee 100644 --- a/openecomp-ui/src/nfvo-components/datepicker/Datepicker.jsx +++ b/openecomp-ui/src/nfvo-components/datepicker/Datepicker.jsx @@ -1,3 +1,18 @@ +/* + * Copyright © 2016-2018 European Support Limited + * + * 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 from 'react'; import PropTypes from 'prop-types'; import DatePicker from 'react-datepicker'; @@ -97,8 +112,21 @@ class Datepicker extends React.Component { placeholderText={placeholderText} /> } - minDate={selectsEnd && props.startDate} - maxDate={selectsStart && props.endDate} + minDate={ + selectsEnd && props.startDate + ? props.startDate + : undefined + } + maxDate={ + selectsStart && props.endDate + ? props.endDate + : undefined + } + popperModifiers={{ + preventOverflow: { + boundariesElement: 'scrollParent' + } + }} {...props} /> </div> diff --git a/openecomp-ui/src/nfvo-components/input/ExpandableInput.jsx b/openecomp-ui/src/nfvo-components/input/ExpandableInput.jsx index be0ebf2bdd..37d79cb72e 100644 --- a/openecomp-ui/src/nfvo-components/input/ExpandableInput.jsx +++ b/openecomp-ui/src/nfvo-components/input/ExpandableInput.jsx @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 from 'react'; import PropTypes from 'prop-types'; @@ -36,8 +36,8 @@ class ExpandableInputOpened extends React.Component { this.rawDomNode.focus(); } - componentWillReceiveProps(newProps) { - if (!newProps.value) { + componentDidUpdate() { + if (!this.props.value) { if (!(document.activeElement === this.rawDomNode)) { this.props.handleBlur(); } diff --git a/openecomp-ui/src/nfvo-components/input/dualListbox/DualListboxView.jsx b/openecomp-ui/src/nfvo-components/input/dualListbox/DualListboxView.jsx index f36d999249..21f09e6613 100644 --- a/openecomp-ui/src/nfvo-components/input/dualListbox/DualListboxView.jsx +++ b/openecomp-ui/src/nfvo-components/input/dualListbox/DualListboxView.jsx @@ -16,9 +16,16 @@ 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'; +import Input from 'nfvo-components/input/validation/Input.jsx'; class DualListboxView extends React.Component { + constructor(props) { + super(props); + this.availableListRef = React.createRef(); + this.availableListFilterRef = React.createRef(); + this.selectedValuesListFilterRef = React.createRef(); + this.selectedValuesRef = React.createRef(); + } static propTypes = { availableList: PropTypes.arrayOf( PropTypes.shape({ @@ -77,13 +84,13 @@ class DualListboxView extends React.Component { unselectedList, { value: availableListFilter, - ref: 'availableListFilter', + ref: this.availableListFilterRef, disabled: isReadOnlyMode, onChange: value => this.setState({ availableListFilter: value }) }, { - ref: 'availableValues', + ref: this.availableListRef, disabled: isReadOnlyMode, testId: 'available' } @@ -94,13 +101,13 @@ class DualListboxView extends React.Component { selectedList, { value: selectedValuesListFilter, - ref: 'selectedValuesListFilter', + ref: this.selectedValuesListFilterRef, disabled: isReadOnlyMode, onChange: value => this.setState({ selectedValuesListFilter: value }) }, { - ref: 'selectedValues', + ref: this.selectedValuesRef, disabled: isReadOnlyMode, testId: 'selected' } @@ -236,6 +243,12 @@ class DualListboxView extends React.Component { removeAllFromSelectedList() { this.props.onChange([]); } + + // fix for auto-selection of first value in the list on the first render + componentDidMount() { + this.availableListRef.current.input.value = ''; + this.selectedValuesRef.current.input.value = ''; + } } export default DualListboxView; diff --git a/openecomp-ui/src/nfvo-components/input/validation/Form.jsx b/openecomp-ui/src/nfvo-components/input/validation/Form.jsx index b5db67c027..027920c423 100644 --- a/openecomp-ui/src/nfvo-components/input/validation/Form.jsx +++ b/openecomp-ui/src/nfvo-components/input/validation/Form.jsx @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 from 'react'; @@ -42,7 +42,8 @@ class Form extends React.Component { cancelButtonText: PropTypes.string, onValidChange: PropTypes.func, onValidityChanged: PropTypes.func, - onValidateForm: PropTypes.func + onValidateForm: PropTypes.func, + btnClassName: PropTypes.string }; constructor(props) { @@ -64,6 +65,7 @@ class Form extends React.Component { submitButtonText, cancelButtonText, children, + btnClassName, ...formProps } = this.props; /* eslint-enable no-unused-vars */ @@ -82,6 +84,7 @@ class Form extends React.Component { cancelButtonText={cancelButtonText} ref={this.setButtonsRef} isReadOnlyMode={isReadOnlyMode} + className={btnClassName} /> )} </form> @@ -159,6 +162,7 @@ export class TabsForm extends Form { onValidChange, onValidityChanged, onDataChanged, + btnClassName, children, ...formProps } = this.props; @@ -176,6 +180,7 @@ export class TabsForm extends Form { cancelButtonText={cancelButtonText} ref={buttons => (this.buttons = buttons)} isReadOnlyMode={isReadOnlyMode} + className={btnClassName} /> )} </form> diff --git a/openecomp-ui/src/nfvo-components/input/validation/Input.jsx b/openecomp-ui/src/nfvo-components/input/validation/Input.jsx index c54d4b660f..f3279b0b6d 100644 --- a/openecomp-ui/src/nfvo-components/input/validation/Input.jsx +++ b/openecomp-ui/src/nfvo-components/input/validation/Input.jsx @@ -4,9 +4,9 @@ * 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. @@ -197,11 +197,15 @@ class Input extends React.Component { selectedValues }); } - componentWillReceiveProps(nextProps) { - this.setState({ - value: nextProps.value - }); + + static getDerivedStateFromProps(props, state) { + if (state.value === props.value) { + return null; + } else { + return { value: props.value, ...state }; + } } + onChange(e) { const { onChange, type } = this.props; let value = e.target.value; diff --git a/openecomp-ui/src/nfvo-components/input/validation/ValidationButtons.jsx b/openecomp-ui/src/nfvo-components/input/validation/ValidationButtons.jsx index 550989688e..a4397114a0 100644 --- a/openecomp-ui/src/nfvo-components/input/validation/ValidationButtons.jsx +++ b/openecomp-ui/src/nfvo-components/input/validation/ValidationButtons.jsx @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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. */ /** * Holds the buttons for save/reset for forms. @@ -57,8 +57,12 @@ class ValidationButtons extends React.Component { ) : ( <SVGIcon className="close" name="close" /> ); + let className = 'validation-buttons'; + if (this.props.className) { + className += ' ' + this.props.className; + } return ( - <div className="validation-buttons"> + <div className={className}> {!this.props.isReadOnlyMode ? ( <div> <Button diff --git a/openecomp-ui/src/nfvo-components/modal/GlobalModal.js b/openecomp-ui/src/nfvo-components/modal/GlobalModal.js index 3a80e734ea..0c924304cc 100644 --- a/openecomp-ui/src/nfvo-components/modal/GlobalModal.js +++ b/openecomp-ui/src/nfvo-components/modal/GlobalModal.js @@ -4,9 +4,9 @@ * 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. @@ -18,81 +18,55 @@ import React from 'react'; import PropTypes from 'prop-types'; import { connect } from 'react-redux'; -import Modal from 'nfvo-components/modal/Modal.jsx'; -import Button from 'sdc-ui/lib/react/Button.js'; +import { + Modal, + ModalHeader, + ModalTitle, + ModalBody, + ModalFooter +} from 'sdc-ui/lib/react'; import i18n from 'nfvo-utils/i18n/i18n.js'; import { modalContentComponents } from 'sdc-app/common/modal/ModalContentMapper.js'; import { actionTypes, typeEnum } from './GlobalModalConstants.js'; -const typeClass = { - default: 'primary', - error: 'negative', - warning: 'warning', - success: 'positive' -}; - -const type2HeaderColor = { - default: 'primary', - error: 'danger', - warning: 'warning', - success: 'success' -}; - -const ModalFooter = ({ - type, +const GlobalModalFooter = ({ onConfirmed, onDeclined, onClose, confirmationButtonText, cancelButtonText }) => { - let myPropsForNoConfirmed = {}; + let actionButtonClick; if (onConfirmed) { - myPropsForNoConfirmed.btnType = 'outline'; + actionButtonClick = () => { + onConfirmed(); + onClose(); + }; } return ( - <Modal.Footer> - <div className="sdc-modal-footer"> - {onConfirmed && ( - <Button - data-test-id="sdc-modal-confirm-button" - color={typeClass[type]} - btnType="primary" - onClick={() => { - onConfirmed(); - onClose(); - }}> - {confirmationButtonText} - </Button> - )} - <Button - {...myPropsForNoConfirmed} - data-test-id="sdc-modal-cancel-button" - btnType="secondary" - color={typeClass[type]} - onClick={ - onDeclined - ? () => { - onDeclined(); - onClose(); - } - : () => onClose() - }> - {cancelButtonText} - </Button> - </div> - </Modal.Footer> + <ModalFooter + actionButtonText={onConfirmed ? confirmationButtonText : undefined} + actionButtonClick={actionButtonClick} + closeButtonText={cancelButtonText} + onClose={ + onDeclined + ? () => { + onDeclined(); + onClose(); + } + : () => onClose() + } + withButtons + /> ); }; -ModalFooter.defaultProps = { - type: 'default', +GlobalModalFooter.defaultProps = { confirmationButtonText: i18n('OK'), cancelButtonText: i18n('Cancel') }; -ModalFooter.PropTypes = { - type: PropTypes.string, +GlobalModalFooter.propTypes = { confirmationButtonText: PropTypes.string, cancelButtonText: PropTypes.string }; @@ -121,12 +95,13 @@ export class GlobalModalView extends React.Component { onConfirmed: PropTypes.func, onDeclined: PropTypes.func, confirmationButtonText: PropTypes.string, - cancelButtonText: PropTypes.string + cancelButtonText: PropTypes.string, + bodyClassName: PropTypes.string }; static defaultProps = { show: false, - type: 'default', + type: 'custom', title: '' }; @@ -137,26 +112,24 @@ export class GlobalModalView extends React.Component { show, modalComponentName, modalComponentProps, - modalClassName, msg, onConfirmed, onDeclined, confirmationButtonText, cancelButtonText, - onClose + onClose, + bodyClassName } = this.props; const ComponentToRender = modalContentComponents[modalComponentName]; return ( <Modal show={show} - bsSize={modalComponentProps && modalComponentProps.size} - className={`onborading-modal ${modalClassName || ''} ${ - type2HeaderColor[type] - }`}> - <Modal.Header> - <Modal.Title>{title}</Modal.Title> - </Modal.Header> - <Modal.Body> + type={type} + size={modalComponentProps && modalComponentProps.size}> + <ModalHeader type={type} onClose={onClose}> + <ModalTitle>{title}</ModalTitle> + </ModalHeader> + <ModalBody className={bodyClassName}> {ComponentToRender ? ( <ComponentToRender {...modalComponentProps} /> ) : msg && typeof msg === 'string' ? ( @@ -172,10 +145,9 @@ export class GlobalModalView extends React.Component { ) : ( msg )} - </Modal.Body> + </ModalBody> {(onConfirmed || onDeclined || type !== typeEnum.DEFAULT) && ( - <ModalFooter - type={type} + <GlobalModalFooter onConfirmed={onConfirmed} onDeclined={onDeclined} onClose={onClose} @@ -196,7 +168,7 @@ export class GlobalModalView extends React.Component { GlobalModalView.propTypes = { show: PropTypes.bool, - type: PropTypes.oneOf(['default', 'error', 'warning', 'success']), + type: PropTypes.oneOf(['custom', 'error', 'alert', 'info']), title: PropTypes.string, modalComponentProps: PropTypes.object, modalComponentName: PropTypes.string, diff --git a/openecomp-ui/src/nfvo-components/modal/GlobalModalConstants.js b/openecomp-ui/src/nfvo-components/modal/GlobalModalConstants.js index 8bac377e08..434b41f931 100644 --- a/openecomp-ui/src/nfvo-components/modal/GlobalModalConstants.js +++ b/openecomp-ui/src/nfvo-components/modal/GlobalModalConstants.js @@ -5,13 +5,13 @@ * 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 + * 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. + * 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 keyMirror from 'nfvo-utils/KeyMirror.js'; @@ -27,13 +27,15 @@ export const actionTypes = keyMirror( ); export const typeEnum = { - DEFAULT: 'default', + DEFAULT: 'custom', ERROR: 'error', - WARNING: 'warning', - SUCCESS: 'success' + WARNING: 'alert', + SUCCESS: 'info' }; export const modalSizes = { LARGE: 'large', - SMALL: 'small' + SMALL: 'small', + XLARGE: 'extraLarge', + MEDIUM: 'medium' }; diff --git a/openecomp-ui/src/nfvo-components/modal/GlobalModalReducer.js b/openecomp-ui/src/nfvo-components/modal/GlobalModalReducer.js index b2273fa7a7..a3383aba43 100644 --- a/openecomp-ui/src/nfvo-components/modal/GlobalModalReducer.js +++ b/openecomp-ui/src/nfvo-components/modal/GlobalModalReducer.js @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 { actionTypes, typeEnum } from './GlobalModalConstants.js'; @@ -25,20 +25,17 @@ export default (state = null, action) => { case actionTypes.GLOBAL_MODAL_ERROR: return { type: typeEnum.ERROR, - modalClassName: 'notification-modal', ...action.data }; case actionTypes.GLOBAL_MODAL_WARNING: return { type: typeEnum.WARNING, - modalClassName: 'notification-modal', ...action.data }; case actionTypes.GLOBAL_MODAL_SUCCESS: return { type: typeEnum.SUCCESS, - modalClassName: 'notification-modal', ...action.data }; diff --git a/openecomp-ui/src/nfvo-components/modal/Modal.jsx b/openecomp-ui/src/nfvo-components/modal/Modal.jsx deleted file mode 100644 index 2f70a6ac1b..0000000000 --- a/openecomp-ui/src/nfvo-components/modal/Modal.jsx +++ /dev/null @@ -1,94 +0,0 @@ -/* - * Copyright © 2016-2018 European Support Limited - * - * 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 from 'react'; -import ReactDOM from 'react-dom'; -import BootstrapModal from 'react-bootstrap/lib/Modal.js'; -import { isEqual } from 'lodash'; -let nextModalId = 0; - -export default class Modal extends React.Component { - static Header = BootstrapModal.Header; - - static Title = BootstrapModal.Title; - - static Footer = BootstrapModal.Footer; - - static Body = class ModalBody extends React.Component { - render() { - let { children, ...props } = this.props; - return ( - <BootstrapModal.Body {...props}>{children}</BootstrapModal.Body> - ); - } - - componentDidMount() { - let element = ReactDOM.findDOMNode(this); - element.addEventListener('click', event => { - if (event.target.tagName === 'A') { - event.preventDefault(); - } - }); - ['wheel', 'mousewheel', 'DOMMouseScroll'].forEach(eventType => - element.addEventListener(eventType, event => - event.stopPropagation() - ) - ); - } - - componentWillUnmount() { - let element = ReactDOM.findDOMNode(this); - - ['wheel', 'mousewheel', 'DOMMouseScroll', 'click'].forEach( - eventType => element.removeEventListener(eventType) - ); - } - - shouldComponentUpdate(nextProps) { - return !isEqual(this.props, nextProps); - } - }; - - componentWillMount() { - this.modalId = `dox-ui-modal-${nextModalId++}`; - } - - componentDidMount() { - this.ensureRootClass(); - } - - componentDidUpdate() { - this.ensureRootClass(); - } - - ensureRootClass() { - let element = document.getElementById(this.modalId); - while (element && !element.hasAttribute('data-reactroot')) { - element = element.parentElement; - } - if (element && !element.classList.contains('dox-ui')) { - element.classList.add('dox-ui'); - } - } - - render() { - let { children, ...props } = this.props; - return ( - <BootstrapModal {...props} id={this.modalId}> - {children} - </BootstrapModal> - ); - } -} diff --git a/openecomp-ui/src/nfvo-components/panel/NavigationSideBar.jsx b/openecomp-ui/src/nfvo-components/panel/NavigationSideBar.jsx index 61121df335..d852ac847b 100644 --- a/openecomp-ui/src/nfvo-components/panel/NavigationSideBar.jsx +++ b/openecomp-ui/src/nfvo-components/panel/NavigationSideBar.jsx @@ -19,7 +19,7 @@ import classnames from 'classnames'; import Collapse from 'react-bootstrap/lib/Collapse.js'; class NavigationSideBar extends React.Component { - static PropTypes = { + static propTypes = { activeItemId: PropTypes.string.isRequired, onSelect: PropTypes.func, onToggle: PropTypes.func, @@ -70,10 +70,10 @@ class NavigationSideBar extends React.Component { } class NavigationMenu extends React.Component { - static PropTypes = { + static propTypes = { activeItemId: PropTypes.string.isRequired, onNavigationItemClick: PropTypes.func, - menu: PropTypes.array + menu: PropTypes.object }; render() { diff --git a/openecomp-ui/src/nfvo-components/panel/versionController/components/CommitCommentModal.jsx b/openecomp-ui/src/nfvo-components/panel/versionController/components/CommitCommentModal.jsx index ae0913f3a9..757dc6737e 100644 --- a/openecomp-ui/src/nfvo-components/panel/versionController/components/CommitCommentModal.jsx +++ b/openecomp-ui/src/nfvo-components/panel/versionController/components/CommitCommentModal.jsx @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 from 'react'; @@ -63,6 +63,7 @@ class CommitCommentModal extends React.Component { submitButtonText={commitButtonText} labledButtons={true} isValid={true} + btnClassName="sdc-modal__footer" className="comment-commit-form"> <div className="commit-modal-text">{descriptionText}</div> <Input @@ -71,6 +72,7 @@ class CommitCommentModal extends React.Component { label={i18n('Enter Commit Comment:')} value={this.state.comment} type="textarea" + groupClassName="no-bottom-margin" /> </Form> ); diff --git a/openecomp-ui/src/nfvo-utils/i18n/en.json b/openecomp-ui/src/nfvo-utils/i18n/en.json index 98022c58e1..4634c37ebf 100644 --- a/openecomp-ui/src/nfvo-utils/i18n/en.json +++ b/openecomp-ui/src/nfvo-utils/i18n/en.json @@ -429,6 +429,8 @@ "ComponentDependencies" : "Component Dependencies", "ComponentQuestionnaire" : "Component Questionnaire", + "ComponentQuestionnaire/general/nfcFunction" : "NFC Function", + "ComponentQuestionnaire/general/nfcNamingCode" : "NFC Naming", "ComponentQuestionnaire/compute" : "Compute", "ComponentQuestionnaire/storage/backup/backupStorageSize": "Backup Storage Size", "ComponentQuestionnaire/storage/backup/backupSolution": "Backup Solution", diff --git a/openecomp-ui/src/sdc-app/Application.jsx b/openecomp-ui/src/sdc-app/Application.jsx index f96bd73c21..e67f662263 100644 --- a/openecomp-ui/src/sdc-app/Application.jsx +++ b/openecomp-ui/src/sdc-app/Application.jsx @@ -43,7 +43,7 @@ class Application extends React.Component { render() { return ( <Provider store={store}> - <div> + <div data-onboardingroot=""> <GlobalModal /> <Notifications /> {this.props.children} diff --git a/openecomp-ui/src/sdc-app/common/merge/MergeEditorActionHelper.js b/openecomp-ui/src/sdc-app/common/merge/MergeEditorActionHelper.js index 50d2a5ba93..fb58151bc8 100644 --- a/openecomp-ui/src/sdc-app/common/merge/MergeEditorActionHelper.js +++ b/openecomp-ui/src/sdc-app/common/merge/MergeEditorActionHelper.js @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * - * Licensed under the Apache License, Version 2.0 (the 'License'); + * 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 + * 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. + * 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 { actionTypes, @@ -24,7 +24,10 @@ import RestAPIUtil from 'nfvo-utils/RestAPIUtil.js'; import Configuration from 'sdc-app/config/Configuration.js'; import ItemsHelper from '../../common/helpers/ItemsHelper.js'; import { modalContentMapper } from 'sdc-app/common/modal/ModalContentMapper.js'; -import { actionTypes as modalActionTypes } from 'nfvo-components/modal/GlobalModalConstants.js'; +import { + actionTypes as modalActionTypes, + modalSizes +} from 'nfvo-components/modal/GlobalModalConstants.js'; import i18n from 'nfvo-utils/i18n/i18n.js'; import { optionsInputValues as laOptionsValues } from 'sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementConstants.js'; import { optionsInputValues as processOptionValues } from 'sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentProcessesConstants.js'; @@ -119,7 +122,6 @@ const MergeEditorActionHelper = { type: modalActionTypes.GLOBAL_MODAL_SHOW, data: { modalComponentName: modalContentMapper.MERGE_EDITOR, - modalClassName: 'merge-editor-modal', title: `${i18n('Merge Required')} - ${ version.description }`, @@ -129,9 +131,9 @@ const MergeEditorActionHelper = { }); }, modalComponentProps: { - size: 'lg', - type: 'default' - } + size: modalSizes.XLARGE + }, + bodyClassName: 'merge-editor-modal' } }) ); diff --git a/openecomp-ui/src/sdc-app/common/merge/MergeEditorView.jsx b/openecomp-ui/src/sdc-app/common/merge/MergeEditorView.jsx index a7e36a39fc..0664952b23 100644 --- a/openecomp-ui/src/sdc-app/common/merge/MergeEditorView.jsx +++ b/openecomp-ui/src/sdc-app/common/merge/MergeEditorView.jsx @@ -98,8 +98,8 @@ class ConflictCategory extends React.Component { <GridItem className="resolve"> <Button className="conflict-resolve-btn" - btnType="outline" - color="gray" + btnType="secondary" + size="default" onClick={() => onResolveConflict({ conflictId, diff --git a/openecomp-ui/src/sdc-app/common/modal/ModalContentMapper.js b/openecomp-ui/src/sdc-app/common/modal/ModalContentMapper.js index 745f01d0eb..a65199ac8f 100644 --- a/openecomp-ui/src/sdc-app/common/modal/ModalContentMapper.js +++ b/openecomp-ui/src/sdc-app/common/modal/ModalContentMapper.js @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 SoftwareProductCreation from 'sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreation.js'; @@ -31,6 +31,13 @@ import Tree from 'nfvo-components/tree/Tree.jsx'; import MergeEditor from 'sdc-app/common/merge/MergeEditor.js'; import Revisions from 'sdc-app/onboarding/revisions/Revisions.js'; import VendorSelector from 'sdc-app/onboarding/softwareProduct/details/SoftwareProductDetailsVendorSelector.jsx'; +import FlowsEditor from 'sdc-app/flows/FlowsEditorModal.js'; +import EntitlementPoolsEditor from 'sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsEditor.js'; +import FeatureGroupEditor from 'sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupEditor'; +import LicenseAgreementEditor from 'sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementEditor'; +import LicenseKeyGroupsEditor from 'sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsEditor'; +import SoftwareProductProcessesEditor from 'sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcessesEditor'; +import SoftwareProductComponentProcessesEditor from 'sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentProcessesEditor'; export const modalContentMapper = { SOFTWARE_PRODUCT_CREATION: 'SOFTWARE_PRODUCT_CREATION', @@ -50,7 +57,14 @@ export const modalContentMapper = { MERGE_EDITOR: 'MERGE_EDITOR', REVISIONS_LIST: 'REVISIONS_LIST', VENDOR_SELECTOR: 'VENDOR_SELECTOR', - VNF_IMPORT: 'VNF_IMPORT' + VNF_IMPORT: 'VNF_IMPORT', + FLOWS_EDITOR: 'FLOWS_EDITOR', + EP_EDITOR: 'EP_EDITOR', + FG_EDITOR: 'FG_EDITOR', + LA_EDITOR: 'LA_EDITOR', + LKG_EDITOR: 'LKG_EDITOR', + PROCESS_EDITOR: 'PROCESS_EDITOR', + COMP_PROCESS_EDITOR: 'COMP_PROCESS_EDITOR' }; export const modalContentComponents = { @@ -70,5 +84,12 @@ export const modalContentComponents = { MERGE_EDITOR: MergeEditor, REVISIONS_LIST: Revisions, VENDOR_SELECTOR: VendorSelector, - VNF_IMPORT: VNFImport + VNF_IMPORT: VNFImport, + FLOWS_EDITOR: FlowsEditor, + EP_EDITOR: EntitlementPoolsEditor, + FG_EDITOR: FeatureGroupEditor, + LA_EDITOR: LicenseAgreementEditor, + LKG_EDITOR: LicenseKeyGroupsEditor, + PROCESS_EDITOR: SoftwareProductProcessesEditor, + COMP_PROCESS_EDITOR: SoftwareProductComponentProcessesEditor }; diff --git a/openecomp-ui/src/sdc-app/flows/FlowsActions.js b/openecomp-ui/src/sdc-app/flows/FlowsActions.js index 9fb65f37d4..4ad7dcfdc8 100644 --- a/openecomp-ui/src/sdc-app/flows/FlowsActions.js +++ b/openecomp-ui/src/sdc-app/flows/FlowsActions.js @@ -1,22 +1,25 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 RestAPIUtil from 'nfvo-utils/RestAPIUtil.js'; import Configuration from 'sdc-app/config/Configuration.js'; import { actionTypes, enums } from './FlowsConstants.js'; import SequenceDiagramModelHelper from './SequenceDiagramModelHelper.js'; +import { actionTypes as modalActionTypes } from 'nfvo-components/modal/GlobalModalConstants.js'; +import { modalContentMapper } from 'sdc-app/common/modal/ModalContentMapper.js'; +import i18n from 'nfvo-utils/i18n/i18n.js'; function baseUrl(serviceId, artifactId = '') { const restCatalogPrefix = Configuration.get('restCatalogPrefix'); @@ -97,7 +100,7 @@ const FlowsActions = Object.freeze({ readonly }); if (!readonly) { - FlowsActions.openFlowDetailsEditor(dispatch); + FlowsActions.openEditCreateWFModal(dispatch); } } else { Object.keys(artifacts).forEach(artifact => @@ -194,14 +197,6 @@ const FlowsActions = Object.freeze({ ); }, - openFlowDetailsEditor(dispatch, flow) { - dispatch({ type: actionTypes.OPEN_FLOW_DETAILS_EDITOR, flow }); - }, - - closeFlowDetailsEditor(dispatch) { - dispatch({ type: actionTypes.CLOSE_FLOW_DETAILS_EDITOR }); - }, - openFlowDiagramEditor(dispatch, { flow }) { dispatch({ type: actionTypes.OPEN_FLOW_DIAGRAM_EDITOR, flow }); }, @@ -212,6 +207,27 @@ const FlowsActions = Object.freeze({ reset(dispatch) { dispatch({ type: actionTypes.RESET }); + }, + openEditCreateWFModal(dispatch, flow) { + dispatch({ type: actionTypes.OPEN_FLOW_DETAILS_EDITOR, flow }); + dispatch({ + type: modalActionTypes.GLOBAL_MODAL_SHOW, + data: { + modalComponentName: modalContentMapper.FLOWS_EDITOR, + modalComponentProps: { + isNewArtifact: Boolean(flow && flow.uniqueId) + }, + title: flow + ? i18n('Edit Workflow') + : i18n('Create New Workflow') + } + }); + }, + closeEditCreateWFModal(dispatch) { + dispatch({ + type: modalActionTypes.GLOBAL_MODAL_CLOSE + }); + dispatch({ type: actionTypes.CLOSE_FLOW_DETAILS_EDITOR }); } }); diff --git a/openecomp-ui/src/sdc-app/flows/FlowsEditorModal.js b/openecomp-ui/src/sdc-app/flows/FlowsEditorModal.js index b45a9fc54e..4ef12faa0e 100644 --- a/openecomp-ui/src/sdc-app/flows/FlowsEditorModal.js +++ b/openecomp-ui/src/sdc-app/flows/FlowsEditorModal.js @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 { connect } from 'react-redux'; import FlowsEditorModalView from './FlowsEditorModalView.jsx'; @@ -50,10 +50,10 @@ export const mapStateToProps = ({ flows }) => { const mapActionsToProps = (dispatch, { isNewArtifact }) => { return { onSubmit: flow => { - FlowsActions.closeFlowDetailsEditor(dispatch); + FlowsActions.closeEditCreateWFModal(dispatch); FlowsActions.createOrUpdateFlow(dispatch, { flow }, isNewArtifact); }, - onCancel: () => FlowsActions.closeFlowDetailsEditor(dispatch), + onCancel: () => FlowsActions.closeEditCreateWFModal(dispatch), onDataChanged: deltaData => ValidationHelper.dataChanged(dispatch, { deltaData, diff --git a/openecomp-ui/src/sdc-app/flows/FlowsEditorModalView.jsx b/openecomp-ui/src/sdc-app/flows/FlowsEditorModalView.jsx index 8c805cca9c..6ac316ed5c 100644 --- a/openecomp-ui/src/sdc-app/flows/FlowsEditorModalView.jsx +++ b/openecomp-ui/src/sdc-app/flows/FlowsEditorModalView.jsx @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 } from 'react'; import i18n from 'nfvo-utils/i18n/i18n.js'; @@ -38,7 +38,8 @@ class FlowsEditorModalView extends Component { onReset={onCancel} formReady={formReady} isValid={isFormValid} - onValidateForm={() => onValidateForm()}> + onValidateForm={() => onValidateForm()} + btnClassName="sdc-modal__footer"> <Input type="text" name="name" diff --git a/openecomp-ui/src/sdc-app/flows/FlowsListEditor.js b/openecomp-ui/src/sdc-app/flows/FlowsListEditor.js index 2718c19aaa..c96415cafb 100644 --- a/openecomp-ui/src/sdc-app/flows/FlowsListEditor.js +++ b/openecomp-ui/src/sdc-app/flows/FlowsListEditor.js @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 { connect } from 'react-redux'; import FlowsActions from './FlowsActions.js'; @@ -20,8 +20,6 @@ import FlowsListEditorView from './FlowsListEditorView.jsx'; export const mapStateToProps = ({ flows }) => { let { flowList = [], - isDisplayModal, - isModalInEditMode, shouldShowWorkflowsEditor = true, data = undefined, readonly @@ -33,9 +31,7 @@ export const mapStateToProps = ({ flows }) => { return { flowList, - isDisplayModal, isCheckedOut, - isModalInEditMode, shouldShowWorkflowsEditor, currentFlow: data, readonly @@ -44,9 +40,9 @@ export const mapStateToProps = ({ flows }) => { const mapActionsToProps = dispatch => { return { - onAddWorkflowClick: () => FlowsActions.openFlowDetailsEditor(dispatch), + onAddWorkflowClick: () => FlowsActions.openEditCreateWFModal(dispatch), onEditFlowDetailsClick: flow => - FlowsActions.openFlowDetailsEditor(dispatch, flow), + FlowsActions.openEditCreateWFModal(dispatch, flow), onEditFlowDiagramClick: flow => FlowsActions.fetchArtifact(dispatch, { flow }), onDeleteFlowClick: flow => FlowsActions.deleteFlow(dispatch, { flow }), diff --git a/openecomp-ui/src/sdc-app/flows/FlowsListEditorView.jsx b/openecomp-ui/src/sdc-app/flows/FlowsListEditorView.jsx index d1c0c9a3df..f0a4635213 100644 --- a/openecomp-ui/src/sdc-app/flows/FlowsListEditorView.jsx +++ b/openecomp-ui/src/sdc-app/flows/FlowsListEditorView.jsx @@ -1,34 +1,30 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 } from 'react'; import PropTypes from 'prop-types'; import i18n from 'nfvo-utils/i18n/i18n.js'; -import Modal from 'nfvo-components/modal/Modal.jsx'; import ListEditorView from 'nfvo-components/listEditor/ListEditorView.jsx'; import ListEditorItemView from 'nfvo-components/listEditor/ListEditorItemView.jsx'; -import FlowsEditorModal from './FlowsEditorModal.js'; import SequenceDiagram from './SequenceDiagram.jsx'; class FlowsListEditorView extends Component { static propTypes = { flowList: PropTypes.array, currentFlow: PropTypes.object, - isDisplayModal: PropTypes.bool, - isModalInEditMode: PropTypes.bool, isCheckedOut: PropTypes.bool, shouldShowWorkflowsEditor: PropTypes.bool, readonly: PropTypes.bool, @@ -57,7 +53,7 @@ class FlowsListEditorView extends Component { } renderWorkflowsEditor() { - let { isDisplayModal, onAddWorkflowClick, isCheckedOut } = this.props; + let { onAddWorkflowClick, isCheckedOut } = this.props; const { localFilter } = this.state; return ( @@ -72,35 +68,10 @@ class FlowsListEditorView extends Component { this.renderWorkflowListItem(flow, isCheckedOut) )} </ListEditorView> - - {isDisplayModal && this.renderWorkflowEditorModal()} </div> ); } - renderWorkflowEditorModal() { - let { isDisplayModal, isModalInEditMode } = this.props; - return ( - <Modal - show={isDisplayModal} - animation={true} - className="onborading-modal workflows-editor-modal"> - <Modal.Header> - <Modal.Title> - {`${ - isModalInEditMode - ? i18n('Edit Workflow') - : i18n('Create New Workflow') - }`} - </Modal.Title> - </Modal.Header> - <Modal.Body> - <FlowsEditorModal isNewArtifact={!isModalInEditMode} /> - </Modal.Body> - </Modal> - ); - } - renderSequenceDiagramTool() { let { onSequenceDiagramSaveClick, diff --git a/openecomp-ui/src/sdc-app/flows/FlowsListReducer.js b/openecomp-ui/src/sdc-app/flows/FlowsListReducer.js index 0279824ac4..56d389bbe5 100644 --- a/openecomp-ui/src/sdc-app/flows/FlowsListReducer.js +++ b/openecomp-ui/src/sdc-app/flows/FlowsListReducer.js @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 { actionTypes, FLOWS_EDITOR_FORM } from './FlowsConstants.js'; @@ -71,17 +71,13 @@ export default (state = {}, action) => { validations: [{ type: 'required', data: true }] } }, - data: action.flow, - isDisplayModal: true, - isModalInEditMode: Boolean(action.flow && action.flow.uniqueId) + data: action.flow }; case actionTypes.CLOSE_FLOW_DETAILS_EDITOR: return { ...state, - data: undefined, - isDisplayModal: false, - isModalInEditMode: false + data: undefined }; case actionTypes.OPEN_FLOW_DIAGRAM_EDITOR: return { diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/components/ModalButtons.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/components/ModalButtons.jsx index 8f3347e65d..4fbbd1a8f0 100644 --- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/components/ModalButtons.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/components/ModalButtons.jsx @@ -18,7 +18,6 @@ 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 GridSection from 'nfvo-components/grid/GridSection.jsx'; const ModalButtons = ({ isFormValid, @@ -28,7 +27,7 @@ const ModalButtons = ({ onCancel, className }) => ( - <GridSection className={`license-model-modal-buttons ${className}`}> + <div className={`${className}`}> {!selectedLimit && ( <Button btnType="primary" @@ -44,11 +43,11 @@ const ModalButtons = ({ type="reset"> {i18n('Cancel')} </Button> - </GridSection> + </div> ); ModalButtons.propTypes = { - isFormValid: PropTypes.func, + isFormValid: PropTypes.bool, isReadOnlyMode: PropTypes.bool, onSubmit: PropTypes.func, selectedLimit: PropTypes.string, diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/components/UuId.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/components/UuId.jsx index 2edfdaede5..66d50ca33f 100644 --- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/components/UuId.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/components/UuId.jsx @@ -21,7 +21,7 @@ import i18n from 'nfvo-utils/i18n/i18n.js'; const UuidElement = ({ title, value }) => ( <div className="uuid-container"> <div className="uuid-title">{title}</div> - <div className="uuid-value" selectable> + <div className="uuid-value" selectable="true"> {value} </div> </div> diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreationView.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreationView.jsx index 8c5d966938..be1a42c8a3 100644 --- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreationView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreationView.jsx @@ -4,9 +4,9 @@ * 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. @@ -41,7 +41,7 @@ class LicenseModelCreationView extends React.Component { let { data = {}, onDataChanged, genericFieldInfo } = this.props; let { vendorName, description } = data; return ( - <div> + <div className="license-model-modal"> {genericFieldInfo && ( <Form ref="validationForm" @@ -52,6 +52,8 @@ class LicenseModelCreationView extends React.Component { labledButtons={true} isValid={this.props.isFormValid} formReady={this.props.formReady} + btnClassName="sdc-modal__footer" + className="license-model-form" onValidateForm={() => this.validate()}> <Input value={vendorName} @@ -70,7 +72,6 @@ class LicenseModelCreationView extends React.Component { errorText={genericFieldInfo.vendorName.errorText} type="text" isRequired={true} - className="field-section" /> <Input isRequired={true} @@ -87,7 +88,7 @@ class LicenseModelCreationView extends React.Component { isValid={genericFieldInfo.description.isValid} errorText={genericFieldInfo.description.errorText} type="textarea" - className="field-section" + groupClassName="no-bottom-margin" /> </Form> )} diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsActionHelper.js index ef705d67e4..dec7d9c3b8 100644 --- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsActionHelper.js +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsActionHelper.js @@ -20,6 +20,12 @@ import { actionTypes as entitlementPoolsActionTypes } from './EntitlementPoolsCo import { actionTypes as limitEditorActions } from 'sdc-app/onboarding/licenseModel/limits/LimitEditorConstants.js'; import { default as getValue, getStrValue } from 'nfvo-utils/getValue.js'; import ItemsHelper from 'sdc-app/common/helpers/ItemsHelper.js'; +import i18n from 'nfvo-utils/i18n/i18n.js'; +import { + actionTypes as modalActionTypes, + modalSizes +} from 'nfvo-components/modal/GlobalModalConstants.js'; +import { modalContentMapper } from 'sdc-app/common/modal/ModalContentMapper.js'; function baseUrl(licenseModelId, version) { const restPrefix = Configuration.get('restPrefix'); @@ -137,9 +143,9 @@ const EntitlementPoolsActionHelper = { openEntitlementPoolsEditor( dispatch, - { entitlementPool, licenseModelId, version } = {} + { entitlementPool, licenseModelId, version, isReadOnlyMode } = {} ) { - if (licenseModelId && version) { + if (licenseModelId && version && entitlementPool) { this.fetchLimits(dispatch, { licenseModelId, version, @@ -150,6 +156,22 @@ const EntitlementPoolsActionHelper = { type: entitlementPoolsActionTypes.entitlementPoolsEditor.OPEN, entitlementPool }); + dispatch({ + type: modalActionTypes.GLOBAL_MODAL_SHOW, + data: { + modalComponentName: modalContentMapper.EP_EDITOR, + modalComponentProps: { + version, + licenseModelId, + isReadOnlyMode, + size: modalSizes.LARGE + }, + title: + licenseModelId && version && entitlementPool + ? i18n('Edit Entitlement Pool') + : i18n('Create New Entitlement Pool') + } + }); }, async deleteEntitlementPool( @@ -181,6 +203,9 @@ const EntitlementPoolsActionHelper = { dispatch({ type: entitlementPoolsActionTypes.entitlementPoolsEditor.CLOSE }); + dispatch({ + type: modalActionTypes.GLOBAL_MODAL_CLOSE + }); }, async saveEntitlementPool( diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsEditorView.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsEditorView.jsx index d5ca81cfac..d0e91e382b 100644 --- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsEditorView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsEditorView.jsx @@ -46,12 +46,27 @@ const EntitlementPoolPropType = PropTypes.shape({ name: PropTypes.string, description: PropTypes.string, thresholdUnits: PropTypes.string, - thresholdValue: PropTypes.string, + thresholdValue: PropTypes.oneOfType([PropTypes.string, PropTypes.number]), increments: PropTypes.string, startDate: PropTypes.string, expiryDate: PropTypes.string }); +const TabButton = props => { + const { onClick, disabled, className } = props; + const dataTestId = props['data-test-id']; + return ( + <div + className={className} + onClick={disabled ? undefined : onClick} + data-test-id={dataTestId} + role="tab" + disabled={disabled}> + {props.children} + </div> + ); +}; + class EntitlementPoolsEditorView extends React.Component { static propTypes = { data: EntitlementPoolPropType, @@ -95,7 +110,7 @@ class EntitlementPoolsEditorView extends React.Component { const isTabsDisabled = !data.id || !this.props.isFormValid; return ( - <div> + <div className="entitlement-pools-modal license-model-modal"> <Tabs type="menu" activeTab={selectedTab} @@ -191,23 +206,29 @@ class EntitlementPoolsEditorView extends React.Component { )} </Tab> {selectedTab !== tabIds.GENERAL ? ( - <Button + <TabButton + tabId={tabIds.ADD_LIMIT_BUTTON} disabled={ - this.state.selectedLimit || isReadOnlyMode + !!this.state.selectedLimit || isReadOnlyMode } - className="add-limit-button" - tabId={tabIds.ADD_LIMIT_BUTTON} - btnType="link" - iconName="plus"> - {i18n('Add Limit')} - </Button> + data-test-id="add-limits-tab" + className="add-limit-button"> + <Button + disabled={ + !!this.state.selectedLimit || isReadOnlyMode + } + btnType="link" + iconName="plus"> + {i18n('Add Limit')} + </Button> + </TabButton> ) : ( - <div key="empty_ep_tab_key" /> + <TabButton key="empty_ep_tab_key" /> ) // Render empty div to not break tabs } </Tabs> <ModalButtons - className="entitlement-pools-editor-buttons" + className="sdc-modal__footer" selectedLimit={this.state.selectedLimit} isFormValid={this.props.isFormValid} isReadOnlyMode={isReadOnlyMode} diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsListEditor.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsListEditor.js index 4679b9ec81..93e78a753b 100644 --- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsListEditor.js +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsListEditor.js @@ -27,7 +27,6 @@ const mapStateToProps = ({ licenseModel: { entitlementPool, licenseModelEditor } }) => { const { entitlementPoolsList } = entitlementPool; - const { data } = entitlementPool.entitlementPoolEditor; const { vendorName } = licenseModelEditor.data; return { @@ -35,21 +34,27 @@ const mapStateToProps = ({ entitlementPoolsList: sortByStringProperty( entitlementPoolsList, SORTING_PROPERTY_NAME - ), - isDisplayModal: Boolean(data), - isModalInEditMode: Boolean(data && data.id) + ) }; }; -const mapActionsToProps = (dispatch, { licenseModelId, version }) => { +const mapActionsToProps = ( + dispatch, + { licenseModelId, version, isReadOnlyMode } +) => { return { onAddEntitlementPoolClick: () => - EntitlementPoolsActionHelper.openEntitlementPoolsEditor(dispatch), + EntitlementPoolsActionHelper.openEntitlementPoolsEditor(dispatch, { + licenseModelId, + version, + isReadOnlyMode + }), onEditEntitlementPoolClick: entitlementPool => EntitlementPoolsActionHelper.openEntitlementPoolsEditor(dispatch, { entitlementPool, licenseModelId, - version + version, + isReadOnlyMode }), onDeleteEntitlementPool: entitlementPool => dispatch({ diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsListEditorView.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsListEditorView.jsx index 0648d6632d..2592687298 100644 --- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsListEditorView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsListEditorView.jsx @@ -17,11 +17,9 @@ import React from 'react'; import PropTypes from 'prop-types'; import i18n from 'nfvo-utils/i18n/i18n.js'; -import Modal from 'nfvo-components/modal/Modal.jsx'; import ListEditorView from 'nfvo-components/listEditor/ListEditorView.jsx'; import ListEditorItemView from 'nfvo-components/listEditor/ListEditorItemView.jsx'; -import EntitlementPoolsEditor from './EntitlementPoolsEditor.js'; import { extractUnits } from './EntitlementPoolsConstants'; class EntitlementPoolsListEditorView extends React.Component { @@ -46,14 +44,7 @@ class EntitlementPoolsListEditorView extends React.Component { }; render() { - let { - licenseModelId, - isReadOnlyMode, - isDisplayModal, - isModalInEditMode, - version - } = this.props; - let { onAddEntitlementPoolClick } = this.props; + let { isReadOnlyMode, onAddEntitlementPoolClick } = this.props; const { localFilter } = this.state; return ( @@ -72,28 +63,6 @@ class EntitlementPoolsListEditorView extends React.Component { ) )} </ListEditorView> - <Modal - show={isDisplayModal} - bsSize="large" - animation={true} - className="onborading-modal license-model-modal entitlement-pools-modal"> - <Modal.Header> - <Modal.Title>{`${ - isModalInEditMode - ? i18n('Edit Entitlement Pool') - : i18n('Create New Entitlement Pool') - }`}</Modal.Title> - </Modal.Header> - <Modal.Body> - {isDisplayModal && ( - <EntitlementPoolsEditor - version={version} - licenseModelId={licenseModelId} - isReadOnlyMode={isReadOnlyMode} - /> - )} - </Modal.Body> - </Modal> </div> ); } diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/components/FormContent.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/components/FormContent.jsx index 531b6b73b2..b734a88d67 100644 --- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/components/FormContent.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/components/FormContent.jsx @@ -161,11 +161,13 @@ export const EntitlementPoolsFormContent = ({ data-test-id="create-ep-manufacturerReferenceNumber-value" value={manufacturerReferenceNumber} type="text" + groupClassName="no-bottom-margin" /> </GridItem> <GridItem colSpan={2} lastColInRow> <div className="date-section"> <Input + groupClassName="no-bottom-margin" type="date" label={i18n('Start Date')} value={startDate} @@ -188,6 +190,7 @@ export const EntitlementPoolsFormContent = ({ selectsStart /> <Input + groupClassName="no-bottom-margin" type="date" label={i18n('Expiry Date')} value={expiryDate} diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupEditorView.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupEditorView.jsx index d80eb9a0ab..2a9af15984 100644 --- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupEditorView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupEditorView.jsx @@ -85,7 +85,7 @@ const GeneralTab = ({ </GridItem> <GridItem colSpan={4}> <Input - groupClassName="field-section" + groupClassName="field-section no-bottom-margin" onChange={partNumber => onDataChanged({ partNumber }, FG_EDITOR_FORM) } @@ -203,7 +203,7 @@ class FeatureGroupEditorView extends React.Component { licenseKeyGroupsList } = this.props; return ( - <div> + <div className="license-model-modal feature-group-modal"> {genericFieldInfo && ( <Form ref="validationForm" @@ -218,6 +218,7 @@ class FeatureGroupEditorView extends React.Component { labledButtons={true} isReadOnlyMode={isReadOnlyMode} name="feature-group-validation-form" + btnClassName="sdc-modal__footer" className="license-model-form feature-group-form"> <Tabs activeTab={onTabSelect ? selectedTab : undefined} diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupListEditor.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupListEditor.js index 8d41b97cf0..fe4eb58b4c 100644 --- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupListEditor.js +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupListEditor.js @@ -26,16 +26,12 @@ import { SORTING_PROPERTY_NAME } from 'sdc-app/onboarding/licenseModel/LicenseMo export const mapStateToProps = ({ licenseModel: { featureGroup, licenseModelEditor } }) => { - const { featureGroupEditor: { data }, featureGroupsList } = featureGroup; + const { featureGroupsList } = featureGroup; const { vendorName, version } = licenseModelEditor.data; return { vendorName, version, - featureGroupsModal: { - show: Boolean(data), - editMode: Boolean(data && data.id) - }, featureGroupsList: sortByStringProperty( featureGroupsList, SORTING_PROPERTY_NAME @@ -63,13 +59,19 @@ const mapActionsToProps = (dispatch, { licenseModelId }) => { onAddFeatureGroupClick: actualVersion => FeatureGroupsActionHelper.openFeatureGroupsEditor(dispatch, { licenseModelId, - version: actualVersion + version: actualVersion, + isReadOnlyMode: false }), - onEditFeatureGroupClick: (featureGroup, actualVersion) => + onEditFeatureGroupClick: ( + featureGroup, + actualVersion, + isReadOnlyMode + ) => FeatureGroupsActionHelper.openFeatureGroupsEditor(dispatch, { featureGroup, licenseModelId, - version: actualVersion + version: actualVersion, + isReadOnlyMode }) }; }; diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupListEditorView.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupListEditorView.jsx index 92468a3b86..63964435f2 100644 --- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupListEditorView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupListEditorView.jsx @@ -17,20 +17,13 @@ import React from 'react'; import PropTypes from 'prop-types'; import i18n from 'nfvo-utils/i18n/i18n.js'; -import Modal from 'nfvo-components/modal/Modal.jsx'; import ListEditorView from 'nfvo-components/listEditor/ListEditorView.jsx'; import ListEditorItemView from 'nfvo-components/listEditor/ListEditorItemView.jsx'; -import FeatureGroupEditor from './FeatureGroupEditor.js'; - class FeatureGroupListEditorView extends React.Component { static propTypes = { vendorName: PropTypes.string, licenseModelId: PropTypes.string.isRequired, - featureGroupsModal: PropTypes.shape({ - show: PropTypes.bool, - editMode: PropTypes.bool - }), isReadOnlyMode: PropTypes.bool.isRequired, onAddFeatureGroupClick: PropTypes.func, onEditFeatureGroupClick: PropTypes.func, @@ -40,11 +33,7 @@ class FeatureGroupListEditorView extends React.Component { }; static defaultProps = { - featureGroupsList: [], - featureGroupsModal: { - show: false, - editMode: false - } + featureGroupsList: [] }; state = { @@ -52,13 +41,7 @@ class FeatureGroupListEditorView extends React.Component { }; render() { - let { - licenseModelId, - featureGroupsModal, - isReadOnlyMode, - onAddFeatureGroupClick, - version - } = this.props; + let { isReadOnlyMode, onAddFeatureGroupClick, version } = this.props; const { localFilter } = this.state; return ( <div className="license-model-list-editor feature-groups-list-editor"> @@ -77,28 +60,6 @@ class FeatureGroupListEditorView extends React.Component { ) )} </ListEditorView> - {featureGroupsModal.show && ( - <Modal - show={featureGroupsModal.show} - bsSize="large" - animation={true} - className="onborading-modal license-model-modal feature-group-modal"> - <Modal.Header> - <Modal.Title>{`${ - featureGroupsModal.editMode - ? i18n('Edit Feature Group') - : i18n('Create New Feature Group') - }`}</Modal.Title> - </Modal.Header> - <Modal.Body> - <FeatureGroupEditor - version={version} - licenseModelId={licenseModelId} - isReadOnlyMode={isReadOnlyMode} - /> - </Modal.Body> - </Modal> - )} </div> ); } @@ -114,7 +75,9 @@ class FeatureGroupListEditorView extends React.Component { <ListEditorItemView key={listItem.id} onDelete={() => this.deleteFeatureGroupItem(listItem, version)} - onSelect={() => this.editFeatureGroupItem(listItem, version)} + onSelect={() => + this.editFeatureGroupItem(listItem, version, isReadOnlyMode) + } className="list-editor-item-view" isReadOnlyMode={isReadOnlyMode}> <div className="list-editor-item-view-field"> diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupsActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupsActionHelper.js index 22e21a613a..c6479a7481 100644 --- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupsActionHelper.js +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupsActionHelper.js @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 RestAPIUtil from 'nfvo-utils/RestAPIUtil.js'; import Configuration from 'sdc-app/config/Configuration.js'; @@ -19,6 +19,12 @@ import { actionTypes as featureGroupsActionConstants } from './FeatureGroupsCons import EntitlementPoolsActionHelper from 'sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsActionHelper.js'; import LicenseKeyGroupsActionHelper from 'sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsActionHelper.js'; import ItemsHelper from 'sdc-app/common/helpers/ItemsHelper.js'; +import { + actionTypes as modalActionTypes, + modalSizes +} from 'nfvo-components/modal/GlobalModalConstants.js'; +import { modalContentMapper } from 'sdc-app/common/modal/ModalContentMapper.js'; +import i18n from 'nfvo-utils/i18n/i18n.js'; function baseUrl(licenseModelId, version) { const restPrefix = Configuration.get('restPrefix'); @@ -189,7 +195,7 @@ export default { openFeatureGroupsEditor( dispatch, - { featureGroup, licenseModelId, version } + { featureGroup, licenseModelId, version, isReadOnlyMode } ) { return Promise.all([ EntitlementPoolsActionHelper.fetchEntitlementPoolsList(dispatch, { @@ -205,6 +211,26 @@ export default { type: featureGroupsActionConstants.featureGroupsEditor.OPEN, featureGroup }); + dispatch({ + type: featureGroupsActionConstants.featureGroupsEditor.OPEN, + featureGroup + }); + dispatch({ + type: modalActionTypes.GLOBAL_MODAL_SHOW, + data: { + modalComponentName: modalContentMapper.FG_EDITOR, + modalComponentProps: { + version, + licenseModelId, + isReadOnlyMode, + size: modalSizes.LARGE + }, + title: + licenseModelId && version && featureGroup + ? i18n('Edit Feature Group') + : i18n('Create New Feature Group') + } + }); }); }, @@ -212,5 +238,8 @@ export default { dispatch({ type: featureGroupsActionConstants.featureGroupsEditor.CLOSE }); + dispatch({ + type: modalActionTypes.GLOBAL_MODAL_CLOSE + }); } }; diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementActionHelper.js index feceba5726..036aaaa686 100644 --- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementActionHelper.js +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementActionHelper.js @@ -1,23 +1,29 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 RestAPIUtil from 'nfvo-utils/RestAPIUtil.js'; import Configuration from 'sdc-app/config/Configuration.js'; import { actionTypes as licenseAgreementActionTypes } from './LicenseAgreementConstants.js'; import FeatureGroupsActionHelper from 'sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupsActionHelper.js'; import ItemsHelper from 'sdc-app/common/helpers/ItemsHelper.js'; +import { + actionTypes as modalActionTypes, + modalSizes +} from 'nfvo-components/modal/GlobalModalConstants.js'; +import { modalContentMapper } from 'sdc-app/common/modal/ModalContentMapper.js'; +import i18n from 'nfvo-utils/i18n/i18n.js'; function baseUrl(licenseModelId, version) { const restPrefix = Configuration.get('restPrefix'); @@ -103,7 +109,7 @@ export default { openLicenseAgreementEditor( dispatch, - { licenseModelId, licenseAgreement, version } + { licenseModelId, licenseAgreement, version, isReadOnlyMode } ) { FeatureGroupsActionHelper.fetchFeatureGroupsList(dispatch, { licenseModelId, @@ -113,12 +119,31 @@ export default { type: licenseAgreementActionTypes.licenseAgreementEditor.OPEN, licenseAgreement }); + dispatch({ + type: modalActionTypes.GLOBAL_MODAL_SHOW, + data: { + modalComponentName: modalContentMapper.LA_EDITOR, + modalComponentProps: { + version, + licenseModelId, + isReadOnlyMode, + size: modalSizes.LARGE + }, + title: + licenseModelId && version && licenseAgreement + ? i18n('Edit License Agreement') + : i18n('Create New License Agreement') + } + }); }, closeLicenseAgreementEditor(dispatch) { dispatch({ type: licenseAgreementActionTypes.licenseAgreementEditor.CLOSE }); + dispatch({ + type: modalActionTypes.GLOBAL_MODAL_CLOSE + }); }, async saveLicenseAgreement( diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementEditorView.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementEditorView.jsx index b2ebc1e436..b54c0806ef 100644 --- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementEditorView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementEditorView.jsx @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 from 'react'; import PropTypes from 'prop-types'; @@ -77,7 +77,12 @@ const GeneralTabContent = ({ isMultiSelect={false} onEnumChange={licenseTerm => onDataChanged( - { licenseTerm: { choice: licenseTerm, other: '' } }, + { + licenseTerm: { + choice: licenseTerm, + other: '' + } + }, LA_EDITOR_FORM ) } @@ -163,7 +168,7 @@ class LicenseAgreementEditorView extends React.Component { genericFieldInfo } = this.props; return ( - <div> + <div className="license-model-modal license-agreement-modal"> {genericFieldInfo && ( <Form ref="validationForm" @@ -177,7 +182,8 @@ class LicenseAgreementEditorView extends React.Component { onValidateForm={() => this.props.onValidateForm(LA_EDITOR_FORM) } - className="license-model-form license-agreement-form"> + className="license-model-form license-agreement-form" + btnClassName="sdc-modal__footer"> <Tabs activeTab={onTabSelect ? selectedTab : undefined} onTabClick={onTabSelect} diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementListEditor.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementListEditor.js index fcb83b4279..6151ad75f2 100644 --- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementListEditor.js +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementListEditor.js @@ -25,7 +25,6 @@ const mapStateToProps = ({ licenseModel: { licenseAgreement, licenseModelEditor } }) => { let { licenseAgreementList } = licenseAgreement; - let { data } = licenseAgreement.licenseAgreementEditor; let { vendorName, version } = licenseModelEditor.data; return { @@ -34,9 +33,7 @@ const mapStateToProps = ({ licenseAgreementList: sortByStringProperty( licenseAgreementList, SORTING_PROPERTY_NAME - ), - isDisplayModal: Boolean(data), - isModalInEditMode: Boolean(data && data.id) + ) }; }; @@ -45,13 +42,19 @@ const mapActionsToProps = (dispatch, { licenseModelId }) => { onAddLicenseAgreementClick: version => LicenseAgreementActionHelper.openLicenseAgreementEditor(dispatch, { licenseModelId, - version + version, + isReadOnlyMode: false }), - onEditLicenseAgreementClick: (licenseAgreement, version) => + onEditLicenseAgreementClick: ( + licenseAgreement, + version, + isReadOnlyMode + ) => LicenseAgreementActionHelper.openLicenseAgreementEditor(dispatch, { licenseModelId, licenseAgreement, - version + version, + isReadOnlyMode }), onDeleteLicenseAgreement: (licenseAgreement, version) => dispatch({ diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementListEditorView.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementListEditorView.jsx index acec1e0ddb..b6ef7cf072 100644 --- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementListEditorView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementListEditorView.jsx @@ -1,26 +1,24 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 from 'react'; import PropTypes from 'prop-types'; import i18n from 'nfvo-utils/i18n/i18n.js'; -import Modal from 'nfvo-components/modal/Modal.jsx'; import ListEditorView from 'nfvo-components/listEditor/ListEditorView.jsx'; import ListEditorItemView from 'nfvo-components/listEditor/ListEditorItemView.jsx'; -import LicenseAgreementEditor from './LicenseAgreementEditor.js'; import { extractValue } from './LicenseAgreementConstants'; class LicenseAgreementListEditorView extends React.Component { @@ -45,13 +43,7 @@ class LicenseAgreementListEditorView extends React.Component { }; render() { - const { - licenseModelId, - isReadOnlyMode, - isDisplayModal, - isModalInEditMode, - version - } = this.props; + const { isReadOnlyMode, version } = this.props; const { onAddLicenseAgreementClick } = this.props; const { localFilter } = this.state; @@ -72,28 +64,6 @@ class LicenseAgreementListEditorView extends React.Component { ) )} </ListEditorView> - <Modal - show={isDisplayModal} - bsSize="large" - animation={true} - className="onborading-modal license-model-modal license-agreement-modal"> - <Modal.Header> - <Modal.Title>{`${ - isModalInEditMode - ? i18n('Edit License Agreement') - : i18n('Create New License Agreement') - }`}</Modal.Title> - </Modal.Header> - <Modal.Body> - {isDisplayModal && ( - <LicenseAgreementEditor - version={version} - licenseModelId={licenseModelId} - isReadOnlyMode={isReadOnlyMode} - /> - )} - </Modal.Body> - </Modal> </div> ); } @@ -133,7 +103,11 @@ class LicenseAgreementListEditorView extends React.Component { <ListEditorItemView key={id} onSelect={() => - onEditLicenseAgreementClick(licenseAgreement, version) + onEditLicenseAgreementClick( + licenseAgreement, + version, + isReadOnlyMode + ) } onDelete={() => onDeleteLicenseAgreement(licenseAgreement, version) diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsActionHelper.js index 53276ca49b..c9f0505ad1 100644 --- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsActionHelper.js +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsActionHelper.js @@ -19,6 +19,12 @@ import { actionTypes as licenseKeyGroupsConstants } from './LicenseKeyGroupsCons import { actionTypes as limitEditorActions } from 'sdc-app/onboarding/licenseModel/limits/LimitEditorConstants.js'; import { default as getValue, getStrValue } from 'nfvo-utils/getValue.js'; import ItemsHelper from 'sdc-app/common/helpers/ItemsHelper.js'; +import i18n from 'nfvo-utils/i18n/i18n.js'; +import { + actionTypes as modalActionTypes, + modalSizes +} from 'nfvo-components/modal/GlobalModalConstants.js'; +import { modalContentMapper } from 'sdc-app/common/modal/ModalContentMapper.js'; function baseUrl(licenseModelId, version) { const restPrefix = Configuration.get('restPrefix'); @@ -131,9 +137,9 @@ export default { openLicenseKeyGroupsEditor( dispatch, - { licenseKeyGroup, licenseModelId, version } = {} + { licenseKeyGroup, licenseModelId, version, isReadOnlyMode } = {} ) { - if (licenseModelId && version) { + if (licenseModelId && version && licenseKeyGroup) { this.fetchLimits(dispatch, { licenseModelId, version, @@ -144,12 +150,31 @@ export default { type: licenseKeyGroupsConstants.licenseKeyGroupsEditor.OPEN, licenseKeyGroup }); + dispatch({ + type: modalActionTypes.GLOBAL_MODAL_SHOW, + data: { + modalComponentName: modalContentMapper.LKG_EDITOR, + modalComponentProps: { + version, + licenseModelId, + isReadOnlyMode, + size: modalSizes.LARGE + }, + title: + licenseModelId && version && licenseKeyGroup + ? i18n('Edit License Key Group') + : i18n('Create New License Key Group') + } + }); }, closeLicenseKeyGroupEditor(dispatch) { dispatch({ type: licenseKeyGroupsConstants.licenseKeyGroupsEditor.CLOSE }); + dispatch({ + type: modalActionTypes.GLOBAL_MODAL_CLOSE + }); }, async saveLicenseKeyGroup( diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsEditorView.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsEditorView.jsx index 8f21722ca6..219f2dcd1e 100644 --- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsEditorView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsEditorView.jsx @@ -39,6 +39,21 @@ import { import LicenseKeyGroupFormContent from './components/FormContent.jsx'; import ModalButtons from 'sdc-app/onboarding/licenseModel/components/ModalButtons.jsx'; +const TabButton = props => { + const { onClick, disabled, className } = props; + const dataTestId = props['data-test-id']; + return ( + <div + className={className} + onClick={disabled ? undefined : onClick} + data-test-id={dataTestId} + role="tab" + disabled={disabled}> + {props.children} + </div> + ); +}; + const LicenseKeyGroupPropType = PropTypes.shape({ id: PropTypes.string, name: PropTypes.string, @@ -94,7 +109,7 @@ class LicenseKeyGroupsEditorView extends React.Component { let { selectedTab } = this.state; const isTabsDisabled = !data.id || !this.props.isFormValid; return ( - <div className="license-keygroup-editor"> + <div className="license-keygroup-editor license-model-modal license-key-groups-modal"> <Tabs type="menu" activeTab={selectedTab} @@ -187,23 +202,29 @@ class LicenseKeyGroupsEditorView extends React.Component { )} </Tab> {selectedTab !== tabIds.GENERAL ? ( - <Button - className="add-limit-button" + <TabButton tabId={tabIds.ADD_LIMIT_BUTTON} - btnType="link" - iconName="plus" disabled={ - this.state.selectedLimit || isReadOnlyMode - }> - {i18n('Add Limit')} - </Button> + !!this.state.selectedLimit || isReadOnlyMode + } + data-test-id="add-limits-tab" + className="add-limit-button"> + <Button + btnType="link" + iconName="plus" + disabled={ + !!this.state.selectedLimit || isReadOnlyMode + }> + {i18n('Add Limit')} + </Button> + </TabButton> ) : ( - <div key="empty_lm_tab_key" /> + <TabButton key="empty_lm_tab_key" /> ) // Render empty div to not break tabs } </Tabs> <ModalButtons - className="license-key-group-editor-buttons" + className="sdc-modal__footer" selectedLimit={this.state.selectedLimit} isFormValid={this.props.isFormValid} isReadOnlyMode={isReadOnlyMode} diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsListEditor.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsListEditor.js index 514e9b85ec..47d3979064 100644 --- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsListEditor.js +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsListEditor.js @@ -29,7 +29,6 @@ const mapStateToProps = ({ licenseModel: { licenseKeyGroup, licenseModelEditor } }) => { let { licenseKeyGroupsList } = licenseKeyGroup; - let { data } = licenseKeyGroup.licenseKeyGroupsEditor; let { vendorName } = licenseModelEditor.data; return { @@ -37,21 +36,24 @@ const mapStateToProps = ({ licenseKeyGroupsList: sortByStringProperty( licenseKeyGroupsList, SORTING_PROPERTY_NAME - ), - isDisplayModal: Boolean(data), - isModalInEditMode: Boolean(data && data.id) + ) }; }; const mapActionsToProps = (dispatch, { licenseModelId, version }) => { return { onAddLicenseKeyGroupClick: () => - LicenseKeyGroupsActionHelper.openLicenseKeyGroupsEditor(dispatch), - onEditLicenseKeyGroupClick: licenseKeyGroup => + LicenseKeyGroupsActionHelper.openLicenseKeyGroupsEditor(dispatch, { + isReadOnlyMode: false, + version, + licenseModelId + }), + onEditLicenseKeyGroupClick: (licenseKeyGroup, isReadOnlyMode) => LicenseKeyGroupsActionHelper.openLicenseKeyGroupsEditor(dispatch, { licenseKeyGroup, licenseModelId, - version + version, + isReadOnlyMode }), onDeleteLicenseKeyGroupClick: licenseKeyGroup => dispatch({ diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsListEditorView.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsListEditorView.jsx index 09bab1c097..2394ec8335 100644 --- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsListEditorView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsListEditorView.jsx @@ -16,11 +16,9 @@ import React from 'react'; import PropTypes from 'prop-types'; import i18n from 'nfvo-utils/i18n/i18n.js'; -import Modal from 'nfvo-components/modal/Modal.jsx'; import ListEditorView from 'nfvo-components/listEditor/ListEditorView.jsx'; import ListEditorItemView from 'nfvo-components/listEditor/ListEditorItemView.jsx'; -import LicenseKeyGroupsEditor from './LicenseKeyGroupsEditor.js'; import InputOptions, { other as optionInputOther } from 'nfvo-components/input/validation/InputOptions.jsx'; @@ -32,8 +30,6 @@ class LicenseKeyGroupsListEditorView extends React.Component { licenseModelId: PropTypes.string.isRequired, licenseKeyGroupsList: PropTypes.array, isReadOnlyMode: PropTypes.bool.isRequired, - isDisplayModal: PropTypes.bool, - isModalInEditMode: PropTypes.bool, onAddLicenseKeyGroupClick: PropTypes.func, onEditLicenseKeyGroupClick: PropTypes.func, onDeleteLicenseKeyGroupClick: PropTypes.func @@ -48,13 +44,7 @@ class LicenseKeyGroupsListEditorView extends React.Component { }; render() { - let { - licenseModelId, - isReadOnlyMode, - isDisplayModal, - isModalInEditMode, - version - } = this.props; + let { isReadOnlyMode } = this.props; let { onAddLicenseKeyGroupClick } = this.props; const { localFilter } = this.state; @@ -74,28 +64,6 @@ class LicenseKeyGroupsListEditorView extends React.Component { ) )} </ListEditorView> - <Modal - show={isDisplayModal} - bsSize="large" - animation={true} - className="onborading-modal license-model-modal license-key-groups-modal"> - <Modal.Header> - <Modal.Title>{`${ - isModalInEditMode - ? i18n('Edit License Key Group') - : i18n('Create New License Key Group') - }`}</Modal.Title> - </Modal.Header> - <Modal.Body> - {isDisplayModal && ( - <LicenseKeyGroupsEditor - version={version} - licenseModelId={licenseModelId} - isReadOnlyMode={isReadOnlyMode} - /> - )} - </Modal.Body> - </Modal> </div> ); } @@ -134,7 +102,9 @@ class LicenseKeyGroupsListEditorView extends React.Component { return ( <ListEditorItemView key={id} - onSelect={() => onEditLicenseKeyGroupClick(licenseKeyGroup)} + onSelect={() => + onEditLicenseKeyGroupClick(licenseKeyGroup, isReadOnlyMode) + } onDelete={() => onDeleteLicenseKeyGroupClick(licenseKeyGroup)} className="list-editor-item-view" isReadOnlyMode={isReadOnlyMode}> diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/components/FormContent.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/components/FormContent.jsx index 4d19ed39ce..c2c62b1402 100644 --- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/components/FormContent.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/components/FormContent.jsx @@ -211,6 +211,7 @@ const LicenseKeyGroupFormContent = ({ value={manufacturerReferenceNumber} data-test-id="create-ep-mrn" type="text" + groupClassName="no-bottom-margin" /> </GridItem> @@ -223,6 +224,7 @@ const LicenseKeyGroupFormContent = ({ value={increments} data-test-id="create-ep-increments" type="text" + groupClassName="no-bottom-margin" /> </GridItem> {id && versionUUID && <UuId id={id} versionUUID={versionUUID} />} diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/LicenseModelOverviewView.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/LicenseModelOverviewView.jsx index 6899360597..c2d6f8e4d6 100644 --- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/LicenseModelOverviewView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/LicenseModelOverviewView.jsx @@ -1,52 +1,28 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 from 'react'; import PropTypes from 'prop-types'; -import i18n from 'nfvo-utils/i18n/i18n.js'; -import Modal from 'nfvo-components/modal/Modal.jsx'; import classNames from 'classnames'; -import EntitlementPoolsEditor from '../entitlementPools/EntitlementPoolsEditor.js'; -import FeatureGroupEditor from '../featureGroups/FeatureGroupEditor.js'; -import LicenseAgreementEditor from '../licenseAgreement/LicenseAgreementEditor.js'; -import LicenseKeyGroupsEditor from '../licenseKeyGroups/LicenseKeyGroupsEditor.js'; -import { - overviewEditorHeaders, - selectedButton -} from './LicenseModelOverviewConstants.js'; +import { selectedButton } from './LicenseModelOverviewConstants.js'; import SummaryView from './SummaryView.jsx'; import VLMListView from './VLMListView.jsx'; import ListButtons from './summary/ListButtons.jsx'; -const setModalClassName = modalHeader => { - switch (modalHeader) { - case overviewEditorHeaders.ENTITLEMENT_POOL: - return 'entitlement-pools-modal'; - case overviewEditorHeaders.LICENSE_AGREEMENT: - return 'license-agreement-modal'; - case overviewEditorHeaders.FEATURE_GROUP: - return 'feature-group-modal'; - case overviewEditorHeaders.LICENSE_KEY_GROUP: - return 'license-key-groups-modal'; - default: - return ''; - } -}; - class LicenseModelOverviewView extends React.Component { static propTypes = { isDisplayModal: PropTypes.bool, @@ -63,8 +39,6 @@ class LicenseModelOverviewView extends React.Component { render() { let { - isDisplayModal, - modalHeader, licensingDataList, selectedTab, onTabSelect, @@ -94,66 +68,9 @@ class LicenseModelOverviewView extends React.Component { showInUse={selectedInUse} /> </div> - {isDisplayModal && ( - <Modal - show={isDisplayModal} - bsSize="large" - animation={true} - className={classNames( - 'onborading-modal license-model-modal', - setModalClassName(modalHeader) - )}> - <Modal.Header> - <Modal.Title>{`${i18n('Create New ')}${i18n( - modalHeader - )}`}</Modal.Title> - </Modal.Header> - <Modal.Body> - {this.renderModalBody(modalHeader)} - </Modal.Body> - </Modal> - )} </div> ); } - - renderModalBody(modalHeader) { - let { licenseModelId, version, isReadOnlyMode } = this.props; - switch (modalHeader) { - case overviewEditorHeaders.ENTITLEMENT_POOL: - return ( - <EntitlementPoolsEditor - version={version} - licenseModelId={licenseModelId} - isReadOnlyMode={isReadOnlyMode} - /> - ); - case overviewEditorHeaders.LICENSE_AGREEMENT: - return ( - <LicenseAgreementEditor - version={version} - licenseModelId={licenseModelId} - isReadOnlyMode={isReadOnlyMode} - /> - ); - case overviewEditorHeaders.FEATURE_GROUP: - return ( - <FeatureGroupEditor - version={version} - licenseModelId={licenseModelId} - isReadOnlyMode={isReadOnlyMode} - /> - ); - case overviewEditorHeaders.LICENSE_KEY_GROUP: - return ( - <LicenseKeyGroupsEditor - version={version} - licenseModelId={licenseModelId} - isReadOnlyMode={isReadOnlyMode} - /> - ); - } - } } export default LicenseModelOverviewView; diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/SummaryCountList.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/SummaryCountList.js index 711bb7a374..6ce42a51bf 100644 --- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/SummaryCountList.js +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/SummaryCountList.js @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 from 'react'; import { connect } from 'react-redux'; @@ -68,7 +68,12 @@ const mapActionsToProps = dispatch => { switch (name) { case overviewItems.ENTITLEMENT_POOLS: EntitlementPoolsActionHelper.openEntitlementPoolsEditor( - dispatch + dispatch, + { + licenseModelId, + version, + isReadOnlyMode: false + } ); break; case overviewItems.FEATURE_GROUPS: @@ -76,7 +81,8 @@ const mapActionsToProps = dispatch => { dispatch, { licenseModelId, - version + version, + isReadOnlyMode: false } ); break; @@ -85,13 +91,19 @@ const mapActionsToProps = dispatch => { dispatch, { licenseModelId, - version + version, + isReadOnlyMode: false } ); break; case overviewItems.LICENSE_KEY_GROUPS: LicenseKeyGroupsActionHelper.openLicenseKeyGroupsEditor( - dispatch + dispatch, + { + licenseModelId, + version, + isReadOnlyMode: false + } ); break; default: diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/CatalogItemDetails.jsx b/openecomp-ui/src/sdc-app/onboarding/onboard/CatalogItemDetails.jsx index 7f361d2742..4e27c39e91 100644 --- a/openecomp-ui/src/sdc-app/onboarding/onboard/CatalogItemDetails.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/onboard/CatalogItemDetails.jsx @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 from 'react'; import PropTypes from 'prop-types'; @@ -101,8 +101,8 @@ const CatalogItemDetails = ({ ); }; -CatalogItemDetails.PropTypes = { - catalogItemData: PropTypes.obj, +CatalogItemDetails.propTypes = { + catalogItemData: PropTypes.object, catalogItemTypeClass: PropTypes.string, onSelect: PropTypes.func, onMigrate: PropTypes.func diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/CatalogModal.jsx b/openecomp-ui/src/sdc-app/onboarding/onboard/CatalogModal.jsx deleted file mode 100644 index 90496c9be4..0000000000 --- a/openecomp-ui/src/sdc-app/onboarding/onboard/CatalogModal.jsx +++ /dev/null @@ -1,65 +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 from 'react'; -import { - modalMapper, - catalogItemTypes, - catalogItemTypeClasses -} from './onboardingCatalog/OnboardingCatalogConstants.js'; -import i18n from 'nfvo-utils/i18n/i18n.js'; -import Modal from 'nfvo-components/modal/Modal.jsx'; -import LicenseModelCreation from '../licenseModel/creation/LicenseModelCreation.js'; -import SoftwareProductCreation from '../softwareProduct/creation/SoftwareProductCreation.js'; - -class CatalogModal extends React.Component { - getModalDetails() { - const { modalToShow } = this.props; - switch (modalToShow) { - case catalogItemTypes.LICENSE_MODEL: - return { - title: i18n('New License Model'), - element: <LicenseModelCreation /> - }; - case catalogItemTypes.SOFTWARE_PRODUCT: - return { - title: i18n('New Software Product'), - element: <SoftwareProductCreation /> - }; - } - } - - render() { - const { modalToShow } = this.props; - const modalDetails = this.getModalDetails(modalToShow); - - return ( - <Modal - show={Boolean(modalDetails)} - className={`${ - catalogItemTypeClasses[modalMapper[modalToShow]] - }-modal`}> - <Modal.Header> - <Modal.Title> - {modalDetails && modalDetails.title} - </Modal.Title> - </Modal.Header> - <Modal.Body>{modalDetails && modalDetails.element}</Modal.Body> - </Modal> - ); - } -} - -export default CatalogModal; diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/filter/Filter.jsx b/openecomp-ui/src/sdc-app/onboarding/onboard/filter/Filter.jsx index dadbbfd720..48f53e0763 100644 --- a/openecomp-ui/src/sdc-app/onboarding/onboard/filter/Filter.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/onboard/filter/Filter.jsx @@ -4,9 +4,9 @@ * 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. @@ -61,7 +61,7 @@ const Filter = ({ onDataChanged, data, activeTab }) => { ); }; -Filter.PropTypes = { +Filter.propTypes = { onDataChanged: PropTypes.func, data: PropTypes.object, activeTab: PropTypes.number diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/VSPOverlay.jsx b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/VSPOverlay.jsx index 81061cbbcd..f0ae41fd3a 100644 --- a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/VSPOverlay.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/VSPOverlay.jsx @@ -4,9 +4,9 @@ * 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. @@ -76,7 +76,7 @@ const VSPOverlay = ({ VSPList, onSelectVSP, onSeeMore, onMigrate }) => { ); }; -VSPOverlay.PropTypes = { +VSPOverlay.propTypes = { VSPList: PropTypes.array, onSelectVSP: PropTypes.func }; diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/VendorItem.jsx b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/VendorItem.jsx index 73545d78f8..76854c29b7 100644 --- a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/VendorItem.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/VendorItem.jsx @@ -32,7 +32,7 @@ import VSPOverlay from './VSPOverlay.jsx'; import { TooltipWrapper } from './Tooltip.jsx'; class VendorItem extends React.Component { - static PropTypes = { + static propTypes = { softwareProductList: PropTypes.array, vendor: PropTypes.object, shouldShowOverlay: PropTypes.bool, diff --git a/openecomp-ui/src/sdc-app/onboarding/permissions/PermissionsManager.jsx b/openecomp-ui/src/sdc-app/onboarding/permissions/PermissionsManager.jsx index ab6add8ac2..6918a8787a 100644 --- a/openecomp-ui/src/sdc-app/onboarding/permissions/PermissionsManager.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/permissions/PermissionsManager.jsx @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 from 'react'; import Form from 'nfvo-components/input/validation/Form.jsx'; @@ -57,7 +57,8 @@ class Permissions extends React.Component { hasButtons={true} onSubmit={() => this.onsaveItemUsers()} onReset={() => onCancel()} - labledButtons={true}> + labledButtons={true} + btnClassName="sdc-modal__footer"> <div className="manage-permissions-title"> {i18n('Owner')} </div> diff --git a/openecomp-ui/src/sdc-app/onboarding/revisions/RevisionsActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/revisions/RevisionsActionHelper.js index 61ccad0cc4..e81c06812c 100644 --- a/openecomp-ui/src/sdc-app/onboarding/revisions/RevisionsActionHelper.js +++ b/openecomp-ui/src/sdc-app/onboarding/revisions/RevisionsActionHelper.js @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 i18n from 'nfvo-utils/i18n/i18n.js'; @@ -54,7 +54,6 @@ const RevisionaActionHelper = { type: modalActionTypes.GLOBAL_MODAL_SHOW, data: { modalComponentName: modalContentMapper.REVISIONS_LIST, - modalClassName: 'manage-revisions-modal', title: i18n('Revert'), modalComponentProps: { itemId: itemId, diff --git a/openecomp-ui/src/sdc-app/onboarding/revisions/RevisionsView.jsx b/openecomp-ui/src/sdc-app/onboarding/revisions/RevisionsView.jsx index 294f5286e7..efcce58bd7 100644 --- a/openecomp-ui/src/sdc-app/onboarding/revisions/RevisionsView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/revisions/RevisionsView.jsx @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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 - * revisions and limitations under the License. + * 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 from 'react'; import Form from 'nfvo-components/input/validation/Form.jsx'; @@ -34,14 +34,15 @@ class RevisionsView extends React.Component { render() { let { onCancel, onRevert, revisions, users } = this.props; return ( - <div className="manage-revisions-page"> + <div className="manage-revisions-modal"> <Form hasButtons={true} isValid={this.state.revertId} onSubmit={() => onRevert(this.state.revertId)} onReset={() => onCancel()} submitButtonText={i18n('Revert')} - labledButtons={true}> + labledButtons={true} + btnClassName="sdc-modal__footer"> <ListEditorView title={i18n('Select a Commit')} isReadOnlyMode={false}> diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/SoftwareProductActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/SoftwareProductActionHelper.js index 877c7869bd..9a177b2a53 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/SoftwareProductActionHelper.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/SoftwareProductActionHelper.js @@ -801,7 +801,7 @@ const SoftwareProductActionHelper = { }, /** for the next verision */ - addComponent(dispatch, { softwareProductId, modalClassName, version }) { + addComponent(dispatch, { softwareProductId, version }) { SoftwareProductComponentsActionHelper.clearComponentCreationData( dispatch ); @@ -813,7 +813,6 @@ const SoftwareProductActionHelper = { data: { modalComponentName: modalContentMapper.COMPONENT_CREATION, modalComponentProps: { softwareProductId, version }, - modalClassName, title: 'Create Virtual Function Component' } }); diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/HeatSetup.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/HeatSetup.js index d75d464f9e..6c0631963b 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/HeatSetup.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/HeatSetup.js @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 { connect } from 'react-redux'; import HeatSetupView from './HeatSetupView.jsx'; @@ -65,6 +65,12 @@ export const mapActionsToProps = (dispatch, {}) => { value, type }), + onToggleVolFilesDisplay: ({ module, value }) => { + HeatSetupActionHelper.toggleVolFilesDisplay(dispatch, { + module, + value + }); + }, onArtifactListChange: artifacts => HeatSetupActionHelper.changeArtifactList(dispatch, artifacts), onAddAllUnassigned: () => diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/HeatSetupActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/HeatSetupActionHelper.js index 05ac408fbb..d2eb4e9eda 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/HeatSetupActionHelper.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/HeatSetupActionHelper.js @@ -1,26 +1,28 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 { actionTypes } from './HeatSetupConstants.js'; import isEqual from 'lodash/isEqual.js'; import cloneDeep from 'lodash/cloneDeep.js'; import SoftwareProductActionHelper from 'sdc-app/onboarding/softwareProduct/SoftwareProductActionHelper.js'; -// import i18n from 'nfvo-utils/i18n/i18n.js'; -// import {actionTypes as modalActionTypes} from 'nfvo-components/modal/GlobalModalConstants.js'; export default { + toggleVolFilesDisplay(dispatch, data) { + dispatch({ type: actionTypes.TOGGLE_VOL_DISPLAY, data }); + }, + addModule(dispatch, isBase) { dispatch({ type: actionTypes.ADD_MODULE, data: { isBase } }); }, @@ -94,7 +96,7 @@ export default { dispatch({ type: modalActionTypes.GLOBAL_MODAL_WARNING, data:{ - msg: i18n(`You have uploaded a new HEAT. If you navigate away or Check-in without proceeding to validation, + msg: i18n(`You have uploaded a new HEAT. If you navigate away or Check-in without proceeding to validation, Old HEAT zip file will be in use. new HEAT will be ignored. Do you want to continue?`), confirmationButtonText: i18n('Continue'), onConfirmed: () => resolve(), diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/HeatSetupConstants.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/HeatSetupConstants.js index c87e9560f8..33bd7f639f 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/HeatSetupConstants.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/HeatSetupConstants.js @@ -1,17 +1,17 @@ -/*! +/* * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 keyMirror from 'nfvo-utils/KeyMirror.js'; @@ -30,7 +30,8 @@ export const actionTypes = keyMirror( MANIFEST_LOADED: null, GO_TO_VALIDATION: null, - IN_VALIDATION: null + IN_VALIDATION: null, + TOGGLE_VOL_DISPLAY: null }, 'heatSetup' ); diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/HeatSetupReducer.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/HeatSetupReducer.js index 8840a11c3e..06a7147ec9 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/HeatSetupReducer.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/HeatSetupReducer.js @@ -1,20 +1,21 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 { actionTypes } from './HeatSetupConstants.js'; import differenceWith from 'lodash/differenceWith.js'; +import cloneDeep from 'lodash/cloneDeep'; const emptyModule = (isBase, currentLength) => ({ name: `${isBase ? 'base_' : 'module_'}${currentLength + 1}`, @@ -65,6 +66,15 @@ function addDeletedModuleFilesToUnassigned(unassigned, deletedModule) { export default (state = {}, action) => { switch (action.type) { + case actionTypes.TOGGLE_VOL_DISPLAY: + let clonedState = cloneDeep(state); + const indexToModify = findModuleIndexByName( + clonedState.modules, + action.data.module.name + ); + let modToModify = clonedState.modules[indexToModify]; + modToModify.showVolFiles = action.data.value; + return clonedState; case actionTypes.MANIFEST_LOADED: return { ...state, diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/HeatSetupView.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/HeatSetupView.jsx index 1d4efd9104..d103d115f6 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/HeatSetupView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/HeatSetupView.jsx @@ -1,415 +1,26 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 } from 'react'; -import Button from 'sdc-ui/lib/react/Button.js'; -import Tooltip from 'react-bootstrap/lib/Tooltip.js'; -import OverlayTrigger from 'react-bootstrap/lib/OverlayTrigger.js'; -import FormControl from 'react-bootstrap/lib/FormControl.js'; import i18n from 'nfvo-utils/i18n/i18n.js'; -import SelectInput from 'nfvo-components/input/SelectInput.jsx'; -import SVGIcon from 'sdc-ui/lib/react/SVGIcon.js'; -import { fileTypes } from './HeatSetupConstants.js'; import { tabsMapping } from '../SoftwareProductAttachmentsConstants.js'; -import { sortable } from 'react-sortable'; - -class ListItem extends Component { - render() { - return <li {...this.props}>{this.props.children}</li>; - } -} - -const SortableListItem = sortable(ListItem); - -class SortableModuleFileList extends Component { - state = { - draggingIndex: null, - data: this.props.modules - }; - - componentWillReceiveProps(nextProps) { - this.setState({ data: nextProps.modules }); - } - - render() { - let { - unassigned, - onModuleRename, - onModuleDelete, - onModuleAdd, - onBaseAdd, - onModuleFileTypeChange, - isBaseExist, - isReadOnlyMode - } = this.props; - const childProps = module => ({ - module, - onModuleRename, - onModuleDelete, - onModuleFileTypeChange: (value, type) => - onModuleFileTypeChange({ module, value, type }), - files: unassigned - }); - let listItems = this.state.data.map(function(item, i) { - return ( - <SortableListItem - key={i} - updateState={data => this.setState(data)} - items={this.state.data} - draggingIndex={this.state.draggingIndex} - sortId={i} - outline="list"> - <ModuleFile - {...childProps(item)} - isReadOnlyMode={this.props.isReadOnlyMode} - /> - </SortableListItem> - ); - }, this); - - return ( - <div - className={`modules-list-wrapper ${ - listItems.length > 0 ? 'modules-list-wrapper-divider' : '' - }`}> - <div className="modules-list-header"> - {!isBaseExist && ( - <div> - <Button - btnType="link" - onClick={onBaseAdd} - disabled={ - isReadOnlyMode || unassigned.length === 0 - }> - {i18n('Add Base')} - </Button> - </div> - )} - <div> - <Button - btnType="link" - onClick={onModuleAdd} - disabled={ - isReadOnlyMode || unassigned.length === 0 - }> - {i18n('Add Module')} - </Button> - </div> - </div> - {listItems.length > 0 && <ul>{listItems}</ul>} - </div> - ); - } -} - -const tooltip = name => <Tooltip id="tooltip-bottom">{name}</Tooltip>; -const UnassignedFileList = props => { - return ( - <div> - <div className="modules-list-header" /> - <div className="unassigned-files"> - <div className="unassigned-files-title"> - {i18n('UNASSIGNED FILES')} - </div> - <div className="unassigned-files-list">{props.children}</div> - </div> - </div> - ); -}; - -const EmptyListContent = props => { - let { heatDataExist } = props; - let displayText = heatDataExist ? 'All Files Are Assigned' : ''; - return ( - <div className="go-to-validation-button-wrapper"> - <div className="all-files-assigned">{i18n(displayText)}</div> - </div> - ); -}; -const UnassignedFile = props => ( - <OverlayTrigger - placement="bottom" - overlay={tooltip(props.name)} - delayShow={1000}> - <li - data-test-id="unassigned-files" - className="unassigned-files-list-item"> - {props.name} - </li> - </OverlayTrigger> -); - -const AddOrDeleteVolumeFiles = ({ - add = true, - onAdd, - onDelete, - isReadOnlyMode -}) => { - const displayText = add ? 'Add Volume Files' : 'Delete Volume Files'; - const action = add ? onAdd : onDelete; - return ( - <Button - disabled={isReadOnlyMode} - onClick={action} - btnType="link" - className="add-or-delete-volumes" - iconName={add ? 'plus' : 'close'}> - {i18n(displayText)} - </Button> - ); -}; - -const SelectWithFileType = ({ type, selected, files, onChange }) => { - let filteredFiledAccordingToType = files.filter( - file => file.label.search(type.regex) > -1 - ); - if (selected) { - filteredFiledAccordingToType = filteredFiledAccordingToType.concat({ - label: selected, - value: selected - }); - } - - return ( - <SelectInput - data-test-id={`${type.label}-list`} - label={type.label} - value={selected} - onChange={value => - value !== selected && onChange(value, type.label) - } - disabled={filteredFiledAccordingToType.length === 0} - placeholder={ - filteredFiledAccordingToType.length === 0 ? '' : undefined - } - clearable={true} - options={filteredFiledAccordingToType} - /> - ); -}; - -class NameEditInput extends Component { - componentDidMount() { - this.input.focus(); - } - - render() { - return ( - <FormControl - {...this.props} - className="name-edit" - inputRef={input => (this.input = input)} - /> - ); - } -} - -class ModuleFile extends Component { - constructor(props) { - super(props); - this.state = { - isInNameEdit: false, - displayVolumes: Boolean(props.module.vol || props.module.volEnv) - }; - } - - handleSubmit(event, name) { - if (event.keyCode === 13) { - this.handleModuleRename(event, name); - } - } - - componentWillReceiveProps(nextProps) { - this.setState({ - displayVolumes: Boolean( - nextProps.module.vol || nextProps.module.volEnv - ) - }); - } - - handleModuleRename(event, name) { - this.setState({ isInNameEdit: false }); - this.props.onModuleRename(name, event.target.value); - } - - deleteVolumeFiles() { - const { onModuleFileTypeChange } = this.props; - onModuleFileTypeChange(null, fileTypes.VOL.label); - onModuleFileTypeChange(null, fileTypes.VOL_ENV.label); - this.setState({ displayVolumes: false }); - } - - renderNameAccordingToEditState() { - const { module: { name } } = this.props; - if (this.state.isInNameEdit) { - return ( - <NameEditInput - defaultValue={name} - onBlur={evt => this.handleModuleRename(evt, name)} - onKeyDown={evt => this.handleSubmit(evt, name)} - /> - ); - } - return <span className="filename-text">{name}</span>; - } - - render() { - const { - module: { name, isBase, yaml, env, vol, volEnv }, - onModuleDelete, - files, - onModuleFileTypeChange, - isReadOnlyMode - } = this.props; - const { displayVolumes } = this.state; - const moduleType = isBase ? 'BASE' : 'MODULE'; - return ( - <div className="modules-list-item" data-test-id="module-item"> - <div className="modules-list-item-controllers"> - <div className="modules-list-item-filename"> - <SVGIcon - name={isBase ? 'base' : 'module'} - color="primary" - iconClassName="heat-setup-module-icon" - /> - <span className="module-title-by-type">{`${moduleType}: `}</span> - <div - className={`text-and-icon ${ - this.state.isInNameEdit ? 'in-edit' : '' - }`}> - {this.renderNameAccordingToEditState()} - {!this.state.isInNameEdit && ( - <SVGIcon - name="pencil" - onClick={() => - this.setState({ isInNameEdit: true }) - } - data-test-id={ - isBase ? 'base-name' : 'module-name' - } - /> - )} - </div> - </div> - <SVGIcon - name="trashO" - onClick={() => onModuleDelete(name)} - data-test-id="module-delete" - /> - </div> - <div className="modules-list-item-selectors"> - <SelectWithFileType - type={fileTypes.YAML} - files={files} - selected={yaml} - onChange={onModuleFileTypeChange} - /> - <SelectWithFileType - type={fileTypes.ENV} - files={files} - selected={env} - onChange={onModuleFileTypeChange} - /> - {displayVolumes && ( - <SelectWithFileType - type={fileTypes.VOL} - files={files} - selected={vol} - onChange={onModuleFileTypeChange} - /> - )} - {displayVolumes && ( - <SelectWithFileType - type={fileTypes.VOL_ENV} - files={files} - selected={volEnv} - onChange={onModuleFileTypeChange} - /> - )} - <AddOrDeleteVolumeFiles - isReadOnlyMode={isReadOnlyMode} - onAdd={() => this.setState({ displayVolumes: true })} - onDelete={() => this.deleteVolumeFiles()} - add={!displayVolumes} - /> - </div> - </div> - ); - } -} - -class ArtifactOrNestedFileList extends Component { - render() { - let { - type, - title, - selected, - options, - onSelectChanged, - onAddAllUnassigned, - isReadOnlyMode, - headerClassName - } = this.props; - return ( - <div - className={`artifact-files ${ - type === 'nested' ? 'nested' : '' - } ${headerClassName} `}> - <div className="artifact-files-header"> - <span> - {type === 'artifact' && ( - <SVGIcon - color="primary" - name="artifacts" - iconClassName="heat-setup-module-icon" - /> - )} - {`${title}`} - </span> - {type === 'artifact' && ( - <Button - disabled={isReadOnlyMode} - btnType="link" - className="add-all-unassigned" - onClick={onAddAllUnassigned}> - {i18n('Add All Unassigned Files')} - </Button> - )} - </div> - {type === 'nested' ? ( - <ul className="nested-list"> - {selected.map(nested => ( - <li key={nested} className="nested-list-item"> - {nested} - </li> - ))} - </ul> - ) : ( - <SelectInput - options={options} - onMultiSelectChanged={onSelectChanged || (() => {})} - value={selected} - clearable={false} - placeholder={i18n('Add Artifact')} - multi - /> - )} - </div> - ); - } -} +import SortableModuleFileList from './components/SortableModuleFileList'; +import UnassignedFile from './components/UnassignedFile'; +import UnassignedFileList from './components/UnassignedFileList'; +import EmptyListContent from './components/EmptyListContent'; +import ArtifactOrNestedFileList from './components/ArtifactOrNestedFileList'; const buildLabelValueObject = str => typeof str === 'string' ? { value: str, label: str } : str; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/components/AddOrDeleteVolumeFiles.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/components/AddOrDeleteVolumeFiles.js new file mode 100644 index 0000000000..92a07ae119 --- /dev/null +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/components/AddOrDeleteVolumeFiles.js @@ -0,0 +1,40 @@ +/* + * Copyright © 2016-2018 European Support Limited + * + * 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 from 'react'; +import Button from 'sdc-ui/lib/react/Button.js'; +import i18n from 'nfvo-utils/i18n/i18n.js'; + +const AddOrDeleteVolumeFiles = ({ + add = true, + onAdd, + onDelete, + isReadOnlyMode +}) => { + const displayText = add ? 'Add Volume Files' : 'Delete Volume Files'; + const action = add ? onAdd : onDelete; + return ( + <Button + disabled={isReadOnlyMode} + onClick={action} + btnType="link" + className="add-or-delete-volumes" + iconName={add ? 'plus' : 'close'}> + {i18n(displayText)} + </Button> + ); +}; + +export default AddOrDeleteVolumeFiles; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/components/ArtifactOrNestedFileList.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/components/ArtifactOrNestedFileList.js new file mode 100644 index 0000000000..c2bbde4c3d --- /dev/null +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/components/ArtifactOrNestedFileList.js @@ -0,0 +1,82 @@ +/* + * Copyright © 2016-2018 European Support Limited + * + * 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 from 'react'; +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'; +import SelectInput from 'nfvo-components/input/SelectInput.jsx'; + +const NestedList = ({ selected }) => ( + <ul className="nested-list"> + {selected.map(nested => ( + <li key={nested} className="nested-list-item"> + {nested} + </li> + ))} + </ul> +); + +const ArtifactOrNestedFileList = ({ + type, + title, + selected, + options, + onSelectChanged, + onAddAllUnassigned, + isReadOnlyMode, + headerClassName +}) => ( + <div + className={`artifact-files ${ + type === 'nested' ? 'nested' : '' + } ${headerClassName} `}> + <div className="artifact-files-header"> + <span> + {type === 'artifact' && ( + <SVGIcon + color="primary" + name="artifacts" + iconClassName="heat-setup-module-icon" + /> + )} + {`${title}`} + </span> + {type === 'artifact' && ( + <Button + disabled={isReadOnlyMode} + btnType="link" + className="add-all-unassigned" + onClick={onAddAllUnassigned}> + {i18n('Add All Unassigned Files')} + </Button> + )} + </div> + {type === 'nested' ? ( + <NestedList selected={selected} /> + ) : ( + <SelectInput + options={options} + onMultiSelectChanged={onSelectChanged || (() => {})} + value={selected} + clearable={false} + placeholder={i18n('Add Artifact')} + multi + /> + )} + </div> +); + +export default ArtifactOrNestedFileList; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/components/EmptyListContent.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/components/EmptyListContent.js new file mode 100644 index 0000000000..f638d10998 --- /dev/null +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/components/EmptyListContent.js @@ -0,0 +1,29 @@ +/* + * Copyright © 2016-2018 European Support Limited + * + * 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 from 'react'; +import i18n from 'nfvo-utils/i18n/i18n.js'; + +const EmptyListContent = props => { + let { heatDataExist } = props; + let displayText = heatDataExist ? 'All Files Are Assigned' : ''; + return ( + <div className="go-to-validation-button-wrapper"> + <div className="all-files-assigned">{i18n(displayText)}</div> + </div> + ); +}; + +export default EmptyListContent; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/components/ModuleFile.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/components/ModuleFile.js new file mode 100644 index 0000000000..5cc74e80df --- /dev/null +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/components/ModuleFile.js @@ -0,0 +1,152 @@ +/* + * Copyright © 2016-2018 European Support Limited + * + * 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 from 'react'; +import SVGIcon from 'sdc-ui/lib/react/SVGIcon.js'; +import NameEditInput from './NameEditInput.js'; +import SelectWithFileType from './SelectWithFileType'; +import { fileTypes } from '../HeatSetupConstants.js'; +import AddOrDeleteVolumeFiles from './AddOrDeleteVolumeFiles'; + +class ModuleFile extends React.Component { + constructor(props) { + super(props); + this.state = { + isInNameEdit: false + }; + } + + handleSubmit(event, name) { + if (event.keyCode === 13) { + this.handleModuleRename(event, name); + } + } + + handleModuleRename(event, name) { + this.setState({ isInNameEdit: false }); + this.props.onModuleRename(name, event.target.value); + } + + deleteVolumeFiles() { + const { onModuleFileTypeChange, onToggleVolFilesDisplay } = this.props; + onModuleFileTypeChange(null, fileTypes.VOL.label); + onModuleFileTypeChange(null, fileTypes.VOL_ENV.label); + onToggleVolFilesDisplay(false); + } + + renderNameAccordingToEditState() { + const { module: { name } } = this.props; + if (this.state.isInNameEdit) { + return ( + <NameEditInput + defaultValue={name} + onBlur={evt => this.handleModuleRename(evt, name)} + onKeyDown={evt => this.handleSubmit(evt, name)} + /> + ); + } + return <span className="filename-text">{name}</span>; + } + + render() { + const { + module: { name, isBase, yaml, env, vol, volEnv }, + onModuleDelete, + files, + onModuleFileTypeChange, + onToggleVolFilesDisplay, + isReadOnlyMode, + displayVolumes + } = this.props; + + //const { displayVolumes } = this.state; + + const moduleType = isBase ? 'BASE' : 'MODULE'; + return ( + <div className="modules-list-item" data-test-id="module-item"> + <div className="modules-list-item-controllers"> + <div className="modules-list-item-filename"> + <SVGIcon + name={isBase ? 'base' : 'module'} + color="primary" + iconClassName="heat-setup-module-icon" + /> + <span className="module-title-by-type">{`${moduleType}: `}</span> + <div + className={`text-and-icon ${ + this.state.isInNameEdit ? 'in-edit' : '' + }`}> + {this.renderNameAccordingToEditState()} + {!this.state.isInNameEdit && ( + <SVGIcon + name="pencil" + onClick={() => + this.setState({ isInNameEdit: true }) + } + data-test-id={ + isBase ? 'base-name' : 'module-name' + } + /> + )} + </div> + </div> + <SVGIcon + name="trashO" + onClick={() => onModuleDelete(name)} + data-test-id="module-delete" + /> + </div> + <div className="modules-list-item-selectors"> + <SelectWithFileType + type={fileTypes.YAML} + files={files} + selected={yaml} + onChange={onModuleFileTypeChange} + /> + <SelectWithFileType + type={fileTypes.ENV} + files={files} + selected={env} + onChange={onModuleFileTypeChange} + /> + {displayVolumes && ( + <SelectWithFileType + type={fileTypes.VOL} + files={files} + selected={vol} + onChange={onModuleFileTypeChange} + /> + )} + {displayVolumes && ( + <SelectWithFileType + type={fileTypes.VOL_ENV} + files={files} + selected={volEnv} + onChange={onModuleFileTypeChange} + /> + )} + <AddOrDeleteVolumeFiles + isReadOnlyMode={isReadOnlyMode} + onAdd={() => onToggleVolFilesDisplay(true)} + onDelete={() => this.deleteVolumeFiles()} + add={!displayVolumes} + /> + </div> + </div> + ); + } +} + +export default ModuleFile; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/components/NameEditInput.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/components/NameEditInput.js new file mode 100644 index 0000000000..36821e02c2 --- /dev/null +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/components/NameEditInput.js @@ -0,0 +1,35 @@ +/* + * Copyright © 2016-2018 European Support Limited + * + * 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 from 'react'; +import FormControl from 'react-bootstrap/lib/FormControl.js'; + +class NameEditInput extends React.Component { + componentDidMount() { + this.input.focus(); + } + + render() { + return ( + <FormControl + {...this.props} + className="name-edit" + inputRef={input => (this.input = input)} + /> + ); + } +} + +export default NameEditInput; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/components/SelectWithFileType.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/components/SelectWithFileType.js new file mode 100644 index 0000000000..050c91e431 --- /dev/null +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/components/SelectWithFileType.js @@ -0,0 +1,48 @@ +/* + * Copyright © 2016-2018 European Support Limited + * + * 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 from 'react'; +import SelectInput from 'nfvo-components/input/SelectInput.jsx'; + +const SelectWithFileType = ({ type, selected, files, onChange }) => { + let filteredFiledAccordingToType = files.filter( + file => file.label.search(type.regex) > -1 + ); + if (selected) { + filteredFiledAccordingToType = filteredFiledAccordingToType.concat({ + label: selected, + value: selected + }); + } + + return ( + <SelectInput + data-test-id={`${type.label}-list`} + label={type.label} + value={selected} + onChange={value => + value !== selected && onChange(value, type.label) + } + disabled={filteredFiledAccordingToType.length === 0} + placeholder={ + filteredFiledAccordingToType.length === 0 ? '' : undefined + } + clearable={true} + options={filteredFiledAccordingToType} + /> + ); +}; + +export default SelectWithFileType; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/components/SortableListItem.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/components/SortableListItem.js new file mode 100644 index 0000000000..57626438fb --- /dev/null +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/components/SortableListItem.js @@ -0,0 +1,21 @@ +/* + * Copyright © 2016-2018 European Support Limited + * + * 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 from 'react'; +import { sortable } from 'react-sortable'; + +const ListItem = props => <li {...props}>{props.children}</li>; + +export default sortable(ListItem); diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/components/SortableModuleFileList.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/components/SortableModuleFileList.js new file mode 100644 index 0000000000..f52c251361 --- /dev/null +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/components/SortableModuleFileList.js @@ -0,0 +1,126 @@ +/* + * Copyright © 2016-2018 European Support Limited + * + * 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 from 'react'; +import isEqual from 'lodash/isEqual'; +import i18n from 'nfvo-utils/i18n/i18n.js'; +import SortableListItem from './SortableListItem.js'; +import { fileTypes } from '../HeatSetupConstants.js'; + +import Button from 'sdc-ui/lib/react/Button.js'; +import ModuleFile from './ModuleFile.js'; + +class SortableModuleFileList extends React.Component { + state = { + draggingIndex: null, + data: this.props.modules + }; + + componentDidUpdate() { + if (!isEqual(this.state.data, this.props.modules)) { + /* eslint-disable-next-line */ + this.setState({ + data: this.props.modules + }); + } + } + + render() { + let { + unassigned, + onModuleRename, + onModuleDelete, + onModuleAdd, + onBaseAdd, + onModuleFileTypeChange, + onToggleVolFilesDisplay, + isBaseExist, + isReadOnlyMode + } = this.props; + const childProps = module => ({ + module, + onModuleRename, + onModuleDelete, + onModuleFileTypeChange: (value, type) => { + if ( + type === fileTypes.VOL.label || + type === fileTypes.VOL_ENV.label + ) { + onToggleVolFilesDisplay({ module, value: false }); + } + onModuleFileTypeChange({ module, value, type }); + }, + + files: unassigned, + displayVolumes: Boolean( + module.vol || module.volEnv || module.showVolFiles + ), + onToggleVolFilesDisplay: value => + onToggleVolFilesDisplay({ module, value }) + }); + + let listItems = this.state.data.map(function(item, i) { + return ( + <SortableListItem + key={i} + updateState={data => this.setState(data)} + items={this.state.data} + draggingIndex={this.state.draggingIndex} + sortId={i} + outline="list"> + <ModuleFile + {...childProps(item)} + isReadOnlyMode={this.props.isReadOnlyMode} + /> + </SortableListItem> + ); + }, this); + + return ( + <div + className={`modules-list-wrapper ${ + listItems.length > 0 ? 'modules-list-wrapper-divider' : '' + }`}> + <div className="modules-list-header"> + {!isBaseExist && ( + <div> + <Button + btnType="link" + onClick={onBaseAdd} + disabled={ + isReadOnlyMode || unassigned.length === 0 + }> + {i18n('Add Base')} + </Button> + </div> + )} + <div> + <Button + btnType="link" + onClick={onModuleAdd} + disabled={ + isReadOnlyMode || unassigned.length === 0 + }> + {i18n('Add Module')} + </Button> + </div> + </div> + {listItems.length > 0 && <ul>{listItems}</ul>} + </div> + ); + } +} + +export default SortableModuleFileList; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/components/UnassignedFile.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/components/UnassignedFile.js new file mode 100644 index 0000000000..770befc0e3 --- /dev/null +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/components/UnassignedFile.js @@ -0,0 +1,35 @@ +/* + * Copyright © 2016-2018 European Support Limited + * + * 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 from 'react'; +import OverlayTrigger from 'react-bootstrap/lib/OverlayTrigger.js'; +import Tooltip from 'react-bootstrap/lib/Tooltip.js'; + +const tooltip = name => <Tooltip id="tooltip-bottom">{name}</Tooltip>; + +const UnassignedFile = props => ( + <OverlayTrigger + placement="bottom" + overlay={tooltip(props.name)} + delayShow={1000}> + <li + data-test-id="unassigned-files" + className="unassigned-files-list-item"> + {props.name} + </li> + </OverlayTrigger> +); + +export default UnassignedFile; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/components/UnassignedFileList.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/components/UnassignedFileList.js new file mode 100644 index 0000000000..75fe7cdc8a --- /dev/null +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/attachments/setup/components/UnassignedFileList.js @@ -0,0 +1,33 @@ +/* + * Copyright © 2016-2018 European Support Limited + * + * 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 from 'react'; +import i18n from 'nfvo-utils/i18n/i18n.js'; + +const UnassignedFileList = props => { + return ( + <div> + <div className="modules-list-header" /> + <div className="unassigned-files"> + <div className="unassigned-files-title"> + {i18n('UNASSIGNED FILES')} + </div> + <div className="unassigned-files-list">{props.children}</div> + </div> + </div> + ); +}; + +export default UnassignedFileList; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/SoftwareProductComponents.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/SoftwareProductComponents.js index bffa9f7d25..8ba5a18229 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/SoftwareProductComponents.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/SoftwareProductComponents.js @@ -1,3 +1,18 @@ +/* + * Copyright © 2016-2018 European Support Limited + * + * 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 { connect } from 'react-redux'; import i18n from 'nfvo-utils/i18n/i18n.js'; @@ -44,8 +59,7 @@ const mapActionToProps = dispatch => { onAddComponent: (softwareProductId, version) => SoftwareProductActionHelper.addComponent(dispatch, { softwareProductId, - version, - modalClassName: 'create-vfc-modal' + version }), onDeleteComponent: (component, softwareProductId, version) => dispatch({ diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/compute/ComputeFlavorActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/compute/ComputeFlavorActionHelper.js index cd37c317af..6842d9448e 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/compute/ComputeFlavorActionHelper.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/compute/ComputeFlavorActionHelper.js @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 RestAPIUtil from 'nfvo-utils/RestAPIUtil.js'; import Configuration from 'sdc-app/config/Configuration.js'; @@ -120,12 +120,9 @@ const ComputeFlavorActionHelper = { data: { modalComponentName: modalContentMapper.COMPONENT_COMPUTE_FLAVOR_EDITOR, - modalClassName: `compute-flavor-editor-modal-${ - props.compute ? 'edit' : 'create' - }`, modalComponentProps: { ...props, - size: props.compute ? modalSizes.LARGE : undefined, + size: props.compute ? modalSizes.XLARGE : undefined, dialogClassName: 'compute-flavor-editor-modal' }, title: `${ diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/compute/computeComponents/computeFlavor/ComputeFlavorEditorView.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/compute/computeComponents/computeFlavor/ComputeFlavorEditorView.jsx index 840f722bb2..7ea6f78a8c 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/compute/computeComponents/computeFlavor/ComputeFlavorEditorView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/compute/computeComponents/computeFlavor/ComputeFlavorEditorView.jsx @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 from 'react'; import PropTypes from 'prop-types'; @@ -63,6 +63,7 @@ class ComputeEditorView extends React.Component { this.form = form; }} hasButtons={true} + btnClassName="sdc-modal__footer" onSubmit={() => onSubmit({ data, qdata })} onReset={() => onCancel()} labledButtons={true} diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/creation/SoftwareProductComponentCreationView.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/creation/SoftwareProductComponentCreationView.jsx index 0b33b4017f..cb17813bae 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/creation/SoftwareProductComponentCreationView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/creation/SoftwareProductComponentCreationView.jsx @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 from 'react'; @@ -47,7 +47,7 @@ class ComponentCreationView extends React.Component { onValidateForm={() => this.props.onValidateForm(forms.CREATE_FORM) } - className="entitlement-pools-form"> + btnClassName="sdc-modal__footer"> <GridSection hasLastColSet> <GridItem colSpan={4} lastColInRow> <Input @@ -82,6 +82,7 @@ class ComponentCreationView extends React.Component { } data-test-id="description" type="textarea" + groupClassName="no-bottom-margin" /> </GridItem> </GridSection> diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/SoftwareProductComponentsImageActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/SoftwareProductComponentsImageActionHelper.js index 3f661b76fe..38ee2ae610 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/SoftwareProductComponentsImageActionHelper.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/SoftwareProductComponentsImageActionHelper.js @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 RestAPIUtil from 'nfvo-utils/RestAPIUtil.js'; import i18n from 'nfvo-utils/i18n/i18n.js'; @@ -199,7 +199,7 @@ const SoftwareProductComponentImagesActionHelper = { modalComponentName: modalContentMapper.SOFTWARE_PRODUCT_COMPONENT_IMAGE_EDITOR, title: title, - modalClassName: className, + bodyClassName: className, modalComponentProps: { softwareProductId, componentId, diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/SoftwareProductComponentsImageEditorView.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/SoftwareProductComponentsImageEditorView.jsx index 3670ab910d..e4eccc6a39 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/SoftwareProductComponentsImageEditorView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/images/SoftwareProductComponentsImageEditorView.jsx @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 from 'react'; import PropTypes from 'prop-types'; @@ -55,6 +55,7 @@ class SoftwareProductComponentsImageEditorView extends React.Component { this.form = form; }} hasButtons={true} + btnClassName="sdc-modal__footer" onSubmit={() => this.submit()} onReset={() => onCancel()} labledButtons={true} diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/NICCreation/NICCreationActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/NICCreation/NICCreationActionHelper.js index 4f200ce33f..2595d9c2cb 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/NICCreation/NICCreationActionHelper.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/NICCreation/NICCreationActionHelper.js @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 { actionTypes } from '../SoftwareProductComponentsNetworkConstants'; import i18n from 'nfvo-utils/i18n/i18n.js'; @@ -19,10 +19,7 @@ import { actionTypes as modalActionTypes } from 'nfvo-components/modal/GlobalMod import { modalContentMapper } from 'sdc-app/common/modal/ModalContentMapper.js'; export default { - open( - dispatch, - { softwareProductId, componentId, modalClassName, version } - ) { + open(dispatch, { softwareProductId, componentId, version }) { dispatch({ type: actionTypes.NICCreation.OPEN }); @@ -32,7 +29,6 @@ export default { data: { modalComponentName: modalContentMapper.NIC_CREATION, title: i18n('Create NEW NIC'), - modalClassName, modalComponentProps: { softwareProductId, componentId, version } } }); diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/NICCreation/NICCreationView.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/NICCreation/NICCreationView.jsx index 6789ba4816..133703a8a8 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/NICCreation/NICCreationView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/NICCreation/NICCreationView.jsx @@ -4,9 +4,9 @@ * 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. @@ -59,7 +59,7 @@ class NICCreationView extends React.Component { } = this.props; let { name, description, networkDescription } = data; return ( - <div> + <div className="network-nic-modal-create"> {genericFieldInfo && ( <Form hasButtons={true} @@ -71,7 +71,8 @@ class NICCreationView extends React.Component { labledButtons={true} isValid={isFormValid} onValidateForm={this.validate} - formReady={formReady}> + formReady={formReady} + btnClassName="sdc-modal__footer"> <GridSection hasLastColSet> <GridItem colSpan={4} lastColInRow> <Input diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNICEditor.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNICEditor.js index d7205b46ed..e6a485adca 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNICEditor.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNICEditor.js @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 { connect } from 'react-redux'; import SoftwareProductComponentsNetworkActionHelper from './SoftwareProductComponentsNetworkActionHelper.js'; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNICEditorView.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNICEditorView.jsx index df2efbe39e..0116bb2d3f 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNICEditorView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNICEditorView.jsx @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 from 'react'; import Form from 'nfvo-components/input/validation/Form.jsx'; @@ -63,6 +63,7 @@ class SoftwareProductComponentsNetworkEditorView extends React.Component { this.form = form; }} hasButtons={true} + btnClassName="sdc-modal__footer" onSubmit={() => this.submit()} onReset={() => onCancel()} labledButtons={true} diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNetworkActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNetworkActionHelper.js index 58c816134b..3c09fae728 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNetworkActionHelper.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNetworkActionHelper.js @@ -1,24 +1,27 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 RestAPIUtil from 'nfvo-utils/RestAPIUtil.js'; import Configuration from 'sdc-app/config/Configuration.js'; import i18n from 'nfvo-utils/i18n/i18n.js'; import { actionTypes } from './SoftwareProductComponentsNetworkConstants.js'; -import { actionTypes as GlobalModalActions } from 'nfvo-components/modal/GlobalModalConstants.js'; +import { + actionTypes as GlobalModalActions, + modalSizes +} from 'nfvo-components/modal/GlobalModalConstants.js'; import { modalContentMapper as modalPagesMapper } from 'sdc-app/common/modal/ModalContentMapper.js'; import ValidationHelper from 'sdc-app/common/helpers/ValidationHelper.js'; import { NIC_QUESTIONNAIRE } from 'sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNetworkConstants.js'; @@ -125,7 +128,6 @@ const SoftwareProductComponentNetworkActionHelper = { softwareProductId, componentId, isReadOnlyMode, - modalClassName, version } ) { @@ -136,12 +138,12 @@ const SoftwareProductComponentNetworkActionHelper = { dispatch({ type: GlobalModalActions.GLOBAL_MODAL_SHOW, data: { - modalClassName, modalComponentProps: { softwareProductId, componentId, isReadOnlyMode, - version + version, + size: modalSizes.LARGE }, modalComponentName: modalPagesMapper.NIC_EDITOR, title: i18n('Edit NIC') diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNetworkList.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNetworkList.js index ac708524cf..db3c767c19 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNetworkList.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNetworkList.js @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 { connect } from 'react-redux'; import i18n from 'nfvo-utils/i18n/i18n.js'; @@ -71,7 +71,6 @@ const mapActionsToProps = ( NICCreationActionHelper.open(dispatch, { softwareProductId, componentId, - modalClassName: 'network-nic-modal-create', version }), onDeleteNic: nic => @@ -119,7 +118,6 @@ const mapActionsToProps = ( isReadOnlyMode, softwareProductId, componentId, - modalClassName: 'network-nic-modal-edit', version } ) diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/NameAndPurpose.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/NameAndPurpose.jsx index 634b43f616..1019e9488b 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/NameAndPurpose.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/NameAndPurpose.jsx @@ -4,9 +4,9 @@ * 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. @@ -56,9 +56,9 @@ const NameAndPurpose = ({ ); }; -NameAndPurpose.PropTypes = { +NameAndPurpose.propTypes = { name: PropTypes.string, - description: PropTypes.array, + description: PropTypes.string, onDataChanged: PropTypes.func, isReadOnlyMode: PropTypes.bool }; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/Network.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/Network.jsx index c440d2fbd3..904df4a856 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/Network.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/Network.jsx @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 from 'react'; import PropTypes from 'prop-types'; @@ -83,7 +83,7 @@ const Network = ({ ); }; -Network.PropTypes = { +Network.propTypes = { networkValues: PropTypes.array }; 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 070ac816ad..8f8d143f32 100644 --- 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 @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 from 'react'; import PropTypes from 'prop-types'; @@ -43,7 +43,7 @@ const PointerInput = ({ ); }; -PointerInput.PropTypes = { +PointerInput.propTypes = { label: PropTypes.string, value: PropTypes.string }; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/Protocols.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/Protocols.jsx index eb762b11b2..b2cda4f649 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/Protocols.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/Protocols.jsx @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 from 'react'; import PropTypes from 'prop-types'; @@ -93,9 +93,9 @@ const Protocols = ({ ); }; -Protocols.PropTypes = { +Protocols.propTypes = { protocols: PropTypes.array, - onQDataChanged: PropTypes.function, + onQDataChanged: PropTypes.func, dataMap: PropTypes.object, qgenericFieldInfo: PropTypes.object }; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentProcessesActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentProcessesActionHelper.js index 52c5cdde3d..5422174f26 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentProcessesActionHelper.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentProcessesActionHelper.js @@ -1,21 +1,27 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 RestAPIUtil from 'nfvo-utils/RestAPIUtil.js'; import Configuration from 'sdc-app/config/Configuration.js'; import { actionTypes } from './SoftwareProductComponentProcessesConstants.js'; +import i18n from 'nfvo-utils/i18n/i18n.js'; +import { + actionTypes as modalActionTypes, + modalSizes +} from 'nfvo-components/modal/GlobalModalConstants.js'; +import { modalContentMapper } from 'sdc-app/common/modal/ModalContentMapper.js'; function baseUrl(softwareProductId, version, componentId) { const restPrefix = Configuration.get('restPrefix'); @@ -182,16 +188,39 @@ const SoftwareProductComponentProcessesActionHelper = { }); }, - openEditor(dispatch, process = {}) { + openEditor( + dispatch, + { process, softwareProductId, version, isReadOnlyMode, componentId } + ) { dispatch({ type: actionTypes.SOFTWARE_PRODUCT_PROCESS_COMPONENTS_EDITOR_OPEN, - process + process: process ? process : {} + }); + dispatch({ + type: modalActionTypes.GLOBAL_MODAL_SHOW, + data: { + modalComponentName: modalContentMapper.COMP_PROCESS_EDITOR, + modalComponentProps: { + version, + softwareProductId, + isReadOnlyMode, + componentId, + size: modalSizes.LARGE + }, + bodyClassName: 'edit-process-modal', + title: process + ? i18n('Edit Process Details') + : i18n('Create New Process Details') + } }); }, closeEditor(dispatch) { dispatch({ type: actionTypes.SOFTWARE_PRODUCT_PROCESS_COMPONENTS_EDITOR_CLOSE }); + dispatch({ + type: modalActionTypes.GLOBAL_MODAL_CLOSE + }); } }; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentProcessesList.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentProcessesList.js index cb6d25a6ac..3ab0b2045c 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentProcessesList.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentProcessesList.js @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 { connect } from 'react-redux'; import i18n from 'nfvo-utils/i18n/i18n.js'; @@ -28,15 +28,12 @@ export const mapStateToProps = ({ softwareProduct }) => { }, softwareProductComponents: { componentProcesses = {} } } = softwareProduct; - let { processesList = [], processesEditor = {} } = componentProcesses; - let { data } = processesEditor; + let { processesList = [] } = componentProcesses; return { currentSoftwareProduct, isValidityData, - processesList, - isDisplayModal: Boolean(data), - isModalInEditMode: Boolean(data && data.id) + processesList }; }; @@ -46,12 +43,20 @@ const mapActionsToProps = ( ) => { return { onAddProcess: () => - SoftwareProductComponentProcessesActionHelper.openEditor(dispatch), - onEditProcess: process => - SoftwareProductComponentProcessesActionHelper.openEditor( - dispatch, - process - ), + SoftwareProductComponentProcessesActionHelper.openEditor(dispatch, { + isReadOnlyMode: false, + componentId, + softwareProductId, + version + }), + onEditProcess: (process, isReadOnlyMode) => + SoftwareProductComponentProcessesActionHelper.openEditor(dispatch, { + process, + isReadOnlyMode, + componentId, + softwareProductId, + version + }), onDeleteProcess: process => dispatch({ type: modalActionTypes.GLOBAL_MODAL_WARNING, diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentsProcessesListView.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentsProcessesListView.jsx index 8fa2bffb27..fe6b8a86de 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentsProcessesListView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentsProcessesListView.jsx @@ -1,23 +1,21 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 from 'react'; import PropTypes from 'prop-types'; import i18n from 'nfvo-utils/i18n/i18n.js'; -import Modal from 'nfvo-components/modal/Modal.jsx'; -import SoftwareProductProcessesEditor from './SoftwareProductComponentProcessesEditor.js'; import SoftwareProductProcessListView from 'sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcessListView.jsx'; class SoftwareProductProcessesView extends React.Component { @@ -42,7 +40,6 @@ class SoftwareProductProcessesView extends React.Component { <div className="vsp-processes-page"> <div className="software-product-view"> <div className="software-product-landing-view-right-side vsp-components-processes-page flex-column"> - {this.renderEditor()} <SoftwareProductProcessListView addButtonTitle={i18n( 'Add Component Process Details' @@ -54,40 +51,6 @@ class SoftwareProductProcessesView extends React.Component { </div> ); } - - renderEditor() { - let { - softwareProductId, - version, - componentId, - isReadOnlyMode, - isDisplayModal, - isModalInEditMode - } = this.props; - return ( - <Modal - show={isDisplayModal} - bsSize="large" - animation={true} - className="onborading-modal"> - <Modal.Header> - <Modal.Title> - {isModalInEditMode - ? i18n('Edit Process Details') - : i18n('Create New Process Details')} - </Modal.Title> - </Modal.Header> - <Modal.Body className="edit-process-modal"> - <SoftwareProductProcessesEditor - componentId={componentId} - softwareProductId={softwareProductId} - version={version} - isReadOnlyMode={isReadOnlyMode} - /> - </Modal.Body> - </Modal> - ); - } } export default SoftwareProductProcessesView; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationView.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationView.jsx index c9693d4f93..e4a9893f61 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/creation/SoftwareProductCreationView.jsx @@ -81,6 +81,7 @@ class SoftwareProductCreationView extends React.Component { isValid={this.props.isFormValid} submitButtonText={i18n('Create')} formReady={this.props.formReady} + btnClassName="sdc-modal__footer" onValidateForm={() => this.validate()}> <GridSection hasLastColSet> <GridItem colSpan="2"> @@ -321,6 +322,7 @@ const OnboardingProcedure = ({ } type="radio" data-test-id="new-vsp-creation-procedure-manual" + groupClassName="no-bottom-margin" /> </GridItem> </GridSection> diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/SoftwareProductDeploymentActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/SoftwareProductDeploymentActionHelper.js index 44b25311e0..769596ea8d 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/SoftwareProductDeploymentActionHelper.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/SoftwareProductDeploymentActionHelper.js @@ -1,3 +1,18 @@ +/* + * Copyright © 2016-2018 European Support Limited + * + * 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 { actionTypes } from './SoftwareProductDeploymentConstants.js'; import { actionTypes as GlobalModalActions } from 'nfvo-components/modal/GlobalModalConstants.js'; import { modalContentMapper } from 'sdc-app/common/modal/ModalContentMapper.js'; @@ -171,7 +186,7 @@ const SoftwareProductDeploymentActionHelper = { data: { modalComponentName: modalContentMapper.DEPLOYMENT_FLAVOR_EDITOR, modalComponentProps: { softwareProductId, version }, - modalClassName, + bodyClassName: modalClassName, title: isEdit ? 'Edit Deployment Flavor' : 'Create a New Deployment Flavor' diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/editor/SoftwareProductDeploymentEditorView.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/editor/SoftwareProductDeploymentEditorView.jsx index e44d2bd966..fd575693ac 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/editor/SoftwareProductDeploymentEditorView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/editor/SoftwareProductDeploymentEditorView.jsx @@ -1,3 +1,18 @@ +/* + * Copyright © 2016-2018 European Support Limited + * + * 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 from 'react'; import i18n from 'nfvo-utils/i18n/i18n.js'; import Input from 'nfvo-components/input/validation/Input.jsx'; @@ -46,7 +61,8 @@ export default class SoftwareProductDeploymentEditorView extends React.Component onValidateForm={() => this.validate()} isValid={this.props.isFormValid} formReady={this.props.formReady} - className="vsp-deployment-editor"> + className="vsp-deployment-editor" + btnClassName="sdc-modal__footer"> <GridSection hasLastColSet> <GridItem colSpan={1}> <Input diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcessListView.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcessListView.jsx index cee46abc69..5f1cdb56e6 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcessListView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcessListView.jsx @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 from 'react'; import PropTypes from 'prop-types'; @@ -66,7 +66,7 @@ class SoftwareProductProcessesListView extends React.Component { key={id} className="list-editor-item-view" isReadOnlyMode={isReadOnlyMode} - onSelect={() => onEditProcess(process)} + onSelect={() => onEditProcess(process, isReadOnlyMode)} onDelete={() => onDeleteProcess(process, version)}> <div className="list-editor-item-view-field"> <div className="title">{i18n('Name')}</div> diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcesses.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcesses.js index fb44530dae..e00cafb64a 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcesses.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcesses.js @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 { connect } from 'react-redux'; import i18n from 'nfvo-utils/i18n/i18n.js'; @@ -38,9 +38,18 @@ export const mapStateToProps = ({ softwareProduct }) => { const mapActionsToProps = (dispatch, { softwareProductId, version }) => { return { onAddProcess: () => - SoftwareProductProcessesActionHelper.openEditor(dispatch), - onEditProcess: process => - SoftwareProductProcessesActionHelper.openEditor(dispatch, process), + SoftwareProductProcessesActionHelper.openEditor(dispatch, { + softwareProductId, + version, + isReadOnlyMode: false + }), + onEditProcess: (process, isReadOnlyMode) => + SoftwareProductProcessesActionHelper.openEditor(dispatch, { + process, + softwareProductId, + version, + isReadOnlyMode + }), onDeleteProcess: process => dispatch({ type: modalActionTypes.GLOBAL_MODAL_WARNING, diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcessesActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcessesActionHelper.js index 7c72c5b892..0e586100b3 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcessesActionHelper.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcessesActionHelper.js @@ -1,21 +1,27 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 { actionTypes } from './SoftwareProductProcessesConstants.js'; import RestAPIUtil from 'nfvo-utils/RestAPIUtil.js'; import Configuration from 'sdc-app/config/Configuration.js'; +import i18n from 'nfvo-utils/i18n/i18n.js'; +import { + actionTypes as modalActionTypes, + modalSizes +} from 'nfvo-components/modal/GlobalModalConstants.js'; +import { modalContentMapper } from 'sdc-app/common/modal/ModalContentMapper.js'; function baseUrl(vspId, version) { let { id: versionId } = version; @@ -73,10 +79,29 @@ const SoftwareProductActionHelper = { }); }); }, - openEditor(dispatch, process = {}) { + openEditor( + dispatch, + { process, softwareProductId, version, isReadOnlyMode } + ) { dispatch({ type: actionTypes.SOFTWARE_PRODUCT_PROCESS_EDITOR_OPEN, - process + process: process ? process : {} + }); + dispatch({ + type: modalActionTypes.GLOBAL_MODAL_SHOW, + data: { + modalComponentName: modalContentMapper.PROCESS_EDITOR, + modalComponentProps: { + version, + softwareProductId, + isReadOnlyMode, + size: modalSizes.LARGE + }, + bodyClassName: 'edit-process-modal', + title: process + ? i18n('Edit Process Details') + : i18n('Create New Process Details') + } }); }, @@ -95,6 +120,9 @@ const SoftwareProductActionHelper = { dispatch({ type: actionTypes.SOFTWARE_PRODUCT_PROCESS_EDITOR_CLOSE }); + dispatch({ + type: modalActionTypes.GLOBAL_MODAL_CLOSE + }); }, saveProcess( diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcessesEditorForm.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcessesEditorForm.jsx index 6e8254f65b..a858e0f07e 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcessesEditorForm.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcessesEditorForm.jsx @@ -1,12 +1,12 @@ /* - * Copyright © 2016-2017 European Support Limited + * Copyright © 2016-2018 European Support Limited * * 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. @@ -70,7 +70,8 @@ class SoftwareProductProcessesEditorForm extends React.Component { isValid={this.props.isFormValid} formReady={this.props.formReady} onValidateForm={() => this.props.onValidateForm()} - className="vsp-processes-editor"> + className="vsp-processes-editor" + btnClassName="sdc-modal__footer"> <div className={`vsp-processes-editor-data${ isReadOnlyMode ? ' disabled' : '' @@ -129,7 +130,7 @@ class SoftwareProductProcessesEditorForm extends React.Component { <GridItem colSpan={2}> <Input name="vsp-process-description" - groupClassName="vsp-process-description" + groupClassName="vsp-process-description no-bottom-margin" onChange={description => onDataChanged({ description }) } @@ -169,6 +170,7 @@ class SoftwareProductProcessesEditorForm extends React.Component { label={i18n('Process Type')} className="process-type" data-test-id="process-type" + groupClassName="no-bottom-margin" isValid={ genericFieldInfo.type.isValid } diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcessesView.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcessesView.jsx index 1357c31e12..50421bc824 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcessesView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcessesView.jsx @@ -1,12 +1,12 @@ /* - * Copyright © 2016-2017 European Support Limited + * Copyright © 2016-2018 European Support Limited * * 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. @@ -16,8 +16,6 @@ import React from 'react'; import PropTypes from 'prop-types'; import i18n from 'nfvo-utils/i18n/i18n.js'; -import Modal from 'nfvo-components/modal/Modal.jsx'; -import SoftwareProductProcessesEditor from './SoftwareProductProcessesEditor.js'; import SoftwareProductProcessListView from './SoftwareProductProcessListView.jsx'; class SoftwareProductProcessesView extends React.Component { @@ -37,7 +35,6 @@ class SoftwareProductProcessesView extends React.Component { render() { return ( <div className="software-product-landing-view-right-side vsp-processes-page"> - {this.renderEditor()} <SoftwareProductProcessListView addButtonTitle={i18n('Add Process Details')} {...this.props} @@ -45,38 +42,6 @@ class SoftwareProductProcessesView extends React.Component { </div> ); } - - renderEditor() { - let { - currentSoftwareProduct: { id }, - version, - isModalInEditMode, - isReadOnlyMode, - isDisplayEditor - } = this.props; - return ( - <Modal - show={isDisplayEditor} - bsSize="large" - animation={true} - className="onborading-modal"> - <Modal.Header> - <Modal.Title> - {isModalInEditMode - ? i18n('Edit Process Details') - : i18n('Create New Process Details')} - </Modal.Title> - </Modal.Header> - <Modal.Body className="edit-process-modal"> - <SoftwareProductProcessesEditor - softwareProductId={id} - version={version} - isReadOnlyMode={isReadOnlyMode} - /> - </Modal.Body> - </Modal> - ); - } } export default SoftwareProductProcessesView; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/vnfMarketPlace/VNFImportView.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/vnfMarketPlace/VNFImportView.jsx index 3a90c8042f..a33e0ede10 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/vnfMarketPlace/VNFImportView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/vnfMarketPlace/VNFImportView.jsx @@ -245,7 +245,7 @@ class VNFImportView extends React.Component { <Button className="vnf-submit" type="button" - btnType="default" + btnType="primary" onClick={() => onSubmit( this.state.selectedRow, @@ -257,7 +257,7 @@ class VNFImportView extends React.Component { <Button className="Cancel" type="button" - btnType="outline" + btnType="secondary" onClick={onCancel}> {i18n('Cancel')} </Button> diff --git a/openecomp-ui/src/sdc-app/onboarding/versionsPage/VersionsPageActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/versionsPage/VersionsPageActionHelper.js index afbb056686..8087dceca0 100644 --- a/openecomp-ui/src/sdc-app/onboarding/versionsPage/VersionsPageActionHelper.js +++ b/openecomp-ui/src/sdc-app/onboarding/versionsPage/VersionsPageActionHelper.js @@ -80,7 +80,7 @@ const VersionsPageActionHelper = { dispatch({ type: modalActionTypes.GLOBAL_MODAL_CLOSE }), - modalClassName: 'versions-tree-modal', + bodyClassName: 'versions-tree-modal', cancelButtonText: i18n('Close'), title: i18n('Version Tree') } diff --git a/openecomp-ui/src/sdc-app/onboarding/versionsPage/creation/VersionsPageCreationView.jsx b/openecomp-ui/src/sdc-app/onboarding/versionsPage/creation/VersionsPageCreationView.jsx index ba92d26067..da5f3be812 100644 --- a/openecomp-ui/src/sdc-app/onboarding/versionsPage/creation/VersionsPageCreationView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/versionsPage/creation/VersionsPageCreationView.jsx @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * 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 + * 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. + * 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 from 'react'; import PropTypes from 'prop-types'; @@ -53,6 +53,7 @@ class VersionsPageCreationView extends React.Component { (this.validationForm = validationForm) } hasButtons={true} + btnClassName="sdc-modal__footer" onSubmit={() => this.submit()} submitButtonText={i18n('Create')} onReset={() => onCancel()} @@ -101,6 +102,7 @@ class VersionsPageCreationView extends React.Component { onDataChanged({ description }) } isRequired + groupClassName="no-bottom-margin" /> </div> </Form> @@ -129,112 +131,3 @@ class VersionsPageCreationView extends React.Component { } export default VersionsPageCreationView; - -/* - <div className='software-product-inline-section'> - <Input - value={name} - label={i18n('Name')} - isRequired={true} - onChange={name => onDataChanged({name},V_CREATION_FORM_NAME, {name: name => this.validateName(name)})} - isValid={genericFieldInfo.name.isValid} - errorText={genericFieldInfo.name.errorText} - type='text' - className='field-section' - data-test-id='new-vsp-name' /> - <Input - label={i18n('Vendor')} - type='select' - value={vendorId} - isRequired={true} - disabled={disableVendor} - onChange={e => this.onSelectVendor(e)} - isValid={genericFieldInfo.vendorId.isValid} - errorText={genericFieldInfo.vendorId.errorText} - className='input-options-select' - groupClassName='bootstrap-input-options' - data-test-id='new-vsp-vendor' > - {vendorList.map(vendor => - <option key={vendor.title} value={vendor.enum}>{vendor.title}</option>)} - </Input> - <Input - label={i18n('Category')} - type='select' - value={subCategory} - isRequired={true} - onChange={e => this.onSelectSubCategory(e)} - isValid={genericFieldInfo.subCategory.isValid} - errorText={genericFieldInfo.subCategory.errorText} - className='input-options-select' - groupClassName='bootstrap-input-options' - data-test-id='new-vsp-category' > - <option key='' value=''>{i18n('please select…')}</option> - {softwareProductCategories.map(category => - category.subcategories && - <optgroup - key={category.name} - label={category.name}>{category.subcategories.map(sub => - <option key={sub.uniqueId} value={sub.uniqueId}>{`${sub.name} (${category.name})`}</option>)} - </optgroup>) - } - </Input> - </div> - <div className='software-product-inline-section'> - <Input - value={description} - label={i18n('Description')} - isRequired={true} - overlayPos='bottom' - onChange={description => onDataChanged({description},V_CREATION_FORM_NAME)} - isValid={genericFieldInfo.description.isValid} - errorText={genericFieldInfo.description.errorText} - type='textarea' - className='field-section' - data-test-id='new-vsp-description' /> - </div> - </div> - </Form>} - </div> - ); - } - - getAvailableMethodsList() { - let {availableMethods} = this.props; - return [...availableMethods]; - } - - onSelectVendor(e) { - const selectedIndex = e.target.selectedIndex; - const vendorId = e.target.options[selectedIndex].value; - this.props.onDataChanged({vendorId},V_CREATION_FORM_NAME); - } - - onSelectSubCategory(e) { - const selectedIndex = e.target.selectedIndex; - const subCategory = e.target.options[selectedIndex].value; - let {softwareProductCategories, onDataChanged} = this.props; - let category = SoftwareProductCategoriesHelper.getCurrentCategoryOfSubCategory(subCategory, softwareProductCategories); - onDataChanged({category, subCategory},V_CREATION_FORM_NAME); - } - - submit() { - let {data:softwareProduct, finalizedLicenseModelList} = this.props; - softwareProduct.vendorName = finalizedLicenseModelList.find(vendor => vendor.id === softwareProduct.vendorId).name; - this.props.onSubmit(softwareProduct); - } - - validateName(value) { - const {data: {id}, VSPNames} = this.props; - const isExists = Validator.isItemNameAlreadyExistsInList({itemId: id, itemName: value, list: VSPNames}); - - return !isExists ? {isValid: true, errorText: ''} : - {isValid: false, errorText: i18n('Software product by the name \'' + value + '\' already exists. Software product name must be unique')}; - } - - validate() { - this.props.onValidateForm(SP_CREATION_FORM_NAME); - } -} - -export default SoftwareProductCreationView; -*/ diff --git a/openecomp-ui/src/sdc-app/sdc.app.jsx b/openecomp-ui/src/sdc-app/sdc.app.jsx index b759ffd259..af955daa0b 100644 --- a/openecomp-ui/src/sdc-app/sdc.app.jsx +++ b/openecomp-ui/src/sdc-app/sdc.app.jsx @@ -1,12 +1,12 @@ /* - * Copyright © 2016-2017 European Support Limited + * Copyright © 2016-2018 European Support Limited * * 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. |