From 7fdf733a64670fceefc3ded35cfa581e1c458179 Mon Sep 17 00:00:00 2001 From: Einav Weiss Keidar Date: Tue, 20 Mar 2018 14:45:40 +0200 Subject: Adding Prettier and fixing up eslint version Issue-ID: SDC-1094 Change-Id: Ie83ad95a03899345dd90235daf0323cbe3bc6afd Signed-off-by: Einav Weiss Keidar --- .../deployment/SoftwareProductDeployment.js | 85 +++-- .../SoftwareProductDeploymentActionHelper.js | 232 +++++++++----- .../SoftwareProductDeploymentConstants.js | 12 +- .../SoftwareProductDeploymentListReducer.js | 14 +- .../deployment/SoftwareProductDeploymentView.jsx | 136 ++++---- .../editor/SoftwareProductDeploymentEditor.js | 144 +++++---- .../SoftwareProductDeploymentEditorReducer.js | 57 ++-- .../editor/SoftwareProductDeploymentEditorView.jsx | 351 ++++++++++++++------- 8 files changed, 649 insertions(+), 382 deletions(-) (limited to 'openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment') diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/SoftwareProductDeployment.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/SoftwareProductDeployment.js index a5c70068b0..4e03926ac5 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/SoftwareProductDeployment.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/SoftwareProductDeployment.js @@ -13,37 +13,70 @@ * or implied. See the License for the specific language governing * permissions and limitations under the License. */ -import {connect} from 'react-redux'; +import { connect } from 'react-redux'; import SoftwareProductDeploymentView from './SoftwareProductDeploymentView.jsx'; import SoftwareProductDeploymentActionHelper from './SoftwareProductDeploymentActionHelper.js'; import i18n from 'nfvo-utils/i18n/i18n.js'; -import {actionTypes as modalActionTypes} from 'nfvo-components/modal/GlobalModalConstants.js'; +import { actionTypes as modalActionTypes } from 'nfvo-components/modal/GlobalModalConstants.js'; -export function mapStateToProps({softwareProduct}) { - let {softwareProductComponents: {componentsList}, softwareProductDeployment: {deploymentFlavors}} = softwareProduct; - return { - deploymentFlavors, - componentsList - }; +export function mapStateToProps({ softwareProduct }) { + let { + softwareProductComponents: { componentsList }, + softwareProductDeployment: { deploymentFlavors } + } = softwareProduct; + return { + deploymentFlavors, + componentsList + }; } -function mapActionToProps(dispatch, {softwareProductId, version}) { - let modalClassName = 'deployment-flavor-editor'; - return { - onAddDeployment: componentsList => SoftwareProductDeploymentActionHelper.openDeploymentFlavorEditor(dispatch, {softwareProductId, modalClassName, componentsList, version}), - onDeleteDeployment: ({id, model}) => dispatch({ - type: modalActionTypes.GLOBAL_MODAL_WARNING, - data:{ - msg: i18n('Are you sure you want to delete "{model}"?', {model: model}), - onConfirmed: () => SoftwareProductDeploymentActionHelper.deleteDeploymentFlavor(dispatch, {softwareProductId, deploymentFlavorId: id, version}) - } - }), - onEditDeployment: (deploymentFlavor, componentsList) => - SoftwareProductDeploymentActionHelper.fetchDeploymentFlavor({softwareProductId, deploymentFlavorId: deploymentFlavor.id, version}).then(response => - SoftwareProductDeploymentActionHelper - .openDeploymentFlavorEditor(dispatch, {softwareProductId, componentsList, modalClassName, deploymentFlavor: {...response.data, id: response.id}, isEdit: true, version}), - ) - }; +function mapActionToProps(dispatch, { softwareProductId, version }) { + let modalClassName = 'deployment-flavor-editor'; + return { + onAddDeployment: componentsList => + SoftwareProductDeploymentActionHelper.openDeploymentFlavorEditor( + dispatch, + { softwareProductId, modalClassName, componentsList, version } + ), + onDeleteDeployment: ({ id, model }) => + dispatch({ + type: modalActionTypes.GLOBAL_MODAL_WARNING, + data: { + msg: i18n('Are you sure you want to delete "{model}"?', { + model: model + }), + onConfirmed: () => + SoftwareProductDeploymentActionHelper.deleteDeploymentFlavor( + dispatch, + { + softwareProductId, + deploymentFlavorId: id, + version + } + ) + } + }), + onEditDeployment: (deploymentFlavor, componentsList) => + SoftwareProductDeploymentActionHelper.fetchDeploymentFlavor({ + softwareProductId, + deploymentFlavorId: deploymentFlavor.id, + version + }).then(response => + SoftwareProductDeploymentActionHelper.openDeploymentFlavorEditor( + dispatch, + { + softwareProductId, + componentsList, + modalClassName, + deploymentFlavor: { ...response.data, id: response.id }, + isEdit: true, + version + } + ) + ) + }; } -export default connect(mapStateToProps, mapActionToProps, null, {withRef: true})(SoftwareProductDeploymentView); +export default connect(mapStateToProps, mapActionToProps, null, { + withRef: true +})(SoftwareProductDeploymentView); 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 bd802b38f4..44b25311e0 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/SoftwareProductDeploymentActionHelper.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/SoftwareProductDeploymentActionHelper.js @@ -1,101 +1,183 @@ -import {actionTypes} from './SoftwareProductDeploymentConstants.js'; -import {actionTypes as GlobalModalActions} from 'nfvo-components/modal/GlobalModalConstants.js'; -import {modalContentMapper} from 'sdc-app/common/modal/ModalContentMapper.js'; +import { actionTypes } from './SoftwareProductDeploymentConstants.js'; +import { actionTypes as GlobalModalActions } from 'nfvo-components/modal/GlobalModalConstants.js'; +import { modalContentMapper } from 'sdc-app/common/modal/ModalContentMapper.js'; import RestAPIUtil from 'nfvo-utils/RestAPIUtil.js'; import Configuration from 'sdc-app/config/Configuration.js'; import pickBy from 'lodash/pickBy'; function baseUrl(vspId, version) { - const versionId = version.id; - const restPrefix = Configuration.get('restPrefix'); - return `${restPrefix}/v1.0/vendor-software-products/${vspId}/versions/${versionId}/deployment-flavors`; + const versionId = version.id; + const restPrefix = Configuration.get('restPrefix'); + return `${restPrefix}/v1.0/vendor-software-products/${vspId}/versions/${versionId}/deployment-flavors`; } -function fetchDeploymentFlavorsList({softwareProductId, version}) { - return RestAPIUtil.fetch(`${baseUrl(softwareProductId, version)}`); +function fetchDeploymentFlavorsList({ softwareProductId, version }) { + return RestAPIUtil.fetch(`${baseUrl(softwareProductId, version)}`); } -function fetchDeploymentFlavor({softwareProductId, deploymentFlavorId, version}) { - return RestAPIUtil.fetch(`${baseUrl(softwareProductId, version)}/${deploymentFlavorId}`); +function fetchDeploymentFlavor({ + softwareProductId, + deploymentFlavorId, + version +}) { + return RestAPIUtil.fetch( + `${baseUrl(softwareProductId, version)}/${deploymentFlavorId}` + ); } -function deleteDeploymentFlavor({softwareProductId, deploymentFlavorId, version}) { - return RestAPIUtil.destroy(`${baseUrl(softwareProductId, version)}/${deploymentFlavorId}`); +function deleteDeploymentFlavor({ + softwareProductId, + deploymentFlavorId, + version +}) { + return RestAPIUtil.destroy( + `${baseUrl(softwareProductId, version)}/${deploymentFlavorId}` + ); } -function createDeploymentFlavor({softwareProductId, data, version}) { - return RestAPIUtil.post(`${baseUrl(softwareProductId, version)}`, data); +function createDeploymentFlavor({ softwareProductId, data, version }) { + return RestAPIUtil.post(`${baseUrl(softwareProductId, version)}`, data); } -function editDeploymentFlavor({softwareProductId, deploymentFlavorId, data, version}) { - return RestAPIUtil.put(`${baseUrl(softwareProductId, version)}/${deploymentFlavorId}`, data); +function editDeploymentFlavor({ + softwareProductId, + deploymentFlavorId, + data, + version +}) { + return RestAPIUtil.put( + `${baseUrl(softwareProductId, version)}/${deploymentFlavorId}`, + data + ); } const SoftwareProductDeploymentActionHelper = { - fetchDeploymentFlavorsList(dispatch, {softwareProductId, version}) { - return fetchDeploymentFlavorsList({softwareProductId, version}).then(response => { - dispatch({ - type: actionTypes.FETCH_SOFTWARE_PRODUCT_DEPLOYMENT_FLAVORS, - deploymentFlavors: response.results - }); - }); - }, + fetchDeploymentFlavorsList(dispatch, { softwareProductId, version }) { + return fetchDeploymentFlavorsList({ softwareProductId, version }).then( + response => { + dispatch({ + type: actionTypes.FETCH_SOFTWARE_PRODUCT_DEPLOYMENT_FLAVORS, + deploymentFlavors: response.results + }); + } + ); + }, - fetchDeploymentFlavor({softwareProductId, deploymentFlavorId, version}) { - return fetchDeploymentFlavor({softwareProductId, deploymentFlavorId, version}); - }, + fetchDeploymentFlavor({ softwareProductId, deploymentFlavorId, version }) { + return fetchDeploymentFlavor({ + softwareProductId, + deploymentFlavorId, + version + }); + }, - deleteDeploymentFlavor(dispatch, {softwareProductId, deploymentFlavorId, version}) { - return deleteDeploymentFlavor({softwareProductId, deploymentFlavorId, version}).then(() => { - return SoftwareProductDeploymentActionHelper.fetchDeploymentFlavorsList(dispatch, {softwareProductId, version}); - }); - }, + deleteDeploymentFlavor( + dispatch, + { softwareProductId, deploymentFlavorId, version } + ) { + return deleteDeploymentFlavor({ + softwareProductId, + deploymentFlavorId, + version + }).then(() => { + return SoftwareProductDeploymentActionHelper.fetchDeploymentFlavorsList( + dispatch, + { softwareProductId, version } + ); + }); + }, - createDeploymentFlavor(dispatch, {softwareProductId, data, version}) { - return createDeploymentFlavor({softwareProductId, data, version}).then(() => { - return SoftwareProductDeploymentActionHelper.fetchDeploymentFlavorsList(dispatch, {softwareProductId, version}); - }); - }, + createDeploymentFlavor(dispatch, { softwareProductId, data, version }) { + return createDeploymentFlavor({ + softwareProductId, + data, + version + }).then(() => { + return SoftwareProductDeploymentActionHelper.fetchDeploymentFlavorsList( + dispatch, + { softwareProductId, version } + ); + }); + }, - editDeploymentFlavor(dispatch, {softwareProductId, deploymentFlavorId, data, version}) { - let dataWithoutId = pickBy(data, (val, key) => key !== 'id'); - return editDeploymentFlavor({softwareProductId, deploymentFlavorId, data: dataWithoutId, version}).then(() => { - return SoftwareProductDeploymentActionHelper.fetchDeploymentFlavorsList(dispatch, {softwareProductId, version}); - }); - }, + editDeploymentFlavor( + dispatch, + { softwareProductId, deploymentFlavorId, data, version } + ) { + let dataWithoutId = pickBy(data, (val, key) => key !== 'id'); + return editDeploymentFlavor({ + softwareProductId, + deploymentFlavorId, + data: dataWithoutId, + version + }).then(() => { + return SoftwareProductDeploymentActionHelper.fetchDeploymentFlavorsList( + dispatch, + { softwareProductId, version } + ); + }); + }, - closeDeploymentFlavorEditor(dispatch) { - dispatch({ - type: actionTypes.deploymentFlavorEditor.SOFTWARE_PRODUCT_DEPLOYMENT_CLEAR_DATA - }); - dispatch({ - type: GlobalModalActions.GLOBAL_MODAL_CLOSE - }); - }, + closeDeploymentFlavorEditor(dispatch) { + dispatch({ + type: + actionTypes.deploymentFlavorEditor + .SOFTWARE_PRODUCT_DEPLOYMENT_CLEAR_DATA + }); + dispatch({ + type: GlobalModalActions.GLOBAL_MODAL_CLOSE + }); + }, - openDeploymentFlavorEditor(dispatch, {softwareProductId, modalClassName, deploymentFlavor = {}, componentsList, isEdit = false, version}) { - let alteredDeploymentFlavor = {...deploymentFlavor}; - if (componentsList.length) { - alteredDeploymentFlavor = {...alteredDeploymentFlavor, componentComputeAssociations: deploymentFlavor.componentComputeAssociations ? - [{...deploymentFlavor.componentComputeAssociations[0], componentId: componentsList[0].id}] - : - [{componentId: componentsList[0].id, computeFlavorId: null}] - }; - } - dispatch({ - type: actionTypes.deploymentFlavorEditor.SOFTWARE_PRODUCT_DEPLOYMENT_FILL_DATA, - deploymentFlavor: alteredDeploymentFlavor - }); - dispatch({ - type: GlobalModalActions.GLOBAL_MODAL_SHOW, - data: { - modalComponentName: modalContentMapper.DEPLOYMENT_FLAVOR_EDITOR, - modalComponentProps: {softwareProductId, version}, - modalClassName, - title: isEdit ? 'Edit Deployment Flavor' : 'Create a New Deployment Flavor' - } - }); - }, + openDeploymentFlavorEditor( + dispatch, + { + softwareProductId, + modalClassName, + deploymentFlavor = {}, + componentsList, + isEdit = false, + version + } + ) { + let alteredDeploymentFlavor = { ...deploymentFlavor }; + if (componentsList.length) { + alteredDeploymentFlavor = { + ...alteredDeploymentFlavor, + componentComputeAssociations: deploymentFlavor.componentComputeAssociations + ? [ + { + ...deploymentFlavor + .componentComputeAssociations[0], + componentId: componentsList[0].id + } + ] + : [ + { + componentId: componentsList[0].id, + computeFlavorId: null + } + ] + }; + } + dispatch({ + type: + actionTypes.deploymentFlavorEditor + .SOFTWARE_PRODUCT_DEPLOYMENT_FILL_DATA, + deploymentFlavor: alteredDeploymentFlavor + }); + dispatch({ + type: GlobalModalActions.GLOBAL_MODAL_SHOW, + data: { + modalComponentName: modalContentMapper.DEPLOYMENT_FLAVOR_EDITOR, + modalComponentProps: { softwareProductId, version }, + modalClassName, + title: isEdit + ? 'Edit Deployment Flavor' + : 'Create a New Deployment Flavor' + } + }); + } }; -export default SoftwareProductDeploymentActionHelper; +export default SoftwareProductDeploymentActionHelper; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/SoftwareProductDeploymentConstants.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/SoftwareProductDeploymentConstants.js index 51469b461c..6c0d3efe38 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/SoftwareProductDeploymentConstants.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/SoftwareProductDeploymentConstants.js @@ -16,13 +16,13 @@ import keyMirror from 'nfvo-utils/KeyMirror.js'; export const actionTypes = keyMirror({ - FETCH_SOFTWARE_PRODUCT_DEPLOYMENT_FLAVORS: null, + FETCH_SOFTWARE_PRODUCT_DEPLOYMENT_FLAVORS: null, - deploymentFlavorEditor: { - DATA_CHANGED: null, - SOFTWARE_PRODUCT_DEPLOYMENT_FILL_DATA: null, - SOFTWARE_PRODUCT_DEPLOYMENT_CLEAR_DATA: null - } + deploymentFlavorEditor: { + DATA_CHANGED: null, + SOFTWARE_PRODUCT_DEPLOYMENT_FILL_DATA: null, + SOFTWARE_PRODUCT_DEPLOYMENT_CLEAR_DATA: null + } }); export const DEPLOYMENT_FLAVORS_FORM_NAME = 'DEPLOYMENT_FLAVORS_FORM_NAME'; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/SoftwareProductDeploymentListReducer.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/SoftwareProductDeploymentListReducer.js index 8eb91e8fcb..31bf09e945 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/SoftwareProductDeploymentListReducer.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/SoftwareProductDeploymentListReducer.js @@ -13,13 +13,13 @@ * or implied. See the License for the specific language governing * permissions and limitations under the License. */ -import {actionTypes} from './SoftwareProductDeploymentConstants.js'; +import { actionTypes } from './SoftwareProductDeploymentConstants.js'; export default (state = [], action) => { - switch (action.type) { - case actionTypes.FETCH_SOFTWARE_PRODUCT_DEPLOYMENT_FLAVORS: - return [...action.deploymentFlavors]; - default: - return state; - } + switch (action.type) { + case actionTypes.FETCH_SOFTWARE_PRODUCT_DEPLOYMENT_FLAVORS: + return [...action.deploymentFlavors]; + default: + return state; + } }; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/SoftwareProductDeploymentView.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/SoftwareProductDeploymentView.jsx index 860d02c343..e1bdd553a6 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/SoftwareProductDeploymentView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/SoftwareProductDeploymentView.jsx @@ -22,74 +22,82 @@ import ListEditorItemView from 'nfvo-components/listEditor/ListEditorItemView.js import ListEditorItemViewField from 'nfvo-components/listEditor/ListEditorItemViewField.jsx'; export default class SoftwareProductDeployment extends React.Component { - state = { - localFilter: '' - }; + state = { + localFilter: '' + }; - static propTypes = { - onAddDeployment: PropTypes.func.isRequired, - onDeleteDeployment: PropTypes.func.isRequired, - onEditDeployment: PropTypes.func.isRequired, - isReadOnlyMode: PropTypes.bool.isRequired - }; + static propTypes = { + onAddDeployment: PropTypes.func.isRequired, + onDeleteDeployment: PropTypes.func.isRequired, + onEditDeployment: PropTypes.func.isRequired, + isReadOnlyMode: PropTypes.bool.isRequired + }; - render() { - return ( -
- {this.renderList()} -
- ); - } + render() { + return
{this.renderList()}
; + } - renderList() { - let {onAddDeployment, isReadOnlyMode, componentsList} = this.props; - return ( - onAddDeployment(componentsList)} - isReadOnlyMode={isReadOnlyMode} - title={i18n('Deployment Flavors')} - onFilter={value => this.setState({localFilter: value})} - twoColumns> - {this.filterList().map(deploymentFlavor => this.renderListItem(deploymentFlavor, isReadOnlyMode))} - - ); - } + renderList() { + let { onAddDeployment, isReadOnlyMode, componentsList } = this.props; + return ( + onAddDeployment(componentsList)} + isReadOnlyMode={isReadOnlyMode} + title={i18n('Deployment Flavors')} + onFilter={value => this.setState({ localFilter: value })} + twoColumns> + {this.filterList().map(deploymentFlavor => + this.renderListItem(deploymentFlavor, isReadOnlyMode) + )} + + ); + } - renderListItem(deploymentFlavor, isReadOnlyMode) { - let {id, model, description} = deploymentFlavor; - let {onEditDeployment, onDeleteDeployment, componentsList} = this.props; - return ( - onEditDeployment(deploymentFlavor, componentsList)} - onDelete={() => onDeleteDeployment(deploymentFlavor)}> - -
{model}
- - -
{description}
- - - ); - } + renderListItem(deploymentFlavor, isReadOnlyMode) { + let { id, model, description } = deploymentFlavor; + let { + onEditDeployment, + onDeleteDeployment, + componentsList + } = this.props; + return ( + + onEditDeployment(deploymentFlavor, componentsList) + } + onDelete={() => onDeleteDeployment(deploymentFlavor)}> + +
{model}
+ + +
{description}
+ + + ); + } - filterList() { - let {deploymentFlavors} = this.props; - let {localFilter} = this.state; + filterList() { + let { deploymentFlavors } = this.props; + let { localFilter } = this.state; - if (localFilter.trim()) { - const filter = new RegExp(escape(localFilter), 'i'); - return deploymentFlavors.filter(({model = '', description = ''}) => { - return escape(model).match(filter) || escape(description).match(filter); - }); - } - else { - return deploymentFlavors; - } - } + if (localFilter.trim()) { + const filter = new RegExp(escape(localFilter), 'i'); + return deploymentFlavors.filter( + ({ model = '', description = '' }) => { + return ( + escape(model).match(filter) || + escape(description).match(filter) + ); + } + ); + } else { + return deploymentFlavors; + } + } } diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/editor/SoftwareProductDeploymentEditor.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/editor/SoftwareProductDeploymentEditor.js index c24548b7b9..9392317692 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/editor/SoftwareProductDeploymentEditor.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/editor/SoftwareProductDeploymentEditor.js @@ -13,77 +13,103 @@ * or implied. See the License for the specific language governing * permissions and limitations under the License. */ -import {connect} from 'react-redux'; +import { connect } from 'react-redux'; import SoftwareProductDeploymentEditorView from './SoftwareProductDeploymentEditorView.jsx'; import SoftwareProdcutDeploymentActionHelper from '../SoftwareProductDeploymentActionHelper.js'; import ValidationHelper from 'sdc-app/common/helpers/ValidationHelper.js'; -import {DEPLOYMENT_FLAVORS_FORM_NAME} from '../SoftwareProductDeploymentConstants.js'; +import { DEPLOYMENT_FLAVORS_FORM_NAME } from '../SoftwareProductDeploymentConstants.js'; export function mapStateToProps({ - licenseModel, - softwareProduct, - currentScreen: {props: {isReadOnlyMode}} + licenseModel, + softwareProduct, + currentScreen: { props: { isReadOnlyMode } } }) { - let { - softwareProductEditor: { - data: currentSoftwareProduct = {} - }, - softwareProductComponents: { - componentsList, - computeFlavor: { - computesList - } - }, - softwareProductDeployment: { - deploymentFlavors, - deploymentFlavorEditor: { - data = {}, - genericFieldInfo, - formReady - } - } - } = softwareProduct; + let { + softwareProductEditor: { data: currentSoftwareProduct = {} }, + softwareProductComponents: { + componentsList, + computeFlavor: { computesList } + }, + softwareProductDeployment: { + deploymentFlavors, + deploymentFlavorEditor: { data = {}, genericFieldInfo, formReady } + } + } = softwareProduct; - let { - featureGroup: { - featureGroupsList - } - } = licenseModel; + let { featureGroup: { featureGroupsList } } = licenseModel; - let isFormValid = ValidationHelper.checkFormValid(genericFieldInfo); - let selectedFeatureGroupsIds = currentSoftwareProduct.licensingData ? currentSoftwareProduct.licensingData.featureGroups || [] : []; - let selectedFeatureGroupsList = featureGroupsList - .filter(featureGroup => selectedFeatureGroupsIds.includes(featureGroup.id)) - .map(featureGroup => ({value: featureGroup.id, label: featureGroup.name})); + let isFormValid = ValidationHelper.checkFormValid(genericFieldInfo); + let selectedFeatureGroupsIds = currentSoftwareProduct.licensingData + ? currentSoftwareProduct.licensingData.featureGroups || [] + : []; + let selectedFeatureGroupsList = featureGroupsList + .filter(featureGroup => + selectedFeatureGroupsIds.includes(featureGroup.id) + ) + .map(featureGroup => ({ + value: featureGroup.id, + label: featureGroup.name + })); - let DFNames = {}; + let DFNames = {}; - deploymentFlavors.map(deployment => { - DFNames[deployment.model.toLowerCase()] = deployment.id; - }); + deploymentFlavors.map(deployment => { + DFNames[deployment.model.toLowerCase()] = deployment.id; + }); - return { - data, - selectedFeatureGroupsList, - genericFieldInfo, - DFNames, - isFormValid, - formReady, - isReadOnlyMode, - componentsList, - computesList, - isEdit: Boolean(data.id) - }; + return { + data, + selectedFeatureGroupsList, + genericFieldInfo, + DFNames, + isFormValid, + formReady, + isReadOnlyMode, + componentsList, + computesList, + isEdit: Boolean(data.id) + }; } -function mapActionsToProps(dispatch, {softwareProductId, version}) { - return { - onDataChanged: (deltaData, customValidations) => ValidationHelper.dataChanged(dispatch, {deltaData, formName: DEPLOYMENT_FLAVORS_FORM_NAME, customValidations}), - onClose: () => SoftwareProdcutDeploymentActionHelper.closeDeploymentFlavorEditor(dispatch), - onCreate: data => SoftwareProdcutDeploymentActionHelper.createDeploymentFlavor(dispatch, {softwareProductId, data, version}), - onEdit: data => SoftwareProdcutDeploymentActionHelper.editDeploymentFlavor(dispatch, {softwareProductId, deploymentFlavorId: data.id, data, version}), - onValidateForm: () => ValidationHelper.validateForm(dispatch, DEPLOYMENT_FLAVORS_FORM_NAME) - }; +function mapActionsToProps(dispatch, { softwareProductId, version }) { + return { + onDataChanged: (deltaData, customValidations) => + ValidationHelper.dataChanged(dispatch, { + deltaData, + formName: DEPLOYMENT_FLAVORS_FORM_NAME, + customValidations + }), + onClose: () => + SoftwareProdcutDeploymentActionHelper.closeDeploymentFlavorEditor( + dispatch + ), + onCreate: data => + SoftwareProdcutDeploymentActionHelper.createDeploymentFlavor( + dispatch, + { + softwareProductId, + data, + version + } + ), + onEdit: data => + SoftwareProdcutDeploymentActionHelper.editDeploymentFlavor( + dispatch, + { + softwareProductId, + deploymentFlavorId: data.id, + data, + version + } + ), + onValidateForm: () => + ValidationHelper.validateForm( + dispatch, + DEPLOYMENT_FLAVORS_FORM_NAME + ) + }; } -export default connect(mapStateToProps, mapActionsToProps)(SoftwareProductDeploymentEditorView); +export default connect(mapStateToProps, mapActionsToProps)( + SoftwareProductDeploymentEditorView +); diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/editor/SoftwareProductDeploymentEditorReducer.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/editor/SoftwareProductDeploymentEditorReducer.js index 70836e8ff9..16e73d2162 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/editor/SoftwareProductDeploymentEditorReducer.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/deployment/editor/SoftwareProductDeploymentEditorReducer.js @@ -13,32 +13,37 @@ * or implied. See the License for the specific language governing * permissions and limitations under the License. */ -import {actionTypes, DEPLOYMENT_FLAVORS_FORM_NAME} from '../SoftwareProductDeploymentConstants.js';; +import { + actionTypes, + DEPLOYMENT_FLAVORS_FORM_NAME +} from '../SoftwareProductDeploymentConstants.js'; export default (state = {}, action) => { - switch (action.type) { - case actionTypes.deploymentFlavorEditor.SOFTWARE_PRODUCT_DEPLOYMENT_FILL_DATA: - return { - ...state, - data: action.deploymentFlavor, - formReady: null, - formName: DEPLOYMENT_FLAVORS_FORM_NAME, - genericFieldInfo: { - 'description' : { - isValid: true, - errorText: '', - validations: [{type: 'maxLength', data: 500}] - }, - 'model' : { - isValid: true, - errorText: '', - validations: [{type: 'required', data: true}] - } - } - }; - case actionTypes.deploymentFlavorEditor.SOFTWARE_PRODUCT_DEPLOYMENT_CLEAR_DATA: - return {}; - default: - return state; - } + switch (action.type) { + case actionTypes.deploymentFlavorEditor + .SOFTWARE_PRODUCT_DEPLOYMENT_FILL_DATA: + return { + ...state, + data: action.deploymentFlavor, + formReady: null, + formName: DEPLOYMENT_FLAVORS_FORM_NAME, + genericFieldInfo: { + description: { + isValid: true, + errorText: '', + validations: [{ type: 'maxLength', data: 500 }] + }, + model: { + isValid: true, + errorText: '', + validations: [{ type: 'required', data: true }] + } + } + }; + case actionTypes.deploymentFlavorEditor + .SOFTWARE_PRODUCT_DEPLOYMENT_CLEAR_DATA: + return {}; + default: + return state; + } }; 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 7c9ae438d9..e44d2bd966 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 @@ -11,127 +11,240 @@ import SelectActionTableCell from 'nfvo-components/table/SelectActionTableCell.j import Validator from 'nfvo-utils/Validator.js'; export default class SoftwareProductDeploymentEditorView extends React.Component { - render() { - let {data, isEdit, onClose, onDataChanged, isReadOnlyMode, selectedFeatureGroupsList, componentsList, computesList, genericFieldInfo} = this.props; - let {model, description, featureGroupId, componentComputeAssociations = []} = data; - let featureGroupsExist = selectedFeatureGroupsList.length > 0; - return ( -
- {genericFieldInfo &&
this.submit() } - submitButtonText={isEdit ? i18n('Save') : i18n('Create')} - onReset={ () => onClose() } - onValidateForm={() => this.validate() } - isValid={this.props.isFormValid} - formReady={this.props.formReady} - className='vsp-deployment-editor'> - - - onDataChanged({model}, {model: model => this.validateName(model)})} - label={i18n('Model')} - value={model} - data-test-id='deployment-model' - isValid={genericFieldInfo.model.isValid} - errorText={genericFieldInfo.model.errorText} - isRequired={true} - type='text'/> - - - onDataChanged({description})} - label={i18n('Description')} - value={description} - data-test-id='deployment-description' - isValid={genericFieldInfo.description.isValid} - errorText={genericFieldInfo.description.errorText} - type='text'/> - - - - - onDataChanged({featureGroupId: featureGroup ? featureGroup.value : null})} - type='select' - clearable={true} - disabled={isReadOnlyMode || !featureGroupsExist} - className='field-section' - options={selectedFeatureGroupsList}/> - - - {!featureGroupsExist && - - {i18n('Please assign Feature Groups in VSP General')} - - } - - - - {componentComputeAssociations.map( (association, index) => - - ({value: component.id, label: component.displayName}) ) - } - selected={association.componentId} - onChange={componentId => { - let newAssociations = [...componentComputeAssociations]; - newAssociations[index] = {...newAssociations[index], componentId}; - onDataChanged({componentComputeAssociations: newAssociations}); - }} - disabled={true}/> - compute.componentId === association.componentId) - .map(compute => ({value: compute.computeFlavorId, label: compute.name}) ) - } - selected={association.computeFlavorId} - onChange={computeFlavorId => { - let newAssociations = [...componentComputeAssociations]; - newAssociations[index] = {...newAssociations[index], computeFlavorId}; - onDataChanged({componentComputeAssociations: newAssociations}); - }} - disabled={isReadOnlyMode}/> - - )} - - - -
} -
- ); - } + render() { + let { + data, + isEdit, + onClose, + onDataChanged, + isReadOnlyMode, + selectedFeatureGroupsList, + componentsList, + computesList, + genericFieldInfo + } = this.props; + let { + model, + description, + featureGroupId, + componentComputeAssociations = [] + } = data; + let featureGroupsExist = selectedFeatureGroupsList.length > 0; + return ( +
+ {genericFieldInfo && ( +
this.submit()} + submitButtonText={ + isEdit ? i18n('Save') : i18n('Create') + } + onReset={() => onClose()} + onValidateForm={() => this.validate()} + isValid={this.props.isFormValid} + formReady={this.props.formReady} + className="vsp-deployment-editor"> + + + + onDataChanged( + { model }, + { + model: model => + this.validateName(model) + } + ) + } + label={i18n('Model')} + value={model} + data-test-id="deployment-model" + isValid={genericFieldInfo.model.isValid} + errorText={genericFieldInfo.model.errorText} + isRequired={true} + type="text" + /> + + + + onDataChanged({ description }) + } + label={i18n('Description')} + value={description} + data-test-id="deployment-description" + isValid={ + genericFieldInfo.description.isValid + } + errorText={ + genericFieldInfo.description.errorText + } + type="text" + /> + + + + + + onDataChanged({ + featureGroupId: featureGroup + ? featureGroup.value + : null + }) + } + type="select" + clearable={true} + disabled={ + isReadOnlyMode || !featureGroupsExist + } + className="field-section" + options={selectedFeatureGroupsList} + /> + + + {!featureGroupsExist && ( + + + + {i18n( + 'Please assign Feature Groups in VSP General' + )} + + + + )} + + + + {componentComputeAssociations.map( + (association, index) => ( + + ({ + value: component.id, + label: + component.displayName + }) + )} + selected={ + association.componentId + } + onChange={componentId => { + let newAssociations = [ + ...componentComputeAssociations + ]; + newAssociations[ + index + ] = { + ...newAssociations[ + index + ], + componentId + }; + onDataChanged({ + componentComputeAssociations: newAssociations + }); + }} + disabled={true} + /> + + compute.componentId === + association.componentId + ) + .map(compute => ({ + value: + compute.computeFlavorId, + label: compute.name + }))} + selected={ + association.computeFlavorId + } + onChange={computeFlavorId => { + let newAssociations = [ + ...componentComputeAssociations + ]; + newAssociations[ + index + ] = { + ...newAssociations[ + index + ], + computeFlavorId + }; + onDataChanged({ + componentComputeAssociations: newAssociations + }); + }} + disabled={isReadOnlyMode} + /> + + ) + )} + + + +
+ )} +
+ ); + } - validateName(value) { - const {data: {id = ''}, DFNames} = this.props; - const isExists = Validator.isItemNameAlreadyExistsInList({itemId: id, itemName: value, list: DFNames}); + validateName(value) { + const { data: { id = '' }, DFNames } = this.props; + const isExists = Validator.isItemNameAlreadyExistsInList({ + itemId: id, + itemName: value, + list: DFNames + }); - return !isExists ? {isValid: true, errorText: ''} : - {isValid: false, errorText: i18n('Deployment flavor by the name \'' + value + '\' already exists. Deployment flavor name must be unique')}; - } + return !isExists + ? { isValid: true, errorText: '' } + : { + isValid: false, + errorText: i18n( + "Deployment flavor by the name '" + + value + + "' already exists. Deployment flavor name must be unique" + ) + }; + } - submit(){ - let {isEdit, onCreate, onEdit, onClose, data} = this.props; - if (isEdit) { - onEdit(data); - } else { - onCreate(data); - } - onClose(); - } + submit() { + let { isEdit, onCreate, onEdit, onClose, data } = this.props; + if (isEdit) { + onEdit(data); + } else { + onCreate(data); + } + onClose(); + } - validate() { - this.props.onValidateForm(); - } + validate() { + this.props.onValidateForm(); + } } -- cgit 1.2.3-korg