[SDC-29] Amdocs OnBoard 1707 initial commit.

Change-Id: Ie4d12a3f574008b792899b368a0902a8b46b5370
Signed-off-by: AviZi <avi.ziv@amdocs.com>

9 files changed, 315 insertions, 224 deletions

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 50ac2c85a3..dd2a5c6003 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsActionHelper.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsActionHelper.js
@@ -1,44 +1,39 @@
-/*-
- * ============LICENSE_START=======================================================
- * SDC
- * ================================================================================
+/*!
  * 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
- * 
+ *
+ * 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.
- * ============LICENSE_END=========================================================
+ * 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 licenseKeyGroupsConstants} from './LicenseKeyGroupsConstants.js';
 import LicenseModelActionHelper from 'sdc-app/onboarding/licenseModel/LicenseModelActionHelper.js';
 
-function baseUrl(licenseModelId) {
+function baseUrl(licenseModelId, version) {
 	const restPrefix = Configuration.get('restPrefix');
-	return `${restPrefix}/v1.0/vendor-license-models/${licenseModelId}/license-key-groups`;
+	const {id: versionId} = version;
+	return `${restPrefix}/v1.0/vendor-license-models/${licenseModelId}/versions/${versionId}/license-key-groups`;
 }
 
 function fetchLicenseKeyGroupsList(licenseModelId, version) {
-	let versionQuery = version ? `?version=${version}` : '';
-	return RestAPIUtil.fetch(`${baseUrl(licenseModelId)}${versionQuery}`);
+	return RestAPIUtil.fetch(`${baseUrl(licenseModelId, version)}`);
 }
 
-function deleteLicenseKeyGroup(licenseModelId, licenseKeyGroupId) {
-	return RestAPIUtil.destroy(`${baseUrl(licenseModelId)}/${licenseKeyGroupId}`);
+function deleteLicenseKeyGroup(licenseModelId, licenseKeyGroupId, version) {
+	return RestAPIUtil.destroy(`${baseUrl(licenseModelId, version)}/${licenseKeyGroupId}`);
 }
 
-function postLicenseKeyGroup(licenseModelId, licenseKeyGroup) {
-	return RestAPIUtil.create(baseUrl(licenseModelId), {
+function postLicenseKeyGroup(licenseModelId, licenseKeyGroup, version) {
+	return RestAPIUtil.post(baseUrl(licenseModelId, version), {
 		name: licenseKeyGroup.name,
 		description: licenseKeyGroup.description,
 		operationalScope: licenseKeyGroup.operationalScope,
@@ -46,8 +41,8 @@ function postLicenseKeyGroup(licenseModelId, licenseKeyGroup) {
 	});
 }
 
-function putLicenseKeyGroup(licenseModelId, licenseKeyGroup) {
-	return RestAPIUtil.save(`${baseUrl(licenseModelId)}/${licenseKeyGroup.id}`, {
+function putLicenseKeyGroup(licenseModelId, licenseKeyGroup, version) {
+	return RestAPIUtil.put(`${baseUrl(licenseModelId, version)}/${licenseKeyGroup.id}`, {
 		name: licenseKeyGroup.name,
 		description: licenseKeyGroup.description,
 		operationalScope: licenseKeyGroup.operationalScope,
@@ -77,9 +72,9 @@ export default {
 		});
 	},
 
-	saveLicenseKeyGroup(dispatch, {licenseModelId, previousLicenseKeyGroup, licenseKeyGroup}) {
+	saveLicenseKeyGroup(dispatch, {licenseModelId, previousLicenseKeyGroup, licenseKeyGroup, version}) {
 		if (previousLicenseKeyGroup) {
-			return putLicenseKeyGroup(licenseModelId, licenseKeyGroup).then(() => {
+			return putLicenseKeyGroup(licenseModelId, licenseKeyGroup, version).then(() => {
 				dispatch({
 					type: licenseKeyGroupsConstants.EDIT_LICENSE_KEY_GROUP,
 					licenseKeyGroup
@@ -87,11 +82,12 @@ export default {
 			});
 		}
 		else {
-			return postLicenseKeyGroup(licenseModelId, licenseKeyGroup).then(response => {
+			return postLicenseKeyGroup(licenseModelId, licenseKeyGroup, version).then(response => {
 				dispatch({
 					type: licenseKeyGroupsConstants.ADD_LICENSE_KEY_GROUP,
 					licenseKeyGroup: {
 						...licenseKeyGroup,
+						referencingFeatureGroups: [],
 						id: response.value
 					}
 				});
@@ -101,8 +97,8 @@ export default {
 
 	},
 
-	deleteLicenseKeyGroup(dispatch, {licenseModelId, licenseKeyGroupId}){
-		return deleteLicenseKeyGroup(licenseModelId, licenseKeyGroupId).then(()=> {
+	deleteLicenseKeyGroup(dispatch, {licenseModelId, licenseKeyGroupId, version}){
+		return deleteLicenseKeyGroup(licenseModelId, licenseKeyGroupId, version).then(()=> {
 			dispatch({
 				type: licenseKeyGroupsConstants.DELETE_LICENSE_KEY_GROUP,
 				licenseKeyGroupId
@@ -110,13 +106,6 @@ export default {
 		});
 	},
 
-	licenseKeyGroupEditorDataChanged(dispatch, {deltaData}) {
-		dispatch({
-			type: licenseKeyGroupsConstants.licenseKeyGroupsEditor.DATA_CHANGED,
-			deltaData
-		});
-	},
-
 	hideDeleteConfirm(dispatch) {
 		dispatch({
 			type: licenseKeyGroupsConstants.LICENSE_KEY_GROUPS_DELETE_CONFIRM,
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsConfirmationModal.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsConfirmationModal.jsx
deleted file mode 100644
index 2413db51d0..0000000000
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsConfirmationModal.jsx
+++ /dev/null
@@ -1,49 +0,0 @@
-import React from 'react';
-import {connect} from 'react-redux';
-import ConfirmationModalView from 'nfvo-components/confirmations/ConfirmationModalView.jsx';
-import LicenseKeyGroupsActionHelper from './LicenseKeyGroupsActionHelper.js';
-import i18n from 'nfvo-utils/i18n/i18n.js';
-
-function renderMsg(licenseKeyGroupToDelete) {
-	let name = licenseKeyGroupToDelete ? licenseKeyGroupToDelete.name : '';
-	let msg = i18n('Are you sure you want to delete "{name}"?', {name});
-	let subMsg =  licenseKeyGroupToDelete
-					&& licenseKeyGroupToDelete.referencingFeatureGroups
-					&& licenseKeyGroupToDelete.referencingFeatureGroups.length > 0 ?
-					i18n('This license key group is associated with one or more feature groups') :
-					'';
-	return(
-		<div>
-			<p>{msg}</p>
-			<p>{subMsg}</p>
-		</div>
-	);
-};
-
-const mapStateToProps = ({licenseModel: {licenseKeyGroup}}, {licenseModelId}) => {
-	let {licenseKeyGroupToDelete} = licenseKeyGroup;
-	const show = licenseKeyGroupToDelete !== false;
-	return {
-		show,
-		title: 'Warning!',
-		type: 'warning',
-		msg: renderMsg(licenseKeyGroupToDelete),
-		confirmationDetails: {licenseKeyGroupToDelete, licenseModelId}
-	};
-};
-
-const mapActionsToProps = (dispatch) => {
-	return {
-		onConfirmed: ({licenseKeyGroupToDelete, licenseModelId}) => {
-
-			LicenseKeyGroupsActionHelper.deleteLicenseKeyGroup(dispatch, {licenseModelId, licenseKeyGroupId:licenseKeyGroupToDelete.id});
-			LicenseKeyGroupsActionHelper.hideDeleteConfirm(dispatch);
-		},
-		onDeclined: () => {
-			LicenseKeyGroupsActionHelper.hideDeleteConfirm(dispatch);
-		}
-	};
-};
-
-export default connect(mapStateToProps, mapActionsToProps)(ConfirmationModalView);
-
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsConstants.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsConstants.js
index d32bc52744..50d1fe8625 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsConstants.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsConstants.js
@@ -1,25 +1,21 @@
-/*-
- * ============LICENSE_START=======================================================
- * SDC
- * ================================================================================
+/*!
  * 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
- * 
+ *
+ * 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.
- * ============LICENSE_END=========================================================
+ * 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';
 import i18n from 'nfvo-utils/i18n/i18n.js';
+import InputOptions, {other as optionInputOther} from 'nfvo-components/input/inputOptions/InputOptions.jsx';
 
 export const actionTypes = keyMirror({
 
@@ -42,6 +38,8 @@ export const defaultState = {
 	}
 };
 
+export const LKG_FORM_NAME = 'LKGFORM';
+
 export const optionsInputValues = {
 	OPERATIONAL_SCOPE: [
 		{enum: '', title: i18n('please select…')},
@@ -61,4 +59,21 @@ export const optionsInputValues = {
 	]
 };
 
+export const extractValue = (item) => {
+	if (item === undefined) {return '';} //TODO fix it later
+
+	return  item ? item === optionInputOther.OTHER ? item : InputOptions.getTitleByName(optionsInputValues, item) : '';
+};
 
+export const getOperationalScopes = (operationalScope) => {
+	if(operationalScope.choices.toString() === i18n(optionInputOther.OTHER) && operationalScope.other !== '') {
+		return operationalScope.other;
+	}
+	else {
+		let allOpScopes = '';
+		for (let opScope of operationalScope.choices) {
+			allOpScopes += allOpScopes === '' ? InputOptions.getTitleByName(optionsInputValues, opScope) : `, ${InputOptions.getTitleByName(optionsInputValues, opScope)}`;
+		}
+		return allOpScopes;
+	}
+};
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsEditor.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsEditor.js
index 3940ec594a..aef1532dc1 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsEditor.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsEditor.js
@@ -1,52 +1,60 @@
-/*-
- * ============LICENSE_START=======================================================
- * SDC
- * ================================================================================
+/*!
  * 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
- * 
+ *
+ * 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.
- * ============LICENSE_END=========================================================
+ * 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 LicenseKeyGroupsActionHelper from './LicenseKeyGroupsActionHelper.js';
 import LicenseKeyGroupsEditorView from './LicenseKeyGroupsEditorView.jsx';
+import ValidationHelper from 'sdc-app/common/helpers/ValidationHelper.js';
 
 const mapStateToProps = ({licenseModel: {licenseKeyGroup}}) => {
 
 
-	let {data} = licenseKeyGroup.licenseKeyGroupsEditor;
+	let {data, genericFieldInfo, formReady} = licenseKeyGroup.licenseKeyGroupsEditor;
 
-	let previousData;
+	let previousData, LKGNames = {};
 	const licenseKeyGroupId = data ? data.id : null;
 	if(licenseKeyGroupId) {
 		previousData = licenseKeyGroup.licenseKeyGroupsList.find(licenseKeyGroup => licenseKeyGroup.id === licenseKeyGroupId);
 	}
 
+	let isFormValid = ValidationHelper.checkFormValid(genericFieldInfo);
+
+	const list = licenseKeyGroup.licenseKeyGroupsList;
+	for (let i = 0; i < list.length; i++) {
+		LKGNames[list[i].name] = list[i].id;
+	}
+
 	return {
 		data,
-		previousData
+		previousData,
+		genericFieldInfo,
+		isFormValid,
+		formReady,
+		LKGNames
 	};
 };
 
-const mapActionsToProps = (dispatch, {licenseModelId}) => {
+const mapActionsToProps = (dispatch, {licenseModelId, version}) => {
 	return {
-		onDataChanged: deltaData => LicenseKeyGroupsActionHelper.licenseKeyGroupEditorDataChanged(dispatch, {deltaData}),
+		onDataChanged: (deltaData, formName, customValidations) => ValidationHelper.dataChanged(dispatch, {deltaData, formName, customValidations}),
 		onCancel: () => LicenseKeyGroupsActionHelper.closeLicenseKeyGroupEditor(dispatch),
 		onSubmit: ({previousLicenseKeyGroup, licenseKeyGroup}) => {
 			LicenseKeyGroupsActionHelper.closeLicenseKeyGroupEditor(dispatch);
-			LicenseKeyGroupsActionHelper.saveLicenseKeyGroup(dispatch, {licenseModelId, previousLicenseKeyGroup, licenseKeyGroup});
-		}
+			LicenseKeyGroupsActionHelper.saveLicenseKeyGroup(dispatch, {licenseModelId, previousLicenseKeyGroup, licenseKeyGroup, version});
+		},
+		onValidateForm: (formName) => ValidationHelper.validateForm(dispatch, formName)
 	};
 };
 
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsEditorReducer.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsEditorReducer.js
index a74498269a..090c971c65 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsEditorReducer.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsEditorReducer.js
@@ -1,42 +1,53 @@
-/*-
- * ============LICENSE_START=======================================================
- * SDC
- * ================================================================================
+/*!
  * 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
- * 
+ *
+ * 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.
- * ============LICENSE_END=========================================================
+ * 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, defaultState} from './LicenseKeyGroupsConstants.js';
+import {actionTypes, defaultState, LKG_FORM_NAME} from './LicenseKeyGroupsConstants.js';
 
 export default (state = {}, action) => {
 	switch (action.type) {
 		case actionTypes.licenseKeyGroupsEditor.OPEN:
 			return {
 				...state,
-				data: action.licenseKeyGroup ? {...action.licenseKeyGroup} : defaultState.licenseKeyGroupsEditor
+				data: action.licenseKeyGroup ? {...action.licenseKeyGroup} : defaultState.licenseKeyGroupsEditor,
+				formReady: null,
+				formName: LKG_FORM_NAME,
+				genericFieldInfo: {
+					'description' : {
+						isValid: true,
+						errorText: '',
+						validations: [{type: 'required', data: true}, {type: 'maxLength', data: 1000}]
+					},
+					'name' : {
+						isValid: true,
+						errorText: '',
+						validations: [{type: 'required', data: true}, {type: 'maxLength', data: 120}]
+					},
+					'type' : {
+						isValid: true,
+						errorText: '',
+						validations: [{type: 'required', data: true}]
+					},
+					'operationalScope' : {
+						isValid: true,
+						errorText: '',
+						validations: []
+					}
+				}
 			};
 		case actionTypes.licenseKeyGroupsEditor.CLOSE:
 			return {};
-		case actionTypes.licenseKeyGroupsEditor.DATA_CHANGED:
-			return {
-				...state,
-				data: {
-					...state.data,
-					...action.deltaData
-				}
-			};
 		default:
 			return state;
 	}
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 102e713060..b95efd0f9c 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsEditorView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsEditorView.jsx
@@ -1,10 +1,29 @@
+/*!
+ * 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 i18n from 'nfvo-utils/i18n/i18n.js';
+import Validator from 'nfvo-utils/Validator.js';
 
-import ValidationForm from 'nfvo-components/input/validation/ValidationForm.jsx';
-import ValidationInput from 'nfvo-components/input/validation/ValidationInput.jsx';
-import {optionsInputValues as licenseKeyGroupOptionsInputValues} from './LicenseKeyGroupsConstants.js';
-import {other as optionInputOther} from 'nfvo-components/input/inputOptions/InputOptions.jsx';
+import Form from 'nfvo-components/input/validation/Form.jsx';
+import Input from 'nfvo-components/input/validation/Input.jsx';
+import GridSection from 'nfvo-components/grid/GridSection.jsx';
+import GridItem from 'nfvo-components/grid/GridItem.jsx';
+import {optionsInputValues as licenseKeyGroupOptionsInputValues, LKG_FORM_NAME} from './LicenseKeyGroupsConstants.js';
+import {other as optionInputOther} from 'nfvo-components/input/validation/InputOptions.jsx';
+import InputOptions from 'nfvo-components/input/validation/InputOptions.jsx';
 
 const LicenseKeyGroupPropType = React.PropTypes.shape({
 	id: React.PropTypes.string,
@@ -17,10 +36,80 @@ const LicenseKeyGroupPropType = React.PropTypes.shape({
 	type: React.PropTypes.string
 });
 
+const LicenseKeyGroupFormContent = ({data, onDataChanged, genericFieldInfo, validateName, validateOperationalScope}) => {
+	let {name, description, operationalScope, type} = data;
+	return (
+		<GridSection>
+			<GridItem colSpan={2}>
+				<Input
+					onChange={name => onDataChanged({name}, LKG_FORM_NAME, {name: validateName})}
+					label={i18n('Name')}
+					data-test-id='create-lkg-name'
+					value={name}
+					isValid={genericFieldInfo.name.isValid}
+					errorText={genericFieldInfo.name.errorText}
+					isRequired={true}
+					type='text'/>
+			</GridItem>
+			<GridItem colSpan={2}>
+				<InputOptions
+					onInputChange={()=>{}}
+					isMultiSelect={true}
+					isRequired={true}
+					onEnumChange={operationalScope => onDataChanged({operationalScope:{choices: operationalScope, other: ''}},
+						LKG_FORM_NAME, {operationalScope: validateOperationalScope})}
+					onOtherChange={operationalScope => onDataChanged({operationalScope:{choices: [optionInputOther.OTHER],
+						other: operationalScope}}, LKG_FORM_NAME, {operationalScope: validateOperationalScope})}
+					label={i18n('Operational Scope')}
+					data-test-id='create-lkg-operational-scope'
+					type='select'
+					multiSelectedEnum={operationalScope && operationalScope.choices}
+					otherValue={operationalScope && operationalScope.other}
+					values={licenseKeyGroupOptionsInputValues.OPERATIONAL_SCOPE}
+					isValid={genericFieldInfo.operationalScope.isValid}
+					errorText={genericFieldInfo.operationalScope.errorText} />
+			</GridItem>
+			<GridItem colSpan={2}>
+				<Input
+					onChange={description => onDataChanged({description}, LKG_FORM_NAME)}
+					label={i18n('Description')}
+					data-test-id='create-lkg-description'
+					value={description}
+					isValid={genericFieldInfo.description.isValid}
+					errorText={genericFieldInfo.description.errorText}
+					isRequired={true}
+					type='textarea'
+					overlayPos='bottom' />
+			</GridItem>
+			<GridItem colSpan={2}>
+				<Input
+					isRequired={true}
+					onChange={e => { const selectedIndex = e.target.selectedIndex;
+						const val = e.target.options[selectedIndex].value;
+						onDataChanged({type: val}, LKG_FORM_NAME);}}
+					value={type}
+					label={i18n('Type')}
+					data-test-id='create-lkg-type'
+					isValid={genericFieldInfo.type.isValid}
+					errorText={genericFieldInfo.type.errorText}
+					groupClassName='bootstrap-input-options'
+					className='input-options-select'
+					type='select' >
+					{
+						licenseKeyGroupOptionsInputValues.TYPE.map(type =>
+						(<option key={type.enum} value={type.enum}>{type.title}</option>))
+					}
+				</Input>
+			</GridItem>
+		</GridSection>
+	);
+};
+
 class LicenseKeyGroupsEditorView extends React.Component {
 	static propTypes = {
 		data: LicenseKeyGroupPropType,
 		previousData: LicenseKeyGroupPropType,
+		LKGNames: React.PropTypes.object,
 		isReadOnlyMode: React.PropTypes.bool,
 		onDataChanged: React.PropTypes.func.isRequired,
 		onSubmit: React.PropTypes.func.isRequired,
@@ -32,54 +121,29 @@ class LicenseKeyGroupsEditorView extends React.Component {
 	};
 
 	render() {
-		let {data = {}, onDataChanged, isReadOnlyMode} = this.props;
-		let {name, description, operationalScope, type} = data;
+		let {data = {}, onDataChanged, isReadOnlyMode, genericFieldInfo} = this.props;
 		return (
-			<ValidationForm
+			<div>
+		{ genericFieldInfo &&
+			<Form
 				ref='validationForm'
 				hasButtons={true}
 				onSubmit={ () => this.submit() }
 				onReset={ () => this.props.onCancel() }
+				isValid={this.props.isFormValid}
+				formReady={this.props.formReady}
+				onValidateForm={() => this.props.onValidateForm(LKG_FORM_NAME) }
 				labledButtons={true}
 				isReadOnlyMode={isReadOnlyMode}
 				className='license-key-groups-form'>
-				<div className='license-key-groups-form-row'>
-					<ValidationInput
-						onChange={name => onDataChanged({name})}
-						ref='name'
-						label={i18n('Name')}
-						value={name}
-						validations={{maxLength: 120, required: true}}
-						type='text'/>
-					<ValidationInput
-						isMultiSelect={true}
-						isRequired={true}
-						onEnumChange={operationalScope => onDataChanged({operationalScope:{choices: operationalScope, other: ''}})}
-						onOtherChange={operationalScope => onDataChanged({operationalScope:{choices: [optionInputOther.OTHER], other: operationalScope}})}
-						label={i18n('Operational Scope')}
-						validations={{required: true}}
-						multiSelectedEnum={operationalScope && operationalScope.choices}
-						otherValue={operationalScope && operationalScope.other}
-						values={licenseKeyGroupOptionsInputValues.OPERATIONAL_SCOPE}/>
-				</div>
-				<div className='license-key-groups-form-row'>
-					<ValidationInput
-						onChange={description => onDataChanged({description})}
-						ref='description'
-						label={i18n('Description')}
-						value={description}
-						validations={{maxLength: 1000, required: true}}
-						type='textarea'/>
-						<ValidationInput
-							isRequired={true}
-							onEnumChange={type => onDataChanged({type})}
-							selectedEnum={type}
-							label={i18n('Type')}
-							type='select'
-							validations={{required: true}}
-							values={licenseKeyGroupOptionsInputValues.TYPE}/>
-					</div>
-			</ValidationForm>
+				<LicenseKeyGroupFormContent
+					data={data}
+					onDataChanged={onDataChanged}
+					genericFieldInfo={genericFieldInfo}
+					validateName={(value)=> this.validateName(value)}
+					validateOperationalScope={this.validateOperationalScope}/>
+			</Form>}
+			</div>
 		);
 	}
 
@@ -87,6 +151,37 @@ class LicenseKeyGroupsEditorView extends React.Component {
 		const {data: licenseKeyGroup, previousData: previousLicenseKeyGroup} = this.props;
 		this.props.onSubmit({licenseKeyGroup, previousLicenseKeyGroup});
 	}
+
+	validateName(value) {
+		const {data: {id}, LKGNames} = this.props;
+		const isExists = Validator.isItemNameAlreadyExistsInList({itemId: id, itemName: value, list: LKGNames});
+
+		return !isExists ?  {isValid: true, errorText: ''} :
+			{isValid: false, errorText: i18n('License key group by the name \'' + value + '\' already exists. License key group name must be unique')};
+	}
+
+	validateOperationalScope(value) {
+		if (value && value.choices && value.choices.length > 0) {
+			if (value.choices[0] !== optionInputOther.OTHER)
+			{
+				return {
+					isValid: true,
+					errorText: ''
+				};
+			} else {
+				if ( value.other ) {
+					return {
+						isValid: true,
+						errorText: ''
+					};
+				}
+			}
+		}
+		return {
+			isValid: false,
+			errorText: 'Field is required'
+		};
+	}
 }
 
 export default LicenseKeyGroupsEditorView;
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 e1b610f973..e2c6c30e21 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsListEditor.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsListEditor.js
@@ -1,27 +1,24 @@
-/*-
- * ============LICENSE_START=======================================================
- * SDC
- * ================================================================================
+/*!
  * 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
- * 
+ *
+ * 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.
- * ============LICENSE_END=========================================================
+ * 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';
 import LicenseKeyGroupsActionHelper from './LicenseKeyGroupsActionHelper.js';
-import LicenseKeyGroupsListEditorView from './LicenseKeyGroupsListEditorView.jsx';
+import LicenseKeyGroupsListEditorView, {generateConfirmationMsg} from './LicenseKeyGroupsListEditorView.jsx';
 import VersionControllerUtils from 'nfvo-components/panel/versionController/VersionControllerUtils.js';
+import {actionTypes as globalMoadlActions}  from 'nfvo-components/modal/GlobalModalConstants.js';
 
 const mapStateToProps = ({licenseModel: {licenseKeyGroup, licenseModelEditor}}) => {
 	let {licenseKeyGroupsList} = licenseKeyGroup;
@@ -38,11 +35,18 @@ const mapStateToProps = ({licenseModel: {licenseKeyGroup, licenseModelEditor}})
 	};
 };
 
-const mapActionsToProps = (dispatch) => {
+const mapActionsToProps = (dispatch, {licenseModelId, version}) => {	
 	return {
 		onAddLicenseKeyGroupClick: () => LicenseKeyGroupsActionHelper.openLicenseKeyGroupsEditor(dispatch),
 		onEditLicenseKeyGroupClick: licenseKeyGroup => LicenseKeyGroupsActionHelper.openLicenseKeyGroupsEditor(dispatch, {licenseKeyGroup}),
-		onDeleteLicenseKeyGroupClick: licenseKeyGroup => LicenseKeyGroupsActionHelper.openDeleteLicenseAgreementConfirm(dispatch, {licenseKeyGroup})
+		onDeleteLicenseKeyGroupClick: licenseKeyGroup => dispatch({
+			type: globalMoadlActions.GLOBAL_MODAL_WARNING,
+			data:{
+				msg: generateConfirmationMsg(licenseKeyGroup),				
+				title: i18n('Warning'),				
+				onConfirmed: ()=>LicenseKeyGroupsActionHelper.deleteLicenseKeyGroup(dispatch, {licenseModelId, licenseKeyGroupId:licenseKeyGroup.id, version})
+			}
+		})
 	};
 };
 
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 1ed1d2093a..a303e46706 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsListEditorView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsListEditorView.jsx
@@ -1,3 +1,18 @@
+/*!
+ * 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 i18n from 'nfvo-utils/i18n/i18n.js';
@@ -8,8 +23,6 @@ import ListEditorItemView from 'nfvo-components/listEditor/ListEditorItemView.js
 import LicenseKeyGroupsEditor from './LicenseKeyGroupsEditor.js';
 import InputOptions, {other as optionInputOther} from 'nfvo-components/input/inputOptions/InputOptions.jsx';
 import {optionsInputValues} from './LicenseKeyGroupsConstants';
-import LicenseKeyGroupsConfirmationModal from './LicenseKeyGroupsConfirmationModal.jsx';
-
 
 class LicenseKeyGroupsListEditorView extends React.Component {
 	static propTypes = {
@@ -33,35 +46,33 @@ class LicenseKeyGroupsListEditorView extends React.Component {
 	};
 
 	render() {
-		let {licenseModelId, vendorName, isReadOnlyMode, isDisplayModal, isModalInEditMode} = this.props;
+		let {licenseModelId, vendorName, isReadOnlyMode, isDisplayModal, isModalInEditMode, version} = this.props;
 		let {onAddLicenseKeyGroupClick} = this.props;
 		const {localFilter} = this.state;
 
 		return (
 			<div className='license-key-groups-list-editor'>
 				<ListEditorView
-					title={i18n('License Key Groups for {vendorName} License Model', {vendorName})}
+					title={i18n('License Key Groups', {vendorName})}
 					plusButtonTitle={i18n('Add License Key Group')}
 					onAdd={onAddLicenseKeyGroupClick}
 					filterValue={localFilter}
-					onFilter={filter => this.setState({localFilter: filter})}
+					onFilter={value => this.setState({localFilter: value})}
 					isReadOnlyMode={isReadOnlyMode}>
 					{this.filterList().map(licenseKeyGroup => (this.renderLicenseKeyGroupListItem(licenseKeyGroup, isReadOnlyMode)))}
 				</ListEditorView>
-				<Modal show={isDisplayModal} bsSize='large' animation={true} className='license-key-groups-modal'>
+				<Modal show={isDisplayModal} bsSize='large' animation={true} className='onborading-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 licenseModelId={licenseModelId} isReadOnlyMode={isReadOnlyMode}/>
+								<LicenseKeyGroupsEditor version={version} licenseModelId={licenseModelId} isReadOnlyMode={isReadOnlyMode}/>
 							)
 						}
 					</Modal.Body>
 				</Modal>
-				<LicenseKeyGroupsConfirmationModal licenseModelId={licenseModelId}/>
-
 			</div>
 		);
 	}
@@ -134,5 +145,17 @@ class LicenseKeyGroupsListEditorView extends React.Component {
 
 export default LicenseKeyGroupsListEditorView;
 
-
-
+export function generateConfirmationMsg(licenseKeyGroupToDelete) {
+	let name = licenseKeyGroupToDelete ? licenseKeyGroupToDelete.name : '';
+	let msg = i18n('Are you sure you want to delete "{name}"?', {name});
+	let subMsg = licenseKeyGroupToDelete.referencingFeatureGroups
+	&& licenseKeyGroupToDelete.referencingFeatureGroups.length > 0 ?
+		i18n('This license key group is associated with one or more feature groups') :
+		'';
+	return (
+		<div>
+			<p>{msg}</p>
+			<p>{subMsg}</p>
+		</div>
+	);
+}
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsListReducer.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsListReducer.js
index 54ce4e3955..1f0a64e295 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsListReducer.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsListReducer.js
@@ -1,23 +1,18 @@
-/*-
- * ============LICENSE_START=======================================================
- * SDC
- * ================================================================================
+/*!
  * 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
- * 
+ *
+ * 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.
- * ============LICENSE_END=========================================================
+ * 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 './LicenseKeyGroupsConstants.js';
 export default (state = [], action) => {
 	switch (action.type) {