diff options
Diffstat (limited to 'openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes')
8 files changed, 418 insertions, 280 deletions
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 b2133ad5d8..52c5cdde3d 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 @@ -15,121 +15,184 @@ */ import RestAPIUtil from 'nfvo-utils/RestAPIUtil.js'; import Configuration from 'sdc-app/config/Configuration.js'; -import {actionTypes} from './SoftwareProductComponentProcessesConstants.js'; +import { actionTypes } from './SoftwareProductComponentProcessesConstants.js'; function baseUrl(softwareProductId, version, componentId) { - const restPrefix = Configuration.get('restPrefix'); - return `${restPrefix}/v1.0/vendor-software-products/${softwareProductId}/versions/${version.id}/components/${componentId}/processes`; + const restPrefix = Configuration.get('restPrefix'); + return `${restPrefix}/v1.0/vendor-software-products/${softwareProductId}/versions/${ + version.id + }/components/${componentId}/processes`; } -function fetchProcessesList({softwareProductId, version, componentId}) { - return RestAPIUtil.fetch(`${baseUrl(softwareProductId, version, componentId)}`); +function fetchProcessesList({ softwareProductId, version, componentId }) { + return RestAPIUtil.fetch( + `${baseUrl(softwareProductId, version, componentId)}` + ); } -function deleteProcess({softwareProductId, version, componentId, processId}) { - return RestAPIUtil.destroy(`${baseUrl(softwareProductId, version, componentId)}/${processId}`); +function deleteProcess({ softwareProductId, version, componentId, processId }) { + return RestAPIUtil.destroy( + `${baseUrl(softwareProductId, version, componentId)}/${processId}` + ); } -function putProcess({softwareProductId, version, componentId, process}) { - return RestAPIUtil.put(`${baseUrl(softwareProductId, version, componentId)}/${process.id}`, { - name: process.name, - description: process.description, - type: process.type === '' ? null : process.type - }); +function putProcess({ softwareProductId, version, componentId, process }) { + return RestAPIUtil.put( + `${baseUrl(softwareProductId, version, componentId)}/${process.id}`, + { + name: process.name, + description: process.description, + type: process.type === '' ? null : process.type + } + ); } -function postProcess({softwareProductId, version, componentId, process}) { - return RestAPIUtil.post(`${baseUrl(softwareProductId, version, componentId)}`, { - name: process.name, - description: process.description, - type: process.type === '' ? null : process.type - }); +function postProcess({ softwareProductId, version, componentId, process }) { + return RestAPIUtil.post( + `${baseUrl(softwareProductId, version, componentId)}`, + { + name: process.name, + description: process.description, + type: process.type === '' ? null : process.type + } + ); } -function uploadFileToProcess({softwareProductId, version, processId, componentId, formData}) { - return RestAPIUtil.post(`${baseUrl(softwareProductId, version, componentId)}/${processId}/upload`, formData); +function uploadFileToProcess({ + softwareProductId, + version, + processId, + componentId, + formData +}) { + return RestAPIUtil.post( + `${baseUrl( + softwareProductId, + version, + componentId + )}/${processId}/upload`, + formData + ); } - - const SoftwareProductComponentProcessesActionHelper = { - fetchProcessesList(dispatch, {softwareProductId, version, componentId}) { - dispatch({ - type: actionTypes.FETCH_SOFTWARE_PRODUCT_COMPONENTS_PROCESSES, - processesList: [] - }); - - return fetchProcessesList({softwareProductId, version, componentId}).then(response => { - dispatch({ - type: actionTypes.FETCH_SOFTWARE_PRODUCT_COMPONENTS_PROCESSES, - processesList: response.results - }); - }); - }, - - deleteProcess(dispatch, {process, softwareProductId, version, componentId}) { - return deleteProcess({softwareProductId, version, processId:process.id, componentId}).then(() => { - dispatch({ - type: actionTypes.DELETE_SOFTWARE_PRODUCT_COMPONENTS_PROCESS, - processId: process.id - }); - }); - - }, - - saveProcess(dispatch, {softwareProductId, version, componentId, previousProcess, process}) { - if (previousProcess) { - return putProcess({softwareProductId, version, componentId, process}).then(() => { - if (process.formData && process.formData.name !== previousProcess.artifactName){ - uploadFileToProcess({softwareProductId, version, processId: process.id, formData: process.formData, componentId}); - } - dispatch({ - type: actionTypes.EDIT_SOFTWARE_PRODUCT_COMPONENTS_PROCESS, - process - }); - }); - } - else { - return postProcess({softwareProductId, version, componentId, process}).then(response => { - if (process.formData) { - uploadFileToProcess({softwareProductId, version, processId: response.value, formData: process.formData, componentId}); - } - dispatch({ - type: actionTypes.ADD_SOFTWARE_PRODUCT_COMPONENTS_PROCESS, - process: { - ...process, - id: response.value - } - }); - }); - } - }, - - hideDeleteConfirm(dispatch) { - dispatch({ - type: actionTypes.SOFTWARE_PRODUCT_PROCESS_DELETE_COMPONENTS_CONFIRM, - processToDelete: false - }); - }, - - openDeleteProcessesConfirm(dispatch, {process} ) { - dispatch({ - type: actionTypes.SOFTWARE_PRODUCT_PROCESS_DELETE_COMPONENTS_CONFIRM, - processToDelete: process - }); - }, - - openEditor(dispatch, process = {}) { - dispatch({ - type: actionTypes.SOFTWARE_PRODUCT_PROCESS_COMPONENTS_EDITOR_OPEN, - process - }); - }, - closeEditor(dispatch) { - dispatch({ - type:actionTypes.SOFTWARE_PRODUCT_PROCESS_COMPONENTS_EDITOR_CLOSE - }); - } + fetchProcessesList(dispatch, { softwareProductId, version, componentId }) { + dispatch({ + type: actionTypes.FETCH_SOFTWARE_PRODUCT_COMPONENTS_PROCESSES, + processesList: [] + }); + + return fetchProcessesList({ + softwareProductId, + version, + componentId + }).then(response => { + dispatch({ + type: actionTypes.FETCH_SOFTWARE_PRODUCT_COMPONENTS_PROCESSES, + processesList: response.results + }); + }); + }, + + deleteProcess( + dispatch, + { process, softwareProductId, version, componentId } + ) { + return deleteProcess({ + softwareProductId, + version, + processId: process.id, + componentId + }).then(() => { + dispatch({ + type: actionTypes.DELETE_SOFTWARE_PRODUCT_COMPONENTS_PROCESS, + processId: process.id + }); + }); + }, + + saveProcess( + dispatch, + { softwareProductId, version, componentId, previousProcess, process } + ) { + if (previousProcess) { + return putProcess({ + softwareProductId, + version, + componentId, + process + }).then(() => { + if ( + process.formData && + process.formData.name !== previousProcess.artifactName + ) { + uploadFileToProcess({ + softwareProductId, + version, + processId: process.id, + formData: process.formData, + componentId + }); + } + dispatch({ + type: actionTypes.EDIT_SOFTWARE_PRODUCT_COMPONENTS_PROCESS, + process + }); + }); + } else { + return postProcess({ + softwareProductId, + version, + componentId, + process + }).then(response => { + if (process.formData) { + uploadFileToProcess({ + softwareProductId, + version, + processId: response.value, + formData: process.formData, + componentId + }); + } + dispatch({ + type: actionTypes.ADD_SOFTWARE_PRODUCT_COMPONENTS_PROCESS, + process: { + ...process, + id: response.value + } + }); + }); + } + }, + + hideDeleteConfirm(dispatch) { + dispatch({ + type: + actionTypes.SOFTWARE_PRODUCT_PROCESS_DELETE_COMPONENTS_CONFIRM, + processToDelete: false + }); + }, + + openDeleteProcessesConfirm(dispatch, { process }) { + dispatch({ + type: + actionTypes.SOFTWARE_PRODUCT_PROCESS_DELETE_COMPONENTS_CONFIRM, + processToDelete: process + }); + }, + + openEditor(dispatch, process = {}) { + dispatch({ + type: actionTypes.SOFTWARE_PRODUCT_PROCESS_COMPONENTS_EDITOR_OPEN, + process + }); + }, + closeEditor(dispatch) { + dispatch({ + type: actionTypes.SOFTWARE_PRODUCT_PROCESS_COMPONENTS_EDITOR_CLOSE + }); + } }; export default SoftwareProductComponentProcessesActionHelper; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentProcessesConstants.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentProcessesConstants.js index d15432b3fb..e3ce4f8007 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentProcessesConstants.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentProcessesConstants.js @@ -16,21 +16,22 @@ import keyMirror from 'nfvo-utils/KeyMirror.js'; export const actionTypes = keyMirror({ - ADD_SOFTWARE_PRODUCT_COMPONENTS_PROCESS: null, - EDIT_SOFTWARE_PRODUCT_COMPONENTS_PROCESS: null, - DELETE_SOFTWARE_PRODUCT_COMPONENTS_PROCESS: null, - SOFTWARE_PRODUCT_PROCESS_COMPONENTS_EDITOR_OPEN: null, - SOFTWARE_PRODUCT_PROCESS_COMPONENTS_EDITOR_CLOSE: null, - FETCH_SOFTWARE_PRODUCT_COMPONENTS_PROCESSES: null, - SOFTWARE_PRODUCT_PROCESS_DELETE_COMPONENTS_CONFIRM: null + ADD_SOFTWARE_PRODUCT_COMPONENTS_PROCESS: null, + EDIT_SOFTWARE_PRODUCT_COMPONENTS_PROCESS: null, + DELETE_SOFTWARE_PRODUCT_COMPONENTS_PROCESS: null, + SOFTWARE_PRODUCT_PROCESS_COMPONENTS_EDITOR_OPEN: null, + SOFTWARE_PRODUCT_PROCESS_COMPONENTS_EDITOR_CLOSE: null, + FETCH_SOFTWARE_PRODUCT_COMPONENTS_PROCESSES: null, + SOFTWARE_PRODUCT_PROCESS_DELETE_COMPONENTS_CONFIRM: null }); export const optionsInputValues = { - PROCESS_TYPE: [ - {title: 'Select...', enum: ''}, - {title: 'Lifecycle Operations', enum: 'Lifecycle_Operations'}, - {title: 'Other', enum: 'Other'} - ] + PROCESS_TYPE: [ + { title: 'Select...', enum: '' }, + { title: 'Lifecycle Operations', enum: 'Lifecycle_Operations' }, + { title: 'Other', enum: 'Other' } + ] }; -export const SOFTWARE_PRODUCT_PROCESS_COMPONENTS_EDITOR_FORM = 'SOFTWAREPRODUCTPROCESSCOMPONENTSEDITORFORM'; +export const SOFTWARE_PRODUCT_PROCESS_COMPONENTS_EDITOR_FORM = + 'SOFTWAREPRODUCTPROCESSCOMPONENTSEDITORFORM'; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentProcessesEditor.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentProcessesEditor.js index 9502e24b1a..9d2bf34b78 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentProcessesEditor.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentProcessesEditor.js @@ -13,44 +13,68 @@ * 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 ValidationHelper from 'sdc-app/common/helpers/ValidationHelper.js'; import SoftwareProductComponentProcessesActionHelper from './SoftwareProductComponentProcessesActionHelper'; import SoftwareProductComponentProcessesEditorView from './SoftwareProductComponentProcessesEditorView.jsx'; -import {SOFTWARE_PRODUCT_PROCESS_COMPONENTS_EDITOR_FORM} from './SoftwareProductComponentProcessesConstants.js'; +import { SOFTWARE_PRODUCT_PROCESS_COMPONENTS_EDITOR_FORM } from './SoftwareProductComponentProcessesConstants.js'; -export const mapStateToProps = ({softwareProduct}) => { - let {softwareProductComponents: {componentProcesses = {}}} = softwareProduct; - let {processesList = [], processesEditor = {}} = componentProcesses; - let {data, genericFieldInfo, formReady} = processesEditor; - let isFormValid = ValidationHelper.checkFormValid(genericFieldInfo); +export const mapStateToProps = ({ softwareProduct }) => { + let { + softwareProductComponents: { componentProcesses = {} } + } = softwareProduct; + let { processesList = [], processesEditor = {} } = componentProcesses; + let { data, genericFieldInfo, formReady } = processesEditor; + let isFormValid = ValidationHelper.checkFormValid(genericFieldInfo); - let previousData; - const processId = data ? data.id : null; - if(processId) { - previousData = processesList.find(process => process.id === processId); - } + let previousData; + const processId = data ? data.id : null; + if (processId) { + previousData = processesList.find(process => process.id === processId); + } - return { - data, - genericFieldInfo, - previousData, - isFormValid, - formReady - }; + return { + data, + genericFieldInfo, + previousData, + isFormValid, + formReady + }; }; -const mapActionsToProps = (dispatch, {softwareProductId, version, componentId}) => { - - return { - onDataChanged: (deltaData) => ValidationHelper.dataChanged(dispatch, {deltaData, formName: SOFTWARE_PRODUCT_PROCESS_COMPONENTS_EDITOR_FORM}), - onCancel: () => SoftwareProductComponentProcessesActionHelper.closeEditor(dispatch), - onSubmit: ({previousProcess, process}) => { - SoftwareProductComponentProcessesActionHelper.closeEditor(dispatch); - SoftwareProductComponentProcessesActionHelper.saveProcess(dispatch, {softwareProductId, version, previousProcess, componentId, process}); - }, - onValidateForm: () => ValidationHelper.validateForm(dispatch, SOFTWARE_PRODUCT_PROCESS_COMPONENTS_EDITOR_FORM) - }; +const mapActionsToProps = ( + dispatch, + { softwareProductId, version, componentId } +) => { + return { + onDataChanged: deltaData => + ValidationHelper.dataChanged(dispatch, { + deltaData, + formName: SOFTWARE_PRODUCT_PROCESS_COMPONENTS_EDITOR_FORM + }), + onCancel: () => + SoftwareProductComponentProcessesActionHelper.closeEditor(dispatch), + onSubmit: ({ previousProcess, process }) => { + SoftwareProductComponentProcessesActionHelper.closeEditor(dispatch); + SoftwareProductComponentProcessesActionHelper.saveProcess( + dispatch, + { + softwareProductId, + version, + previousProcess, + componentId, + process + } + ); + }, + onValidateForm: () => + ValidationHelper.validateForm( + dispatch, + SOFTWARE_PRODUCT_PROCESS_COMPONENTS_EDITOR_FORM + ) + }; }; -export default connect(mapStateToProps, mapActionsToProps)(SoftwareProductComponentProcessesEditorView); +export default connect(mapStateToProps, mapActionsToProps)( + SoftwareProductComponentProcessesEditorView +); diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentProcessesEditorReducer.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentProcessesEditorReducer.js index 9afaa6d5fd..fd211734df 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentProcessesEditorReducer.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentProcessesEditorReducer.js @@ -13,42 +13,48 @@ * or implied. See the License for the specific language governing * permissions and limitations under the License. */ -import {actionTypes, SOFTWARE_PRODUCT_PROCESS_COMPONENTS_EDITOR_FORM} from './SoftwareProductComponentProcessesConstants.js'; +import { + actionTypes, + SOFTWARE_PRODUCT_PROCESS_COMPONENTS_EDITOR_FORM +} from './SoftwareProductComponentProcessesConstants.js'; export default (state = {}, action) => { - switch (action.type) { - case actionTypes.SOFTWARE_PRODUCT_PROCESS_COMPONENTS_EDITOR_OPEN: - return { - ...state, - formReady: null, - formName: SOFTWARE_PRODUCT_PROCESS_COMPONENTS_EDITOR_FORM, - genericFieldInfo: { - 'name' : { - isValid: true, - errorText: '', - validations: [{type: 'required', data: true}, {type: 'maxLength', data: 120}] - }, - 'description' : { - isValid: true, - errorText: '', - validations: [{type: 'maxLength', data: 1000}] - }, - 'artifactName' : { - isValid: true, - errorText: '', - validations: [] - }, - 'type' : { - isValid: true, - errorText: '', - validations: [] - } - }, - data: action.process - }; - case actionTypes.SOFTWARE_PRODUCT_PROCESS_COMPONENTS_EDITOR_CLOSE: - return {}; - default: - return state; - } + switch (action.type) { + case actionTypes.SOFTWARE_PRODUCT_PROCESS_COMPONENTS_EDITOR_OPEN: + return { + ...state, + formReady: null, + formName: SOFTWARE_PRODUCT_PROCESS_COMPONENTS_EDITOR_FORM, + genericFieldInfo: { + name: { + isValid: true, + errorText: '', + validations: [ + { type: 'required', data: true }, + { type: 'maxLength', data: 120 } + ] + }, + description: { + isValid: true, + errorText: '', + validations: [{ type: 'maxLength', data: 1000 }] + }, + artifactName: { + isValid: true, + errorText: '', + validations: [] + }, + type: { + isValid: true, + errorText: '', + validations: [] + } + }, + data: action.process + }; + case actionTypes.SOFTWARE_PRODUCT_PROCESS_COMPONENTS_EDITOR_CLOSE: + return {}; + default: + return state; + } }; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentProcessesEditorView.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentProcessesEditorView.jsx index 9841ecbae7..132ebe86fb 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentProcessesEditorView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentProcessesEditorView.jsx @@ -14,17 +14,18 @@ * permissions and limitations under the License. */ import React from 'react'; -import {optionsInputValues as ComponentProcessesOptionsInputValues} from './SoftwareProductComponentProcessesConstants.js'; +import { optionsInputValues as ComponentProcessesOptionsInputValues } from './SoftwareProductComponentProcessesConstants.js'; import SoftwareProductProcessesEditorForm from 'sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcessesEditorForm.jsx'; - class SoftwareProductProcessesEditorView extends React.Component { - - render() { - return ( - <SoftwareProductProcessesEditorForm optionsInputValues={ComponentProcessesOptionsInputValues} {...this.props}/> - ); - } + render() { + return ( + <SoftwareProductProcessesEditorForm + optionsInputValues={ComponentProcessesOptionsInputValues} + {...this.props} + /> + ); + } } export default SoftwareProductProcessesEditorView; 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 2a7152ef8b..cb6d25a6ac 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 @@ -13,45 +13,64 @@ * 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 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'; import SoftwareProductComponentProcessesActionHelper from './SoftwareProductComponentProcessesActionHelper.js'; import SoftwareProductComponentsProcessesListView from './SoftwareProductComponentsProcessesListView.jsx'; -export const mapStateToProps = ({softwareProduct}) => { - - let {softwareProductEditor: {data:currentSoftwareProduct = {}, isValidityData = true}, softwareProductComponents: {componentProcesses = {}}} = softwareProduct; - let{processesList = [], processesEditor = {}} = componentProcesses; - let {data} = processesEditor; - - return { - currentSoftwareProduct, - isValidityData, - processesList, - isDisplayModal: Boolean(data), - isModalInEditMode: Boolean(data && data.id) - }; +export const mapStateToProps = ({ softwareProduct }) => { + let { + softwareProductEditor: { + data: currentSoftwareProduct = {}, + isValidityData = true + }, + softwareProductComponents: { componentProcesses = {} } + } = softwareProduct; + let { processesList = [], processesEditor = {} } = componentProcesses; + let { data } = processesEditor; + return { + currentSoftwareProduct, + isValidityData, + processesList, + isDisplayModal: Boolean(data), + isModalInEditMode: Boolean(data && data.id) + }; }; -const mapActionsToProps = (dispatch, {componentId, softwareProductId, version}) => { - - return { - onAddProcess: () => SoftwareProductComponentProcessesActionHelper.openEditor(dispatch), - onEditProcess: (process) => SoftwareProductComponentProcessesActionHelper.openEditor(dispatch, process), - onDeleteProcess: (process) => dispatch({ - type: modalActionTypes.GLOBAL_MODAL_WARNING, - data:{ - msg: i18n('Are you sure you want to delete "{name}"?', {name: process.name}), - confirmationButtonText: i18n('Delete'), - title: i18n('Delete'), - onConfirmed: ()=> SoftwareProductComponentProcessesActionHelper.deleteProcess(dispatch, - {process, softwareProductId, version, componentId}) - } - }) - }; +const mapActionsToProps = ( + dispatch, + { componentId, softwareProductId, version } +) => { + return { + onAddProcess: () => + SoftwareProductComponentProcessesActionHelper.openEditor(dispatch), + onEditProcess: process => + SoftwareProductComponentProcessesActionHelper.openEditor( + dispatch, + process + ), + onDeleteProcess: process => + dispatch({ + type: modalActionTypes.GLOBAL_MODAL_WARNING, + data: { + msg: i18n('Are you sure you want to delete "{name}"?', { + name: process.name + }), + confirmationButtonText: i18n('Delete'), + title: i18n('Delete'), + onConfirmed: () => + SoftwareProductComponentProcessesActionHelper.deleteProcess( + dispatch, + { process, softwareProductId, version, componentId } + ) + } + }) + }; }; -export default connect(mapStateToProps, mapActionsToProps, null, {withRef: true})(SoftwareProductComponentsProcessesListView); +export default connect(mapStateToProps, mapActionsToProps, null, { + withRef: true +})(SoftwareProductComponentsProcessesListView); diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentProcessesListReducer.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentProcessesListReducer.js index 98e24a9c21..d406f02c19 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentProcessesListReducer.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/processes/SoftwareProductComponentProcessesListReducer.js @@ -13,20 +13,26 @@ * or implied. See the License for the specific language governing * permissions and limitations under the License. */ -import {actionTypes} from './SoftwareProductComponentProcessesConstants.js'; +import { actionTypes } from './SoftwareProductComponentProcessesConstants.js'; export default (state = [], action) => { - switch (action.type) { - case actionTypes.FETCH_SOFTWARE_PRODUCT_COMPONENTS_PROCESSES: - return [...action.processesList]; - case actionTypes.EDIT_SOFTWARE_PRODUCT_COMPONENTS_PROCESS: - const indexForEdit = state.findIndex(process => process.id === action.process.id); - return [...state.slice(0, indexForEdit), action.process, ...state.slice(indexForEdit + 1)]; - case actionTypes.ADD_SOFTWARE_PRODUCT_COMPONENTS_PROCESS: - return [...state, action.process]; - case actionTypes.DELETE_SOFTWARE_PRODUCT_COMPONENTS_PROCESS: - return state.filter(process => process.id !== action.processId); - default: - return state; - } + switch (action.type) { + case actionTypes.FETCH_SOFTWARE_PRODUCT_COMPONENTS_PROCESSES: + return [...action.processesList]; + case actionTypes.EDIT_SOFTWARE_PRODUCT_COMPONENTS_PROCESS: + const indexForEdit = state.findIndex( + process => process.id === action.process.id + ); + return [ + ...state.slice(0, indexForEdit), + action.process, + ...state.slice(indexForEdit + 1) + ]; + case actionTypes.ADD_SOFTWARE_PRODUCT_COMPONENTS_PROCESS: + return [...state, action.process]; + case actionTypes.DELETE_SOFTWARE_PRODUCT_COMPONENTS_PROCESS: + return state.filter(process => process.id !== action.processId); + default: + return state; + } }; 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 27c4b9f429..8fa2bffb27 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 @@ -21,55 +21,73 @@ import SoftwareProductProcessesEditor from './SoftwareProductComponentProcessesE import SoftwareProductProcessListView from 'sdc-app/onboarding/softwareProduct/processes/SoftwareProductProcessListView.jsx'; class SoftwareProductProcessesView extends React.Component { + state = { + localFilter: '' + }; - state = { - localFilter: '' - }; + static propTypes = { + onAddProcess: PropTypes.func, + onEditProcess: PropTypes.func, + onDeleteProcess: PropTypes.func, + isDisplayModal: PropTypes.bool, + isModalInEditMode: PropTypes.bool, + onStorageSelect: PropTypes.func, + componentId: PropTypes.string, + softwareProductId: PropTypes.string, + currentSoftwareProduct: PropTypes.object + }; - static propTypes = { - onAddProcess: PropTypes.func, - onEditProcess: PropTypes.func, - onDeleteProcess: PropTypes.func, - isDisplayModal: PropTypes.bool, - isModalInEditMode: PropTypes.bool, - onStorageSelect: PropTypes.func, - componentId: PropTypes.string, - softwareProductId: PropTypes.string, - currentSoftwareProduct: PropTypes.object - }; - - render() { - return ( - <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')} {...this.props}/> - </div> - </div> - </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> - - ); - } + render() { + return ( + <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' + )} + {...this.props} + /> + </div> + </div> + </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; |