Adding Prettier and fixing up eslint version

Issue-ID: SDC-1094
Change-Id: Ie83ad95a03899345dd90235daf0323cbe3bc6afd
Signed-off-by: Einav Weiss Keidar <einavw@amdocs.com>

74 files changed, 6704 insertions, 4509 deletions

diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/ArchivedLicenseModelListReducer.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/ArchivedLicenseModelListReducer.js
index 8e4750e666..d5563f41ba 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/ArchivedLicenseModelListReducer.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/ArchivedLicenseModelListReducer.js
@@ -13,13 +13,13 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import {actionTypes} from './LicenseModelConstants.js';
+import { actionTypes } from './LicenseModelConstants.js';
 
 export default (state = [], action) => {
-	switch (action.type) {
-		case actionTypes.ARCHIVED_LICENSE_MODELS_LIST_LOADED:
-			return [...action.response.results];
-		default:
-			return state;
-	}
+    switch (action.type) {
+        case actionTypes.ARCHIVED_LICENSE_MODELS_LIST_LOADED:
+            return [...action.response.results];
+        default:
+            return state;
+    }
 };
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/FinalizedLicenseModelListReducer.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/FinalizedLicenseModelListReducer.js
index cc9d9c536d..b5c2bff4ba 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/FinalizedLicenseModelListReducer.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/FinalizedLicenseModelListReducer.js
@@ -13,13 +13,13 @@
  * or implied. See the License for the specific language governing
  * permissions and limitations under the License.
  */
-import {actionTypes} from './LicenseModelConstants.js';
+import { actionTypes } from './LicenseModelConstants.js';
 
 export default (state = [], action) => {
-	switch (action.type) {
-		case actionTypes.FINALIZED_LICENSE_MODELS_LIST_LOADED:
-			return [...action.response.results];
-		default:
-			return state;
-	}
+    switch (action.type) {
+        case actionTypes.FINALIZED_LICENSE_MODELS_LIST_LOADED:
+            return [...action.response.results];
+        default:
+            return state;
+    }
 };
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModel.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModel.js
index c390ecc9b0..cea369d2ec 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModel.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModel.js
@@ -4,173 +4,220 @@
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
- * 
+ *
  *      http://www.apache.org/licenses/LICENSE-2.0
- * 
+ *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import {connect} from 'react-redux';
+import { connect } from 'react-redux';
 
 import i18n from 'nfvo-utils/i18n/i18n.js';
 import TabulatedEditor from 'src/nfvo-components/editor/TabulatedEditor.jsx';
 import ScreensHelper from 'sdc-app/common/helpers/ScreensHelper.js';
-import {enums, screenTypes} from 'sdc-app/onboarding/OnboardingConstants.js';
+import { enums, screenTypes } from 'sdc-app/onboarding/OnboardingConstants.js';
 
 import PermissionsActionHelper from './../permissions/PermissionsActionHelper.js';
 import RevisionsActionHelper from './../revisions/RevisionsActionHelper.js';
 
 import LicenseModelActionHelper from './LicenseModelActionHelper.js';
-import {actionTypes as modalActionTypes} from 'nfvo-components/modal/GlobalModalConstants.js';
-import {modalContentMapper} from 'sdc-app/common/modal/ModalContentMapper.js';
-import {CommitModalType} from 'nfvo-components/panel/versionController/components/CommitCommentModal.jsx';
+import { actionTypes as modalActionTypes } from 'nfvo-components/modal/GlobalModalConstants.js';
+import { modalContentMapper } from 'sdc-app/common/modal/ModalContentMapper.js';
+import { CommitModalType } from 'nfvo-components/panel/versionController/components/CommitCommentModal.jsx';
 
 const buildNavigationBarProps = (licenseModel, screen) => {
-	const {id, vendorName, version} = licenseModel;
-	const meta = {version};
-
-	const groups = [{
-		id,
-		name: vendorName,
-		items: [
-			{
-				id: enums.SCREEN.LICENSE_MODEL_OVERVIEW,
-				name: i18n('Overview'),
-				meta
-			},
-			{
-				id: enums.SCREEN.LICENSE_AGREEMENTS,
-				name: i18n('License Agreements'),
-				meta
-			},
-			{
-				id: enums.SCREEN.FEATURE_GROUPS,
-				name: i18n('Feature Groups'),
-				meta
-			},
-			{
-				id: enums.SCREEN.ENTITLEMENT_POOLS,
-				name: i18n('Entitlement Pools'),
-				meta
-			},
-			{
-				id: enums.SCREEN.LICENSE_KEY_GROUPS,
-				name: i18n('License Key Groups'),
-				meta
-			},
-			{
-				id: enums.SCREEN.ACTIVITY_LOG,
-				name: i18n('Activity Log'),
-				meta
-			}
-		]
-	}];
-
-	return {
-		activeItemId: screen, groups
-	};
+    const { id, vendorName, version } = licenseModel;
+    const meta = { version };
+
+    const groups = [
+        {
+            id,
+            name: vendorName,
+            items: [
+                {
+                    id: enums.SCREEN.LICENSE_MODEL_OVERVIEW,
+                    name: i18n('Overview'),
+                    meta
+                },
+                {
+                    id: enums.SCREEN.LICENSE_AGREEMENTS,
+                    name: i18n('License Agreements'),
+                    meta
+                },
+                {
+                    id: enums.SCREEN.FEATURE_GROUPS,
+                    name: i18n('Feature Groups'),
+                    meta
+                },
+                {
+                    id: enums.SCREEN.ENTITLEMENT_POOLS,
+                    name: i18n('Entitlement Pools'),
+                    meta
+                },
+                {
+                    id: enums.SCREEN.LICENSE_KEY_GROUPS,
+                    name: i18n('License Key Groups'),
+                    meta
+                },
+                {
+                    id: enums.SCREEN.ACTIVITY_LOG,
+                    name: i18n('Activity Log'),
+                    meta
+                }
+            ]
+        }
+    ];
+
+    return {
+        activeItemId: screen,
+        groups
+    };
 };
 
-
 const buildVersionControllerProps = ({
-	licenseModelEditor = {data: {}},
-	versions,
-	currentVersion,
-	userInfo,
-	usersList,
-	permissions,
-	isArchived,
-	itemPermission,
-	isReadOnlyMode
+    licenseModelEditor = { data: {} },
+    versions,
+    currentVersion,
+    userInfo,
+    usersList,
+    permissions,
+    isArchived,
+    itemPermission,
+    isReadOnlyMode
 }) => {
-	const {isValidityData = true} = licenseModelEditor;
-	return {
-		version: currentVersion,
-		viewableVersions: versions,
-		isFormDataValid: isValidityData,
-		permissions,
-		userInfo,
-		usersList,
-		isArchived,
-		itemName: licenseModelEditor.data.vendorName,
-		itemPermission,
-		isReadOnlyMode
-	};
+    const { isValidityData = true } = licenseModelEditor;
+    return {
+        version: currentVersion,
+        viewableVersions: versions,
+        isFormDataValid: isValidityData,
+        permissions,
+        userInfo,
+        usersList,
+        isArchived,
+        itemName: licenseModelEditor.data.vendorName,
+        itemPermission,
+        isReadOnlyMode
+    };
 };
 
-
-const mapStateToProps = ({
-	users: {userInfo, usersList},
-	licenseModel: {licenseModelEditor},
-	versionsPage: {permissions, versionsList: {versions, itemName}}
-}, {
-	currentScreen: {screen, itemPermission, props: {isReadOnlyMode, version: currentVersion}}
-}) => {
-	return {
-		versionControllerProps: buildVersionControllerProps({
-			licenseModelEditor,
-			versions,
-			currentVersion,
-			userInfo,
-			permissions,
-			usersList,
-			isArchived: itemPermission.isArchived,
-			itemPermission,
-			isReadOnlyMode
-		}),
-		navigationBarProps: buildNavigationBarProps(licenseModelEditor.data, screen)
-	};
+const mapStateToProps = (
+    {
+        users: { userInfo, usersList },
+        licenseModel: { licenseModelEditor },
+        versionsPage: { permissions, versionsList: { versions } }
+    },
+    {
+        currentScreen: {
+            screen,
+            itemPermission,
+            props: { isReadOnlyMode, version: currentVersion }
+        }
+    }
+) => {
+    return {
+        versionControllerProps: buildVersionControllerProps({
+            licenseModelEditor,
+            versions,
+            currentVersion,
+            userInfo,
+            permissions,
+            usersList,
+            isArchived: itemPermission.isArchived,
+            itemPermission,
+            isReadOnlyMode
+        }),
+        navigationBarProps: buildNavigationBarProps(
+            licenseModelEditor.data,
+            screen
+        )
+    };
 };
 
-
-const mapActionsToProps = (dispatch, {currentScreen: {screen, props: {licenseModelId, version}}}) => {
-
-	return {
-		onVersionControllerAction: (action, version, comment) =>
-			LicenseModelActionHelper.performVCAction(dispatch, {licenseModelId, action, version, comment}).then(updatedVersion => {
-				ScreensHelper.loadScreen(dispatch, {screen, screenType: screenTypes.LICENSE_MODEL, props: {licenseModelId, version: updatedVersion}});
-			}),
-
-		onOpenCommentCommitModal: ({onCommit, title}) => dispatch({
-			type: modalActionTypes.GLOBAL_MODAL_SHOW,
-			data: {
-				modalComponentName: modalContentMapper.COMMIT_COMMENT,
-				modalComponentProps: {
-					onCommit,
-					type: CommitModalType.COMMIT
-				},
-				title
-			}
-		}),
-
-		onVersionSwitching: version => {
-			ScreensHelper.loadScreen(dispatch, {screen, screenType: screenTypes.LICENSE_MODEL, props: {licenseModelId, version}});
-		},
-
-		onManagePermissions() {
-			PermissionsActionHelper.openPermissonsManager(dispatch, {itemId: licenseModelId, askForRights: false});
-		},
-
-		onMoreVersionsClick: ({itemName, users}) => {
-			ScreensHelper.loadScreen(dispatch, {screen: enums.SCREEN.VERSIONS_PAGE, screenType: screenTypes.LICENSE_MODEL,
-				props: {licenseModelId, licenseModel: {name: itemName}, usersList: users}});
-		},
-
-		onOpenPermissions: ({users}) => {
-			return PermissionsActionHelper.fetchItemUsers(dispatch, {itemId: licenseModelId, allUsers: users});
-		},
-
-		onOpenRevisionsModal: () => {
-			return RevisionsActionHelper.openRevisionsView(dispatch, {itemId: licenseModelId, version: version, itemType: screenTypes.LICENSE_MODEL});
-		},
-
-		onNavigate: ({id}) => {
-			ScreensHelper.loadScreen(dispatch, {screen: id, screenType: screenTypes.LICENSE_MODEL, props: {licenseModelId, version}});
-		}
-	};
+const mapActionsToProps = (
+    dispatch,
+    { currentScreen: { screen, props: { licenseModelId, version } } }
+) => {
+    return {
+        onVersionControllerAction: (action, version, comment) =>
+            LicenseModelActionHelper.performVCAction(dispatch, {
+                licenseModelId,
+                action,
+                version,
+                comment
+            }).then(updatedVersion => {
+                ScreensHelper.loadScreen(dispatch, {
+                    screen,
+                    screenType: screenTypes.LICENSE_MODEL,
+                    props: { licenseModelId, version: updatedVersion }
+                });
+            }),
+
+        onOpenCommentCommitModal: ({ onCommit, title }) =>
+            dispatch({
+                type: modalActionTypes.GLOBAL_MODAL_SHOW,
+                data: {
+                    modalComponentName: modalContentMapper.COMMIT_COMMENT,
+                    modalComponentProps: {
+                        onCommit,
+                        type: CommitModalType.COMMIT
+                    },
+                    title
+                }
+            }),
+
+        onVersionSwitching: version => {
+            ScreensHelper.loadScreen(dispatch, {
+                screen,
+                screenType: screenTypes.LICENSE_MODEL,
+                props: { licenseModelId, version }
+            });
+        },
+
+        onManagePermissions() {
+            PermissionsActionHelper.openPermissonsManager(dispatch, {
+                itemId: licenseModelId,
+                askForRights: false
+            });
+        },
+
+        onMoreVersionsClick: ({ itemName, users }) => {
+            ScreensHelper.loadScreen(dispatch, {
+                screen: enums.SCREEN.VERSIONS_PAGE,
+                screenType: screenTypes.LICENSE_MODEL,
+                props: {
+                    licenseModelId,
+                    licenseModel: { name: itemName },
+                    usersList: users
+                }
+            });
+        },
+
+        onOpenPermissions: ({ users }) => {
+            return PermissionsActionHelper.fetchItemUsers(dispatch, {
+                itemId: licenseModelId,
+                allUsers: users
+            });
+        },
+
+        onOpenRevisionsModal: () => {
+            return RevisionsActionHelper.openRevisionsView(dispatch, {
+                itemId: licenseModelId,
+                version: version,
+                itemType: screenTypes.LICENSE_MODEL
+            });
+        },
+
+        onNavigate: ({ id }) => {
+            ScreensHelper.loadScreen(dispatch, {
+                screen: id,
+                screenType: screenTypes.LICENSE_MODEL,
+                props: { licenseModelId, version }
+            });
+        }
+    };
 };
 
 export default connect(mapStateToProps, mapActionsToProps)(TabulatedEditor);
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModelActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModelActionHelper.js
index d1d3a77d92..cfff9f1fcd 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModelActionHelper.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModelActionHelper.js
@@ -15,195 +15,279 @@
  */
 import RestAPIUtil from 'nfvo-utils/RestAPIUtil.js';
 import Configuration from 'sdc-app/config/Configuration.js';
-import {actionTypes} from './LicenseModelConstants.js';
-import {actionTypes as modalActionTypes} from 'nfvo-components/modal/GlobalModalConstants.js';
-import {actionsEnum as vcActionsEnum} from 'nfvo-components/panel/versionController/VersionControllerConstants.js';
+import { actionTypes } from './LicenseModelConstants.js';
+import { actionTypes as modalActionTypes } from 'nfvo-components/modal/GlobalModalConstants.js';
+import { actionsEnum as vcActionsEnum } from 'nfvo-components/panel/versionController/VersionControllerConstants.js';
 import i18n from 'nfvo-utils/i18n/i18n.js';
 import LicenseAgreementActionHelper from './licenseAgreement/LicenseAgreementActionHelper.js';
 import FeatureGroupsActionHelper from './featureGroups/FeatureGroupsActionHelper.js';
 import EntitlementPoolsActionHelper from './entitlementPools/EntitlementPoolsActionHelper.js';
 import LicenseKeyGroupsActionHelper from './licenseKeyGroups/LicenseKeyGroupsActionHelper.js';
-import {default as ItemsHelper} from 'sdc-app/common/helpers/ItemsHelper.js';
+import { default as ItemsHelper } from 'sdc-app/common/helpers/ItemsHelper.js';
 import MergeEditorActionHelper from 'sdc-app/common/merge/MergeEditorActionHelper.js';
-import {modalContentMapper} from 'sdc-app/common/modal/ModalContentMapper.js';
-import {CommitModalType} from 'nfvo-components/panel/versionController/components/CommitCommentModal.jsx';
+import { modalContentMapper } from 'sdc-app/common/modal/ModalContentMapper.js';
+import { CommitModalType } from 'nfvo-components/panel/versionController/components/CommitCommentModal.jsx';
 import versionPageActionHelper from 'sdc-app/onboarding/versionsPage/VersionsPageActionHelper.js';
-import {itemTypes} from 'sdc-app/onboarding/versionsPage/VersionsPageConstants.js';
-import {catalogItemStatuses} from 'sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogConstants.js';
-import {actionsEnum as VersionControllerActionsEnum} from 'nfvo-components/panel/versionController/VersionControllerConstants.js';
+import { itemTypes } from 'sdc-app/onboarding/versionsPage/VersionsPageConstants.js';
+import { catalogItemStatuses } from 'sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogConstants.js';
+import { actionsEnum as VersionControllerActionsEnum } from 'nfvo-components/panel/versionController/VersionControllerConstants.js';
 
 function baseUrl() {
-	const restPrefix = Configuration.get('restPrefix');
-	return `${restPrefix}/v1.0/vendor-license-models/`;
+    const restPrefix = Configuration.get('restPrefix');
+    return `${restPrefix}/v1.0/vendor-license-models/`;
 }
 
 function fetchLicenseModels() {
-	return RestAPIUtil.fetch(`${baseUrl()}?versionFilter=${catalogItemStatuses.DRAFT}`);
+    return RestAPIUtil.fetch(
+        `${baseUrl()}?versionFilter=${catalogItemStatuses.DRAFT}`
+    );
 }
 
 function fetchFinalizedLicenseModels() {
-	return RestAPIUtil.fetch(`${baseUrl()}?versionFilter=${catalogItemStatuses.CERTIFIED}`);
+    return RestAPIUtil.fetch(
+        `${baseUrl()}?versionFilter=${catalogItemStatuses.CERTIFIED}`
+    );
 }
 function fetchArchivedLicenseModels() {
-	return RestAPIUtil.fetch(`${baseUrl()}?Status=${catalogItemStatuses.ARCHIVED}`);
+    return RestAPIUtil.fetch(
+        `${baseUrl()}?Status=${catalogItemStatuses.ARCHIVED}`
+    );
 }
 function fetchLicenseModelById(licenseModelId, version) {
-	const {id: versionId} = version;
-	return RestAPIUtil.fetch(`${baseUrl()}${licenseModelId}/versions/${versionId}`);
+    const { id: versionId } = version;
+    return RestAPIUtil.fetch(
+        `${baseUrl()}${licenseModelId}/versions/${versionId}`
+    );
 }
 
 function putLicenseModel(licenseModel) {
-	let {id, vendorName, description, iconRef, version: {id: versionId}} = licenseModel;
-	return RestAPIUtil.put(`${baseUrl()}${id}/versions/${versionId}`, {
-		vendorName,
-		description,
-		iconRef
-	});
+    let {
+        id,
+        vendorName,
+        description,
+        iconRef,
+        version: { id: versionId }
+    } = licenseModel;
+    return RestAPIUtil.put(`${baseUrl()}${id}/versions/${versionId}`, {
+        vendorName,
+        description,
+        iconRef
+    });
 }
 
-function putLicenseModelAction({itemId, action, version}) {
-	const {id: versionId} = version;
-	return RestAPIUtil.put(`${baseUrl()}${itemId}/versions/${versionId}/actions`, {action: action});
+function putLicenseModelAction({ itemId, action, version }) {
+    const { id: versionId } = version;
+    return RestAPIUtil.put(
+        `${baseUrl()}${itemId}/versions/${versionId}/actions`,
+        { action: action }
+    );
 }
 
 const LicenseModelActionHelper = {
+    fetchLicenseModels(dispatch) {
+        return fetchLicenseModels().then(response => {
+            dispatch({
+                type: actionTypes.LICENSE_MODELS_LIST_LOADED,
+                response
+            });
+        });
+    },
 
-	fetchLicenseModels(dispatch) {
-		return fetchLicenseModels().then(response => {
-			dispatch({
-				type: actionTypes.LICENSE_MODELS_LIST_LOADED,
-				response
-			});
-		});
-	},
+    fetchFinalizedLicenseModels(dispatch) {
+        return fetchFinalizedLicenseModels().then(response =>
+            dispatch({
+                type: actionTypes.FINALIZED_LICENSE_MODELS_LIST_LOADED,
+                response
+            })
+        );
+    },
 
-	fetchFinalizedLicenseModels(dispatch) {
-		return fetchFinalizedLicenseModels().then(response => dispatch({
-			type: actionTypes.FINALIZED_LICENSE_MODELS_LIST_LOADED,
-			response
-		}));
+    fetchArchivedLicenseModels(dispatch) {
+        return fetchArchivedLicenseModels().then(response =>
+            dispatch({
+                type: actionTypes.ARCHIVED_LICENSE_MODELS_LIST_LOADED,
+                response
+            })
+        );
+    },
 
-	},
+    fetchLicenseModelById(dispatch, { licenseModelId, version }) {
+        return fetchLicenseModelById(licenseModelId, version).then(response => {
+            dispatch({
+                type: actionTypes.LICENSE_MODEL_LOADED,
+                response: { ...response, version }
+            });
+        });
+    },
 
-	fetchArchivedLicenseModels(dispatch) {
-		return fetchArchivedLicenseModels().then(response => dispatch({
-			type: actionTypes.ARCHIVED_LICENSE_MODELS_LIST_LOADED,
-			response
-		}));
+    fetchLicenseModelItems(dispatch, { licenseModelId, version }) {
+        return Promise.all([
+            LicenseAgreementActionHelper.fetchLicenseAgreementList(dispatch, {
+                licenseModelId,
+                version
+            }),
+            FeatureGroupsActionHelper.fetchFeatureGroupsList(dispatch, {
+                licenseModelId,
+                version
+            }),
+            EntitlementPoolsActionHelper.fetchEntitlementPoolsList(dispatch, {
+                licenseModelId,
+                version
+            }),
+            LicenseKeyGroupsActionHelper.fetchLicenseKeyGroupsList(dispatch, {
+                licenseModelId,
+                version
+            })
+        ]);
+    },
 
-	},
+    manageSubmitAction(dispatch, { licenseModelId, version, isDirty }) {
+        if (isDirty) {
+            const onCommit = comment => {
+                return this.performVCAction(dispatch, {
+                    licenseModelId,
+                    action: vcActionsEnum.COMMIT,
+                    version,
+                    comment
+                }).then(() => {
+                    return this.performSubmitAction(dispatch, {
+                        licenseModelId,
+                        version
+                    });
+                });
+            };
+            dispatch({
+                type: modalActionTypes.GLOBAL_MODAL_SHOW,
+                data: {
+                    modalComponentName: modalContentMapper.COMMIT_COMMENT,
+                    modalComponentProps: {
+                        onCommit,
+                        type: CommitModalType.COMMIT_SUBMIT
+                    },
+                    title: i18n('Commit & Submit')
+                }
+            });
+            return Promise.reject();
+        }
+        return this.performSubmitAction(dispatch, { licenseModelId, version });
+    },
 
-	fetchLicenseModelById(dispatch, {licenseModelId, version}) {
+    performSubmitAction(dispatch, { licenseModelId, version }) {
+        return putLicenseModelAction({
+            itemId: licenseModelId,
+            action: vcActionsEnum.SUBMIT,
+            version
+        }).then(() => {
+            return ItemsHelper.checkItemStatus(dispatch, {
+                itemId: licenseModelId,
+                versionId: version.id
+            }).then(updatedVersion => {
+                dispatch({
+                    type: modalActionTypes.GLOBAL_MODAL_SUCCESS,
+                    data: {
+                        title: i18n('Submit Succeeded'),
+                        msg: i18n('This license model successfully submitted'),
+                        cancelButtonText: i18n('OK'),
+                        timeout: 2000
+                    }
+                });
+                versionPageActionHelper.fetchVersions(dispatch, {
+                    itemType: itemTypes.LICENSE_MODEL,
+                    itemId: licenseModelId
+                });
+                return Promise.resolve(updatedVersion);
+            });
+        });
+    },
 
-		return fetchLicenseModelById(licenseModelId, version).then(response => {
-			dispatch({
-				type: actionTypes.LICENSE_MODEL_LOADED,
-				response: {...response, version}
-			});
-		});
-	},
-
-	fetchLicenseModelItems(dispatch, {licenseModelId, version}) {
-		return Promise.all([
-			LicenseAgreementActionHelper.fetchLicenseAgreementList(dispatch, {licenseModelId, version}),
-			FeatureGroupsActionHelper.fetchFeatureGroupsList(dispatch, {licenseModelId, version}),
-			EntitlementPoolsActionHelper.fetchEntitlementPoolsList(dispatch, {licenseModelId, version}),
-			LicenseKeyGroupsActionHelper.fetchLicenseKeyGroupsList(dispatch, {licenseModelId, version})
-		]);
-	},
-
-	manageSubmitAction(dispatch, {licenseModelId, version, isDirty}) {
-		if(isDirty) {
-			const onCommit = comment => {
-				return this.performVCAction(dispatch, {licenseModelId, action: vcActionsEnum.COMMIT, version, comment}).then(() => {
-					return this.performSubmitAction(dispatch, {licenseModelId, version});
-				});
-			};
-			dispatch({
-				type: modalActionTypes.GLOBAL_MODAL_SHOW,
-				data: {
-					modalComponentName: modalContentMapper.COMMIT_COMMENT,
-					modalComponentProps: {
-						onCommit,
-						type: CommitModalType.COMMIT_SUBMIT
-					},
-					title: i18n('Commit & Submit')
-				}
-			});
-			return Promise.reject();
-		}
-		return this.performSubmitAction(dispatch, {licenseModelId, version});
-	},
-
-	performSubmitAction(dispatch, {licenseModelId, version}) {
-		return putLicenseModelAction({itemId: licenseModelId, action: vcActionsEnum.SUBMIT, version}).then(() => {
-			return ItemsHelper.checkItemStatus(dispatch, {itemId: licenseModelId, versionId: version.id}).then(updatedVersion => {
-				dispatch({
-					type: modalActionTypes.GLOBAL_MODAL_SUCCESS,
-					data: {
-						title: i18n('Submit Succeeded'),
-						msg: i18n('This license model successfully submitted'),
-						cancelButtonText: i18n('OK'),
-						timeout: 2000
-					}
-				});
-				versionPageActionHelper.fetchVersions(dispatch, {itemType: itemTypes.LICENSE_MODEL, itemId: licenseModelId});
-				return Promise.resolve(updatedVersion);
-			});
-		});
-	},
-
-	performVCAction(dispatch, {licenseModelId, action, version, comment}) {
-		return MergeEditorActionHelper.analyzeSyncResult(dispatch, {itemId: licenseModelId, version}).then(({inMerge, isDirty, updatedVersion}) => {
-			if ( (updatedVersion.status === catalogItemStatuses.CERTIFIED || updatedVersion.archivedStatus === catalogItemStatuses.ARCHIVED) && 
-				(action === VersionControllerActionsEnum.COMMIT || action === VersionControllerActionsEnum.SYNC)) {
-				versionPageActionHelper.fetchVersions(dispatch, {itemType: itemTypes.LICENSE_MODEL, itemId: licenseModelId});
-				const msg = updatedVersion.archivedStatus === catalogItemStatuses.ARCHIVED ? i18n('Item was Archived') : i18n('Item version already Certified');
-				dispatch({
-					type: modalActionTypes.GLOBAL_MODAL_WARNING,
-					data: {
-						title: i18n('Commit error'),
-						msg,
-						cancelButtonText: i18n('Cancel')
-					}
-				});
-				return Promise.resolve(updatedVersion);
-			}
-			if (!inMerge) {
-				if(action === vcActionsEnum.SUBMIT) {
-					return this.manageSubmitAction(dispatch, {licenseModelId, version, isDirty});
-				}
-				else {
-					return ItemsHelper.performVCAction({itemId: licenseModelId, action, version, comment}).then(() => {
-						versionPageActionHelper.fetchVersions(dispatch, {itemType: itemTypes.LICENSE_MODEL, itemId: licenseModelId});
-						if (action === vcActionsEnum.SYNC) {
-							return MergeEditorActionHelper.analyzeSyncResult(dispatch, {itemId: licenseModelId, version}).then(({updatedVersion}) => {
-								return Promise.resolve(updatedVersion);
-							});
-						} else {
-							return ItemsHelper.checkItemStatus(dispatch, {itemId: licenseModelId, versionId: version.id});
-						}
-					});
-				}
-			}
-		});
-	},
-
-	saveLicenseModel(dispatch, {licenseModel}) {
-		return putLicenseModel(licenseModel).then(() => {
-			dispatch({
-				type: actionTypes.LICENSE_MODEL_LOADED,
-				response: licenseModel
-			});
-			const {id, version: {id: versionId}} = licenseModel;
-			return ItemsHelper.checkItemStatus(dispatch, {itemId: id, versionId}).then(updatedVersion => {
-				if (updatedVersion.status !== licenseModel.version.status) {
-					versionPageActionHelper.fetchVersions(dispatch, {itemType: itemTypes.LICENSE_MODEL, itemId: licenseModel.id});
-				}
-			});
-		});
-	}
+    performVCAction(dispatch, { licenseModelId, action, version, comment }) {
+        return MergeEditorActionHelper.analyzeSyncResult(dispatch, {
+            itemId: licenseModelId,
+            version
+        }).then(({ inMerge, isDirty, updatedVersion }) => {
+            if (
+                (updatedVersion.status === catalogItemStatuses.CERTIFIED ||
+                    updatedVersion.archivedStatus ===
+                        catalogItemStatuses.ARCHIVED) &&
+                (action === VersionControllerActionsEnum.COMMIT ||
+                    action === VersionControllerActionsEnum.SYNC)
+            ) {
+                versionPageActionHelper.fetchVersions(dispatch, {
+                    itemType: itemTypes.LICENSE_MODEL,
+                    itemId: licenseModelId
+                });
+                const msg =
+                    updatedVersion.archivedStatus ===
+                    catalogItemStatuses.ARCHIVED
+                        ? i18n('Item was Archived')
+                        : i18n('Item version already Certified');
+                dispatch({
+                    type: modalActionTypes.GLOBAL_MODAL_WARNING,
+                    data: {
+                        title: i18n('Commit error'),
+                        msg,
+                        cancelButtonText: i18n('Cancel')
+                    }
+                });
+                return Promise.resolve(updatedVersion);
+            }
+            if (!inMerge) {
+                if (action === vcActionsEnum.SUBMIT) {
+                    return this.manageSubmitAction(dispatch, {
+                        licenseModelId,
+                        version,
+                        isDirty
+                    });
+                } else {
+                    return ItemsHelper.performVCAction({
+                        itemId: licenseModelId,
+                        action,
+                        version,
+                        comment
+                    }).then(() => {
+                        versionPageActionHelper.fetchVersions(dispatch, {
+                            itemType: itemTypes.LICENSE_MODEL,
+                            itemId: licenseModelId
+                        });
+                        if (action === vcActionsEnum.SYNC) {
+                            return MergeEditorActionHelper.analyzeSyncResult(
+                                dispatch,
+                                { itemId: licenseModelId, version }
+                            ).then(({ updatedVersion }) => {
+                                return Promise.resolve(updatedVersion);
+                            });
+                        } else {
+                            return ItemsHelper.checkItemStatus(dispatch, {
+                                itemId: licenseModelId,
+                                versionId: version.id
+                            });
+                        }
+                    });
+                }
+            }
+        });
+    },
 
+    saveLicenseModel(dispatch, { licenseModel }) {
+        return putLicenseModel(licenseModel).then(() => {
+            dispatch({
+                type: actionTypes.LICENSE_MODEL_LOADED,
+                response: licenseModel
+            });
+            const { id, version: { id: versionId } } = licenseModel;
+            return ItemsHelper.checkItemStatus(dispatch, {
+                itemId: id,
+                versionId
+            }).then(updatedVersion => {
+                if (updatedVersion.status !== licenseModel.version.status) {
+                    versionPageActionHelper.fetchVersions(dispatch, {
+                        itemType: itemTypes.LICENSE_MODEL,
+                        itemId: licenseModel.id
+                    });
+                }
+            });
+        });
+    }
 };
 
 export default LicenseModelActionHelper;
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModelConstants.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModelConstants.js
index 08009ee305..d97f682535 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModelConstants.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModelConstants.js
@@ -17,23 +17,22 @@ import keyMirror from 'nfvo-utils/KeyMirror.js';
 import i18n from 'nfvo-utils/i18n/i18n.js';
 
 export const actionTypes = keyMirror({
-	LICENSE_MODEL_LOADED: null,
-	LICENSE_MODELS_LIST_LOADED: null,
-	FINALIZED_LICENSE_MODELS_LIST_LOADED: null,
-	ARCHIVED_LICENSE_MODELS_LIST_LOADED: null,
-	EDIT_LICENSE_MODEL: null
+    LICENSE_MODEL_LOADED: null,
+    LICENSE_MODELS_LIST_LOADED: null,
+    FINALIZED_LICENSE_MODELS_LIST_LOADED: null,
+    ARCHIVED_LICENSE_MODELS_LIST_LOADED: null,
+    EDIT_LICENSE_MODEL: null
 });
 
-
 export const thresholdUnitType = {
-	ABSOLUTE: 'Absolute',
-	PERCENTAGE: 'Percentage'
+    ABSOLUTE: 'Absolute',
+    PERCENTAGE: 'Percentage'
 };
 
 export const optionsInputValues = {
-	THRESHOLD_UNITS: [
-		{enum: '', title: i18n('please select…')},
-		{enum: thresholdUnitType.ABSOLUTE, title: 'Absolute'},
-		{enum: thresholdUnitType.PERCENTAGE, title: '%'}
-	]
-};
\ No newline at end of file
+    THRESHOLD_UNITS: [
+        { enum: '', title: i18n('please select…') },
+        { enum: thresholdUnitType.ABSOLUTE, title: 'Absolute' },
+        { enum: thresholdUnitType.PERCENTAGE, title: '%' }
+    ]
+};
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModelEditorReducer.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModelEditorReducer.js
index add5ac6a98..2d27679283 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModelEditorReducer.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModelEditorReducer.js
@@ -13,16 +13,16 @@
  * or implied. See the License for the specific language governing
  * permissions and limitations under the License.
  */
-import {actionTypes} from './LicenseModelConstants.js';
+import { actionTypes } from './LicenseModelConstants.js';
 
 export default (state = {}, action) => {
-	switch (action.type) {
-		case actionTypes.LICENSE_MODEL_LOADED:			
-			return {
-				...state,
-				data: action.response
-			};
-		default:
-			return state;
-	}
+    switch (action.type) {
+        case actionTypes.LICENSE_MODEL_LOADED:
+            return {
+                ...state,
+                data: action.response
+            };
+        default:
+            return state;
+    }
 };
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModelListReducer.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModelListReducer.js
index 36a190a39c..00d669c7d1 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModelListReducer.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModelListReducer.js
@@ -13,13 +13,13 @@
  * or implied. See the License for the specific language governing
  * permissions and limitations under the License.
  */
-import {actionTypes} from './LicenseModelConstants.js';
+import { actionTypes } from './LicenseModelConstants.js';
 
 export default (state = [], action) => {
-	switch (action.type) {
-		case actionTypes.LICENSE_MODELS_LIST_LOADED:
-			return [...action.response.results];
-		default:
-			return state;
-	}
+    switch (action.type) {
+        case actionTypes.LICENSE_MODELS_LIST_LOADED:
+            return [...action.response.results];
+        default:
+            return state;
+    }
 };
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModelReducer.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModelReducer.js
index f635532348..f102d286f0 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModelReducer.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModelReducer.js
@@ -13,7 +13,7 @@
  * or implied. See the License for the specific language governing
  * permissions and limitations under the License.
  */
-import {combineReducers} from 'redux';
+import { combineReducers } from 'redux';
 
 import activityLogReducer from 'sdc-app/common/activity-log/ActivityLogReducer.js';
 
@@ -32,56 +32,75 @@ import entitlementPoolsEditorReducer from './entitlementPools/EntitlementPoolsEd
 import licenseKeyGroupsEditorReducer from './licenseKeyGroups/LicenseKeyGroupsEditorReducer.js';
 import licenseKeyGroupsListReducer from './licenseKeyGroups/LicenseKeyGroupsListReducer.js';
 
-import {createPlainDataReducer} from 'sdc-app/common/reducers/PlainDataReducer.js';
+import { createPlainDataReducer } from 'sdc-app/common/reducers/PlainDataReducer.js';
 
-import {actionTypes as licenseModelOverviewConstants, VLM_DESCRIPTION_FORM} from './overview/LicenseModelOverviewConstants.js';
-import limitEditorReducer from './limits/LimitEditorReducer.js'; 
+import {
+    actionTypes as licenseModelOverviewConstants,
+    VLM_DESCRIPTION_FORM
+} from './overview/LicenseModelOverviewConstants.js';
+import limitEditorReducer from './limits/LimitEditorReducer.js';
 
 export default combineReducers({
-	licenseModelCreation: createPlainDataReducer(licenseModelCreationReducer),
-	licenseModelEditor: licenseModelEditorReducer,
+    licenseModelCreation: createPlainDataReducer(licenseModelCreationReducer),
+    licenseModelEditor: licenseModelEditorReducer,
 
-	licenseAgreement: combineReducers({
-		licenseAgreementEditor: createPlainDataReducer(licenseAgreementEditorReducer),
-		licenseAgreementList: licenseAgreementListReducer
-	}),
-	featureGroup: combineReducers({
-		featureGroupEditor: createPlainDataReducer(featureGroupsEditorReducer),
-		featureGroupsList: featureGroupsListReducer
-	}),
-	entitlementPool: combineReducers({
-		entitlementPoolEditor: createPlainDataReducer(entitlementPoolsEditorReducer),
-		entitlementPoolsList: entitlementPoolsListReducer
-	}),
-	licenseKeyGroup: combineReducers({
-		licenseKeyGroupsEditor: createPlainDataReducer(licenseKeyGroupsEditorReducer),
-		licenseKeyGroupsList: licenseKeyGroupsListReducer
-	}),
-	licenseModelOverview: combineReducers({
-		selectedTab: (state = null, action) => action.type === licenseModelOverviewConstants.LICENSE_MODEL_OVERVIEW_TAB_SELECTED ? action.buttonTab : state,
-		descriptionEditor: createPlainDataReducer(function(state = false, action) {
-			if (action.type === licenseModelOverviewConstants.LM_DATA_CHANGED) {
-				return {
-					...state,
-					data : {
-						description : action.description
-					},
-					formReady: null,
-					formName: VLM_DESCRIPTION_FORM,
-					genericFieldInfo: {
-						'description': {
-							isValid: true,
-							errorText: '',
-							validations: [{type: 'required', data: true}, {type: 'maxLength', data: 1000}]
-						}
-					}
-				};
-				//return action.description;
-			} else {
-				return state;
-			}
-		}
-	)}),
-	limitEditor: createPlainDataReducer(limitEditorReducer),
-	activityLog: activityLogReducer
+    licenseAgreement: combineReducers({
+        licenseAgreementEditor: createPlainDataReducer(
+            licenseAgreementEditorReducer
+        ),
+        licenseAgreementList: licenseAgreementListReducer
+    }),
+    featureGroup: combineReducers({
+        featureGroupEditor: createPlainDataReducer(featureGroupsEditorReducer),
+        featureGroupsList: featureGroupsListReducer
+    }),
+    entitlementPool: combineReducers({
+        entitlementPoolEditor: createPlainDataReducer(
+            entitlementPoolsEditorReducer
+        ),
+        entitlementPoolsList: entitlementPoolsListReducer
+    }),
+    licenseKeyGroup: combineReducers({
+        licenseKeyGroupsEditor: createPlainDataReducer(
+            licenseKeyGroupsEditorReducer
+        ),
+        licenseKeyGroupsList: licenseKeyGroupsListReducer
+    }),
+    licenseModelOverview: combineReducers({
+        selectedTab: (state = null, action) =>
+            action.type ===
+            licenseModelOverviewConstants.LICENSE_MODEL_OVERVIEW_TAB_SELECTED
+                ? action.buttonTab
+                : state,
+        descriptionEditor: createPlainDataReducer(function(
+            state = false,
+            action
+        ) {
+            if (action.type === licenseModelOverviewConstants.LM_DATA_CHANGED) {
+                return {
+                    ...state,
+                    data: {
+                        description: action.description
+                    },
+                    formReady: null,
+                    formName: VLM_DESCRIPTION_FORM,
+                    genericFieldInfo: {
+                        description: {
+                            isValid: true,
+                            errorText: '',
+                            validations: [
+                                { type: 'required', data: true },
+                                { type: 'maxLength', data: 1000 }
+                            ]
+                        }
+                    }
+                };
+                //return action.description;
+            } else {
+                return state;
+            }
+        })
+    }),
+    limitEditor: createPlainDataReducer(limitEditorReducer),
+    activityLog: activityLogReducer
 });
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModelValidations.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModelValidations.js
index 64bae3b6a0..340d345609 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModelValidations.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/LicenseModelValidations.js
@@ -14,28 +14,34 @@
  * permissions and limitations under the License.
  */
 import i18n from 'nfvo-utils/i18n/i18n.js';
-import {thresholdUnitType} from './LicenseModelConstants.js';
+import { thresholdUnitType } from './LicenseModelConstants.js';
 import Validator from 'nfvo-utils/Validator.js';
 
 export function validateStartDate(value, state) {
-	if (state.data.expiryDate) {
-		if (!value) {
-			return {isValid: false, errorText: i18n('Start date has to be specified if expiry date is specified')};
-		}
-	}
-	return {isValid: true, errorText: ''};
+    if (state.data.expiryDate) {
+        if (!value) {
+            return {
+                isValid: false,
+                errorText: i18n(
+                    'Start date has to be specified if expiry date is specified'
+                )
+            };
+        }
+    }
+    return { isValid: true, errorText: '' };
 }
 
 export function thresholdValueValidation(value, state) {
-	let  unit = state.data.thresholdUnits;
-	if (unit === thresholdUnitType.PERCENTAGE) {
-		return Validator.validate('thresholdValue', value, [
-			{type: 'numeric', data: true},
-			{type: 'maximum', data: 100},
-			{type: 'minimum', data: 0}]);
-	} else {
-		return Validator.validate('thresholdValue', value, [
-			{type: 'numeric', data: true},
-		]);
-	}
+    let unit = state.data.thresholdUnits;
+    if (unit === thresholdUnitType.PERCENTAGE) {
+        return Validator.validate('thresholdValue', value, [
+            { type: 'numeric', data: true },
+            { type: 'maximum', data: 100 },
+            { type: 'minimum', data: 0 }
+        ]);
+    } else {
+        return Validator.validate('thresholdValue', value, [
+            { type: 'numeric', data: true }
+        ]);
+    }
 }
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreation.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreation.js
index bcd6e7fe5b..4bbab865fa 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreation.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreation.js
@@ -13,48 +13,84 @@
  * 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 LicenseModelCreationActionHelper from './LicenseModelCreationActionHelper.js';
 import LicenseModelCreationView from './LicenseModelCreationView.jsx';
 import ValidationHelper from 'sdc-app/common/helpers/ValidationHelper.js';
 import LicenseModelActionHelper from 'sdc-app/onboarding/licenseModel/LicenseModelActionHelper.js';
 import VersionsPageActionHelper from 'sdc-app/onboarding/versionsPage/VersionsPageActionHelper.js';
-import {itemTypes as versionItemTypes} from 'sdc-app/onboarding/versionsPage/VersionsPageConstants.js';
+import { itemTypes as versionItemTypes } from 'sdc-app/onboarding/versionsPage/VersionsPageConstants.js';
 import ScreensHelper from 'sdc-app/common/helpers/ScreensHelper.js';
-import {enums, screenTypes} from 'sdc-app/onboarding/OnboardingConstants.js';
+import { enums, screenTypes } from 'sdc-app/onboarding/OnboardingConstants.js';
 import PermissionsActionHelper from 'sdc-app/onboarding/permissions/PermissionsActionHelper.js';
 
-export const mapStateToProps = ({users: {usersList}, licenseModelList, finalizedLicenseModelList, archivedLicenseModelList, licenseModel: {licenseModelCreation}}) => {
-	let {genericFieldInfo} = licenseModelCreation;
-	let isFormValid = ValidationHelper.checkFormValid(genericFieldInfo);
-	let VLMNames = {};
+export const mapStateToProps = ({
+    users: { usersList },
+    licenseModelList,
+    finalizedLicenseModelList,
+    archivedLicenseModelList,
+    licenseModel: { licenseModelCreation }
+}) => {
+    let { genericFieldInfo } = licenseModelCreation;
+    let isFormValid = ValidationHelper.checkFormValid(genericFieldInfo);
+    let VLMNames = {};
 
-	const allVlmList = [...licenseModelList, ...finalizedLicenseModelList,...archivedLicenseModelList];
-	allVlmList.map((item) => {
-		VLMNames[item.name.toLowerCase()] = item.id;
-	});
+    const allVlmList = [
+        ...licenseModelList,
+        ...finalizedLicenseModelList,
+        ...archivedLicenseModelList
+    ];
+    allVlmList.map(item => {
+        VLMNames[item.name.toLowerCase()] = item.id;
+    });
 
-	return {...licenseModelCreation, isFormValid: isFormValid, VLMNames, usersList};
+    return {
+        ...licenseModelCreation,
+        isFormValid: isFormValid,
+        VLMNames,
+        usersList
+    };
 };
 
-export const mapActionsToProps = (dispatch) => {
-	return {
-		onDataChanged: (deltaData, formName, customValidations) => ValidationHelper.dataChanged(dispatch, {deltaData, formName, customValidations}),
-		onCancel: () => LicenseModelCreationActionHelper.close(dispatch),
-		onSubmit: (licenseModel, usersList) => {
-			LicenseModelCreationActionHelper.close(dispatch);
-			LicenseModelCreationActionHelper.createLicenseModel(dispatch, {licenseModel}).then(response => {
-				let {itemId, version} = response;
-				LicenseModelActionHelper.fetchLicenseModels(dispatch).then(() =>
-					PermissionsActionHelper.fetchItemUsers(dispatch, {itemId, allUsers: usersList}).then(() =>
-						VersionsPageActionHelper.fetchVersions(dispatch, {itemType: versionItemTypes.LICENSE_MODEL, itemId}).then(() =>
-							ScreensHelper.loadScreen(dispatch, {screen: enums.SCREEN.LICENSE_MODEL_OVERVIEW, screenType: screenTypes.LICENSE_MODEL,
-								props: {licenseModelId: itemId, version}})
-				)));
-			});
-		},
-		onValidateForm: (formName) => ValidationHelper.validateForm(dispatch, formName)
-	};
+export const mapActionsToProps = dispatch => {
+    return {
+        onDataChanged: (deltaData, formName, customValidations) =>
+            ValidationHelper.dataChanged(dispatch, {
+                deltaData,
+                formName,
+                customValidations
+            }),
+        onCancel: () => LicenseModelCreationActionHelper.close(dispatch),
+        onSubmit: (licenseModel, usersList) => {
+            LicenseModelCreationActionHelper.close(dispatch);
+            LicenseModelCreationActionHelper.createLicenseModel(dispatch, {
+                licenseModel
+            }).then(response => {
+                let { itemId, version } = response;
+                LicenseModelActionHelper.fetchLicenseModels(dispatch).then(() =>
+                    PermissionsActionHelper.fetchItemUsers(dispatch, {
+                        itemId,
+                        allUsers: usersList
+                    }).then(() =>
+                        VersionsPageActionHelper.fetchVersions(dispatch, {
+                            itemType: versionItemTypes.LICENSE_MODEL,
+                            itemId
+                        }).then(() =>
+                            ScreensHelper.loadScreen(dispatch, {
+                                screen: enums.SCREEN.LICENSE_MODEL_OVERVIEW,
+                                screenType: screenTypes.LICENSE_MODEL,
+                                props: { licenseModelId: itemId, version }
+                            })
+                        )
+                    )
+                );
+            });
+        },
+        onValidateForm: formName =>
+            ValidationHelper.validateForm(dispatch, formName)
+    };
 };
 
-export default connect(mapStateToProps, mapActionsToProps)(LicenseModelCreationView);
+export default connect(mapStateToProps, mapActionsToProps)(
+    LicenseModelCreationView
+);
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreationActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreationActionHelper.js
index 87df1386b6..e2b8d55ffe 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreationActionHelper.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreationActionHelper.js
@@ -15,59 +15,56 @@
  */
 import RestAPIUtil from 'nfvo-utils/RestAPIUtil.js';
 import Configuration from 'sdc-app/config/Configuration.js';
-import {actionTypes} from './LicenseModelCreationConstants.js';
-import {modalContentMapper} from 'sdc-app/common/modal/ModalContentMapper.js';
-import {actionTypes as modalActionTypes} from 'nfvo-components/modal/GlobalModalConstants.js';
+import { actionTypes } from './LicenseModelCreationConstants.js';
+import { modalContentMapper } from 'sdc-app/common/modal/ModalContentMapper.js';
+import { actionTypes as modalActionTypes } from 'nfvo-components/modal/GlobalModalConstants.js';
 import i18n from 'nfvo-utils/i18n/i18n.js';
 
 function baseUrl() {
-	const restPrefix = Configuration.get('restPrefix');
-	return `${restPrefix}/v1.0/vendor-license-models/`;
+    const restPrefix = Configuration.get('restPrefix');
+    return `${restPrefix}/v1.0/vendor-license-models/`;
 }
 
 function createLicenseModel(licenseModel) {
-	return RestAPIUtil.post(baseUrl(), {
-		vendorName: licenseModel.vendorName,
-		description: licenseModel.description,
-		iconRef: 'icon'
-	});
+    return RestAPIUtil.post(baseUrl(), {
+        vendorName: licenseModel.vendorName,
+        description: licenseModel.description,
+        iconRef: 'icon'
+    });
 }
 
-
 export default {
+    open(dispatch) {
+        dispatch({
+            type: actionTypes.OPEN
+        });
 
-	open(dispatch) {
-		dispatch({
-			type: actionTypes.OPEN
-		});
-
-		dispatch({
-			type: modalActionTypes.GLOBAL_MODAL_SHOW,
-			data: {
-				modalComponentName: modalContentMapper.LICENSE_MODEL_CREATION,
-				title: i18n('New License Model')
-			}
-		});
-	},
-
-	close(dispatch){
-		dispatch({
-			type: actionTypes.CLOSE
-		});
+        dispatch({
+            type: modalActionTypes.GLOBAL_MODAL_SHOW,
+            data: {
+                modalComponentName: modalContentMapper.LICENSE_MODEL_CREATION,
+                title: i18n('New License Model')
+            }
+        });
+    },
 
-		dispatch({
-			type: modalActionTypes.GLOBAL_MODAL_CLOSE
-		});
-	},
+    close(dispatch) {
+        dispatch({
+            type: actionTypes.CLOSE
+        });
 
-	createLicenseModel(dispatch, {licenseModel}){
-		return createLicenseModel(licenseModel).then(result => {
-			dispatch({
-				type: actionTypes.LICENSE_MODEL_CREATED,
-				result
-			});
-			return result;
-		});
-	}
+        dispatch({
+            type: modalActionTypes.GLOBAL_MODAL_CLOSE
+        });
+    },
 
+    createLicenseModel(dispatch, { licenseModel }) {
+        return createLicenseModel(licenseModel).then(result => {
+            dispatch({
+                type: actionTypes.LICENSE_MODEL_CREATED,
+                result
+            });
+            return result;
+        });
+    }
 };
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreationConstants.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreationConstants.js
index e9b1c46bef..1cd61a9e4b 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreationConstants.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreationConstants.js
@@ -16,9 +16,9 @@
 import keyMirror from 'nfvo-utils/KeyMirror.js';
 
 export const actionTypes = keyMirror({
-	OPEN: null,
-	CLOSE: null,
-	LICENSE_MODEL_CREATED: null
+    OPEN: null,
+    CLOSE: null,
+    LICENSE_MODEL_CREATED: null
 });
 
 export const LICENSE_MODEL_CREATION_FORM_NAME = 'LMCREATIONFORM';
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreationReducer.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreationReducer.js
index 879d356de2..7137230cc7 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreationReducer.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreationReducer.js
@@ -13,32 +13,41 @@
  * or implied. See the License for the specific language governing
  * permissions and limitations under the License.
  */
-import {actionTypes, LICENSE_MODEL_CREATION_FORM_NAME} from './LicenseModelCreationConstants.js';
+import {
+    actionTypes,
+    LICENSE_MODEL_CREATION_FORM_NAME
+} from './LicenseModelCreationConstants.js';
 
 export default (state = {}, action) => {
-	switch (action.type) {
-		case actionTypes.OPEN:
-			return {
-				...state,
-				formReady: null,
-				formName: LICENSE_MODEL_CREATION_FORM_NAME,
-				data: {},
-				genericFieldInfo: {
-					'description' : {
-						isValid: true,
-						errorText: '',
-						validations: [{type: 'required', data: true}, {type: 'maxLength', data: 1000}]
-					},
-					'vendorName' : {
-						isValid: true,
-						errorText: '',
-						validations: [{type: 'required', data: true}, {type: 'maxLength', data: 25}]
-					}
-				}
-			};
-		case actionTypes.CLOSE:
-			return {};
-		default:
-			return state;
-	}
+    switch (action.type) {
+        case actionTypes.OPEN:
+            return {
+                ...state,
+                formReady: null,
+                formName: LICENSE_MODEL_CREATION_FORM_NAME,
+                data: {},
+                genericFieldInfo: {
+                    description: {
+                        isValid: true,
+                        errorText: '',
+                        validations: [
+                            { type: 'required', data: true },
+                            { type: 'maxLength', data: 1000 }
+                        ]
+                    },
+                    vendorName: {
+                        isValid: true,
+                        errorText: '',
+                        validations: [
+                            { type: 'required', data: true },
+                            { type: 'maxLength', data: 25 }
+                        ]
+                    }
+                }
+            };
+        case actionTypes.CLOSE:
+            return {};
+        default:
+            return state;
+    }
 };
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreationView.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreationView.jsx
index 948bdc158d..59c4152213 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreationView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/creation/LicenseModelCreationView.jsx
@@ -19,84 +19,112 @@ import i18n from 'nfvo-utils/i18n/i18n.js';
 import Validator from 'nfvo-utils/Validator.js';
 import Input from 'nfvo-components/input/validation/Input.jsx';
 import Form from 'nfvo-components/input/validation/Form.jsx';
-import {LICENSE_MODEL_CREATION_FORM_NAME} from './LicenseModelCreationConstants.js';
+import { LICENSE_MODEL_CREATION_FORM_NAME } from './LicenseModelCreationConstants.js';
 
 const LicenseModelPropType = PropTypes.shape({
-	id: PropTypes.string,
-	vendorName: PropTypes.string,
-	description: PropTypes.string
+    id: PropTypes.string,
+    vendorName: PropTypes.string,
+    description: PropTypes.string
 });
 
 class LicenseModelCreationView extends React.Component {
+    static propTypes = {
+        data: LicenseModelPropType,
+        VLMNames: PropTypes.object,
+        usersList: PropTypes.array,
+        onDataChanged: PropTypes.func.isRequired,
+        onSubmit: PropTypes.func.isRequired,
+        onValidateForm: PropTypes.func.isRequired,
+        onCancel: PropTypes.func.isRequired
+    };
 
-	static propTypes = {
-		data: LicenseModelPropType,
-		VLMNames: PropTypes.object,
-		usersList: PropTypes.array,
-		onDataChanged: PropTypes.func.isRequired,
-		onSubmit: PropTypes.func.isRequired,
-		onValidateForm: PropTypes.func.isRequired,
-		onCancel: PropTypes.func.isRequired
-	};
+    render() {
+        let { data = {}, onDataChanged, genericFieldInfo } = this.props;
+        let { vendorName, description } = data;
+        return (
+            <div>
+                {genericFieldInfo && (
+                    <Form
+                        ref="validationForm"
+                        hasButtons={true}
+                        onSubmit={() => this.submit()}
+                        submitButtonText={i18n('Create')}
+                        onReset={() => this.props.onCancel()}
+                        labledButtons={true}
+                        isValid={this.props.isFormValid}
+                        formReady={this.props.formReady}
+                        onValidateForm={() => this.validate()}>
+                        <Input
+                            value={vendorName}
+                            label={i18n('Vendor Name')}
+                            data-test-id="vendor-name"
+                            onChange={vendorName =>
+                                onDataChanged(
+                                    { vendorName },
+                                    LICENSE_MODEL_CREATION_FORM_NAME,
+                                    {
+                                        vendorName: name =>
+                                            this.validateName(name)
+                                    }
+                                )
+                            }
+                            isValid={genericFieldInfo.vendorName.isValid}
+                            errorText={genericFieldInfo.vendorName.errorText}
+                            type="text"
+                            isRequired={true}
+                            className="field-section"
+                        />
+                        <Input
+                            isRequired={true}
+                            value={description}
+                            label={i18n('Description')}
+                            data-test-id="vendor-description"
+                            overlayPos="bottom"
+                            onChange={description =>
+                                onDataChanged(
+                                    { description },
+                                    LICENSE_MODEL_CREATION_FORM_NAME
+                                )
+                            }
+                            isValid={genericFieldInfo.description.isValid}
+                            errorText={genericFieldInfo.description.errorText}
+                            type="textarea"
+                            className="field-section"
+                        />
+                    </Form>
+                )}
+            </div>
+        );
+    }
 
-	render() {
-		let {data = {}, onDataChanged, genericFieldInfo} = this.props;
-		let {vendorName, description} = data;
-		return (
-			<div>
-				{genericFieldInfo && <Form
-					ref='validationForm'
-					hasButtons={true}
-					onSubmit={ () => this.submit() }
-					submitButtonText={i18n('Create')}
-					onReset={ () => this.props.onCancel() }
-					labledButtons={true}
-					isValid={this.props.isFormValid}
-					formReady={this.props.formReady}
-					onValidateForm={() => this.validate() }>
-					<Input
-						value={vendorName}
-						label={i18n('Vendor Name')}
-						data-test-id='vendor-name'
-						onChange={vendorName => onDataChanged({vendorName}, LICENSE_MODEL_CREATION_FORM_NAME, {vendorName: name => this.validateName(name)})}
-						isValid={genericFieldInfo.vendorName.isValid}
-						errorText={genericFieldInfo.vendorName.errorText}
-						type='text'
-						isRequired={true}
-						className='field-section'/>
-					<Input
-						isRequired={true}
-						value={description}
-						label={i18n('Description')}
-						data-test-id='vendor-description'
-						overlayPos='bottom'
-						onChange={description => onDataChanged({description}, LICENSE_MODEL_CREATION_FORM_NAME)}
-						isValid={genericFieldInfo.description.isValid}
-						errorText={genericFieldInfo.description.errorText}
-						type='textarea'
-						className='field-section'/>
-				</Form>}
-			</div>
-		);
-	}
+    submit() {
+        const { data: licenseModel, usersList } = this.props;
+        this.props.onSubmit(licenseModel, usersList);
+    }
 
+    validateName(value) {
+        const { data: { id }, VLMNames } = this.props;
+        const isExists = Validator.isItemNameAlreadyExistsInList({
+            itemId: id,
+            itemName: value,
+            list: VLMNames
+        });
 
-	submit() {
-		const {data:licenseModel, usersList} = this.props;
-		this.props.onSubmit(licenseModel, usersList);
-	}
+        return !isExists
+            ? { isValid: true, errorText: '' }
+            : {
+                  isValid: false,
+                  errorText: i18n(
+                      "License model by the name '" +
+                          value +
+                          "' already exists. License model name must be unique"
+                  )
+              };
+    }
 
-	validateName(value) {
-		const {data: {id}, VLMNames} = this.props;
-		const isExists = Validator.isItemNameAlreadyExistsInList({itemId: id, itemName: value, list: VLMNames});
-
-		return !isExists ?  {isValid: true, errorText: ''} :
-			{isValid: false, errorText: i18n('License model by the name \'' + value + '\' already exists. License model name must be unique')};
-	}
-
-	validate() {
-		this.props.onValidateForm(LICENSE_MODEL_CREATION_FORM_NAME);
-	}
+    validate() {
+        this.props.onValidateForm(LICENSE_MODEL_CREATION_FORM_NAME);
+    }
 }
 
 export default LicenseModelCreationView;
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsActionHelper.js
index 84bdac804c..181fc11c9d 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsActionHelper.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsActionHelper.js
@@ -15,197 +15,281 @@
  */
 import RestAPIUtil from 'nfvo-utils/RestAPIUtil.js';
 import Configuration from 'sdc-app/config/Configuration.js';
-import {actionTypes as entitlementPoolsActionTypes } from './EntitlementPoolsConstants.js';
-import {actionTypes as limitEditorActions} from 'sdc-app/onboarding/licenseModel/limits/LimitEditorConstants.js';
-import {default as getValue, getStrValue} from 'nfvo-utils/getValue.js';
+import { actionTypes as entitlementPoolsActionTypes } from './EntitlementPoolsConstants.js';
+import { actionTypes as limitEditorActions } from 'sdc-app/onboarding/licenseModel/limits/LimitEditorConstants.js';
+import { default as getValue, getStrValue } from 'nfvo-utils/getValue.js';
 import ItemsHelper from 'sdc-app/common/helpers/ItemsHelper.js';
 
 function baseUrl(licenseModelId, version) {
-	const restPrefix = Configuration.get('restPrefix');
-	const {id: versionId} = version;
-	return `${restPrefix}/v1.0/vendor-license-models/${licenseModelId}/versions/${versionId}/entitlement-pools`;
+    const restPrefix = Configuration.get('restPrefix');
+    const { id: versionId } = version;
+    return `${restPrefix}/v1.0/vendor-license-models/${licenseModelId}/versions/${versionId}/entitlement-pools`;
 }
 
 function fetchEntitlementPoolsList(licenseModelId, version) {
-	return RestAPIUtil.fetch(`${baseUrl(licenseModelId, version)}`);
+    return RestAPIUtil.fetch(`${baseUrl(licenseModelId, version)}`);
 }
 
 function postEntitlementPool(licenseModelId, entitlementPool, version) {
-	return RestAPIUtil.post(baseUrl(licenseModelId, version), {
-		name: entitlementPool.name,
-		description: entitlementPool.description,
-		thresholdValue: entitlementPool.thresholdValue,
-		thresholdUnits: getValue(entitlementPool.thresholdUnits),
-		increments: entitlementPool.increments,
-		operationalScope: getValue(entitlementPool.operationalScope),
-		time: entitlementPool.time,
-		startDate: entitlementPool.startDate,
-		expiryDate: entitlementPool.expiryDate
-	});
+    return RestAPIUtil.post(baseUrl(licenseModelId, version), {
+        name: entitlementPool.name,
+        description: entitlementPool.description,
+        thresholdValue: entitlementPool.thresholdValue,
+        thresholdUnits: getValue(entitlementPool.thresholdUnits),
+        increments: entitlementPool.increments,
+        operationalScope: getValue(entitlementPool.operationalScope),
+        time: entitlementPool.time,
+        startDate: entitlementPool.startDate,
+        expiryDate: entitlementPool.expiryDate
+    });
 }
 
-
-function putEntitlementPool(licenseModelId, previousEntitlementPool, entitlementPool, version) {
-
-	return RestAPIUtil.put(`${baseUrl(licenseModelId, version)}/${entitlementPool.id}`, {
-		name: entitlementPool.name,
-		description: entitlementPool.description,
-		thresholdValue: entitlementPool.thresholdValue,
-		thresholdUnits: getValue(entitlementPool.thresholdUnits),
-		increments: entitlementPool.increments,
-		operationalScope: getValue(entitlementPool.operationalScope),
-		time: entitlementPool.time,
-		startDate: entitlementPool.startDate,
-		expiryDate: entitlementPool.expiryDate
-	});
+function putEntitlementPool(
+    licenseModelId,
+    previousEntitlementPool,
+    entitlementPool,
+    version
+) {
+    return RestAPIUtil.put(
+        `${baseUrl(licenseModelId, version)}/${entitlementPool.id}`,
+        {
+            name: entitlementPool.name,
+            description: entitlementPool.description,
+            thresholdValue: entitlementPool.thresholdValue,
+            thresholdUnits: getValue(entitlementPool.thresholdUnits),
+            increments: entitlementPool.increments,
+            operationalScope: getValue(entitlementPool.operationalScope),
+            time: entitlementPool.time,
+            startDate: entitlementPool.startDate,
+            expiryDate: entitlementPool.expiryDate
+        }
+    );
 }
 
 function deleteEntitlementPool(licenseModelId, entitlementPoolId, version) {
-	return RestAPIUtil.destroy(`${baseUrl(licenseModelId, version)}/${entitlementPoolId}`);
+    return RestAPIUtil.destroy(
+        `${baseUrl(licenseModelId, version)}/${entitlementPoolId}`
+    );
 }
 
 function fetchLimitsList(licenseModelId, entitlementPoolId, version) {
-	return RestAPIUtil.fetch(`${baseUrl(licenseModelId, version)}/${entitlementPoolId}/limits`);
+    return RestAPIUtil.fetch(
+        `${baseUrl(licenseModelId, version)}/${entitlementPoolId}/limits`
+    );
 }
 
 function deleteLimit(licenseModelId, entitlementPoolId, version, limitId) {
-	return RestAPIUtil.destroy(`${baseUrl(licenseModelId, version)}/${entitlementPoolId}/limits/${limitId}`);
+    return RestAPIUtil.destroy(
+        `${baseUrl(
+            licenseModelId,
+            version
+        )}/${entitlementPoolId}/limits/${limitId}`
+    );
 }
 
 function postLimit(licenseModelId, entitlementPoolId, version, limit) {
-	return RestAPIUtil.post(`${baseUrl(licenseModelId, version)}/${entitlementPoolId}/limits`, {
-		name: limit.name,
-		type: limit.type,
-		description: limit.description,
-		metric: getStrValue(limit.metric),
-		value: limit.value,
-		unit: getStrValue(limit.unit),
-		aggregationFunction: getValue(limit.aggregationFunction),
-		time: getValue(limit.time)
-	});
+    return RestAPIUtil.post(
+        `${baseUrl(licenseModelId, version)}/${entitlementPoolId}/limits`,
+        {
+            name: limit.name,
+            type: limit.type,
+            description: limit.description,
+            metric: getStrValue(limit.metric),
+            value: limit.value,
+            unit: getStrValue(limit.unit),
+            aggregationFunction: getValue(limit.aggregationFunction),
+            time: getValue(limit.time)
+        }
+    );
 }
 
 function putLimit(licenseModelId, entitlementPoolId, version, limit) {
-
-	return RestAPIUtil.put(`${baseUrl(licenseModelId, version)}/${entitlementPoolId}/limits/${limit.id}`, {
-		name: limit.name,
-		type: limit.type,
-		description: limit.description,
-		metric: getStrValue(limit.metric),
-		value: limit.value,
-		unit: getStrValue(limit.unit),
-		aggregationFunction: getValue(limit.aggregationFunction),
-		time: getValue(limit.time)
-	});
+    return RestAPIUtil.put(
+        `${baseUrl(licenseModelId, version)}/${entitlementPoolId}/limits/${
+            limit.id
+        }`,
+        {
+            name: limit.name,
+            type: limit.type,
+            description: limit.description,
+            metric: getStrValue(limit.metric),
+            value: limit.value,
+            unit: getStrValue(limit.unit),
+            aggregationFunction: getValue(limit.aggregationFunction),
+            time: getValue(limit.time)
+        }
+    );
 }
 
 export default {
+    fetchEntitlementPoolsList(dispatch, { licenseModelId, version }) {
+        return fetchEntitlementPoolsList(licenseModelId, version).then(
+            response =>
+                dispatch({
+                    type:
+                        entitlementPoolsActionTypes.ENTITLEMENT_POOLS_LIST_LOADED,
+                    response
+                })
+        );
+    },
+
+    openEntitlementPoolsEditor(
+        dispatch,
+        { entitlementPool, licenseModelId, version } = {}
+    ) {
+        if (licenseModelId && version) {
+            this.fetchLimits(dispatch, {
+                licenseModelId,
+                version,
+                entitlementPool
+            });
+        }
+        dispatch({
+            type: entitlementPoolsActionTypes.entitlementPoolsEditor.OPEN,
+            entitlementPool
+        });
+    },
+
+    deleteEntitlementPool(
+        dispatch,
+        { licenseModelId, entitlementPoolId, version }
+    ) {
+        return deleteEntitlementPool(
+            licenseModelId,
+            entitlementPoolId,
+            version
+        ).then(() => {
+            dispatch({
+                type: entitlementPoolsActionTypes.DELETE_ENTITLEMENT_POOL,
+                entitlementPoolId
+            });
+            return ItemsHelper.checkItemStatus(dispatch, {
+                itemId: licenseModelId,
+                versionId: version.id
+            });
+        });
+    },
+
+    entitlementPoolsEditorDataChanged(dispatch, { deltaData }) {
+        dispatch({
+            type:
+                entitlementPoolsActionTypes.entitlementPoolsEditor.DATA_CHANGED,
+            deltaData
+        });
+    },
+
+    closeEntitlementPoolsEditor(dispatch) {
+        dispatch({
+            type: entitlementPoolsActionTypes.entitlementPoolsEditor.CLOSE
+        });
+    },
+
+    saveEntitlementPool(
+        dispatch,
+        { licenseModelId, previousEntitlementPool, entitlementPool, version }
+    ) {
+        if (previousEntitlementPool) {
+            return putEntitlementPool(
+                licenseModelId,
+                previousEntitlementPool,
+                entitlementPool,
+                version
+            ).then(() => {
+                dispatch({
+                    type: entitlementPoolsActionTypes.EDIT_ENTITLEMENT_POOL,
+                    entitlementPool
+                });
+                return ItemsHelper.checkItemStatus(dispatch, {
+                    itemId: licenseModelId,
+                    versionId: version.id
+                });
+            });
+        } else {
+            return postEntitlementPool(
+                licenseModelId,
+                entitlementPool,
+                version
+            ).then(response => {
+                dispatch({
+                    type: entitlementPoolsActionTypes.ADD_ENTITLEMENT_POOL,
+                    entitlementPool: {
+                        ...entitlementPool,
+                        referencingFeatureGroups: [],
+                        id: response.value
+                    }
+                });
+                return ItemsHelper.checkItemStatus(dispatch, {
+                    itemId: licenseModelId,
+                    versionId: version.id
+                });
+            });
+        }
+    },
+
+    hideDeleteConfirm(dispatch) {
+        dispatch({
+            type: entitlementPoolsActionTypes.ENTITLEMENT_POOLS_DELETE_CONFIRM,
+            entitlementPoolToDelete: false
+        });
+    },
+    openDeleteEntitlementPoolConfirm(dispatch, { entitlementPool }) {
+        dispatch({
+            type: entitlementPoolsActionTypes.ENTITLEMENT_POOLS_DELETE_CONFIRM,
+            entitlementPoolToDelete: entitlementPool
+        });
+    },
+
+    fetchLimits(dispatch, { licenseModelId, version, entitlementPool }) {
+        return fetchLimitsList(
+            licenseModelId,
+            entitlementPool.id,
+            version
+        ).then(response => {
+            dispatch({
+                type:
+                    entitlementPoolsActionTypes.entitlementPoolsEditor
+                        .LIMITS_LIST_LOADED,
+                response
+            });
+        });
+    },
+
+    submitLimit(dispatch, { licenseModelId, version, entitlementPool, limit }) {
+        const propmise = limit.id
+            ? putLimit(licenseModelId, entitlementPool.id, version, limit)
+            : postLimit(licenseModelId, entitlementPool.id, version, limit);
+        return propmise.then(() => {
+            dispatch({
+                type: limitEditorActions.CLOSE
+            });
+            this.fetchLimits(dispatch, {
+                licenseModelId,
+                version,
+                entitlementPool
+            });
+            return ItemsHelper.checkItemStatus(dispatch, {
+                itemId: licenseModelId,
+                versionId: version.id
+            });
+        });
+    },
 
-	fetchEntitlementPoolsList(dispatch, {licenseModelId, version}) {
-		return fetchEntitlementPoolsList(licenseModelId, version).then(response => dispatch({
-			type: entitlementPoolsActionTypes.ENTITLEMENT_POOLS_LIST_LOADED,
-			response
-		}));
-	},
-
-	openEntitlementPoolsEditor(dispatch, {entitlementPool, licenseModelId, version} = {}) {
-		if (licenseModelId && version) {
-			this.fetchLimits(dispatch, {licenseModelId, version, entitlementPool});
-		}
-		dispatch({
-			type: entitlementPoolsActionTypes.entitlementPoolsEditor.OPEN,
-			entitlementPool
-		});
-	},
-
-	deleteEntitlementPool(dispatch, {licenseModelId, entitlementPoolId, version}) {
-		return deleteEntitlementPool(licenseModelId, entitlementPoolId, version).then(() => {
-			dispatch({
-				type: entitlementPoolsActionTypes.DELETE_ENTITLEMENT_POOL,
-				entitlementPoolId
-			});
-			return ItemsHelper.checkItemStatus(dispatch, {itemId: licenseModelId, versionId: version.id});
-		});
-	},
-
-	entitlementPoolsEditorDataChanged(dispatch, {deltaData}) {
-		dispatch({
-			type: entitlementPoolsActionTypes.entitlementPoolsEditor.DATA_CHANGED,
-			deltaData
-		});
-	},
-
-	closeEntitlementPoolsEditor(dispatch) {
-		dispatch({
-			type: entitlementPoolsActionTypes.entitlementPoolsEditor.CLOSE
-		});
-	},
-
-	saveEntitlementPool(dispatch, {licenseModelId, previousEntitlementPool, entitlementPool, version}) {
-		if (previousEntitlementPool) {
-			return putEntitlementPool(licenseModelId, previousEntitlementPool, entitlementPool, version).then(() => {
-				dispatch({
-					type: entitlementPoolsActionTypes.EDIT_ENTITLEMENT_POOL,
-					entitlementPool
-				});
-				return ItemsHelper.checkItemStatus(dispatch, {itemId: licenseModelId, versionId: version.id});
-			});
-		}
-		else {
-			return postEntitlementPool(licenseModelId, entitlementPool, version).then(response => {
-				dispatch({
-					type: entitlementPoolsActionTypes.ADD_ENTITLEMENT_POOL,
-					entitlementPool: {
-						...entitlementPool,
-						referencingFeatureGroups: [],
-						id: response.value
-					}
-				});
-				return ItemsHelper.checkItemStatus(dispatch, {itemId: licenseModelId, versionId: version.id});
-			});
-		}
-	},
-
-	hideDeleteConfirm(dispatch) {
-		dispatch({
-			type: entitlementPoolsActionTypes.ENTITLEMENT_POOLS_DELETE_CONFIRM,
-			entitlementPoolToDelete: false
-		});
-	},
-	openDeleteEntitlementPoolConfirm(dispatch, {entitlementPool}) {
-		dispatch({
-			type: entitlementPoolsActionTypes.ENTITLEMENT_POOLS_DELETE_CONFIRM,
-			entitlementPoolToDelete: entitlementPool
-		});
-	},
-
-
-
-	fetchLimits(dispatch, {licenseModelId, version, entitlementPool}) {
-		return fetchLimitsList(licenseModelId, entitlementPool.id, version). then (response => {
-			dispatch({
-				type: entitlementPoolsActionTypes.entitlementPoolsEditor.LIMITS_LIST_LOADED,
-				response
-			});
-		});
-	},
-
-	submitLimit(dispatch, {licenseModelId, version, entitlementPool, limit}) {
-		const propmise  =  limit.id ? putLimit(licenseModelId,entitlementPool.id, version, limit)
-			: postLimit(licenseModelId,entitlementPool.id, version, limit);
-		return propmise.then(() => {
-			dispatch({
-				type: limitEditorActions.CLOSE
-			});
-			this.fetchLimits(dispatch, {licenseModelId, version, entitlementPool});
-			return ItemsHelper.checkItemStatus(dispatch, {itemId: licenseModelId, versionId: version.id});
-		});
-	},
-
-	deleteLimit(dispatch, {licenseModelId, version, entitlementPool, limit}) {
-		return  deleteLimit(licenseModelId,entitlementPool.id, version, limit.id).then(() => {
-			this.fetchLimits(dispatch, {licenseModelId, version, entitlementPool});
-			return ItemsHelper.checkItemStatus(dispatch, {itemId: licenseModelId, versionId: version.id});
-		});
-	}
+    deleteLimit(dispatch, { licenseModelId, version, entitlementPool, limit }) {
+        return deleteLimit(
+            licenseModelId,
+            entitlementPool.id,
+            version,
+            limit.id
+        ).then(() => {
+            this.fetchLimits(dispatch, {
+                licenseModelId,
+                version,
+                entitlementPool
+            });
+            return ItemsHelper.checkItemStatus(dispatch, {
+                itemId: licenseModelId,
+                versionId: version.id
+            });
+        });
+    }
 };
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsConstants.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsConstants.js
index de2a87ceaf..e69ff688ab 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsConstants.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsConstants.js
@@ -15,104 +15,112 @@
  */
 import keyMirror from 'nfvo-utils/KeyMirror.js';
 import i18n from 'nfvo-utils/i18n/i18n.js';
-import InputOptions, {other as optionInputOther} from 'nfvo-components/input/validation/InputOptions.jsx';
+import InputOptions, {
+    other as optionInputOther
+} from 'nfvo-components/input/validation/InputOptions.jsx';
 
 export const actionTypes = keyMirror({
+    ENTITLEMENT_POOLS_LIST_LOADED: null,
+    ADD_ENTITLEMENT_POOL: null,
+    EDIT_ENTITLEMENT_POOL: null,
+    DELETE_ENTITLEMENT_POOL: null,
 
-	ENTITLEMENT_POOLS_LIST_LOADED: null,
-	ADD_ENTITLEMENT_POOL: null,
-	EDIT_ENTITLEMENT_POOL: null,
-	DELETE_ENTITLEMENT_POOL: null,
-
-	entitlementPoolsEditor: {
-		OPEN: null,
-		CLOSE: null,
-		DATA_CHANGED: null,
-		LIMITS_LIST_LOADED: null
-	}
-
+    entitlementPoolsEditor: {
+        OPEN: null,
+        CLOSE: null,
+        DATA_CHANGED: null,
+        LIMITS_LIST_LOADED: null
+    }
 });
 
 export const enums = keyMirror({
-	SELECTED_FEATURE_GROUP_TAB: {
-		GENERAL: 1,
-		ENTITLEMENT_POOLS: 2,
-		LICENCE_KEY_GROUPS: 3
-	},
-	SELECTED_ENTITLEMENT_POOLS_BUTTONTAB: {
-		ASSOCIATED_ENTITLEMENT_POOLS: 1,
-		AVAILABLE_ENTITLEMENT_POOLS: 2
-	}
+    SELECTED_FEATURE_GROUP_TAB: {
+        GENERAL: 1,
+        ENTITLEMENT_POOLS: 2,
+        LICENCE_KEY_GROUPS: 3
+    },
+    SELECTED_ENTITLEMENT_POOLS_BUTTONTAB: {
+        ASSOCIATED_ENTITLEMENT_POOLS: 1,
+        AVAILABLE_ENTITLEMENT_POOLS: 2
+    }
 });
 
 export const defaultState = {
-	ENTITLEMENT_POOLS_EDITOR_DATA: {
-		entitlementMetric: {choice: '', other: ''},
-		aggregationFunction: {choice: '', other: ''},
-		operationalScope: {choices: [], other: ''},
-		time: {choice: '', other: ''}
-	}
+    ENTITLEMENT_POOLS_EDITOR_DATA: {
+        entitlementMetric: { choice: '', other: '' },
+        aggregationFunction: { choice: '', other: '' },
+        operationalScope: { choices: [], other: '' },
+        time: { choice: '', other: '' }
+    }
 };
 
 export const thresholdUnitType = {
-	ABSOLUTE: 'Absolute',
-	PERCENTAGE: 'Percentage'
+    ABSOLUTE: 'Absolute',
+    PERCENTAGE: 'Percentage'
 };
 
 export const optionsInputValues = {
-	OPERATIONAL_SCOPE: [
-		{enum: '', title: i18n('please select…')},
-		{enum: 'Network_Wide', title: 'Network Wide'},
-		{enum: 'Availability_Zone', title: 'Availability Zone'},
-		{enum: 'Data_Center', title: 'Data Center'},
-		{enum: 'Tenant', title: 'Tenant'},
-		{enum: 'VM', title: 'VM'},
-		{enum: 'CPU', title: 'CPU'},
-		{enum: 'Core', title: 'Core'}
-	],
-	TIME: [
-		{enum: '', title: i18n('please select…')},
-		{enum: 'Hour', title: 'Hour'},
-		{enum: 'Day', title: 'Day'},
-		{enum: 'Month', title: 'Month'}
-	],
-	AGGREGATE_FUNCTION: [
-		{enum: '', title: i18n('please select…')},
-		{enum: 'Peak', title: 'Peak'},
-		{enum: 'Average', title: 'Average'}
-	],
-	ENTITLEMENT_METRIC: [
-		{enum: '', title: i18n('please select…')},
-		{enum: 'Software_Instances_Count', title: 'Software Instances'},
-		{enum: 'Core', title: 'Core'},
-		{enum: 'CPU', title: 'CPU'},
-		{enum: 'Trunks', title: 'Trunks'},
-		{enum: 'User', title: 'User'},
-		{enum: 'Subscribers', title: 'Subscribers'},
-		{enum: 'Tenants', title: 'Tenants'},
-		{enum: 'Tokens', title: 'Tokens'},
-		{enum: 'Seats', title: 'Seats'},
-		{enum: 'Units_TB', title: 'Units-TB'},
-		{enum: 'Units_GB', title: 'Units-GB'},
-		{enum: 'Units_MB', title: 'Units-MB'}
-	]
+    OPERATIONAL_SCOPE: [
+        { enum: '', title: i18n('please select…') },
+        { enum: 'Network_Wide', title: 'Network Wide' },
+        { enum: 'Availability_Zone', title: 'Availability Zone' },
+        { enum: 'Data_Center', title: 'Data Center' },
+        { enum: 'Tenant', title: 'Tenant' },
+        { enum: 'VM', title: 'VM' },
+        { enum: 'CPU', title: 'CPU' },
+        { enum: 'Core', title: 'Core' }
+    ],
+    TIME: [
+        { enum: '', title: i18n('please select…') },
+        { enum: 'Hour', title: 'Hour' },
+        { enum: 'Day', title: 'Day' },
+        { enum: 'Month', title: 'Month' }
+    ],
+    AGGREGATE_FUNCTION: [
+        { enum: '', title: i18n('please select…') },
+        { enum: 'Peak', title: 'Peak' },
+        { enum: 'Average', title: 'Average' }
+    ],
+    ENTITLEMENT_METRIC: [
+        { enum: '', title: i18n('please select…') },
+        { enum: 'Software_Instances_Count', title: 'Software Instances' },
+        { enum: 'Core', title: 'Core' },
+        { enum: 'CPU', title: 'CPU' },
+        { enum: 'Trunks', title: 'Trunks' },
+        { enum: 'User', title: 'User' },
+        { enum: 'Subscribers', title: 'Subscribers' },
+        { enum: 'Tenants', title: 'Tenants' },
+        { enum: 'Tokens', title: 'Tokens' },
+        { enum: 'Seats', title: 'Seats' },
+        { enum: 'Units_TB', title: 'Units-TB' },
+        { enum: 'Units_GB', title: 'Units-GB' },
+        { enum: 'Units_MB', title: 'Units-MB' }
+    ]
 };
 
-export const extractValue = (item) => {
-	if (item === undefined) {return '';} //TODO fix it later
-	return  item ? item.choice === optionInputOther.OTHER ? item.other : InputOptions.getTitleByName(optionsInputValues, item.choice) : '';
+export const extractValue = item => {
+    if (item === undefined) {
+        return '';
+    } //TODO fix it later
+    return item
+        ? item.choice === optionInputOther.OTHER
+          ? item.other
+          : InputOptions.getTitleByName(optionsInputValues, item.choice)
+        : '';
 };
 
-export const extractUnits = (units) => {
-	if (units === undefined) {return '';} //TODO fix it later
-	return units === 'Absolute' ? '' : '%';
+export const extractUnits = units => {
+    if (units === undefined) {
+        return '';
+    } //TODO fix it later
+    return units === 'Absolute' ? '' : '%';
 };
 
 export const tabIds = {
-	GENERAL: 'GENERAL',
-	SP_LIMITS: 'SP_LIMITS',
-	VENDOR_LIMITS: 'VENDOR_LIMITS',
-	ADD_LIMIT_BUTTON: 'ADD_LIMIT_BUTTON'
+    GENERAL: 'GENERAL',
+    SP_LIMITS: 'SP_LIMITS',
+    VENDOR_LIMITS: 'VENDOR_LIMITS',
+    ADD_LIMIT_BUTTON: 'ADD_LIMIT_BUTTON'
 };
 
-export const SP_ENTITLEMENT_POOL_FORM = 'SPENTITLEMENTPOOL';
\ No newline at end of file
+export const SP_ENTITLEMENT_POOL_FORM = 'SPENTITLEMENTPOOL';
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsEditor.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsEditor.js
index 23c260f793..5fcdad992a 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsEditor.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsEditor.js
@@ -13,54 +13,80 @@
  * 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 EntitlementPoolsActionHelper from './EntitlementPoolsActionHelper.js';
 import EntitlementPoolsEditorView from './EntitlementPoolsEditorView.jsx';
 import ValidationHelper from 'sdc-app/common/helpers/ValidationHelper.js';
 
 import LimitEditorActionHelper from '../limits/LimitEditorActionHelper.js';
 
-const mapStateToProps = ({licenseModel: {entitlementPool}}) => {
+const mapStateToProps = ({ licenseModel: { entitlementPool } }) => {
+    let {
+        data,
+        genericFieldInfo,
+        formReady,
+        limitsList
+    } = entitlementPool.entitlementPoolEditor;
 
+    let isFormValid = ValidationHelper.checkFormValid(genericFieldInfo);
 
-	let {data, genericFieldInfo, formReady, limitsList} = entitlementPool.entitlementPoolEditor;
+    let previousData,
+        EPNames = {};
+    const entitlementPoolId = data ? data.id : null;
+    if (entitlementPoolId) {
+        previousData = entitlementPool.entitlementPoolsList.find(
+            entitlementPool => entitlementPool.id === entitlementPoolId
+        );
+    }
 
-	let isFormValid = ValidationHelper.checkFormValid(genericFieldInfo);
+    const list = entitlementPool.entitlementPoolsList;
+    for (let i = 0; i < list.length; i++) {
+        EPNames[list[i].name.toLowerCase()] = list[i].id;
+    }
 
-	let previousData, EPNames = {};
-	const entitlementPoolId = data ? data.id : null;
-	if(entitlementPoolId) {
-		previousData = entitlementPool.entitlementPoolsList.find(entitlementPool => entitlementPool.id === entitlementPoolId);
-	}
-
-	const list = entitlementPool.entitlementPoolsList;
-	for (let i = 0; i < list.length; i++) {
-		EPNames[list[i].name.toLowerCase()] = list[i].id;
-	}
-
-	return {
-		data,
-		genericFieldInfo,
-		previousData,
-		isFormValid,
-		formReady,
-		EPNames,
-		limitsList
-	};
+    return {
+        data,
+        genericFieldInfo,
+        previousData,
+        isFormValid,
+        formReady,
+        EPNames,
+        limitsList
+    };
 };
 
-const mapActionsToProps = (dispatch, {licenseModelId, version}) => {
-	return {
-		onDataChanged: (deltaData, formName, customValidations) => ValidationHelper.dataChanged(dispatch, {deltaData, formName, customValidations}),
-		onCancel: () => EntitlementPoolsActionHelper.closeEntitlementPoolsEditor(dispatch),
-		onSubmit: ({previousEntitlementPool, entitlementPool, keepOpen}) => {
-			if (!keepOpen) {EntitlementPoolsActionHelper.closeEntitlementPoolsEditor(dispatch);}
-			EntitlementPoolsActionHelper.saveEntitlementPool(dispatch, {licenseModelId, previousEntitlementPool, entitlementPool, version});
-		},
-		onValidateForm: (formName) => ValidationHelper.validateForm(dispatch, formName),
-		onCloseLimitEditor: () => LimitEditorActionHelper.closeLimitsEditor(dispatch),
-		onOpenLimitEditor: (limit) => LimitEditorActionHelper.openLimitsEditor(dispatch, {limit})
-	};
+const mapActionsToProps = (dispatch, { licenseModelId, version }) => {
+    return {
+        onDataChanged: (deltaData, formName, customValidations) =>
+            ValidationHelper.dataChanged(dispatch, {
+                deltaData,
+                formName,
+                customValidations
+            }),
+        onCancel: () =>
+            EntitlementPoolsActionHelper.closeEntitlementPoolsEditor(dispatch),
+        onSubmit: ({ previousEntitlementPool, entitlementPool, keepOpen }) => {
+            if (!keepOpen) {
+                EntitlementPoolsActionHelper.closeEntitlementPoolsEditor(
+                    dispatch
+                );
+            }
+            EntitlementPoolsActionHelper.saveEntitlementPool(dispatch, {
+                licenseModelId,
+                previousEntitlementPool,
+                entitlementPool,
+                version
+            });
+        },
+        onValidateForm: formName =>
+            ValidationHelper.validateForm(dispatch, formName),
+        onCloseLimitEditor: () =>
+            LimitEditorActionHelper.closeLimitsEditor(dispatch),
+        onOpenLimitEditor: limit =>
+            LimitEditorActionHelper.openLimitsEditor(dispatch, { limit })
+    };
 };
 
-export default connect(mapStateToProps, mapActionsToProps)(EntitlementPoolsEditorView);
+export default connect(mapStateToProps, mapActionsToProps)(
+    EntitlementPoolsEditorView
+);
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsEditorReducer.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsEditorReducer.js
index be100f6802..4556b87129 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsEditorReducer.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsEditorReducer.js
@@ -13,87 +13,101 @@
  * or implied. See the License for the specific language governing
  * permissions and limitations under the License.
  */
-import {actionTypes, defaultState, SP_ENTITLEMENT_POOL_FORM} from './EntitlementPoolsConstants.js';
+import {
+    actionTypes,
+    defaultState,
+    SP_ENTITLEMENT_POOL_FORM
+} from './EntitlementPoolsConstants.js';
 import moment from 'moment';
-import {DATE_FORMAT} from 'sdc-app/onboarding/OnboardingConstants.js';
+import { DATE_FORMAT } from 'sdc-app/onboarding/OnboardingConstants.js';
 
 export default (state = {}, action) => {
-	switch (action.type) {
-		case actionTypes.entitlementPoolsEditor.OPEN:
-			let entitlementPoolData = {...action.entitlementPool};
-			let {startDate, expiryDate} = entitlementPoolData;
-			if (startDate) {
-				entitlementPoolData.startDate = moment(startDate, DATE_FORMAT).format(DATE_FORMAT);
-			}
-			if (expiryDate) {
-				entitlementPoolData.expiryDate = moment(expiryDate, DATE_FORMAT).format(DATE_FORMAT);
-			}
-			return {
-				...state,
-				formReady: null,
-				formName: SP_ENTITLEMENT_POOL_FORM,
-				genericFieldInfo: {
-					'name' : {
-						isValid: true,
-						errorText: '',
-						validations: [{type: 'required', data: true}, {type: 'maxLength', data: 120}]
-					},
-					'description' : {
-						isValid: true,
-						errorText: '',
-						validations: [{type: 'maxLength', data: 1000}]
-					},
-					'increments' : {
-						isValid: true,
-						errorText: '',
-						validations: [{type: 'maxLength', data: 120}]
-					},
-					'operationalScope' : {
-						isValid: true,
-						errorText: '',
-						validations: []
-					},
-					'thresholdUnits' : {
-						isValid: true,
-						errorText: '',
-						validations: []
-					},
-					'thresholdValue' : {
-						isValid: true,
-						errorText: '',
-						validations: []
-					},					
-					'startDate': {
-						isValid: true,
-						errorText: '',
-						validations: []
-					},
-					'expiryDate': {
-						isValid: true,
-						errorText: '',
-						validations: []
-					}
-				},
-				data: action.entitlementPool ? entitlementPoolData : defaultState.ENTITLEMENT_POOLS_EDITOR_DATA
-			};
-		case actionTypes.entitlementPoolsEditor.DATA_CHANGED:
-			return {
-				...state,
-				data: {
-					...state.data,
-					...action.deltaData
-				}
-			};
-		case actionTypes.entitlementPoolsEditor.CLOSE:
-			return {};
-
-		case actionTypes.entitlementPoolsEditor.LIMITS_LIST_LOADED:
-			return {
-				...state,
-				limitsList: action.response.results
-			};	
-		default:
-			return state;
-	}
+    switch (action.type) {
+        case actionTypes.entitlementPoolsEditor.OPEN:
+            let entitlementPoolData = { ...action.entitlementPool };
+            let { startDate, expiryDate } = entitlementPoolData;
+            if (startDate) {
+                entitlementPoolData.startDate = moment(
+                    startDate,
+                    DATE_FORMAT
+                ).format(DATE_FORMAT);
+            }
+            if (expiryDate) {
+                entitlementPoolData.expiryDate = moment(
+                    expiryDate,
+                    DATE_FORMAT
+                ).format(DATE_FORMAT);
+            }
+            return {
+                ...state,
+                formReady: null,
+                formName: SP_ENTITLEMENT_POOL_FORM,
+                genericFieldInfo: {
+                    name: {
+                        isValid: true,
+                        errorText: '',
+                        validations: [
+                            { type: 'required', data: true },
+                            { type: 'maxLength', data: 120 }
+                        ]
+                    },
+                    description: {
+                        isValid: true,
+                        errorText: '',
+                        validations: [{ type: 'maxLength', data: 1000 }]
+                    },
+                    increments: {
+                        isValid: true,
+                        errorText: '',
+                        validations: [{ type: 'maxLength', data: 120 }]
+                    },
+                    operationalScope: {
+                        isValid: true,
+                        errorText: '',
+                        validations: []
+                    },
+                    thresholdUnits: {
+                        isValid: true,
+                        errorText: '',
+                        validations: []
+                    },
+                    thresholdValue: {
+                        isValid: true,
+                        errorText: '',
+                        validations: []
+                    },
+                    startDate: {
+                        isValid: true,
+                        errorText: '',
+                        validations: []
+                    },
+                    expiryDate: {
+                        isValid: true,
+                        errorText: '',
+                        validations: []
+                    }
+                },
+                data: action.entitlementPool
+                    ? entitlementPoolData
+                    : defaultState.ENTITLEMENT_POOLS_EDITOR_DATA
+            };
+        case actionTypes.entitlementPoolsEditor.DATA_CHANGED:
+            return {
+                ...state,
+                data: {
+                    ...state.data,
+                    ...action.deltaData
+                }
+            };
+        case actionTypes.entitlementPoolsEditor.CLOSE:
+            return {};
 
+        case actionTypes.entitlementPoolsEditor.LIMITS_LIST_LOADED:
+            return {
+                ...state,
+                limitsList: action.response.results
+            };
+        default:
+            return state;
+    }
 };
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsEditorView.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsEditorView.jsx
index efae7f3ad2..46eda622b5 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsEditorView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsEditorView.jsx
@@ -25,307 +25,479 @@ import Form from 'nfvo-components/input/validation/Form.jsx';
 import Button from 'sdc-ui/lib/react/Button.js';
 import GridSection from 'nfvo-components/grid/GridSection.jsx';
 import GridItem from 'nfvo-components/grid/GridItem.jsx';
-import {optionsInputValues as  EntitlementPoolsOptionsInputValues, SP_ENTITLEMENT_POOL_FORM, tabIds}  from  './EntitlementPoolsConstants.js';
-import {optionsInputValues as LicenseModelOptionsInputValues} from '../LicenseModelConstants.js';
-import {validateStartDate, thresholdValueValidation} from '../LicenseModelValidations.js';
-import {DATE_FORMAT} from 'sdc-app/onboarding/OnboardingConstants.js';
-import {other as optionInputOther} from 'nfvo-components/input/validation/InputOptions.jsx';
+import {
+    optionsInputValues as EntitlementPoolsOptionsInputValues,
+    SP_ENTITLEMENT_POOL_FORM,
+    tabIds
+} from './EntitlementPoolsConstants.js';
+import { optionsInputValues as LicenseModelOptionsInputValues } from '../LicenseModelConstants.js';
+import {
+    validateStartDate,
+    thresholdValueValidation
+} from '../LicenseModelValidations.js';
+import { DATE_FORMAT } from 'sdc-app/onboarding/OnboardingConstants.js';
+import { other as optionInputOther } from 'nfvo-components/input/validation/InputOptions.jsx';
 import Tabs from 'sdc-ui/lib/react/Tabs.js';
 import Tab from 'sdc-ui/lib/react/Tab.js';
 import EntitlementPoolsLimits from './EntitlementPoolsLimits.js';
-import {limitType, NEW_LIMIT_TEMP_ID} from '../limits/LimitEditorConstants.js';
+import {
+    limitType,
+    NEW_LIMIT_TEMP_ID
+} from '../limits/LimitEditorConstants.js';
 
 const EntitlementPoolPropType = PropTypes.shape({
-	id: PropTypes.string,
-	name: PropTypes.string,
-	description: PropTypes.string,
-	operationalScope: PropTypes.shape({
-		choices: PropTypes.array,
-		other: PropTypes.string
-	}),
-	thresholdUnits: PropTypes.string,
-	thresholdValue: PropTypes.string,
-	increments: PropTypes.string,
-	startDate: PropTypes.string,
-	expiryDate: PropTypes.string
+    id: PropTypes.string,
+    name: PropTypes.string,
+    description: PropTypes.string,
+    operationalScope: PropTypes.shape({
+        choices: PropTypes.array,
+        other: PropTypes.string
+    }),
+    thresholdUnits: PropTypes.string,
+    thresholdValue: PropTypes.string,
+    increments: PropTypes.string,
+    startDate: PropTypes.string,
+    expiryDate: PropTypes.string
 });
 
-const EntitlementPoolsFormContent = ({data, genericFieldInfo, onDataChanged, validateName,
-	 thresholdValueValidation, validateStartDate}) => {
+const EntitlementPoolsFormContent = ({
+    data,
+    genericFieldInfo,
+    onDataChanged,
+    validateName,
+    thresholdValueValidation,
+    validateStartDate
+}) => {
+    let {
+        name,
+        description,
+        operationalScope,
+        thresholdUnits,
+        thresholdValue,
+        increments,
+        startDate,
+        expiryDate
+    } = data;
+    return (
+        <GridSection hasLastColSet>
+            <GridItem colSpan={2}>
+                <Input
+                    onChange={name =>
+                        onDataChanged({ name }, SP_ENTITLEMENT_POOL_FORM, {
+                            name: validateName
+                        })
+                    }
+                    isValid={genericFieldInfo.name.isValid}
+                    isRequired={true}
+                    errorText={genericFieldInfo.name.errorText}
+                    label={i18n('Name')}
+                    value={name}
+                    data-test-id="create-ep-name"
+                    type="text"
+                />
+            </GridItem>
+            <GridItem colSpan={2} lastColInRow>
+                <InputOptions
+                    onInputChange={() => {}}
+                    isMultiSelect={true}
+                    onEnumChange={operationalScope =>
+                        onDataChanged(
+                            {
+                                operationalScope: {
+                                    choices: operationalScope,
+                                    other: ''
+                                }
+                            },
+                            SP_ENTITLEMENT_POOL_FORM
+                        )
+                    }
+                    onOtherChange={operationalScope =>
+                        onDataChanged(
+                            {
+                                operationalScope: {
+                                    choices: [optionInputOther.OTHER],
+                                    other: operationalScope
+                                }
+                            },
+                            SP_ENTITLEMENT_POOL_FORM
+                        )
+                    }
+                    label={i18n('Operational Scope')}
+                    data-test-id="create-ep-operational-scope"
+                    type="select"
+                    multiSelectedEnum={
+                        operationalScope && operationalScope.choices
+                    }
+                    otherValue={operationalScope && operationalScope.other}
+                    values={
+                        EntitlementPoolsOptionsInputValues.OPERATIONAL_SCOPE
+                    }
+                    isValid={genericFieldInfo.operationalScope.isValid}
+                    errorText={genericFieldInfo.operationalScope.errorText}
+                />
+            </GridItem>
+            <GridItem colSpan={2} stretch>
+                <Input
+                    onChange={description =>
+                        onDataChanged({ description }, SP_ENTITLEMENT_POOL_FORM)
+                    }
+                    isValid={genericFieldInfo.description.isValid}
+                    errorText={genericFieldInfo.description.errorText}
+                    label={i18n('Description')}
+                    value={description}
+                    data-test-id="create-ep-description"
+                    type="textarea"
+                />
+            </GridItem>
+            <GridItem colSpan={2} lastColInRow>
+                <div className="threshold-section">
+                    <Input
+                        onChange={e => {
+                            // setting the unit to the correct value
+                            const selectedIndex = e.target.selectedIndex;
+                            const val = e.target.options[selectedIndex].value;
+                            onDataChanged(
+                                { thresholdUnits: val },
+                                SP_ENTITLEMENT_POOL_FORM
+                            );
+                            // TODO make sure that the value is valid too
+                            if (thresholdValue && thresholdValue !== '') {
+                                onDataChanged(
+                                    { thresholdValue: thresholdValue },
+                                    SP_ENTITLEMENT_POOL_FORM,
+                                    { thresholdValue: thresholdValueValidation }
+                                );
+                            }
+                        }}
+                        value={thresholdUnits}
+                        label={i18n('Threshold Units')}
+                        data-test-id="create-ep-threshold-units"
+                        isValid={genericFieldInfo.thresholdUnits.isValid}
+                        errorText={genericFieldInfo.thresholdUnits.errorText}
+                        groupClassName="bootstrap-input-options"
+                        className="input-options-select"
+                        type="select">
+                        {LicenseModelOptionsInputValues.THRESHOLD_UNITS.map(
+                            mtype => (
+                                <option key={mtype.enum} value={mtype.enum}>{`${
+                                    mtype.title
+                                }`}</option>
+                            )
+                        )}
+                    </Input>
 
-	let {name, description, operationalScope, thresholdUnits, thresholdValue,
-		increments, startDate, expiryDate} = data;
-	return (
-		<GridSection hasLastColSet>
-			<GridItem colSpan={2}>
-				<Input
-					onChange={name => onDataChanged({name}, SP_ENTITLEMENT_POOL_FORM, {name: validateName})}
-					isValid={genericFieldInfo.name.isValid}
-					isRequired={true}
-					errorText={genericFieldInfo.name.errorText}
-					label={i18n('Name')}
-					value={name}
-					data-test-id='create-ep-name'
-					type='text'/>
-			</GridItem>
-			<GridItem colSpan={2} lastColInRow>
-				<InputOptions
-					onInputChange={()=>{}}
-					isMultiSelect={true}
-					onEnumChange={operationalScope => onDataChanged({operationalScope:{choices: operationalScope, other: ''}},
-						SP_ENTITLEMENT_POOL_FORM)}
-					onOtherChange={operationalScope => onDataChanged({operationalScope:{choices: [optionInputOther.OTHER],
-						other: operationalScope}}, SP_ENTITLEMENT_POOL_FORM)}
-					label={i18n('Operational Scope')}
-					data-test-id='create-ep-operational-scope'
-					type='select'
-					multiSelectedEnum={operationalScope && operationalScope.choices}
-					otherValue={operationalScope && operationalScope.other}
-					values={EntitlementPoolsOptionsInputValues.OPERATIONAL_SCOPE}
-					isValid={genericFieldInfo.operationalScope.isValid}
-					errorText={genericFieldInfo.operationalScope.errorText} />
-			</GridItem>
-			<GridItem colSpan={2} stretch>
-				<Input
-					onChange={description => onDataChanged({description}, SP_ENTITLEMENT_POOL_FORM)}
-					isValid={genericFieldInfo.description.isValid}
-					errorText={genericFieldInfo.description.errorText}
-					label={i18n('Description')}
-					value={description}
-					data-test-id='create-ep-description'
-					type='textarea'/>
-			</GridItem>
-			<GridItem colSpan={2} lastColInRow>
-				<div className='threshold-section'>
-					<Input
-						onChange={e => {
-							// setting the unit to the correct value
-							const selectedIndex = e.target.selectedIndex;
-							const val = e.target.options[selectedIndex].value;
-							onDataChanged({thresholdUnits: val}, SP_ENTITLEMENT_POOL_FORM);
-							// TODO make sure that the value is valid too
-							if(thresholdValue && thresholdValue !== '') {
-								onDataChanged({thresholdValue: thresholdValue}, SP_ENTITLEMENT_POOL_FORM,{thresholdValue : thresholdValueValidation});
-							}}
-
-						}
-						value={thresholdUnits}
-						label={i18n('Threshold Units')}
-						data-test-id='create-ep-threshold-units'
-						isValid={genericFieldInfo.thresholdUnits.isValid}
-						errorText={genericFieldInfo.thresholdUnits.errorText}
-						groupClassName='bootstrap-input-options'
-						className='input-options-select'
-						type='select' >
-						{LicenseModelOptionsInputValues.THRESHOLD_UNITS.map(mtype =>
-							<option key={mtype.enum} value={mtype.enum}>{`${mtype.title}`}</option>)}
-					</Input>
-
-					<Input
-						className='entitlement-pools-form-row-threshold-value'
-						onChange={thresholdValue => onDataChanged({thresholdValue}, SP_ENTITLEMENT_POOL_FORM,
-							{thresholdValue : thresholdValueValidation})}
-						label={i18n('Threshold Value')}
-						isValid={genericFieldInfo.thresholdValue.isValid}
-						errorText={genericFieldInfo.thresholdValue.errorText}
-						data-test-id='create-ep-threshold-value'
-						value={thresholdValue}
-						type='text'/>
-				</div>
-				<Input
-					onChange={increments => onDataChanged({increments}, SP_ENTITLEMENT_POOL_FORM)}
-					label={i18n('Increments')}
-					value={increments}
-					data-test-id='create-ep-increments'
-					type='text'/>
-				<div className='date-section'>
-					<Input
-						type='date'
-						label={i18n('Start Date')}
-						value={startDate}
-						dateFormat={DATE_FORMAT}
-						startDate={startDate}
-						endDate={expiryDate}
-						onChange={startDate => onDataChanged(
-							{startDate: startDate ? startDate.format(DATE_FORMAT) : ''},
-							SP_ENTITLEMENT_POOL_FORM,
-							{startDate: validateStartDate}
-						)}
-						isValid={genericFieldInfo.startDate.isValid}
-						errorText={genericFieldInfo.startDate.errorText}
-						selectsStart/>
-					<Input
-						type='date'
-						label={i18n('Expiry Date')}
-						value={expiryDate}
-						dateFormat={DATE_FORMAT}
-						startDate={startDate}
-						endDate={expiryDate}
-						onChange={expiryDate => {
-							onDataChanged({expiryDate: expiryDate ? expiryDate.format(DATE_FORMAT) : ''}, SP_ENTITLEMENT_POOL_FORM);
-							onDataChanged({startDate}, SP_ENTITLEMENT_POOL_FORM, {startDate: validateStartDate});
-						}}
-						isValid={genericFieldInfo.expiryDate.isValid}
-						errorText={genericFieldInfo.expiryDate.errorText}
-						selectsEnd/>
-				</div>
-			</GridItem>
-		</GridSection>
-	);
+                    <Input
+                        className="entitlement-pools-form-row-threshold-value"
+                        onChange={thresholdValue =>
+                            onDataChanged(
+                                { thresholdValue },
+                                SP_ENTITLEMENT_POOL_FORM,
+                                {
+                                    thresholdValue: thresholdValueValidation
+                                }
+                            )
+                        }
+                        label={i18n('Threshold Value')}
+                        isValid={genericFieldInfo.thresholdValue.isValid}
+                        errorText={genericFieldInfo.thresholdValue.errorText}
+                        data-test-id="create-ep-threshold-value"
+                        value={thresholdValue}
+                        type="text"
+                    />
+                </div>
+                <Input
+                    onChange={increments =>
+                        onDataChanged({ increments }, SP_ENTITLEMENT_POOL_FORM)
+                    }
+                    label={i18n('Increments')}
+                    value={increments}
+                    data-test-id="create-ep-increments"
+                    type="text"
+                />
+                <div className="date-section">
+                    <Input
+                        type="date"
+                        label={i18n('Start Date')}
+                        value={startDate}
+                        dateFormat={DATE_FORMAT}
+                        startDate={startDate}
+                        endDate={expiryDate}
+                        onChange={startDate =>
+                            onDataChanged(
+                                {
+                                    startDate: startDate
+                                        ? startDate.format(DATE_FORMAT)
+                                        : ''
+                                },
+                                SP_ENTITLEMENT_POOL_FORM,
+                                { startDate: validateStartDate }
+                            )
+                        }
+                        isValid={genericFieldInfo.startDate.isValid}
+                        errorText={genericFieldInfo.startDate.errorText}
+                        selectsStart
+                    />
+                    <Input
+                        type="date"
+                        label={i18n('Expiry Date')}
+                        value={expiryDate}
+                        dateFormat={DATE_FORMAT}
+                        startDate={startDate}
+                        endDate={expiryDate}
+                        onChange={expiryDate => {
+                            onDataChanged(
+                                {
+                                    expiryDate: expiryDate
+                                        ? expiryDate.format(DATE_FORMAT)
+                                        : ''
+                                },
+                                SP_ENTITLEMENT_POOL_FORM
+                            );
+                            onDataChanged(
+                                { startDate },
+                                SP_ENTITLEMENT_POOL_FORM,
+                                {
+                                    startDate: validateStartDate
+                                }
+                            );
+                        }}
+                        isValid={genericFieldInfo.expiryDate.isValid}
+                        errorText={genericFieldInfo.expiryDate.errorText}
+                        selectsEnd
+                    />
+                </div>
+            </GridItem>
+        </GridSection>
+    );
 };
 
 class EntitlementPoolsEditorView extends React.Component {
+    static propTypes = {
+        data: EntitlementPoolPropType,
+        previousData: EntitlementPoolPropType,
+        EPNames: PropTypes.object,
+        isReadOnlyMode: PropTypes.bool,
+        onDataChanged: PropTypes.func.isRequired,
+        onSubmit: PropTypes.func.isRequired,
+        onCancel: PropTypes.func.isRequired
+    };
 
-	static propTypes = {
-		data: EntitlementPoolPropType,
-		previousData: EntitlementPoolPropType,
-		EPNames: PropTypes.object,
-		isReadOnlyMode: PropTypes.bool,
-		onDataChanged: PropTypes.func.isRequired,
-		onSubmit: PropTypes.func.isRequired,
-		onCancel: PropTypes.func.isRequired
-	};
-
-	static defaultProps = {
-		data: {}
-	};
-
-	componentDidUpdate(prevProps) {
-		if (this.props.formReady && this.props.formReady !== prevProps.formReady) { // if form validation succeeded -> continue with submit
-			this.submit();
-		}
-	}
+    static defaultProps = {
+        data: {}
+    };
 
-	state = {
-		selectedTab: tabIds.GENERAL,
-		selectedLimit: ''
-	};
+    componentDidUpdate(prevProps) {
+        if (
+            this.props.formReady &&
+            this.props.formReady !== prevProps.formReady
+        ) {
+            // if form validation succeeded -> continue with submit
+            this.submit();
+        }
+    }
 
-	render() {
-		let {data = {}, onDataChanged, isReadOnlyMode, genericFieldInfo, onCloseLimitEditor, limitsList = []} = this.props;
-		const {selectedTab} = this.state;
-		const isTabsDisabled = !data.id || !this.props.isFormValid;
+    state = {
+        selectedTab: tabIds.GENERAL,
+        selectedLimit: ''
+    };
 
-		return (
-			<div>
-			<Tabs
-				type='menu'
-				activeTab={selectedTab}
-				onTabClick={(tabIndex)=>{
-					if (tabIndex === tabIds.ADD_LIMIT_BUTTON)  {
-						this.onAddLimit();
-					} else {
-						this.setState({selectedTab: tabIndex});
-						this.setState({selectedLimit: ''});
-						onCloseLimitEditor();
-					}
-				}}
-				invalidTabs={[]}>
-				<Tab tabId={tabIds.GENERAL} data-test-id='general-tab' title={i18n('General')}>
-					{
-						genericFieldInfo && <Form
-							ref='validationForm'
-							hasButtons={false}
-							labledButtons={false}
-							isReadOnlyMode={isReadOnlyMode}
-							isValid={this.props.isFormValid}
-							formReady={this.props.formReady}
-							onValidateForm={() => this.props.onValidateForm(SP_ENTITLEMENT_POOL_FORM) }
-							className='license-model-form entitlement-pools-form'>
-							<EntitlementPoolsFormContent
-								data={data}
-								genericFieldInfo={genericFieldInfo}
-								onDataChanged={onDataChanged}
-								validateName={(value) => this.validateName(value)}
-								validateStartDate={(value, state) => validateStartDate(value, state)}
-								thresholdValueValidation={(value, state) => thresholdValueValidation(value, state)}/>
-						</Form>
-					}
-				</Tab>
-				<Tab disabled={isTabsDisabled} tabId={tabIds.SP_LIMITS} data-test-id='sp-limits-tab' title={i18n('SP Limits')}>
-					{selectedTab === tabIds.SP_LIMITS &&
-						<EntitlementPoolsLimits
-							isReadOnlyMode={isReadOnlyMode}
-							limitType={limitType.SERVICE_PROVIDER}
-							limitsList={limitsList.filter(item => item.type === limitType.SERVICE_PROVIDER)}
-							selectedLimit={this.state.selectedLimit}
-							onCloseLimitEditor={() => this.onCloseLimitEditor()}
-							onSelectLimit={limit => this.onSelectLimit(limit)}/>}
-				</Tab>
-				<Tab disabled={isTabsDisabled} tabId={tabIds.VENDOR_LIMITS} data-test-id='vendor-limits-tab' title={i18n('Vendor Limits')}>
-					{selectedTab === tabIds.VENDOR_LIMITS &&
-						<EntitlementPoolsLimits
-							isReadOnlyMode={isReadOnlyMode}
-							limitType={limitType.VENDOR}
-							limitsList={limitsList.filter(item => item.type === limitType.VENDOR)}
-							selectedLimit={this.state.selectedLimit}
-							onCloseLimitEditor={() => this.onCloseLimitEditor()}
-							onSelectLimit={limit => this.onSelectLimit(limit)}/>}
-				</Tab>
-				{
-					selectedTab !== tabIds.GENERAL ?
-						<Button
-							disabled={this.state.selectedLimit || isReadOnlyMode}
-							className='add-limit-button'
-							tabId={tabIds.ADD_LIMIT_BUTTON}
-							btnType='link'
-							iconName='plus'>
-							{i18n('Add Limit')}
-						</Button>
-					:
-						<div key='empty_ep_tab_key'></div> // Render empty div to not break tabs
-				}
-			</Tabs>
-			<GridSection className='license-model-modal-buttons entitlement-pools-editor-buttons'>
-				{!this.state.selectedLimit &&
-					<Button btnType='default' disabled={!this.props.isFormValid || isReadOnlyMode} onClick={() => this.submit()} type='reset'>
-						{i18n('Save')}
-					</Button>
-				}
-			<Button btnType={this.state.selectedLimit ? 'default' : 'outline'} onClick={() => this.props.onCancel()} type='reset'>
-				{i18n('Cancel')}
-			</Button>
-			</GridSection>
-			</div>
-		);
-	}
+    render() {
+        let {
+            data = {},
+            onDataChanged,
+            isReadOnlyMode,
+            genericFieldInfo,
+            onCloseLimitEditor,
+            limitsList = []
+        } = this.props;
+        const { selectedTab } = this.state;
+        const isTabsDisabled = !data.id || !this.props.isFormValid;
 
-	submit() {
-		const {data: entitlementPool, previousData: previousEntitlementPool, formReady} = this.props;
-		if (!formReady) {
-			this.props.onValidateForm(SP_ENTITLEMENT_POOL_FORM);
-		} else {
-			this.props.onSubmit({entitlementPool, previousEntitlementPool});
-		}
-	}
+        return (
+            <div>
+                <Tabs
+                    type="menu"
+                    activeTab={selectedTab}
+                    onTabClick={tabIndex => {
+                        if (tabIndex === tabIds.ADD_LIMIT_BUTTON) {
+                            this.onAddLimit();
+                        } else {
+                            this.setState({ selectedTab: tabIndex });
+                            this.setState({ selectedLimit: '' });
+                            onCloseLimitEditor();
+                        }
+                    }}
+                    invalidTabs={[]}>
+                    <Tab
+                        tabId={tabIds.GENERAL}
+                        data-test-id="general-tab"
+                        title={i18n('General')}>
+                        {genericFieldInfo && (
+                            <Form
+                                ref="validationForm"
+                                hasButtons={false}
+                                labledButtons={false}
+                                isReadOnlyMode={isReadOnlyMode}
+                                isValid={this.props.isFormValid}
+                                formReady={this.props.formReady}
+                                onValidateForm={() =>
+                                    this.props.onValidateForm(
+                                        SP_ENTITLEMENT_POOL_FORM
+                                    )
+                                }
+                                className="license-model-form entitlement-pools-form">
+                                <EntitlementPoolsFormContent
+                                    data={data}
+                                    genericFieldInfo={genericFieldInfo}
+                                    onDataChanged={onDataChanged}
+                                    validateName={value =>
+                                        this.validateName(value)
+                                    }
+                                    validateStartDate={(value, state) =>
+                                        validateStartDate(value, state)
+                                    }
+                                    thresholdValueValidation={(value, state) =>
+                                        thresholdValueValidation(value, state)
+                                    }
+                                />
+                            </Form>
+                        )}
+                    </Tab>
+                    <Tab
+                        disabled={isTabsDisabled}
+                        tabId={tabIds.SP_LIMITS}
+                        data-test-id="sp-limits-tab"
+                        title={i18n('SP Limits')}>
+                        {selectedTab === tabIds.SP_LIMITS && (
+                            <EntitlementPoolsLimits
+                                isReadOnlyMode={isReadOnlyMode}
+                                limitType={limitType.SERVICE_PROVIDER}
+                                limitsList={limitsList.filter(
+                                    item =>
+                                        item.type === limitType.SERVICE_PROVIDER
+                                )}
+                                selectedLimit={this.state.selectedLimit}
+                                onCloseLimitEditor={() =>
+                                    this.onCloseLimitEditor()
+                                }
+                                onSelectLimit={limit =>
+                                    this.onSelectLimit(limit)
+                                }
+                            />
+                        )}
+                    </Tab>
+                    <Tab
+                        disabled={isTabsDisabled}
+                        tabId={tabIds.VENDOR_LIMITS}
+                        data-test-id="vendor-limits-tab"
+                        title={i18n('Vendor Limits')}>
+                        {selectedTab === tabIds.VENDOR_LIMITS && (
+                            <EntitlementPoolsLimits
+                                isReadOnlyMode={isReadOnlyMode}
+                                limitType={limitType.VENDOR}
+                                limitsList={limitsList.filter(
+                                    item => item.type === limitType.VENDOR
+                                )}
+                                selectedLimit={this.state.selectedLimit}
+                                onCloseLimitEditor={() =>
+                                    this.onCloseLimitEditor()
+                                }
+                                onSelectLimit={limit =>
+                                    this.onSelectLimit(limit)
+                                }
+                            />
+                        )}
+                    </Tab>
+                    {selectedTab !== tabIds.GENERAL ? (
+                        <Button
+                            disabled={
+                                this.state.selectedLimit || isReadOnlyMode
+                            }
+                            className="add-limit-button"
+                            tabId={tabIds.ADD_LIMIT_BUTTON}
+                            btnType="link"
+                            iconName="plus">
+                            {i18n('Add Limit')}
+                        </Button>
+                    ) : (
+                        <div key="empty_ep_tab_key" />
+                    ) // Render empty div to not break tabs
+                    }
+                </Tabs>
+                <GridSection className="license-model-modal-buttons entitlement-pools-editor-buttons">
+                    {!this.state.selectedLimit && (
+                        <Button
+                            btnType="default"
+                            disabled={!this.props.isFormValid || isReadOnlyMode}
+                            onClick={() => this.submit()}
+                            type="reset">
+                            {i18n('Save')}
+                        </Button>
+                    )}
+                    <Button
+                        btnType={
+                            this.state.selectedLimit ? 'default' : 'outline'
+                        }
+                        onClick={() => this.props.onCancel()}
+                        type="reset">
+                        {i18n('Cancel')}
+                    </Button>
+                </GridSection>
+            </div>
+        );
+    }
 
-	validateName(value) {
-		const {data: {id}, EPNames} = this.props;
-		const isExists = Validator.isItemNameAlreadyExistsInList({itemId: id, itemName: value, list: EPNames});
+    submit() {
+        const {
+            data: entitlementPool,
+            previousData: previousEntitlementPool,
+            formReady
+        } = this.props;
+        if (!formReady) {
+            this.props.onValidateForm(SP_ENTITLEMENT_POOL_FORM);
+        } else {
+            this.props.onSubmit({ entitlementPool, previousEntitlementPool });
+        }
+    }
 
-		return !isExists ?  {isValid: true, errorText: ''} :
-		{isValid: false, errorText: i18n('Entitlement pool by the name \'' + value + '\' already exists. Entitlement pool name must be unique')};
-	}
+    validateName(value) {
+        const { data: { id }, EPNames } = this.props;
+        const isExists = Validator.isItemNameAlreadyExistsInList({
+            itemId: id,
+            itemName: value,
+            list: EPNames
+        });
 
-	onSelectLimit(limit) {
-		if (limit.id === this.state.selectedLimit) {
-			this.setState({selectedLimit: ''});
-			return;
-		}
-		this.setState({selectedLimit: limit.id});
-		this.props.onOpenLimitEditor(limit);
-	}
+        return !isExists
+            ? { isValid: true, errorText: '' }
+            : {
+                  isValid: false,
+                  errorText: i18n(
+                      "Entitlement pool by the name '" +
+                          value +
+                          "' already exists. Entitlement pool name must be unique"
+                  )
+              };
+    }
 
-	onCloseLimitEditor() {
-		this.setState({selectedLimit: ''});
-		this.props.onCloseLimitEditor();
-	}
+    onSelectLimit(limit) {
+        if (limit.id === this.state.selectedLimit) {
+            this.setState({ selectedLimit: '' });
+            return;
+        }
+        this.setState({ selectedLimit: limit.id });
+        this.props.onOpenLimitEditor(limit);
+    }
 
-	onAddLimit() {
-		this.setState({selectedLimit: NEW_LIMIT_TEMP_ID});
-		this.props.onOpenLimitEditor();
-	}
+    onCloseLimitEditor() {
+        this.setState({ selectedLimit: '' });
+        this.props.onCloseLimitEditor();
+    }
 
+    onAddLimit() {
+        this.setState({ selectedLimit: NEW_LIMIT_TEMP_ID });
+        this.props.onOpenLimitEditor();
+    }
 }
 
 export default EntitlementPoolsEditorView;
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsLimits.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsLimits.js
index 8300594098..fd5fe6dd21 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsLimits.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsLimits.js
@@ -13,44 +13,74 @@
  * 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 ValidationHelper from 'sdc-app/common/helpers/ValidationHelper.js';
 import Limits from 'sdc-app/onboarding/licenseModel/limits/Limits.jsx';
-import {actionTypes as globalModalActionTypes} from 'nfvo-components/modal/GlobalModalConstants.js';
+import { actionTypes as globalModalActionTypes } from 'nfvo-components/modal/GlobalModalConstants.js';
 import EntitlementPoolsActionHelper from './EntitlementPoolsActionHelper.js';
 
-const mapStateToProps = ({licenseModel: {entitlementPool: {entitlementPoolEditor: {data}}, limitEditor}, currentScreen}) => {
-	let  {props: {licenseModelId, version}} = currentScreen;
-	return {
-		parent: data,
-		limitEditor,
-		licenseModelId,
-		version
-	};
+const mapStateToProps = ({
+    licenseModel: {
+        entitlementPool: { entitlementPoolEditor: { data } },
+        limitEditor
+    },
+    currentScreen
+}) => {
+    let { props: { licenseModelId, version } } = currentScreen;
+    return {
+        parent: data,
+        limitEditor,
+        licenseModelId,
+        version
+    };
 };
 
-const mapActionsToProps = (dispatch) => {
-	return {
-		onDataChanged: (deltaData, formName, customValidations) => ValidationHelper.dataChanged(dispatch, {deltaData, formName, customValidations}),
-		onSubmit: (limit, entitlementPool, licenseModelId, version) => EntitlementPoolsActionHelper.submitLimit(dispatch,
-			{
-				limit,
-				entitlementPool,
-				licenseModelId,
-				version}),
-		onDelete: ({limit, parent, licenseModelId, version, onCloseLimitEditor, selectedLimit}) => dispatch({
-			type: globalModalActionTypes.GLOBAL_MODAL_WARNING,
-			data:{
-				msg: i18n('Are you sure you want to delete {name}?', {name: limit.name}),
-				confirmationButtonText: i18n('Delete'),
-				title: i18n('Delete'),
-				onConfirmed: ()=> EntitlementPoolsActionHelper.deleteLimit(dispatch, {limit, entitlementPool: parent, licenseModelId, version}).then(() =>
-					selectedLimit === limit.id && onCloseLimitEditor()
-				)
-			}
-		})
-	};
+const mapActionsToProps = dispatch => {
+    return {
+        onDataChanged: (deltaData, formName, customValidations) =>
+            ValidationHelper.dataChanged(dispatch, {
+                deltaData,
+                formName,
+                customValidations
+            }),
+        onSubmit: (limit, entitlementPool, licenseModelId, version) =>
+            EntitlementPoolsActionHelper.submitLimit(dispatch, {
+                limit,
+                entitlementPool,
+                licenseModelId,
+                version
+            }),
+        onDelete: ({
+            limit,
+            parent,
+            licenseModelId,
+            version,
+            onCloseLimitEditor,
+            selectedLimit
+        }) =>
+            dispatch({
+                type: globalModalActionTypes.GLOBAL_MODAL_WARNING,
+                data: {
+                    msg: i18n('Are you sure you want to delete {name}?', {
+                        name: limit.name
+                    }),
+                    confirmationButtonText: i18n('Delete'),
+                    title: i18n('Delete'),
+                    onConfirmed: () =>
+                        EntitlementPoolsActionHelper.deleteLimit(dispatch, {
+                            limit,
+                            entitlementPool: parent,
+                            licenseModelId,
+                            version
+                        }).then(
+                            () =>
+                                selectedLimit === limit.id &&
+                                onCloseLimitEditor()
+                        )
+                }
+            })
+    };
 };
 
 export default connect(mapStateToProps, mapActionsToProps)(Limits);
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsListEditor.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsListEditor.js
index f1dc1f8542..819fb7d824 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsListEditor.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsListEditor.js
@@ -13,45 +13,60 @@
  * 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 EntitlementPoolsActionHelper from './EntitlementPoolsActionHelper.js';
-import EntitlementPoolsListEditorView, {generateConfirmationMsg} from './EntitlementPoolsListEditorView.jsx';
-import {actionTypes as globalMoadlActions}  from 'nfvo-components/modal/GlobalModalConstants.js';
+import EntitlementPoolsListEditorView, {
+    generateConfirmationMsg
+} from './EntitlementPoolsListEditorView.jsx';
+import { actionTypes as globalMoadlActions } from 'nfvo-components/modal/GlobalModalConstants.js';
 
-const mapStateToProps = ({licenseModel: {entitlementPool, licenseModelEditor}}) => {
-
-	const {entitlementPoolsList} = entitlementPool;
-	const {data} = entitlementPool.entitlementPoolEditor;
-	const {vendorName} = licenseModelEditor.data;
-
-	return {
-		vendorName,
-		entitlementPoolsList,
-		isDisplayModal: Boolean(data),
-		isModalInEditMode: Boolean(data && data.id),
-	};
+const mapStateToProps = ({
+    licenseModel: { entitlementPool, licenseModelEditor }
+}) => {
+    const { entitlementPoolsList } = entitlementPool;
+    const { data } = entitlementPool.entitlementPoolEditor;
+    const { vendorName } = licenseModelEditor.data;
 
+    return {
+        vendorName,
+        entitlementPoolsList,
+        isDisplayModal: Boolean(data),
+        isModalInEditMode: Boolean(data && data.id)
+    };
 };
 
-const mapActionsToProps = (dispatch, {licenseModelId, version}) => {
-	return {
-		onAddEntitlementPoolClick: () => EntitlementPoolsActionHelper.openEntitlementPoolsEditor(dispatch),
-		onEditEntitlementPoolClick: entitlementPool => EntitlementPoolsActionHelper.openEntitlementPoolsEditor(dispatch, {entitlementPool, licenseModelId, version}),
-		onDeleteEntitlementPool: entitlementPool => dispatch({
-			type: globalMoadlActions.GLOBAL_MODAL_WARNING,
-			data:{
-				msg: generateConfirmationMsg(entitlementPool),
-				confirmationButtonText: i18n('Delete'),
-				title: i18n('Delete'),
-				onConfirmed: () => EntitlementPoolsActionHelper.deleteEntitlementPool(dispatch, {
-					licenseModelId,
-					entitlementPoolId: entitlementPool.id,
-					version
-				})
-			}
-		})
-	};
+const mapActionsToProps = (dispatch, { licenseModelId, version }) => {
+    return {
+        onAddEntitlementPoolClick: () =>
+            EntitlementPoolsActionHelper.openEntitlementPoolsEditor(dispatch),
+        onEditEntitlementPoolClick: entitlementPool =>
+            EntitlementPoolsActionHelper.openEntitlementPoolsEditor(dispatch, {
+                entitlementPool,
+                licenseModelId,
+                version
+            }),
+        onDeleteEntitlementPool: entitlementPool =>
+            dispatch({
+                type: globalMoadlActions.GLOBAL_MODAL_WARNING,
+                data: {
+                    msg: generateConfirmationMsg(entitlementPool),
+                    confirmationButtonText: i18n('Delete'),
+                    title: i18n('Delete'),
+                    onConfirmed: () =>
+                        EntitlementPoolsActionHelper.deleteEntitlementPool(
+                            dispatch,
+                            {
+                                licenseModelId,
+                                entitlementPoolId: entitlementPool.id,
+                                version
+                            }
+                        )
+                }
+            })
+    };
 };
 
-export default connect(mapStateToProps, mapActionsToProps)(EntitlementPoolsListEditorView);
+export default connect(mapStateToProps, mapActionsToProps)(
+    EntitlementPoolsListEditorView
+);
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsListEditorView.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsListEditorView.jsx
index cc0cda1992..7a07f94bd5 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsListEditorView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsListEditorView.jsx
@@ -22,120 +22,162 @@ import ListEditorView from 'nfvo-components/listEditor/ListEditorView.jsx';
 import ListEditorItemView from 'nfvo-components/listEditor/ListEditorItemView.jsx';
 
 import EntitlementPoolsEditor from './EntitlementPoolsEditor.js';
-import {extractUnits} from './EntitlementPoolsConstants';
+import { extractUnits } from './EntitlementPoolsConstants';
 
 class EntitlementPoolsListEditorView extends React.Component {
-	static propTypes = {
-		vendorName: PropTypes.string,
-		licenseModelId: PropTypes.string.isRequired,
-		entitlementPoolsList: PropTypes.array,
-		isReadOnlyMode: PropTypes.bool.isRequired,
-		isDisplayModal: PropTypes.bool,
-		isModalInEditMode: PropTypes.bool,
-		onAddEntitlementPoolClick: PropTypes.func,
-		onEditEntitlementPoolClick: PropTypes.func,
-		onDeleteEntitlementPool: PropTypes.func,
-	};
+    static propTypes = {
+        vendorName: PropTypes.string,
+        licenseModelId: PropTypes.string.isRequired,
+        entitlementPoolsList: PropTypes.array,
+        isReadOnlyMode: PropTypes.bool.isRequired,
+        isDisplayModal: PropTypes.bool,
+        isModalInEditMode: PropTypes.bool,
+        onAddEntitlementPoolClick: PropTypes.func,
+        onEditEntitlementPoolClick: PropTypes.func,
+        onDeleteEntitlementPool: PropTypes.func
+    };
 
-	static defaultProps = {
-		entitlementPoolsList: []
-	};
+    static defaultProps = {
+        entitlementPoolsList: []
+    };
 
-	state = {
-		localFilter: ''
-	};
+    state = {
+        localFilter: ''
+    };
 
-	render() {
-		let {licenseModelId, isReadOnlyMode, isDisplayModal, isModalInEditMode, version} = this.props;
-		let {onAddEntitlementPoolClick} = this.props;
-		const {localFilter} = this.state;
+    render() {
+        let {
+            licenseModelId,
+            isReadOnlyMode,
+            isDisplayModal,
+            isModalInEditMode,
+            version
+        } = this.props;
+        let { onAddEntitlementPoolClick } = this.props;
+        const { localFilter } = this.state;
 
-		return (
-			<div className='license-model-list-editor entitlement-pools-list-editor'>
-				<ListEditorView
-					title={i18n('Entitlement Pools')}
-					plusButtonTitle={i18n('Add Entitlement Pool')}
-					onAdd={onAddEntitlementPoolClick}
-					filterValue={localFilter}
-					onFilter={value => this.setState({localFilter: value})}
-					isReadOnlyMode={isReadOnlyMode}>
-					{this.filterList().map(entitlementPool => this.renderEntitlementPoolListItem(entitlementPool, isReadOnlyMode))}
-				</ListEditorView>
-				<Modal show={isDisplayModal} bsSize='large' animation={true} className='onborading-modal license-model-modal entitlement-pools-modal'>
-					<Modal.Header>
-						<Modal.Title>{`${isModalInEditMode ? i18n('Edit Entitlement Pool') : i18n('Create New Entitlement Pool')}`}</Modal.Title>
-					</Modal.Header>
-					<Modal.Body>
-						{
-							isDisplayModal && (
-								<EntitlementPoolsEditor version={version} licenseModelId={licenseModelId} isReadOnlyMode={isReadOnlyMode}/>
-							)
-						}
-					</Modal.Body>
-				</Modal>
-			</div>
-		);
-	}
+        return (
+            <div className="license-model-list-editor entitlement-pools-list-editor">
+                <ListEditorView
+                    title={i18n('Entitlement Pools')}
+                    plusButtonTitle={i18n('Add Entitlement Pool')}
+                    onAdd={onAddEntitlementPoolClick}
+                    filterValue={localFilter}
+                    onFilter={value => this.setState({ localFilter: value })}
+                    isReadOnlyMode={isReadOnlyMode}>
+                    {this.filterList().map(entitlementPool =>
+                        this.renderEntitlementPoolListItem(
+                            entitlementPool,
+                            isReadOnlyMode
+                        )
+                    )}
+                </ListEditorView>
+                <Modal
+                    show={isDisplayModal}
+                    bsSize="large"
+                    animation={true}
+                    className="onborading-modal license-model-modal entitlement-pools-modal">
+                    <Modal.Header>
+                        <Modal.Title>{`${
+                            isModalInEditMode
+                                ? i18n('Edit Entitlement Pool')
+                                : i18n('Create New Entitlement Pool')
+                        }`}</Modal.Title>
+                    </Modal.Header>
+                    <Modal.Body>
+                        {isDisplayModal && (
+                            <EntitlementPoolsEditor
+                                version={version}
+                                licenseModelId={licenseModelId}
+                                isReadOnlyMode={isReadOnlyMode}
+                            />
+                        )}
+                    </Modal.Body>
+                </Modal>
+            </div>
+        );
+    }
 
-	filterList() {
-		let {entitlementPoolsList} = this.props;
-		let {localFilter} = this.state;
-		if(localFilter.trim()) {
-			const filter = new RegExp(escape(localFilter), 'i');
-			return entitlementPoolsList.filter(({name = '', description = ''}) => {
-				return escape(name).match(filter) || escape(description).match(filter);
-			});
-		}
-		else {
-			return entitlementPoolsList;
-		}
-	}
+    filterList() {
+        let { entitlementPoolsList } = this.props;
+        let { localFilter } = this.state;
+        if (localFilter.trim()) {
+            const filter = new RegExp(escape(localFilter), 'i');
+            return entitlementPoolsList.filter(
+                ({ name = '', description = '' }) => {
+                    return (
+                        escape(name).match(filter) ||
+                        escape(description).match(filter)
+                    );
+                }
+            );
+        } else {
+            return entitlementPoolsList;
+        }
+    }
 
-	renderEntitlementPoolListItem(entitlementPool, isReadOnlyMode) {
-		let {id, name, description, thresholdValue, thresholdUnits} = entitlementPool;
-		let {onEditEntitlementPoolClick, onDeleteEntitlementPool} = this.props;
-		return (
-			<ListEditorItemView
-				key={id}
-				onSelect={() => onEditEntitlementPoolClick(entitlementPool)}
-				onDelete={() => onDeleteEntitlementPool(entitlementPool)}
-				className='list-editor-item-view'
-				isReadOnlyMode={isReadOnlyMode}>
-				<div className='list-editor-item-view-field'>
+    renderEntitlementPoolListItem(entitlementPool, isReadOnlyMode) {
+        let {
+            id,
+            name,
+            description,
+            thresholdValue,
+            thresholdUnits
+        } = entitlementPool;
+        let {
+            onEditEntitlementPoolClick,
+            onDeleteEntitlementPool
+        } = this.props;
+        return (
+            <ListEditorItemView
+                key={id}
+                onSelect={() => onEditEntitlementPoolClick(entitlementPool)}
+                onDelete={() => onDeleteEntitlementPool(entitlementPool)}
+                className="list-editor-item-view"
+                isReadOnlyMode={isReadOnlyMode}>
+                <div className="list-editor-item-view-field">
+                    <div className="title">{i18n('Name')}</div>
+                    <div>
+                        <div className="textEllipses text name">{name}</div>
+                    </div>
+                </div>
 
-					<div className='title'>{i18n('Name')}</div>
-					<div ><div className='textEllipses text name'>{name}</div></div>
-				</div>
-
-				<div className='list-editor-item-view-field'>
-					<div className='title'>{i18n('Entitlement')}</div>
-					<div className='entitlement-pools-count'>{thresholdValue && `${thresholdValue} ${extractUnits(thresholdUnits)}`}</div>
-				</div>
-
-				<div className='list-editor-item-view-field'>
-					<div className='title'>{i18n('Description')}</div>
-					<div className='text description'>{description}</div>
-				</div>
-			</ListEditorItemView>
-		);
-	}
+                <div className="list-editor-item-view-field">
+                    <div className="title">{i18n('Entitlement')}</div>
+                    <div className="entitlement-pools-count">
+                        {thresholdValue &&
+                            `${thresholdValue} ${extractUnits(thresholdUnits)}`}
+                    </div>
+                </div>
 
+                <div className="list-editor-item-view-field">
+                    <div className="title">{i18n('Description')}</div>
+                    <div className="text description">{description}</div>
+                </div>
+            </ListEditorItemView>
+        );
+    }
 }
 
 export default EntitlementPoolsListEditorView;
 
 export function generateConfirmationMsg(entitlementPoolToDelete) {
-	let poolName = entitlementPoolToDelete ? entitlementPoolToDelete.name : '';
-	let msg = i18n('Are you sure you want to delete "{poolName}"?', {poolName: poolName});
-	let subMsg = entitlementPoolToDelete
-	&& entitlementPoolToDelete.referencingFeatureGroups
-	&& entitlementPoolToDelete.referencingFeatureGroups.length > 0 ?
-		i18n('This entitlement pool is associated with one or more feature groups') :
-		'';
-	return (
-		<div>
-			<p>{msg}</p>
-			<p>{subMsg}</p>
-		</div>
-	);
+    let poolName = entitlementPoolToDelete ? entitlementPoolToDelete.name : '';
+    let msg = i18n('Are you sure you want to delete "{poolName}"?', {
+        poolName: poolName
+    });
+    let subMsg =
+        entitlementPoolToDelete &&
+        entitlementPoolToDelete.referencingFeatureGroups &&
+        entitlementPoolToDelete.referencingFeatureGroups.length > 0
+            ? i18n(
+                  'This entitlement pool 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/entitlementPools/EntitlementPoolsListReducer.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsListReducer.js
index fefd823207..3c8621d9d8 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsListReducer.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsListReducer.js
@@ -13,19 +13,29 @@
  * or implied. See the License for the specific language governing
  * permissions and limitations under the License.
  */
-import {actionTypes} from './EntitlementPoolsConstants';
+import { actionTypes } from './EntitlementPoolsConstants';
 export default (state = [], action) => {
-	switch (action.type) {
-		case actionTypes.ENTITLEMENT_POOLS_LIST_LOADED:
-			return [...action.response.results];
-		case actionTypes.ADD_ENTITLEMENT_POOL:
-			return [...state, action.entitlementPool];
-		case actionTypes.EDIT_ENTITLEMENT_POOL:
-			const indexForEdit = state.findIndex(entitlementPool => entitlementPool.id === action.entitlementPool.id);
-			return [...state.slice(0, indexForEdit), action.entitlementPool, ...state.slice(indexForEdit + 1)];
-		case actionTypes.DELETE_ENTITLEMENT_POOL:
-			return state.filter(entitlementPool => entitlementPool.id !== action.entitlementPoolId);
-		default:
-			return state;
-	}
+    switch (action.type) {
+        case actionTypes.ENTITLEMENT_POOLS_LIST_LOADED:
+            return [...action.response.results];
+        case actionTypes.ADD_ENTITLEMENT_POOL:
+            return [...state, action.entitlementPool];
+        case actionTypes.EDIT_ENTITLEMENT_POOL:
+            const indexForEdit = state.findIndex(
+                entitlementPool =>
+                    entitlementPool.id === action.entitlementPool.id
+            );
+            return [
+                ...state.slice(0, indexForEdit),
+                action.entitlementPool,
+                ...state.slice(indexForEdit + 1)
+            ];
+        case actionTypes.DELETE_ENTITLEMENT_POOL:
+            return state.filter(
+                entitlementPool =>
+                    entitlementPool.id !== action.entitlementPoolId
+            );
+        default:
+            return state;
+    }
 };
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupEditor.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupEditor.js
index 6edb1e1f0c..997a6e09ed 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupEditor.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupEditor.js
@@ -13,66 +13,92 @@
  * 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 FeatureGroupsActionHelper from './FeatureGroupsActionHelper.js';
 import FeatureGroupEditorView from './FeatureGroupEditorView.jsx';
 import ValidationHelper from 'sdc-app/common/helpers/ValidationHelper.js';
 
-export const mapStateToProps = ({licenseModel: {featureGroup, entitlementPool, licenseKeyGroup}}) => {
-	let {entitlementPoolsList = []} = entitlementPool;
-	let {licenseKeyGroupsList = []} = licenseKeyGroup;
-	const {featureGroupEditor} = featureGroup;
-	let {data, selectedTab, genericFieldInfo, formReady} = featureGroupEditor;
-	const featureGroupId = data ? data.id : null;
-	const list = featureGroup.featureGroupsList;
+export const mapStateToProps = ({
+    licenseModel: { featureGroup, entitlementPool, licenseKeyGroup }
+}) => {
+    let { entitlementPoolsList = [] } = entitlementPool;
+    let { licenseKeyGroupsList = [] } = licenseKeyGroup;
+    const { featureGroupEditor } = featureGroup;
+    let { data, selectedTab, genericFieldInfo, formReady } = featureGroupEditor;
+    const featureGroupId = data ? data.id : null;
+    const list = featureGroup.featureGroupsList;
 
-	let previousData, FGNames = {}, isFormValid = true, invalidTabs = [];
+    let previousData,
+        FGNames = {},
+        isFormValid = true,
+        invalidTabs = [];
 
-	if (featureGroupId) {
-		previousData = list.find(featureGroup => featureGroup.id === featureGroupId);
-	}
+    if (featureGroupId) {
+        previousData = list.find(
+            featureGroup => featureGroup.id === featureGroupId
+        );
+    }
 
-	for (let i = 0; i < list.length; i++) {
-		FGNames[list[i].name.toLowerCase()] = list[i].id;
-	}
+    for (let i = 0; i < list.length; i++) {
+        FGNames[list[i].name.toLowerCase()] = list[i].id;
+    }
 
-	for (let field in genericFieldInfo) {
-		if (!genericFieldInfo[field].isValid) {
-			isFormValid = false;
-			let tabId = genericFieldInfo[field].tabId;
-			if (invalidTabs.indexOf(tabId) === -1) {
-				invalidTabs[invalidTabs.length] = genericFieldInfo[field].tabId;
-			}
-		}
-	}
+    for (let field in genericFieldInfo) {
+        if (!genericFieldInfo[field].isValid) {
+            isFormValid = false;
+            let tabId = genericFieldInfo[field].tabId;
+            if (invalidTabs.indexOf(tabId) === -1) {
+                invalidTabs[invalidTabs.length] = genericFieldInfo[field].tabId;
+            }
+        }
+    }
 
-	return {
-		data,
-		previousData,
-		selectedTab,
-		entitlementPoolsList,
-		licenseKeyGroupsList,
-		isFormValid,
-		formReady,
-		genericFieldInfo,
-		invalidTabs,
-		FGNames
-	};
+    return {
+        data,
+        previousData,
+        selectedTab,
+        entitlementPoolsList,
+        licenseKeyGroupsList,
+        isFormValid,
+        formReady,
+        genericFieldInfo,
+        invalidTabs,
+        FGNames
+    };
 };
 
-
-const mapActionsToProps = (dispatch, {licenseModelId, version}) => {
-	return {
-		onDataChanged: (deltaData, formName, customValidations) => ValidationHelper.dataChanged(dispatch, {deltaData, formName, customValidations}),
-		onTabSelect: tab => FeatureGroupsActionHelper.selectEntitlementPoolsEditorTab(dispatch, {tab}),
-		onSubmit: (previousFeatureGroup, featureGroup) => {
-			FeatureGroupsActionHelper.closeFeatureGroupsEditor(dispatch);
-			FeatureGroupsActionHelper.saveFeatureGroup(dispatch, {licenseModelId, previousFeatureGroup, featureGroup, version});
-		},
-		onCancel: () => FeatureGroupsActionHelper.closeFeatureGroupsEditor(dispatch),
-		onValidateForm: (formName) => ValidationHelper.validateForm(dispatch, formName)
-	};
+const mapActionsToProps = (dispatch, { licenseModelId, version }) => {
+    return {
+        onDataChanged: (deltaData, formName, customValidations) =>
+            ValidationHelper.dataChanged(dispatch, {
+                deltaData,
+                formName,
+                customValidations
+            }),
+        onTabSelect: tab =>
+            FeatureGroupsActionHelper.selectEntitlementPoolsEditorTab(
+                dispatch,
+                {
+                    tab
+                }
+            ),
+        onSubmit: (previousFeatureGroup, featureGroup) => {
+            FeatureGroupsActionHelper.closeFeatureGroupsEditor(dispatch);
+            FeatureGroupsActionHelper.saveFeatureGroup(dispatch, {
+                licenseModelId,
+                previousFeatureGroup,
+                featureGroup,
+                version
+            });
+        },
+        onCancel: () =>
+            FeatureGroupsActionHelper.closeFeatureGroupsEditor(dispatch),
+        onValidateForm: formName =>
+            ValidationHelper.validateForm(dispatch, formName)
+    };
 };
 
-export default connect(mapStateToProps, mapActionsToProps)(FeatureGroupEditorView);
+export default connect(mapStateToProps, mapActionsToProps)(
+    FeatureGroupEditorView
+);
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupEditorView.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupEditorView.jsx
index 6d0acaa65d..fc8269332a 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupEditorView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupEditorView.jsx
@@ -19,211 +19,320 @@ import Tabs from 'nfvo-components/input/validation/Tabs.jsx';
 import Tab from 'sdc-ui/lib/react/Tab.js';
 import GridSection from 'nfvo-components/grid/GridSection.jsx';
 import GridItem from 'nfvo-components/grid/GridItem.jsx';
-import {TabsForm as Form} from 'nfvo-components/input/validation/Form.jsx';
+import { TabsForm as Form } from 'nfvo-components/input/validation/Form.jsx';
 import DualListboxView from 'nfvo-components/input/dualListbox/DualListboxView.jsx';
 import Input from 'nfvo-components/input/validation/Input.jsx';
 import i18n from 'nfvo-utils/i18n/i18n.js';
 import Validator from 'nfvo-utils/Validator.js';
 
-import {state as FeatureGroupStateConstants, FG_EDITOR_FORM} from './FeatureGroupsConstants.js';
+import {
+    state as FeatureGroupStateConstants,
+    FG_EDITOR_FORM
+} from './FeatureGroupsConstants.js';
 
 const FeatureGroupsPropType = PropTypes.shape({
-	id: PropTypes.string,
-	name: PropTypes.string,
-	description: PropTypes.string,
-	partNumber: PropTypes.string,
-	manufacturerReferenceNumber: PropTypes.string,
-	entitlementPoolsIds: PropTypes.arrayOf(PropTypes.string),
-	licenseKeyGroupsIds: PropTypes.arrayOf(PropTypes.string)
+    id: PropTypes.string,
+    name: PropTypes.string,
+    description: PropTypes.string,
+    partNumber: PropTypes.string,
+    manufacturerReferenceNumber: PropTypes.string,
+    entitlementPoolsIds: PropTypes.arrayOf(PropTypes.string),
+    licenseKeyGroupsIds: PropTypes.arrayOf(PropTypes.string)
 });
 
-const GeneralTab = ({data = {}, onDataChanged, genericFieldInfo, validateName}) => {
-	let {name, description, partNumber, manufacturerReferenceNumber} = data;
-	return (
-			<GridSection hasLastColSet>
-				<GridItem colSpan={2}>
-					<Input
-						groupClassName='field-section'
-						onChange={name => onDataChanged({name}, FG_EDITOR_FORM, {name: validateName})}
-						label={i18n('Name')}
-						data-test-id='create-fg-name'
-						value={name}
-						name='feature-group-name'
-						type='text'
-						isRequired={true}
-						isValid={genericFieldInfo.name.isValid}
-						errorText={genericFieldInfo.name.errorText} />
-				</GridItem>
-				<GridItem colSpan={2} lastColInRow>
-					<Input
-						groupClassName='field-section'
-						className='description-field'
-						onChange={description => onDataChanged({description}, FG_EDITOR_FORM)}
-						data-test-id='create-fg-description'
-						label={i18n('Description')}
-						value={description}
-						name='feature-group-description'
-						type='textarea'
-						isValid={genericFieldInfo.description.isValid}
-						errorText={genericFieldInfo.description.errorText} />
-				</GridItem>
-				<GridItem colSpan={2}>
-					<Input
-						groupClassName='field-section'
-						onChange={partNumber => onDataChanged({partNumber}, FG_EDITOR_FORM)}
-						label={i18n('Part Number')}
-						data-test-id='create-fg-part-number'
-						value={partNumber}
-						isRequired={true}
-						type='text'
-						isValid={genericFieldInfo.partNumber.isValid}
-						errorText={genericFieldInfo.partNumber.errorText} />
-				</GridItem>
-				<GridItem colSpan={2} lastColInRow>
-					<Input
-						groupClassName='field-section'
-						onChange={manufacturerReferenceNumber => onDataChanged({manufacturerReferenceNumber}, FG_EDITOR_FORM)}
-						label={i18n('Manufacturer Reference Number')}
-						data-test-id='create-fg-reference-number'
-						value={manufacturerReferenceNumber}
-						isRequired={true}
-						type='text'
-						isValid={genericFieldInfo.manufacturerReferenceNumber.isValid}
-						errorText={genericFieldInfo.manufacturerReferenceNumber.errorText} />
-				</GridItem>
-			</GridSection>
-		);
+const GeneralTab = ({
+    data = {},
+    onDataChanged,
+    genericFieldInfo,
+    validateName
+}) => {
+    let { name, description, partNumber, manufacturerReferenceNumber } = data;
+    return (
+        <GridSection hasLastColSet>
+            <GridItem colSpan={2}>
+                <Input
+                    groupClassName="field-section"
+                    onChange={name =>
+                        onDataChanged({ name }, FG_EDITOR_FORM, {
+                            name: validateName
+                        })
+                    }
+                    label={i18n('Name')}
+                    data-test-id="create-fg-name"
+                    value={name}
+                    name="feature-group-name"
+                    type="text"
+                    isRequired={true}
+                    isValid={genericFieldInfo.name.isValid}
+                    errorText={genericFieldInfo.name.errorText}
+                />
+            </GridItem>
+            <GridItem colSpan={2} lastColInRow>
+                <Input
+                    groupClassName="field-section"
+                    className="description-field"
+                    onChange={description =>
+                        onDataChanged({ description }, FG_EDITOR_FORM)
+                    }
+                    data-test-id="create-fg-description"
+                    label={i18n('Description')}
+                    value={description}
+                    name="feature-group-description"
+                    type="textarea"
+                    isValid={genericFieldInfo.description.isValid}
+                    errorText={genericFieldInfo.description.errorText}
+                />
+            </GridItem>
+            <GridItem colSpan={2}>
+                <Input
+                    groupClassName="field-section"
+                    onChange={partNumber =>
+                        onDataChanged({ partNumber }, FG_EDITOR_FORM)
+                    }
+                    label={i18n('Part Number')}
+                    data-test-id="create-fg-part-number"
+                    value={partNumber}
+                    isRequired={true}
+                    type="text"
+                    isValid={genericFieldInfo.partNumber.isValid}
+                    errorText={genericFieldInfo.partNumber.errorText}
+                />
+            </GridItem>
+            <GridItem colSpan={2} lastColInRow>
+                <Input
+                    groupClassName="field-section"
+                    onChange={manufacturerReferenceNumber =>
+                        onDataChanged(
+                            { manufacturerReferenceNumber },
+                            FG_EDITOR_FORM
+                        )
+                    }
+                    label={i18n('Manufacturer Reference Number')}
+                    data-test-id="create-fg-reference-number"
+                    value={manufacturerReferenceNumber}
+                    isRequired={true}
+                    type="text"
+                    isValid={
+                        genericFieldInfo.manufacturerReferenceNumber.isValid
+                    }
+                    errorText={
+                        genericFieldInfo.manufacturerReferenceNumber.errorText
+                    }
+                />
+            </GridItem>
+        </GridSection>
+    );
 };
 
-const EntitlementPoolsTab = ({entitlementPoolsList, data, onDataChanged, isReadOnlyMode}) => {
-	const dualBoxFilterTitle = {
-		left: i18n('Available Entitlement Pools'),
-		right: i18n('Selected Entitlement Pools')
-	};
-	if (entitlementPoolsList.length > 0) {
-		return (
-			<DualListboxView
-				isReadOnlyMode={isReadOnlyMode}
-				filterTitle={dualBoxFilterTitle}
-				selectedValuesList={data.entitlementPoolsIds}
-				availableList={entitlementPoolsList}
-				onChange={ selectedValuesList => onDataChanged( { entitlementPoolsIds: selectedValuesList }, FG_EDITOR_FORM )}/>
-		);
-	} else {
-		return (
-			<p>{i18n('There are no available entitlement pools')}</p>
-		);
-	}
+const EntitlementPoolsTab = ({
+    entitlementPoolsList,
+    data,
+    onDataChanged,
+    isReadOnlyMode
+}) => {
+    const dualBoxFilterTitle = {
+        left: i18n('Available Entitlement Pools'),
+        right: i18n('Selected Entitlement Pools')
+    };
+    if (entitlementPoolsList.length > 0) {
+        return (
+            <DualListboxView
+                isReadOnlyMode={isReadOnlyMode}
+                filterTitle={dualBoxFilterTitle}
+                selectedValuesList={data.entitlementPoolsIds}
+                availableList={entitlementPoolsList}
+                onChange={selectedValuesList =>
+                    onDataChanged(
+                        { entitlementPoolsIds: selectedValuesList },
+                        FG_EDITOR_FORM
+                    )
+                }
+            />
+        );
+    } else {
+        return <p>{i18n('There are no available entitlement pools')}</p>;
+    }
 };
 
-const LKGTab = ({licenseKeyGroupsList, data, onDataChanged, isReadOnlyMode}) => {
-	const dualBoxFilterTitle = {
-		left: i18n('Available License Key Groups'),
-		right: i18n('Selected License Key Groups')
-	};
-	if (licenseKeyGroupsList.length > 0) {
-		return (
-			<DualListboxView
-				isReadOnlyMode={isReadOnlyMode}
-				filterTitle={dualBoxFilterTitle}
-				selectedValuesList={data.licenseKeyGroupsIds}
-				availableList={licenseKeyGroupsList}
-				onChange={ selectedValuesList => onDataChanged( { licenseKeyGroupsIds: selectedValuesList }, FG_EDITOR_FORM )}/>
-		);
-	} else {
-		return (
-			<p>{i18n('There are no available license key groups')}</p>
-		);
-	}
+const LKGTab = ({
+    licenseKeyGroupsList,
+    data,
+    onDataChanged,
+    isReadOnlyMode
+}) => {
+    const dualBoxFilterTitle = {
+        left: i18n('Available License Key Groups'),
+        right: i18n('Selected License Key Groups')
+    };
+    if (licenseKeyGroupsList.length > 0) {
+        return (
+            <DualListboxView
+                isReadOnlyMode={isReadOnlyMode}
+                filterTitle={dualBoxFilterTitle}
+                selectedValuesList={data.licenseKeyGroupsIds}
+                availableList={licenseKeyGroupsList}
+                onChange={selectedValuesList =>
+                    onDataChanged(
+                        { licenseKeyGroupsIds: selectedValuesList },
+                        FG_EDITOR_FORM
+                    )
+                }
+            />
+        );
+    } else {
+        return <p>{i18n('There are no available license key groups')}</p>;
+    }
 };
 
 class FeatureGroupEditorView extends React.Component {
+    static propTypes = {
+        data: FeatureGroupsPropType,
+        previousData: FeatureGroupsPropType,
+        isReadOnlyMode: PropTypes.bool,
+        FGNames: PropTypes.object,
 
+        onSubmit: PropTypes.func,
+        onCancel: PropTypes.func,
 
-	static propTypes = {
-		data: FeatureGroupsPropType,
-		previousData: FeatureGroupsPropType,
-		isReadOnlyMode: PropTypes.bool,
-		FGNames: PropTypes.object,
-
-		onSubmit: PropTypes.func,
-		onCancel: PropTypes.func,
-
-		selectedTab: PropTypes.number,
-		onTabSelect: PropTypes.func,
-
-		entitlementPoolsList: DualListboxView.propTypes.availableList,
-		licenseKeyGroupsList: DualListboxView.propTypes.availableList
-	};
-
-
-	static defaultProps = {
-		data: {},
-		selectedTab: FeatureGroupStateConstants.SELECTED_FEATURE_GROUP_TAB.GENERAL,
-	};
-
-	state = {
-		localEntitlementPoolsListFilter: '',
-		localLicenseKeyGroupsListFilter: ''
-	};
-
-
-	render() {
-		let {selectedTab, onTabSelect, isReadOnlyMode, invalidTabs, data, onDataChanged, genericFieldInfo, entitlementPoolsList, licenseKeyGroupsList} = this.props;
-		return (
-			<div>
-			{ genericFieldInfo && <Form
-				ref='validationForm'
-				hasButtons={true}
-				onSubmit={ () => this.submit() }
-				isValid={this.props.isFormValid}
-				formReady={this.props.formReady}
-				onValidateForm={() => this.props.onValidateForm(FG_EDITOR_FORM) }
-				onReset={ () => this.props.onCancel() }
-				labledButtons={true}
-				isReadOnlyMode={isReadOnlyMode}
-				name='feature-group-validation-form'
-				className='license-model-form feature-group-form'>
-				<Tabs activeTab={onTabSelect ? selectedTab : undefined} onTabClick={onTabSelect} invalidTabs={invalidTabs} id='vlmFGValTabs' >
-					<Tab tabId={FeatureGroupStateConstants.SELECTED_FEATURE_GROUP_TAB.GENERAL} title={i18n('General')}  >
-						<fieldset disabled={isReadOnlyMode}>
-							<GeneralTab data={data} onDataChanged={onDataChanged} genericFieldInfo={genericFieldInfo}  validateName={(value)=> this.validateName(value)}/>
-						</fieldset>
-					</Tab>
-					<Tab
-						tabId={FeatureGroupStateConstants.SELECTED_FEATURE_GROUP_TAB.ENTITLEMENT_POOLS}
-						title={i18n('Entitlement Pools')} >
-						<fieldset disabled={isReadOnlyMode}>
-							<EntitlementPoolsTab isReadOnlyMode={isReadOnlyMode} data={data} onDataChanged={onDataChanged} entitlementPoolsList={entitlementPoolsList} />
-						</fieldset>
-					</Tab>
-					<Tab
-						tabId={FeatureGroupStateConstants.SELECTED_FEATURE_GROUP_TAB.LICENSE_KEY_GROUPS}
-						title={i18n('License Key Groups')} >
-						<fieldset disabled={isReadOnlyMode}>
-							<LKGTab isReadOnlyMode={isReadOnlyMode} data={data} onDataChanged={onDataChanged} licenseKeyGroupsList={licenseKeyGroupsList} />
-						</fieldset>
-					</Tab>
-				</Tabs>
-
-				</Form> }
-			</div>
-		);
-	}
-
-	submit() {
-		const {data: featureGroup, previousData: previousFeatureGroup} = this.props;
-		this.props.onSubmit(previousFeatureGroup, featureGroup);
-	}
-
-	validateName(value) {
-		const {data: {id}, FGNames} = this.props;
-		const isExists = Validator.isItemNameAlreadyExistsInList({itemId: id, itemName: value, list: FGNames});
-
-		return !isExists ?  {isValid: true, errorText: ''} :
-			{isValid: false, errorText: i18n('Feature group by the name \'' + value + '\' already exists. Feature group name must be unique')};
-	}
-}
+        selectedTab: PropTypes.number,
+        onTabSelect: PropTypes.func,
+
+        entitlementPoolsList: DualListboxView.propTypes.availableList,
+        licenseKeyGroupsList: DualListboxView.propTypes.availableList
+    };
+
+    static defaultProps = {
+        data: {},
+        selectedTab:
+            FeatureGroupStateConstants.SELECTED_FEATURE_GROUP_TAB.GENERAL
+    };
+
+    state = {
+        localEntitlementPoolsListFilter: '',
+        localLicenseKeyGroupsListFilter: ''
+    };
 
+    render() {
+        let {
+            selectedTab,
+            onTabSelect,
+            isReadOnlyMode,
+            invalidTabs,
+            data,
+            onDataChanged,
+            genericFieldInfo,
+            entitlementPoolsList,
+            licenseKeyGroupsList
+        } = this.props;
+        return (
+            <div>
+                {genericFieldInfo && (
+                    <Form
+                        ref="validationForm"
+                        hasButtons={true}
+                        onSubmit={() => this.submit()}
+                        isValid={this.props.isFormValid}
+                        formReady={this.props.formReady}
+                        onValidateForm={() =>
+                            this.props.onValidateForm(FG_EDITOR_FORM)
+                        }
+                        onReset={() => this.props.onCancel()}
+                        labledButtons={true}
+                        isReadOnlyMode={isReadOnlyMode}
+                        name="feature-group-validation-form"
+                        className="license-model-form feature-group-form">
+                        <Tabs
+                            activeTab={onTabSelect ? selectedTab : undefined}
+                            onTabClick={onTabSelect}
+                            invalidTabs={invalidTabs}
+                            id="vlmFGValTabs">
+                            <Tab
+                                tabId={
+                                    FeatureGroupStateConstants
+                                        .SELECTED_FEATURE_GROUP_TAB.GENERAL
+                                }
+                                title={i18n('General')}>
+                                <fieldset disabled={isReadOnlyMode}>
+                                    <GeneralTab
+                                        data={data}
+                                        onDataChanged={onDataChanged}
+                                        genericFieldInfo={genericFieldInfo}
+                                        validateName={value =>
+                                            this.validateName(value)
+                                        }
+                                    />
+                                </fieldset>
+                            </Tab>
+                            <Tab
+                                tabId={
+                                    FeatureGroupStateConstants
+                                        .SELECTED_FEATURE_GROUP_TAB
+                                        .ENTITLEMENT_POOLS
+                                }
+                                title={i18n('Entitlement Pools')}>
+                                <fieldset disabled={isReadOnlyMode}>
+                                    <EntitlementPoolsTab
+                                        isReadOnlyMode={isReadOnlyMode}
+                                        data={data}
+                                        onDataChanged={onDataChanged}
+                                        entitlementPoolsList={
+                                            entitlementPoolsList
+                                        }
+                                    />
+                                </fieldset>
+                            </Tab>
+                            <Tab
+                                tabId={
+                                    FeatureGroupStateConstants
+                                        .SELECTED_FEATURE_GROUP_TAB
+                                        .LICENSE_KEY_GROUPS
+                                }
+                                title={i18n('License Key Groups')}>
+                                <fieldset disabled={isReadOnlyMode}>
+                                    <LKGTab
+                                        isReadOnlyMode={isReadOnlyMode}
+                                        data={data}
+                                        onDataChanged={onDataChanged}
+                                        licenseKeyGroupsList={
+                                            licenseKeyGroupsList
+                                        }
+                                    />
+                                </fieldset>
+                            </Tab>
+                        </Tabs>
+                    </Form>
+                )}
+            </div>
+        );
+    }
+
+    submit() {
+        const {
+            data: featureGroup,
+            previousData: previousFeatureGroup
+        } = this.props;
+        this.props.onSubmit(previousFeatureGroup, featureGroup);
+    }
+
+    validateName(value) {
+        const { data: { id }, FGNames } = this.props;
+        const isExists = Validator.isItemNameAlreadyExistsInList({
+            itemId: id,
+            itemName: value,
+            list: FGNames
+        });
+
+        return !isExists
+            ? { isValid: true, errorText: '' }
+            : {
+                  isValid: false,
+                  errorText: i18n(
+                      "Feature group by the name '" +
+                          value +
+                          "' already exists. Feature group name must be unique"
+                  )
+              };
+    }
+}
 
 export default FeatureGroupEditorView;
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupListEditor.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupListEditor.js
index 26925487db..55e2710231 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupListEditor.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupListEditor.js
@@ -13,48 +13,62 @@
  * or implied. See the License for the specific language governing
  * permissions and limitations under the License.
  */
-import {connect} from 'react-redux';
-import FeatureGroupsActionHelper  from './FeatureGroupsActionHelper.js';
-import FeatureGroupListEditorView, {generateConfirmationMsg} from './FeatureGroupListEditorView.jsx';
+import { connect } from 'react-redux';
+import FeatureGroupsActionHelper from './FeatureGroupsActionHelper.js';
+import FeatureGroupListEditorView, {
+    generateConfirmationMsg
+} from './FeatureGroupListEditorView.jsx';
 import i18n from 'nfvo-utils/i18n/i18n.js';
-import {actionTypes as globalMoadlActions}  from 'nfvo-components/modal/GlobalModalConstants.js';
+import { actionTypes as globalMoadlActions } from 'nfvo-components/modal/GlobalModalConstants.js';
 
-export const mapStateToProps = ({licenseModel: {featureGroup, licenseModelEditor}}) => {
-
-	const {featureGroupEditor: {data}, featureGroupsList} = featureGroup;
-	const {vendorName, version} = licenseModelEditor.data;
-
-	return {
-		vendorName,
-		version,
-		featureGroupsModal: {
-			show: Boolean(data),
-			editMode: Boolean(data && data.id)
-		},
-		featureGroupsList
-	};
+export const mapStateToProps = ({
+    licenseModel: { featureGroup, licenseModelEditor }
+}) => {
+    const { featureGroupEditor: { data }, featureGroupsList } = featureGroup;
+    const { vendorName, version } = licenseModelEditor.data;
 
+    return {
+        vendorName,
+        version,
+        featureGroupsModal: {
+            show: Boolean(data),
+            editMode: Boolean(data && data.id)
+        },
+        featureGroupsList
+    };
 };
 
-
-const mapActionsToProps = (dispatch, {licenseModelId}) => {
-	return {
-		onDeleteFeatureGroupClick: (featureGroup, version) => dispatch({
-			type: globalMoadlActions.GLOBAL_MODAL_WARNING,
-			data:{
-				msg: generateConfirmationMsg(featureGroup),
-				confirmationButtonText: i18n('Delete'),
-				title: i18n('Delete'),
-				onConfirmed: ()=>FeatureGroupsActionHelper.deleteFeatureGroup(dispatch, {featureGroupId: featureGroup.id, licenseModelId, version})
-			}
-		}),
-		onAddFeatureGroupClick: (actualVersion) => FeatureGroupsActionHelper.openFeatureGroupsEditor(dispatch, {licenseModelId, version: actualVersion}),
-		onEditFeatureGroupClick: (featureGroup, actualVersion) => FeatureGroupsActionHelper.openFeatureGroupsEditor(dispatch, {
-			featureGroup,
-			licenseModelId,
-			version: actualVersion
-		})
-	};
+const mapActionsToProps = (dispatch, { licenseModelId }) => {
+    return {
+        onDeleteFeatureGroupClick: (featureGroup, version) =>
+            dispatch({
+                type: globalMoadlActions.GLOBAL_MODAL_WARNING,
+                data: {
+                    msg: generateConfirmationMsg(featureGroup),
+                    confirmationButtonText: i18n('Delete'),
+                    title: i18n('Delete'),
+                    onConfirmed: () =>
+                        FeatureGroupsActionHelper.deleteFeatureGroup(dispatch, {
+                            featureGroupId: featureGroup.id,
+                            licenseModelId,
+                            version
+                        })
+                }
+            }),
+        onAddFeatureGroupClick: actualVersion =>
+            FeatureGroupsActionHelper.openFeatureGroupsEditor(dispatch, {
+                licenseModelId,
+                version: actualVersion
+            }),
+        onEditFeatureGroupClick: (featureGroup, actualVersion) =>
+            FeatureGroupsActionHelper.openFeatureGroupsEditor(dispatch, {
+                featureGroup,
+                licenseModelId,
+                version: actualVersion
+            })
+    };
 };
 
-export default connect(mapStateToProps, mapActionsToProps)(FeatureGroupListEditorView);
+export default connect(mapStateToProps, mapActionsToProps)(
+    FeatureGroupListEditorView
+);
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupListEditorView.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupListEditorView.jsx
index f59e000c21..91f77b3111 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupListEditorView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupListEditorView.jsx
@@ -24,147 +24,184 @@ import ListEditorItemView from 'nfvo-components/listEditor/ListEditorItemView.js
 import FeatureGroupEditor from './FeatureGroupEditor.js';
 
 class FeatureGroupListEditorView extends React.Component {
-	static propTypes = {
-		vendorName: PropTypes.string,
-		licenseModelId: PropTypes.string.isRequired,
-		featureGroupsModal: PropTypes.shape({
-			show: PropTypes.bool,
-			editMode: PropTypes.bool
-		}),
-		isReadOnlyMode: PropTypes.bool.isRequired,
-		onAddFeatureGroupClick: PropTypes.func,
-		onEditFeatureGroupClick: PropTypes.func,
-		onDeleteFeatureGroupClick: PropTypes.func,
-		onCancelFeatureGroupsEditor: PropTypes.func,
-		featureGroupsList: PropTypes.array
-	};
-
-	static defaultProps = {
-		featureGroupsList: [],
-		featureGroupsModal: {
-			show: false,
-			editMode: false
-		}
-	};
-
-	state = {
-		localFilter: ''
-	};
-
-	render() {
-		let {licenseModelId, featureGroupsModal, isReadOnlyMode, onAddFeatureGroupClick, version} = this.props;
-		const {localFilter} = this.state;
-		return (
-			<div className='license-model-list-editor feature-groups-list-editor'>
-				<ListEditorView
-					title={i18n('Feature Groups')}
-					plusButtonTitle={i18n('Add Feature Group')}
-					filterValue={localFilter}
-					onFilter={value => this.setState({localFilter: value})}
-					onAdd={() => onAddFeatureGroupClick(version)}
-					isReadOnlyMode={isReadOnlyMode}>
-					{this.filterList().map(listItem => this.renderFeatureGroupListItem(listItem, isReadOnlyMode, version))}
-				</ListEditorView>
-				{featureGroupsModal.show && <Modal show={featureGroupsModal.show} bsSize='large' animation={true}
-					       className='onborading-modal license-model-modal feature-group-modal'>
-						<Modal.Header>
-							<Modal.Title>{`${featureGroupsModal.editMode ? i18n('Edit Feature Group') : i18n('Create New Feature Group')}`}</Modal.Title>
-						</Modal.Header>
-						<Modal.Body>
-							<FeatureGroupEditor
-								version={version}
-								licenseModelId={licenseModelId}
-								isReadOnlyMode={isReadOnlyMode}/>
-						</Modal.Body>
-					</Modal>
-				}
-
-			</div>
-		);
-	}
-
-
-	renderFeatureGroupListItem(listItem, isReadOnlyMode, version) {
-		let {name, description, manufacturerReferenceNumber, entitlementPoolsIds = [], licenseKeyGroupsIds = []} = listItem;
-		return (
-			<ListEditorItemView
-				key={listItem.id}
-				onDelete={() => this.deleteFeatureGroupItem(listItem, version)}
-				onSelect={() => this.editFeatureGroupItem(listItem, version)}
-				className='list-editor-item-view'
-				isReadOnlyMode={isReadOnlyMode}>
-				<div className='list-editor-item-view-field'>
-					<div className='title'>{i18n('Name')}</div>
-					<div className='text name'>{name}</div>
-				</div>
-
-				<div className='list-editor-item-view-field smaller-field'>
-					<div className='feature-groups-count-field'>
-						<div className='title'>{i18n('EP')}</div>
-						<div className='feature-groups-count-ep'>{entitlementPoolsIds.length || 0}</div>
-					</div>
-				</div>
-				<div className='list-editor-item-view-field smaller-field'>
-					<div className='feature-groups-count-field'>
-						<div className='title'>{i18n('LKG')}</div>
-						<div className='feature-groups-count-lk'>{licenseKeyGroupsIds.length || 0}</div>
-					</div>
-				</div>
-
-				<div className='list-editor-item-view-field'>
-					<div className='feature-groups-count-field'>
-						<div className='title title-no-wrap'>{i18n('Manufacturer Reference Number')}</div>
-						<div className='feature-groups-mrn-ep'>{manufacturerReferenceNumber}</div>
-					</div>
-				</div>
-
-				<div className='list-editor-item-view-field'>
-					<div className='title'>{i18n('Description')}</div>
-					<div className='text description'>{description}</div>
-				</div>
-
-
-
-			</ListEditorItemView>
-		);
-	}
-
-	filterList() {
-		let {featureGroupsList} = this.props;
-		let {localFilter} = this.state;
-		if (localFilter.trim()) {
-			const filter = new RegExp(escape(localFilter), 'i');
-			return featureGroupsList.filter(({name = '', description = ''}) => {
-				return escape(name).match(filter) || escape(description).match(filter);
-			});
-		}
-		else {
-			return featureGroupsList;
-		}
-	}
-
-	editFeatureGroupItem(featureGroup, version) {
-		this.props.onEditFeatureGroupClick(featureGroup, version);
-	}
-
-	deleteFeatureGroupItem(featureGroup, version) {
-		this.props.onDeleteFeatureGroupClick(featureGroup, version);
-	}
+    static propTypes = {
+        vendorName: PropTypes.string,
+        licenseModelId: PropTypes.string.isRequired,
+        featureGroupsModal: PropTypes.shape({
+            show: PropTypes.bool,
+            editMode: PropTypes.bool
+        }),
+        isReadOnlyMode: PropTypes.bool.isRequired,
+        onAddFeatureGroupClick: PropTypes.func,
+        onEditFeatureGroupClick: PropTypes.func,
+        onDeleteFeatureGroupClick: PropTypes.func,
+        onCancelFeatureGroupsEditor: PropTypes.func,
+        featureGroupsList: PropTypes.array
+    };
+
+    static defaultProps = {
+        featureGroupsList: [],
+        featureGroupsModal: {
+            show: false,
+            editMode: false
+        }
+    };
+
+    state = {
+        localFilter: ''
+    };
+
+    render() {
+        let {
+            licenseModelId,
+            featureGroupsModal,
+            isReadOnlyMode,
+            onAddFeatureGroupClick,
+            version
+        } = this.props;
+        const { localFilter } = this.state;
+        return (
+            <div className="license-model-list-editor feature-groups-list-editor">
+                <ListEditorView
+                    title={i18n('Feature Groups')}
+                    plusButtonTitle={i18n('Add Feature Group')}
+                    filterValue={localFilter}
+                    onFilter={value => this.setState({ localFilter: value })}
+                    onAdd={() => onAddFeatureGroupClick(version)}
+                    isReadOnlyMode={isReadOnlyMode}>
+                    {this.filterList().map(listItem =>
+                        this.renderFeatureGroupListItem(
+                            listItem,
+                            isReadOnlyMode,
+                            version
+                        )
+                    )}
+                </ListEditorView>
+                {featureGroupsModal.show && (
+                    <Modal
+                        show={featureGroupsModal.show}
+                        bsSize="large"
+                        animation={true}
+                        className="onborading-modal license-model-modal feature-group-modal">
+                        <Modal.Header>
+                            <Modal.Title>{`${
+                                featureGroupsModal.editMode
+                                    ? i18n('Edit Feature Group')
+                                    : i18n('Create New Feature Group')
+                            }`}</Modal.Title>
+                        </Modal.Header>
+                        <Modal.Body>
+                            <FeatureGroupEditor
+                                version={version}
+                                licenseModelId={licenseModelId}
+                                isReadOnlyMode={isReadOnlyMode}
+                            />
+                        </Modal.Body>
+                    </Modal>
+                )}
+            </div>
+        );
+    }
+
+    renderFeatureGroupListItem(listItem, isReadOnlyMode, version) {
+        let {
+            name,
+            description,
+            manufacturerReferenceNumber,
+            entitlementPoolsIds = [],
+            licenseKeyGroupsIds = []
+        } = listItem;
+        return (
+            <ListEditorItemView
+                key={listItem.id}
+                onDelete={() => this.deleteFeatureGroupItem(listItem, version)}
+                onSelect={() => this.editFeatureGroupItem(listItem, version)}
+                className="list-editor-item-view"
+                isReadOnlyMode={isReadOnlyMode}>
+                <div className="list-editor-item-view-field">
+                    <div className="title">{i18n('Name')}</div>
+                    <div className="text name">{name}</div>
+                </div>
+
+                <div className="list-editor-item-view-field smaller-field">
+                    <div className="feature-groups-count-field">
+                        <div className="title">{i18n('EP')}</div>
+                        <div className="feature-groups-count-ep">
+                            {entitlementPoolsIds.length || 0}
+                        </div>
+                    </div>
+                </div>
+                <div className="list-editor-item-view-field smaller-field">
+                    <div className="feature-groups-count-field">
+                        <div className="title">{i18n('LKG')}</div>
+                        <div className="feature-groups-count-lk">
+                            {licenseKeyGroupsIds.length || 0}
+                        </div>
+                    </div>
+                </div>
+
+                <div className="list-editor-item-view-field">
+                    <div className="feature-groups-count-field">
+                        <div className="title title-no-wrap">
+                            {i18n('Manufacturer Reference Number')}
+                        </div>
+                        <div className="feature-groups-mrn-ep">
+                            {manufacturerReferenceNumber}
+                        </div>
+                    </div>
+                </div>
+
+                <div className="list-editor-item-view-field">
+                    <div className="title">{i18n('Description')}</div>
+                    <div className="text description">{description}</div>
+                </div>
+            </ListEditorItemView>
+        );
+    }
+
+    filterList() {
+        let { featureGroupsList } = this.props;
+        let { localFilter } = this.state;
+        if (localFilter.trim()) {
+            const filter = new RegExp(escape(localFilter), 'i');
+            return featureGroupsList.filter(
+                ({ name = '', description = '' }) => {
+                    return (
+                        escape(name).match(filter) ||
+                        escape(description).match(filter)
+                    );
+                }
+            );
+        } else {
+            return featureGroupsList;
+        }
+    }
+
+    editFeatureGroupItem(featureGroup, version) {
+        this.props.onEditFeatureGroupClick(featureGroup, version);
+    }
+
+    deleteFeatureGroupItem(featureGroup, version) {
+        this.props.onDeleteFeatureGroupClick(featureGroup, version);
+    }
 }
 
 export default FeatureGroupListEditorView;
 
 export function generateConfirmationMsg(featureGroupToDelete) {
-	let name = featureGroupToDelete ? featureGroupToDelete.name : '';
-	let msg = i18n('Are you sure you want to delete "{name}"?', {name: name});
-	let subMsg = featureGroupToDelete.referencingLicenseAgreements
-	&& featureGroupToDelete.referencingLicenseAgreements.length > 0 ?
-		i18n('This feature group is associated with one ore more license agreements') :
-		'';
-	return (
-		<div>
-			<p>{msg}</p>
-			<p>{subMsg}</p>
-		</div>
-	);
+    let name = featureGroupToDelete ? featureGroupToDelete.name : '';
+    let msg = i18n('Are you sure you want to delete "{name}"?', { name: name });
+    let subMsg =
+        featureGroupToDelete.referencingLicenseAgreements &&
+        featureGroupToDelete.referencingLicenseAgreements.length > 0
+            ? i18n(
+                  'This feature group is associated with one ore more license agreements'
+              )
+            : '';
+    return (
+        <div>
+            <p>{msg}</p>
+            <p>{subMsg}</p>
+        </div>
+    );
 }
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupsActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupsActionHelper.js
index 9e7fe8e0dd..22e21a613a 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupsActionHelper.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupsActionHelper.js
@@ -15,132 +15,202 @@
  */
 import RestAPIUtil from 'nfvo-utils/RestAPIUtil.js';
 import Configuration from 'sdc-app/config/Configuration.js';
-import {actionTypes as featureGroupsActionConstants} from './FeatureGroupsConstants.js';
+import { actionTypes as featureGroupsActionConstants } from './FeatureGroupsConstants.js';
 import EntitlementPoolsActionHelper from 'sdc-app/onboarding/licenseModel/entitlementPools/EntitlementPoolsActionHelper.js';
 import LicenseKeyGroupsActionHelper from 'sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsActionHelper.js';
 import ItemsHelper from 'sdc-app/common/helpers/ItemsHelper.js';
 
 function baseUrl(licenseModelId, version) {
-	const restPrefix = Configuration.get('restPrefix');
-	const {id: versionId} = version;
-	return `${restPrefix}/v1.0/vendor-license-models/${licenseModelId}/versions/${versionId}/feature-groups`;
+    const restPrefix = Configuration.get('restPrefix');
+    const { id: versionId } = version;
+    return `${restPrefix}/v1.0/vendor-license-models/${licenseModelId}/versions/${versionId}/feature-groups`;
 }
 
 function fetchFeatureGroup(licenseModelId, featureGroupId, version) {
-	return RestAPIUtil.fetch(`${baseUrl(licenseModelId, version)}/${featureGroupId}`);
+    return RestAPIUtil.fetch(
+        `${baseUrl(licenseModelId, version)}/${featureGroupId}`
+    );
 }
 
 function fetchFeatureGroupsList(licenseModelId, version) {
-	return RestAPIUtil.fetch(`${baseUrl(licenseModelId, version)}`);
+    return RestAPIUtil.fetch(`${baseUrl(licenseModelId, version)}`);
 }
 
 function deleteFeatureGroup(licenseModelId, featureGroupId, version) {
-	return RestAPIUtil.destroy(`${baseUrl(licenseModelId, version)}/${featureGroupId}`);
+    return RestAPIUtil.destroy(
+        `${baseUrl(licenseModelId, version)}/${featureGroupId}`
+    );
 }
 
 function addFeatureGroup(licenseModelId, featureGroup, version) {
-	return RestAPIUtil.post(baseUrl(licenseModelId, version), {
-		name: featureGroup.name,
-		description: featureGroup.description,
-		partNumber: featureGroup.partNumber,
-		manufacturerReferenceNumber: featureGroup.manufacturerReferenceNumber,
-		addedLicenseKeyGroupsIds: featureGroup.licenseKeyGroupsIds,
-		addedEntitlementPoolsIds: featureGroup.entitlementPoolsIds
-	});
+    return RestAPIUtil.post(baseUrl(licenseModelId, version), {
+        name: featureGroup.name,
+        description: featureGroup.description,
+        partNumber: featureGroup.partNumber,
+        manufacturerReferenceNumber: featureGroup.manufacturerReferenceNumber,
+        addedLicenseKeyGroupsIds: featureGroup.licenseKeyGroupsIds,
+        addedEntitlementPoolsIds: featureGroup.entitlementPoolsIds
+    });
 }
 
-function updateFeatureGroup(licenseModelId, previousFeatureGroup, featureGroup, version) {
-
-	const {licenseKeyGroupsIds = []} = featureGroup;
-	const {licenseKeyGroupsIds: prevLicenseKeyGroupsIds = []} = previousFeatureGroup;
-	const {entitlementPoolsIds = []} = featureGroup;
-	const {entitlementPoolsIds: prevEntitlementPoolsIds = []} = previousFeatureGroup;
-	return RestAPIUtil.put(`${baseUrl(licenseModelId, version)}/${featureGroup.id}`, {
-		name: featureGroup.name,
-		description: featureGroup.description,
-		partNumber: featureGroup.partNumber,
-		manufacturerReferenceNumber: featureGroup.manufacturerReferenceNumber,
-		addedLicenseKeyGroupsIds: licenseKeyGroupsIds.filter(licenseKeyGroupId => prevLicenseKeyGroupsIds.indexOf(licenseKeyGroupId) === -1),
-		removedLicenseKeyGroupsIds: prevLicenseKeyGroupsIds.filter(prevLicenseKeyGroupId => licenseKeyGroupsIds.indexOf(prevLicenseKeyGroupId) === -1),
-		addedEntitlementPoolsIds: entitlementPoolsIds.filter(entitlementPoolId => prevEntitlementPoolsIds.indexOf(entitlementPoolId) === -1),
-		removedEntitlementPoolsIds: prevEntitlementPoolsIds.filter(prevEntitlementPoolId => entitlementPoolsIds.indexOf(prevEntitlementPoolId) === -1)
-
-	});
+function updateFeatureGroup(
+    licenseModelId,
+    previousFeatureGroup,
+    featureGroup,
+    version
+) {
+    const { licenseKeyGroupsIds = [] } = featureGroup;
+    const {
+        licenseKeyGroupsIds: prevLicenseKeyGroupsIds = []
+    } = previousFeatureGroup;
+    const { entitlementPoolsIds = [] } = featureGroup;
+    const {
+        entitlementPoolsIds: prevEntitlementPoolsIds = []
+    } = previousFeatureGroup;
+    return RestAPIUtil.put(
+        `${baseUrl(licenseModelId, version)}/${featureGroup.id}`,
+        {
+            name: featureGroup.name,
+            description: featureGroup.description,
+            partNumber: featureGroup.partNumber,
+            manufacturerReferenceNumber:
+                featureGroup.manufacturerReferenceNumber,
+            addedLicenseKeyGroupsIds: licenseKeyGroupsIds.filter(
+                licenseKeyGroupId =>
+                    prevLicenseKeyGroupsIds.indexOf(licenseKeyGroupId) === -1
+            ),
+            removedLicenseKeyGroupsIds: prevLicenseKeyGroupsIds.filter(
+                prevLicenseKeyGroupId =>
+                    licenseKeyGroupsIds.indexOf(prevLicenseKeyGroupId) === -1
+            ),
+            addedEntitlementPoolsIds: entitlementPoolsIds.filter(
+                entitlementPoolId =>
+                    prevEntitlementPoolsIds.indexOf(entitlementPoolId) === -1
+            ),
+            removedEntitlementPoolsIds: prevEntitlementPoolsIds.filter(
+                prevEntitlementPoolId =>
+                    entitlementPoolsIds.indexOf(prevEntitlementPoolId) === -1
+            )
+        }
+    );
 }
 
 export default {
-	fetchFeatureGroup(dispatch, {licenseModelId, featureGroupId, version}) {
-		return fetchFeatureGroup(licenseModelId, featureGroupId, version);
-	},
+    fetchFeatureGroup(dispatch, { licenseModelId, featureGroupId, version }) {
+        return fetchFeatureGroup(licenseModelId, featureGroupId, version);
+    },
 
-	fetchFeatureGroupsList(dispatch, {licenseModelId, version}) {
-		return fetchFeatureGroupsList(licenseModelId, version).then(response => dispatch({
-			type: featureGroupsActionConstants.FEATURE_GROUPS_LIST_LOADED,
-			response
-		}));
-	},
+    fetchFeatureGroupsList(dispatch, { licenseModelId, version }) {
+        return fetchFeatureGroupsList(licenseModelId, version).then(response =>
+            dispatch({
+                type: featureGroupsActionConstants.FEATURE_GROUPS_LIST_LOADED,
+                response
+            })
+        );
+    },
 
-	deleteFeatureGroup(dispatch, {licenseModelId, featureGroupId, version}) {
-		return deleteFeatureGroup(licenseModelId, featureGroupId, version).then(() => {
-			dispatch({
-				type: featureGroupsActionConstants.DELETE_FEATURE_GROUPS,
-				featureGroupId
-			});
-			return ItemsHelper.checkItemStatus(dispatch, {itemId: licenseModelId, versionId: version.id});
-		});
-	},
+    deleteFeatureGroup(dispatch, { licenseModelId, featureGroupId, version }) {
+        return deleteFeatureGroup(licenseModelId, featureGroupId, version).then(
+            () => {
+                dispatch({
+                    type: featureGroupsActionConstants.DELETE_FEATURE_GROUPS,
+                    featureGroupId
+                });
+                return ItemsHelper.checkItemStatus(dispatch, {
+                    itemId: licenseModelId,
+                    versionId: version.id
+                });
+            }
+        );
+    },
 
-	saveFeatureGroup(dispatch, {licenseModelId, previousFeatureGroup, featureGroup, version}) {
-		if (previousFeatureGroup) {
-			return updateFeatureGroup(licenseModelId, previousFeatureGroup, featureGroup, version).then(() =>{
-				dispatch({
-					type: featureGroupsActionConstants.EDIT_FEATURE_GROUPS,
-					featureGroup
-				});
-				EntitlementPoolsActionHelper.fetchEntitlementPoolsList(dispatch, {licenseModelId, version});
-				LicenseKeyGroupsActionHelper.fetchLicenseKeyGroupsList(dispatch, {licenseModelId, version});
-				return ItemsHelper.checkItemStatus(dispatch, {itemId: licenseModelId, versionId: version.id});
-			});
-		}
-		else {
-			return addFeatureGroup(licenseModelId, featureGroup, version).then(response => {
-				dispatch({
-					type: featureGroupsActionConstants.ADD_FEATURE_GROUPS,
-					featureGroup: {
-						...featureGroup,
-						id: response.value,
-						referencingLicenseAgreements: []
-					}
-				});
-				EntitlementPoolsActionHelper.fetchEntitlementPoolsList(dispatch, {licenseModelId, version});
-				LicenseKeyGroupsActionHelper.fetchLicenseKeyGroupsList(dispatch, {licenseModelId, version});
-				return ItemsHelper.checkItemStatus(dispatch, {itemId: licenseModelId, versionId: version.id});
-			});
-		}
-	},
+    saveFeatureGroup(
+        dispatch,
+        { licenseModelId, previousFeatureGroup, featureGroup, version }
+    ) {
+        if (previousFeatureGroup) {
+            return updateFeatureGroup(
+                licenseModelId,
+                previousFeatureGroup,
+                featureGroup,
+                version
+            ).then(() => {
+                dispatch({
+                    type: featureGroupsActionConstants.EDIT_FEATURE_GROUPS,
+                    featureGroup
+                });
+                EntitlementPoolsActionHelper.fetchEntitlementPoolsList(
+                    dispatch,
+                    { licenseModelId, version }
+                );
+                LicenseKeyGroupsActionHelper.fetchLicenseKeyGroupsList(
+                    dispatch,
+                    { licenseModelId, version }
+                );
+                return ItemsHelper.checkItemStatus(dispatch, {
+                    itemId: licenseModelId,
+                    versionId: version.id
+                });
+            });
+        } else {
+            return addFeatureGroup(licenseModelId, featureGroup, version).then(
+                response => {
+                    dispatch({
+                        type: featureGroupsActionConstants.ADD_FEATURE_GROUPS,
+                        featureGroup: {
+                            ...featureGroup,
+                            id: response.value,
+                            referencingLicenseAgreements: []
+                        }
+                    });
+                    EntitlementPoolsActionHelper.fetchEntitlementPoolsList(
+                        dispatch,
+                        { licenseModelId, version }
+                    );
+                    LicenseKeyGroupsActionHelper.fetchLicenseKeyGroupsList(
+                        dispatch,
+                        { licenseModelId, version }
+                    );
+                    return ItemsHelper.checkItemStatus(dispatch, {
+                        itemId: licenseModelId,
+                        versionId: version.id
+                    });
+                }
+            );
+        }
+    },
 
-	selectEntitlementPoolsEditorTab(dispatch, {tab}) {
-		dispatch({
-			type: featureGroupsActionConstants.featureGroupsEditor.SELECT_TAB,
-			tab
-		});
-	},
+    selectEntitlementPoolsEditorTab(dispatch, { tab }) {
+        dispatch({
+            type: featureGroupsActionConstants.featureGroupsEditor.SELECT_TAB,
+            tab
+        });
+    },
 
-	openFeatureGroupsEditor(dispatch, {featureGroup, licenseModelId, version}) {
-		return Promise.all([
-			EntitlementPoolsActionHelper.fetchEntitlementPoolsList(dispatch, {licenseModelId, version}),
-			LicenseKeyGroupsActionHelper.fetchLicenseKeyGroupsList(dispatch, {licenseModelId, version})
-		]).then(() => {
-			dispatch({
-				type: featureGroupsActionConstants.featureGroupsEditor.OPEN,
-				featureGroup
-			});
-		});
-	},
+    openFeatureGroupsEditor(
+        dispatch,
+        { featureGroup, licenseModelId, version }
+    ) {
+        return Promise.all([
+            EntitlementPoolsActionHelper.fetchEntitlementPoolsList(dispatch, {
+                licenseModelId,
+                version
+            }),
+            LicenseKeyGroupsActionHelper.fetchLicenseKeyGroupsList(dispatch, {
+                licenseModelId,
+                version
+            })
+        ]).then(() => {
+            dispatch({
+                type: featureGroupsActionConstants.featureGroupsEditor.OPEN,
+                featureGroup
+            });
+        });
+    },
 
-	closeFeatureGroupsEditor(dispatch) {
-		dispatch({
-			type: featureGroupsActionConstants.featureGroupsEditor.CLOSE
-		});
-	}
+    closeFeatureGroupsEditor(dispatch) {
+        dispatch({
+            type: featureGroupsActionConstants.featureGroupsEditor.CLOSE
+        });
+    }
 };
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupsConstants.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupsConstants.js
index 4c5a94f239..feeb5b6c39 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupsConstants.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupsConstants.js
@@ -16,27 +16,27 @@
 import keyMirror from 'nfvo-utils/KeyMirror.js';
 
 export const actionTypes = keyMirror({
-	FEATURE_GROUPS_LIST_LOADED: null,
-	ADD_FEATURE_GROUPS: null,
-	EDIT_FEATURE_GROUPS: null,
-	DELETE_FEATURE_GROUPS: null,
+    FEATURE_GROUPS_LIST_LOADED: null,
+    ADD_FEATURE_GROUPS: null,
+    EDIT_FEATURE_GROUPS: null,
+    DELETE_FEATURE_GROUPS: null,
 
-	ENTITLEMENT_POOLS_LIST_LOADED: null,
+    ENTITLEMENT_POOLS_LIST_LOADED: null,
 
-	featureGroupsEditor: {
-		OPEN: null,
-		CLOSE: null,
-		DATA_CHANGED: null,
-		SELECT_TAB: null
-	}
+    featureGroupsEditor: {
+        OPEN: null,
+        CLOSE: null,
+        DATA_CHANGED: null,
+        SELECT_TAB: null
+    }
 });
 
 export const FG_EDITOR_FORM = 'FG_EDITOR_FORM';
 
 export const state = keyMirror({
-	SELECTED_FEATURE_GROUP_TAB: {
-		GENERAL: 1,
-		ENTITLEMENT_POOLS: 2,
-		LICENSE_KEY_GROUPS: 3
-	}
+    SELECTED_FEATURE_GROUP_TAB: {
+        GENERAL: 1,
+        ENTITLEMENT_POOLS: 2,
+        LICENSE_KEY_GROUPS: 3
+    }
 });
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupsEditorReducer.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupsEditorReducer.js
index 5688fc0f16..aa1081ed20 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupsEditorReducer.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupsEditorReducer.js
@@ -14,65 +14,82 @@
  * permissions and limitations under the License.
  */
 
-import {actionTypes, FG_EDITOR_FORM, state as FeatureGroupStateConstants} from './FeatureGroupsConstants.js';
-
-
+import {
+    actionTypes,
+    FG_EDITOR_FORM,
+    state as FeatureGroupStateConstants
+} from './FeatureGroupsConstants.js';
 
 export default (state = {}, action) => {
-	switch (action.type) {
-		case actionTypes.featureGroupsEditor.OPEN:
-			return {
-				...state,
-				data: action.featureGroup || {},
-				formReady: null,
-				formName: FG_EDITOR_FORM,
-				genericFieldInfo: {
-					'description': {
-						isValid: true,
-						errorText: '',
-						validations: [{type: 'maxLength', data: 1000}],
-						tabId: FeatureGroupStateConstants.SELECTED_FEATURE_GROUP_TAB.GENERAL
-					},
-					'partNumber': {
-						isValid: true,
-						errorText: '',
-						validations: [{type: 'required', data: true}],
-						tabId: FeatureGroupStateConstants.SELECTED_FEATURE_GROUP_TAB.GENERAL
-					},
-					'manufacturerReferenceNumber': {
-						isValid: true,
-						errorText: '',
-						validations: [{type: 'required', data: true}, {type: 'maxLength', data: 100}],
-						tabId: FeatureGroupStateConstants.SELECTED_FEATURE_GROUP_TAB.GENERAL
-					},
-					'name': {
-						isValid: true,
-						errorText: '',
-						validations: [{type: 'required', data: true}, {type: 'maxLength', data: 120}],
-						tabId: FeatureGroupStateConstants.SELECTED_FEATURE_GROUP_TAB.GENERAL
-					}
-				}
-			};
-		case actionTypes.featureGroupsEditor.CLOSE:
-			return {};
-		case actionTypes.featureGroupsEditor.SELECT_TAB:
-			return {
-				...state,
-				selectedTab: action.tab
-			};
-
-		case actionTypes.featureGroupsEditor.SELECTED_ENTITLEMENT_POOLS_BUTTONTAB:
-			return {
-				...state,
-				selectedEntitlementPoolsButtonTab: action.buttonTab
-			};
-		case actionTypes.featureGroupsEditor.SELECTED_LICENSE_KEY_GROUPS_BUTTONTAB:
-			return {
-				...state,
-				selectedLicenseKeyGroupsButtonTab: action.buttonTab
-			};
-		default:
-			return state;
-	}
+    switch (action.type) {
+        case actionTypes.featureGroupsEditor.OPEN:
+            return {
+                ...state,
+                data: action.featureGroup || {},
+                formReady: null,
+                formName: FG_EDITOR_FORM,
+                genericFieldInfo: {
+                    description: {
+                        isValid: true,
+                        errorText: '',
+                        validations: [{ type: 'maxLength', data: 1000 }],
+                        tabId:
+                            FeatureGroupStateConstants
+                                .SELECTED_FEATURE_GROUP_TAB.GENERAL
+                    },
+                    partNumber: {
+                        isValid: true,
+                        errorText: '',
+                        validations: [{ type: 'required', data: true }],
+                        tabId:
+                            FeatureGroupStateConstants
+                                .SELECTED_FEATURE_GROUP_TAB.GENERAL
+                    },
+                    manufacturerReferenceNumber: {
+                        isValid: true,
+                        errorText: '',
+                        validations: [
+                            { type: 'required', data: true },
+                            { type: 'maxLength', data: 100 }
+                        ],
+                        tabId:
+                            FeatureGroupStateConstants
+                                .SELECTED_FEATURE_GROUP_TAB.GENERAL
+                    },
+                    name: {
+                        isValid: true,
+                        errorText: '',
+                        validations: [
+                            { type: 'required', data: true },
+                            { type: 'maxLength', data: 120 }
+                        ],
+                        tabId:
+                            FeatureGroupStateConstants
+                                .SELECTED_FEATURE_GROUP_TAB.GENERAL
+                    }
+                }
+            };
+        case actionTypes.featureGroupsEditor.CLOSE:
+            return {};
+        case actionTypes.featureGroupsEditor.SELECT_TAB:
+            return {
+                ...state,
+                selectedTab: action.tab
+            };
 
+        case actionTypes.featureGroupsEditor
+            .SELECTED_ENTITLEMENT_POOLS_BUTTONTAB:
+            return {
+                ...state,
+                selectedEntitlementPoolsButtonTab: action.buttonTab
+            };
+        case actionTypes.featureGroupsEditor
+            .SELECTED_LICENSE_KEY_GROUPS_BUTTONTAB:
+            return {
+                ...state,
+                selectedLicenseKeyGroupsButtonTab: action.buttonTab
+            };
+        default:
+            return state;
+    }
 };
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupsListReducer.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupsListReducer.js
index 3b5f1c55e4..072bba403d 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupsListReducer.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupsListReducer.js
@@ -13,19 +13,27 @@
  * or implied. See the License for the specific language governing
  * permissions and limitations under the License.
  */
-import {actionTypes} from './FeatureGroupsConstants.js';
+import { actionTypes } from './FeatureGroupsConstants.js';
 export default (state = [], action) => {
-	switch (action.type) {
-		case actionTypes.FEATURE_GROUPS_LIST_LOADED:
-			return [...action.response.results];
-		case actionTypes.ADD_FEATURE_GROUPS:
-			return [...state, action.featureGroup];
-		case actionTypes.EDIT_FEATURE_GROUPS:
-			const indexForEdit = state.findIndex(featureGroup => featureGroup.id === action.featureGroup.id);
-			return [...state.slice(0, indexForEdit), action.featureGroup, ...state.slice(indexForEdit + 1)];
-		case actionTypes.DELETE_FEATURE_GROUPS:
-			return state.filter(featureGroup => featureGroup.id !== action.featureGroupId);
-		default:
-			return state;
-	}
+    switch (action.type) {
+        case actionTypes.FEATURE_GROUPS_LIST_LOADED:
+            return [...action.response.results];
+        case actionTypes.ADD_FEATURE_GROUPS:
+            return [...state, action.featureGroup];
+        case actionTypes.EDIT_FEATURE_GROUPS:
+            const indexForEdit = state.findIndex(
+                featureGroup => featureGroup.id === action.featureGroup.id
+            );
+            return [
+                ...state.slice(0, indexForEdit),
+                action.featureGroup,
+                ...state.slice(indexForEdit + 1)
+            ];
+        case actionTypes.DELETE_FEATURE_GROUPS:
+            return state.filter(
+                featureGroup => featureGroup.id !== action.featureGroupId
+            );
+        default:
+            return state;
+    }
 };
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementActionHelper.js
index b1b4ee8fdd..e07777f69e 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementActionHelper.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementActionHelper.js
@@ -15,109 +15,181 @@
  */
 import RestAPIUtil from 'nfvo-utils/RestAPIUtil.js';
 import Configuration from 'sdc-app/config/Configuration.js';
-import {actionTypes as licenseAgreementActionTypes} from './LicenseAgreementConstants.js';
+import { actionTypes as licenseAgreementActionTypes } from './LicenseAgreementConstants.js';
 import FeatureGroupsActionHelper from 'sdc-app/onboarding/licenseModel/featureGroups/FeatureGroupsActionHelper.js';
 import ItemsHelper from 'sdc-app/common/helpers/ItemsHelper.js';
 
 function baseUrl(licenseModelId, version) {
-	const restPrefix = Configuration.get('restPrefix');
-	const {id: versionId} = version;
-	return `${restPrefix}/v1.0/vendor-license-models/${licenseModelId}/versions/${versionId}/license-agreements`;
+    const restPrefix = Configuration.get('restPrefix');
+    const { id: versionId } = version;
+    return `${restPrefix}/v1.0/vendor-license-models/${licenseModelId}/versions/${versionId}/license-agreements`;
 }
 
 function fetchLicenseAgreementList(licenseModelId, version) {
-	return RestAPIUtil.fetch(`${baseUrl(licenseModelId, version)}`);
+    return RestAPIUtil.fetch(`${baseUrl(licenseModelId, version)}`);
 }
 
 function fetchLicenseAgreement(licenseModelId, licenseAgreementId, version) {
-	return RestAPIUtil.fetch(`${baseUrl(licenseModelId, version)}/${licenseAgreementId}`);
+    return RestAPIUtil.fetch(
+        `${baseUrl(licenseModelId, version)}/${licenseAgreementId}`
+    );
 }
 
 function postLicenseAgreement(licenseModelId, licenseAgreement, version) {
-	return RestAPIUtil.post(baseUrl(licenseModelId, version), {
-		name: licenseAgreement.name,
-		description: licenseAgreement.description,
-		licenseTerm: licenseAgreement.licenseTerm,
-		requirementsAndConstrains: licenseAgreement.requirementsAndConstrains,
-		addedFeatureGroupsIds: licenseAgreement.featureGroupsIds
-	});
+    return RestAPIUtil.post(baseUrl(licenseModelId, version), {
+        name: licenseAgreement.name,
+        description: licenseAgreement.description,
+        licenseTerm: licenseAgreement.licenseTerm,
+        requirementsAndConstrains: licenseAgreement.requirementsAndConstrains,
+        addedFeatureGroupsIds: licenseAgreement.featureGroupsIds
+    });
 }
 
-function putLicenseAgreement(licenseModelId, previousLicenseAgreement, licenseAgreement, version) {
-	const {featureGroupsIds = []} = licenseAgreement;
-	const {featureGroupsIds: prevFeatureGroupsIds = []} = previousLicenseAgreement;
-	return RestAPIUtil.put(`${baseUrl(licenseModelId, version)}/${licenseAgreement.id}`, {
-		name: licenseAgreement.name,
-		description: licenseAgreement.description,
-		licenseTerm: licenseAgreement.licenseTerm,
-		requirementsAndConstrains: licenseAgreement.requirementsAndConstrains,
-		addedFeatureGroupsIds: featureGroupsIds.filter(featureGroupId => prevFeatureGroupsIds.indexOf(featureGroupId) === -1),
-		removedFeatureGroupsIds: prevFeatureGroupsIds.filter(prevFeatureGroupsId => featureGroupsIds.indexOf(prevFeatureGroupsId) === -1)
-	});
+function putLicenseAgreement(
+    licenseModelId,
+    previousLicenseAgreement,
+    licenseAgreement,
+    version
+) {
+    const { featureGroupsIds = [] } = licenseAgreement;
+    const {
+        featureGroupsIds: prevFeatureGroupsIds = []
+    } = previousLicenseAgreement;
+    return RestAPIUtil.put(
+        `${baseUrl(licenseModelId, version)}/${licenseAgreement.id}`,
+        {
+            name: licenseAgreement.name,
+            description: licenseAgreement.description,
+            licenseTerm: licenseAgreement.licenseTerm,
+            requirementsAndConstrains:
+                licenseAgreement.requirementsAndConstrains,
+            addedFeatureGroupsIds: featureGroupsIds.filter(
+                featureGroupId =>
+                    prevFeatureGroupsIds.indexOf(featureGroupId) === -1
+            ),
+            removedFeatureGroupsIds: prevFeatureGroupsIds.filter(
+                prevFeatureGroupsId =>
+                    featureGroupsIds.indexOf(prevFeatureGroupsId) === -1
+            )
+        }
+    );
 }
 
 function deleteLicenseAgreement(licenseModelId, licenseAgreementId, version) {
-	return RestAPIUtil.destroy(`${baseUrl(licenseModelId, version)}/${licenseAgreementId}`);
+    return RestAPIUtil.destroy(
+        `${baseUrl(licenseModelId, version)}/${licenseAgreementId}`
+    );
 }
 
 export default {
+    fetchLicenseAgreementList(dispatch, { licenseModelId, version }) {
+        return fetchLicenseAgreementList(licenseModelId, version).then(
+            response =>
+                dispatch({
+                    type:
+                        licenseAgreementActionTypes.LICENSE_AGREEMENT_LIST_LOADED,
+                    response
+                })
+        );
+    },
 
-	fetchLicenseAgreementList(dispatch, {licenseModelId, version}) {
-		return fetchLicenseAgreementList(licenseModelId, version).then(response => dispatch({
-			type: licenseAgreementActionTypes.LICENSE_AGREEMENT_LIST_LOADED,
-			response
-		}));
-	},
+    fetchLicenseAgreement(
+        dispatch,
+        { licenseModelId, licenseAgreementId, version }
+    ) {
+        return fetchLicenseAgreement(
+            licenseModelId,
+            licenseAgreementId,
+            version
+        );
+    },
 
-	fetchLicenseAgreement(dispatch, {licenseModelId, licenseAgreementId, version}) {
-		return fetchLicenseAgreement(licenseModelId, licenseAgreementId, version);
-	},
+    openLicenseAgreementEditor(
+        dispatch,
+        { licenseModelId, licenseAgreement, version }
+    ) {
+        FeatureGroupsActionHelper.fetchFeatureGroupsList(dispatch, {
+            licenseModelId,
+            version
+        });
+        dispatch({
+            type: licenseAgreementActionTypes.licenseAgreementEditor.OPEN,
+            licenseAgreement
+        });
+    },
 
-	openLicenseAgreementEditor(dispatch, {licenseModelId, licenseAgreement, version}) {
-		FeatureGroupsActionHelper.fetchFeatureGroupsList(dispatch, {licenseModelId, version});
-		dispatch({
-			type: licenseAgreementActionTypes.licenseAgreementEditor.OPEN,
-			licenseAgreement
-		});
-	},
+    closeLicenseAgreementEditor(dispatch) {
+        dispatch({
+            type: licenseAgreementActionTypes.licenseAgreementEditor.CLOSE
+        });
+    },
 
-	closeLicenseAgreementEditor(dispatch) {
-		dispatch({
-			type: licenseAgreementActionTypes.licenseAgreementEditor.CLOSE
-		});
-	},
+    saveLicenseAgreement(
+        dispatch,
+        { licenseModelId, previousLicenseAgreement, licenseAgreement, version }
+    ) {
+        if (previousLicenseAgreement) {
+            return putLicenseAgreement(
+                licenseModelId,
+                previousLicenseAgreement,
+                licenseAgreement,
+                version
+            ).then(() => {
+                this.fetchLicenseAgreementList(dispatch, {
+                    licenseModelId,
+                    version
+                });
+                return ItemsHelper.checkItemStatus(dispatch, {
+                    itemId: licenseModelId,
+                    versionId: version.id
+                });
+            });
+        } else {
+            return postLicenseAgreement(
+                licenseModelId,
+                licenseAgreement,
+                version
+            ).then(() => {
+                this.fetchLicenseAgreementList(dispatch, {
+                    licenseModelId,
+                    version
+                });
+                FeatureGroupsActionHelper.fetchFeatureGroupsList(dispatch, {
+                    licenseModelId,
+                    version
+                });
+                return ItemsHelper.checkItemStatus(dispatch, {
+                    itemId: licenseModelId,
+                    versionId: version.id
+                });
+            });
+        }
+    },
 
+    deleteLicenseAgreement(
+        dispatch,
+        { licenseModelId, licenseAgreementId, version }
+    ) {
+        return deleteLicenseAgreement(
+            licenseModelId,
+            licenseAgreementId,
+            version
+        ).then(() => {
+            dispatch({
+                type: licenseAgreementActionTypes.DELETE_LICENSE_AGREEMENT,
+                licenseAgreementId
+            });
+            return ItemsHelper.checkItemStatus(dispatch, {
+                itemId: licenseModelId,
+                versionId: version.id
+            });
+        });
+    },
 
-	saveLicenseAgreement(dispatch, {licenseModelId, previousLicenseAgreement, licenseAgreement, version}) {
-		if (previousLicenseAgreement) {
-			return putLicenseAgreement(licenseModelId, previousLicenseAgreement, licenseAgreement, version).then(() => {
-				this.fetchLicenseAgreementList(dispatch, {licenseModelId, version});
-				return ItemsHelper.checkItemStatus(dispatch, {itemId: licenseModelId, versionId: version.id});
-			});
-		}
-		else {
-			return postLicenseAgreement(licenseModelId, licenseAgreement, version).then(() => {
-				this.fetchLicenseAgreementList(dispatch, {licenseModelId, version});
-				FeatureGroupsActionHelper.fetchFeatureGroupsList(dispatch, {licenseModelId, version});
-				return ItemsHelper.checkItemStatus(dispatch, {itemId: licenseModelId, versionId: version.id});
-			});
-		}
-	},
-
-	deleteLicenseAgreement(dispatch, {licenseModelId, licenseAgreementId, version}) {
-		return deleteLicenseAgreement(licenseModelId, licenseAgreementId, version).then(() => {
-			dispatch({
-				type: licenseAgreementActionTypes.DELETE_LICENSE_AGREEMENT,
-				licenseAgreementId
-			});
-			return ItemsHelper.checkItemStatus(dispatch, {itemId: licenseModelId, versionId: version.id});
-		});
-	},
-
-	selectLicenseAgreementEditorTab(dispatch, {tab}) {
-		dispatch({
-			type: licenseAgreementActionTypes.licenseAgreementEditor.SELECT_TAB,
-			tab
-		});
-	}
+    selectLicenseAgreementEditorTab(dispatch, { tab }) {
+        dispatch({
+            type: licenseAgreementActionTypes.licenseAgreementEditor.SELECT_TAB,
+            tab
+        });
+    }
 };
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementConstants.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementConstants.js
index 181171d4cd..65a45348ca 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementConstants.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementConstants.js
@@ -15,49 +15,54 @@
  */
 import keyMirror from 'nfvo-utils/KeyMirror.js';
 import i18n from 'nfvo-utils/i18n/i18n.js';
-import InputOptions, {other as optionInputOther} from 'nfvo-components/input/validation/InputOptions.jsx';
+import InputOptions, {
+    other as optionInputOther
+} from 'nfvo-components/input/validation/InputOptions.jsx';
 
 export const actionTypes = keyMirror({
-	LICENSE_AGREEMENT_LIST_LOADED: null,
-	DELETE_LICENSE_AGREEMENT: null,
-
-	licenseAgreementEditor: {
-		OPEN: null,
-		CLOSE: null,
-		DATA_CHANGED: null,
-		SELECT_TAB: null
-	}
+    LICENSE_AGREEMENT_LIST_LOADED: null,
+    DELETE_LICENSE_AGREEMENT: null,
 
+    licenseAgreementEditor: {
+        OPEN: null,
+        CLOSE: null,
+        DATA_CHANGED: null,
+        SELECT_TAB: null
+    }
 });
 
 export const LA_EDITOR_FORM = 'LA_EDITOR_FORM';
 
 export const enums = keyMirror({
-	SELECTED_LICENSE_AGREEMENT_TAB: {
-		GENERAL: 1,
-		FEATURE_GROUPS: 2
-	}
+    SELECTED_LICENSE_AGREEMENT_TAB: {
+        GENERAL: 1,
+        FEATURE_GROUPS: 2
+    }
 });
 
 export const defaultState = {
-	LICENSE_AGREEMENT_EDITOR_DATA: {
-		licenseTerm: {choice: '', other: ''}
-	}
+    LICENSE_AGREEMENT_EDITOR_DATA: {
+        licenseTerm: { choice: '', other: '' }
+    }
 };
 
 export const optionsInputValues = {
-	LICENSE_MODEL_TYPE: [
-		{enum: '', title: i18n('please select…')},
-		{enum: 'Fixed_Term', title: 'Fixed Term'},
-		{enum: 'Perpetual', title: 'Perpetual'},
-		{enum: 'Unlimited', title: 'Unlimited'}
-	]
+    LICENSE_MODEL_TYPE: [
+        { enum: '', title: i18n('please select…') },
+        { enum: 'Fixed_Term', title: 'Fixed Term' },
+        { enum: 'Perpetual', title: 'Perpetual' },
+        { enum: 'Unlimited', title: 'Unlimited' }
+    ]
 };
 
-export const extractValue = (item) => {
-	if (item === undefined) {
-		return '';
-	} //TODO fix it later
+export const extractValue = item => {
+    if (item === undefined) {
+        return '';
+    } //TODO fix it later
 
-	return item ? item.choice === optionInputOther.OTHER ? item.other : InputOptions.getTitleByName(optionsInputValues, item.choice) : '';
+    return item
+        ? item.choice === optionInputOther.OTHER
+          ? item.other
+          : InputOptions.getTitleByName(optionsInputValues, item.choice)
+        : '';
 };
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementEditor.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementEditor.js
index 7d70da6ea5..735531a175 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementEditor.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementEditor.js
@@ -13,66 +13,93 @@
  * 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 LicenseAgreementActionHelper from './LicenseAgreementActionHelper.js';
 import LicenseAgreementEditorView from './LicenseAgreementEditorView.jsx';
 import ValidationHelper from 'sdc-app/common/helpers/ValidationHelper.js';
 
-export const mapStateToProps = ({licenseModel: {licenseAgreement, featureGroup}}) => {
+export const mapStateToProps = ({
+    licenseModel: { licenseAgreement, featureGroup }
+}) => {
+    let {
+        data,
+        selectedTab,
+        genericFieldInfo,
+        formReady
+    } = licenseAgreement.licenseAgreementEditor;
+    const list = licenseAgreement.licenseAgreementList;
+    const LANames = {};
 
+    let previousData;
+    const licenseAgreementId = data ? data.id : null;
+    if (licenseAgreementId) {
+        previousData = licenseAgreement.licenseAgreementList.find(
+            licenseAgreement => licenseAgreement.id === licenseAgreementId
+        );
+    }
 
-	let {data, selectedTab, genericFieldInfo, formReady} = licenseAgreement.licenseAgreementEditor;
-	const list = licenseAgreement.licenseAgreementList;
-	const LANames = {};
+    for (let i = 0; i < list.length; i++) {
+        LANames[list[i].name.toLowerCase()] = list[i].id;
+    }
 
-	let previousData;
-	const licenseAgreementId = data ? data.id : null;
-	if(licenseAgreementId) {
-		previousData = licenseAgreement.licenseAgreementList.find(licenseAgreement => licenseAgreement.id === licenseAgreementId);
-	}
+    const { featureGroupsList = [] } = featureGroup;
 
-	for (let i = 0; i < list.length; i++) {
-		LANames[list[i].name.toLowerCase()] = list[i].id;
-	}
+    let isFormValid = true;
+    let invalidTabs = [];
+    for (let field in genericFieldInfo) {
+        if (!genericFieldInfo[field].isValid) {
+            isFormValid = false;
+            let tabId = genericFieldInfo[field].tabId;
+            if (invalidTabs.indexOf(tabId) === -1) {
+                invalidTabs[invalidTabs.length] = genericFieldInfo[field].tabId;
+            }
+        }
+    }
 
-	const {featureGroupsList = []} = featureGroup;
-
-	let isFormValid = true;
-	let invalidTabs = [];
-	for (let field in genericFieldInfo) {
-		if (!genericFieldInfo[field].isValid) {
-			isFormValid = false;
-			let tabId = genericFieldInfo[field].tabId;
-			if (invalidTabs.indexOf(tabId) === -1) {
-				invalidTabs[invalidTabs.length] = genericFieldInfo[field].tabId;
-			}
-		}
-	}
-
-	return {
-		data,
-		previousData,
-		selectedTab,
-		featureGroupsList,
-		LANames,
-		genericFieldInfo,
-		isFormValid,
-		formReady,
-		invalidTabs
-	};
+    return {
+        data,
+        previousData,
+        selectedTab,
+        featureGroupsList,
+        LANames,
+        genericFieldInfo,
+        isFormValid,
+        formReady,
+        invalidTabs
+    };
 };
 
-export const mapActionsToProps = (dispatch, {licenseModelId, version}) => {
-	return {
-		onDataChanged: (deltaData, formName, customValidations) => ValidationHelper.dataChanged(dispatch, {deltaData, formName, customValidations}),
-		onTabSelect: tab => LicenseAgreementActionHelper.selectLicenseAgreementEditorTab(dispatch, {tab}),
-		onCancel: () => LicenseAgreementActionHelper.closeLicenseAgreementEditor(dispatch),
-		onSubmit: ({previousLicenseAgreement, licenseAgreement}) => {
-			LicenseAgreementActionHelper.closeLicenseAgreementEditor(dispatch);
-			LicenseAgreementActionHelper.saveLicenseAgreement(dispatch, {licenseModelId, previousLicenseAgreement, licenseAgreement, version});
-		},
-		onValidateForm: (formName) => ValidationHelper.validateForm(dispatch, formName)
-	};
+export const mapActionsToProps = (dispatch, { licenseModelId, version }) => {
+    return {
+        onDataChanged: (deltaData, formName, customValidations) =>
+            ValidationHelper.dataChanged(dispatch, {
+                deltaData,
+                formName,
+                customValidations
+            }),
+        onTabSelect: tab =>
+            LicenseAgreementActionHelper.selectLicenseAgreementEditorTab(
+                dispatch,
+                {
+                    tab
+                }
+            ),
+        onCancel: () =>
+            LicenseAgreementActionHelper.closeLicenseAgreementEditor(dispatch),
+        onSubmit: ({ previousLicenseAgreement, licenseAgreement }) => {
+            LicenseAgreementActionHelper.closeLicenseAgreementEditor(dispatch);
+            LicenseAgreementActionHelper.saveLicenseAgreement(dispatch, {
+                licenseModelId,
+                previousLicenseAgreement,
+                licenseAgreement,
+                version
+            });
+        },
+        onValidateForm: formName =>
+            ValidationHelper.validateForm(dispatch, formName)
+    };
 };
 
-export default connect(mapStateToProps, mapActionsToProps)(LicenseAgreementEditorView);
+export default connect(mapStateToProps, mapActionsToProps)(
+    LicenseAgreementEditorView
+);
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementEditorReducer.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementEditorReducer.js
index 9cff2792ff..0d3fb2a3b6 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementEditorReducer.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementEditorReducer.js
@@ -13,53 +13,76 @@
  * or implied. See the License for the specific language governing
  * permissions and limitations under the License.
  */
-import {actionTypes, defaultState, LA_EDITOR_FORM, enums as LicenseAgreementEnums} from './LicenseAgreementConstants.js';
-import {other as optionInputOther} from 'nfvo-components/input/validation/InputOptions.jsx';
+import {
+    actionTypes,
+    defaultState,
+    LA_EDITOR_FORM,
+    enums as LicenseAgreementEnums
+} from './LicenseAgreementConstants.js';
+import { other as optionInputOther } from 'nfvo-components/input/validation/InputOptions.jsx';
 
 export default (state = {}, action) => {
-	switch (action.type) {
-		case actionTypes.licenseAgreementEditor.OPEN:
-			return {
-				...state,
-				formReady: null,
-				formName: LA_EDITOR_FORM,
-				genericFieldInfo: {
-					'description' : {
-						isValid: true,
-						errorText: '',
-						validations: [{type: 'maxLength', data: 1000}],
-						tabId: LicenseAgreementEnums.SELECTED_LICENSE_AGREEMENT_TAB.GENERAL
-					},
-					'requirementsAndConstrains' : {
-						isValid: true,
-						errorText: '',
-						validations: [{type: 'maxLength', data: 1000}],
-						tabId: LicenseAgreementEnums.SELECTED_LICENSE_AGREEMENT_TAB.GENERAL
-					},
-					'licenseTerm' : {
-						isValid: true,
-						errorText: '',
-						validations: [{type: 'required', data: true}, {type: 'requiredChoiceWithOther', data: optionInputOther.OTHER}],
-						tabId: LicenseAgreementEnums.SELECTED_LICENSE_AGREEMENT_TAB.GENERAL
-					},
-					'name' : {
-						isValid: true,
-						errorText: '',
-						validations: [{type: 'required', data: true}, {type: 'maxLength', data: 25}],
-						tabId: LicenseAgreementEnums.SELECTED_LICENSE_AGREEMENT_TAB.GENERAL
-					}
-				},
-				data: action.licenseAgreement ? { ...action.licenseAgreement } : defaultState.LICENSE_AGREEMENT_EDITOR_DATA
-			};
-		case actionTypes.licenseAgreementEditor.CLOSE:
-			return {};
-		case actionTypes.licenseAgreementEditor.SELECT_TAB:
-			return {
-				...state,
-				selectedTab: action.tab
-			};
-		default:
-			return state;
-	}
-
+    switch (action.type) {
+        case actionTypes.licenseAgreementEditor.OPEN:
+            return {
+                ...state,
+                formReady: null,
+                formName: LA_EDITOR_FORM,
+                genericFieldInfo: {
+                    description: {
+                        isValid: true,
+                        errorText: '',
+                        validations: [{ type: 'maxLength', data: 1000 }],
+                        tabId:
+                            LicenseAgreementEnums.SELECTED_LICENSE_AGREEMENT_TAB
+                                .GENERAL
+                    },
+                    requirementsAndConstrains: {
+                        isValid: true,
+                        errorText: '',
+                        validations: [{ type: 'maxLength', data: 1000 }],
+                        tabId:
+                            LicenseAgreementEnums.SELECTED_LICENSE_AGREEMENT_TAB
+                                .GENERAL
+                    },
+                    licenseTerm: {
+                        isValid: true,
+                        errorText: '',
+                        validations: [
+                            { type: 'required', data: true },
+                            {
+                                type: 'requiredChoiceWithOther',
+                                data: optionInputOther.OTHER
+                            }
+                        ],
+                        tabId:
+                            LicenseAgreementEnums.SELECTED_LICENSE_AGREEMENT_TAB
+                                .GENERAL
+                    },
+                    name: {
+                        isValid: true,
+                        errorText: '',
+                        validations: [
+                            { type: 'required', data: true },
+                            { type: 'maxLength', data: 25 }
+                        ],
+                        tabId:
+                            LicenseAgreementEnums.SELECTED_LICENSE_AGREEMENT_TAB
+                                .GENERAL
+                    }
+                },
+                data: action.licenseAgreement
+                    ? { ...action.licenseAgreement }
+                    : defaultState.LICENSE_AGREEMENT_EDITOR_DATA
+            };
+        case actionTypes.licenseAgreementEditor.CLOSE:
+            return {};
+        case actionTypes.licenseAgreementEditor.SELECT_TAB:
+            return {
+                ...state,
+                selectedTab: action.tab
+            };
+        default:
+            return state;
+    }
 };
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementEditorView.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementEditorView.jsx
index a3e73f4f14..cc16dd996d 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementEditorView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementEditorView.jsx
@@ -17,7 +17,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import GridSection from 'nfvo-components/grid/GridSection.jsx';
 import GridItem from 'nfvo-components/grid/GridItem.jsx';
-import {TabsForm as Form} from 'nfvo-components/input/validation/Form.jsx';
+import { TabsForm as Form } from 'nfvo-components/input/validation/Form.jsx';
 import Tabs from 'nfvo-components/input/validation/Tabs.jsx';
 import Tab from 'sdc-ui/lib/react/Tab.js';
 import Input from 'nfvo-components/input/validation/Input.jsx';
@@ -25,176 +25,278 @@ import InputOptions from 'nfvo-components/input/validation/InputOptions.jsx';
 import DualListboxView from 'nfvo-components/input/dualListbox/DualListboxView.jsx';
 import i18n from 'nfvo-utils/i18n/i18n.js';
 import Validator from 'nfvo-utils/Validator.js';
-import {other as optionInputOther} from 'nfvo-components/input/validation/InputOptions.jsx';
+import { other as optionInputOther } from 'nfvo-components/input/validation/InputOptions.jsx';
 
-import {enums as LicenseAgreementEnums, optionsInputValues as LicenseAgreementOptionsInputValues, LA_EDITOR_FORM} from './LicenseAgreementConstants.js';
+import {
+    enums as LicenseAgreementEnums,
+    optionsInputValues as LicenseAgreementOptionsInputValues,
+    LA_EDITOR_FORM
+} from './LicenseAgreementConstants.js';
 
 const dualBoxFilterTitle = {
-	left: i18n('Available Feature Groups'),
-	right: i18n('Selected Feature Groups')
+    left: i18n('Available Feature Groups'),
+    right: i18n('Selected Feature Groups')
 };
 
 const LicenseAgreementPropType = PropTypes.shape({
-	id: PropTypes.string,
-	name: PropTypes.string,
-	description: PropTypes.string,
-	requirementsAndConstrains: PropTypes.string,
-	licenseTerm: PropTypes.object,
-	featureGroupsIds: PropTypes.arrayOf(PropTypes.string),
-	version: PropTypes.object
+    id: PropTypes.string,
+    name: PropTypes.string,
+    description: PropTypes.string,
+    requirementsAndConstrains: PropTypes.string,
+    licenseTerm: PropTypes.object,
+    featureGroupsIds: PropTypes.arrayOf(PropTypes.string),
+    version: PropTypes.object
 });
 
-
-const GeneralTabContent = ({data, genericFieldInfo, onDataChanged, validateName}) => {
-	let {name, description, requirementsAndConstrains, licenseTerm} = data;
-	return (
-		<GridSection hasLastColSet>
-			<GridItem colSpan={2}>
-				<Input
-					isValid={genericFieldInfo.name.isValid}
-					errorText={genericFieldInfo.name.errorText}
-					onChange={name => onDataChanged({name}, LA_EDITOR_FORM, { name: validateName })}
-					label={i18n('Name')}
-					value={name}
-					data-test-id='create-la-name'
-					name='license-agreement-name'
-					isRequired={true}
-					type='text'/>
-				<Input
-					isValid={genericFieldInfo.requirementsAndConstrains.isValid}
-					errorText={genericFieldInfo.requirementsAndConstrains.errorText}
-					onChange={requirementsAndConstrains => onDataChanged({requirementsAndConstrains}, LA_EDITOR_FORM)}
-					label={i18n('Requirements and Constraints')}
-					value={requirementsAndConstrains}
-					data-test-id='create-la-requirements-constants'
-					name='license-agreement-requirements-and-constraints'
-					type='textarea'/>
-				<InputOptions
-					onInputChange={()=>{}}
-					isMultiSelect={false}
-					onEnumChange={licenseTerm => onDataChanged({licenseTerm:{choice: licenseTerm, other: ''}},
-						LA_EDITOR_FORM)}
-					onOtherChange={licenseTerm => onDataChanged({licenseTerm:{choice: optionInputOther.OTHER,
-						other: licenseTerm}}, LA_EDITOR_FORM)}
-					label={i18n('License Term')}
-					data-test-id='create-la-license-term'
-					isRequired={true}
-					type='select'
-					selectedEnum={licenseTerm && licenseTerm.choice}
-					otherValue={licenseTerm && licenseTerm.other}
-					values={LicenseAgreementOptionsInputValues.LICENSE_MODEL_TYPE}
-					isValid={genericFieldInfo.licenseTerm.isValid}
-					errorText={genericFieldInfo.licenseTerm.errorText} />
-			</GridItem>
-			<GridItem colSpan={2} stretch lastColInRow>
-				<Input
-					isValid={genericFieldInfo.description.isValid}
-					errorText={genericFieldInfo.description.errorText}
-					onChange={description => onDataChanged({description}, LA_EDITOR_FORM)}
-					label={i18n('Description')}
-					value={description}
-					overlayPos='bottom'
-					data-test-id='create-la-description'
-					name='license-agreement-description'
-					type='textarea'/>
-			</GridItem>
-		</GridSection>
-	);
+const GeneralTabContent = ({
+    data,
+    genericFieldInfo,
+    onDataChanged,
+    validateName
+}) => {
+    let { name, description, requirementsAndConstrains, licenseTerm } = data;
+    return (
+        <GridSection hasLastColSet>
+            <GridItem colSpan={2}>
+                <Input
+                    isValid={genericFieldInfo.name.isValid}
+                    errorText={genericFieldInfo.name.errorText}
+                    onChange={name =>
+                        onDataChanged({ name }, LA_EDITOR_FORM, {
+                            name: validateName
+                        })
+                    }
+                    label={i18n('Name')}
+                    value={name}
+                    data-test-id="create-la-name"
+                    name="license-agreement-name"
+                    isRequired={true}
+                    type="text"
+                />
+                <Input
+                    isValid={genericFieldInfo.requirementsAndConstrains.isValid}
+                    errorText={
+                        genericFieldInfo.requirementsAndConstrains.errorText
+                    }
+                    onChange={requirementsAndConstrains =>
+                        onDataChanged(
+                            { requirementsAndConstrains },
+                            LA_EDITOR_FORM
+                        )
+                    }
+                    label={i18n('Requirements and Constraints')}
+                    value={requirementsAndConstrains}
+                    data-test-id="create-la-requirements-constants"
+                    name="license-agreement-requirements-and-constraints"
+                    type="textarea"
+                />
+                <InputOptions
+                    onInputChange={() => {}}
+                    isMultiSelect={false}
+                    onEnumChange={licenseTerm =>
+                        onDataChanged(
+                            { licenseTerm: { choice: licenseTerm, other: '' } },
+                            LA_EDITOR_FORM
+                        )
+                    }
+                    onOtherChange={licenseTerm =>
+                        onDataChanged(
+                            {
+                                licenseTerm: {
+                                    choice: optionInputOther.OTHER,
+                                    other: licenseTerm
+                                }
+                            },
+                            LA_EDITOR_FORM
+                        )
+                    }
+                    label={i18n('License Term')}
+                    data-test-id="create-la-license-term"
+                    isRequired={true}
+                    type="select"
+                    selectedEnum={licenseTerm && licenseTerm.choice}
+                    otherValue={licenseTerm && licenseTerm.other}
+                    values={
+                        LicenseAgreementOptionsInputValues.LICENSE_MODEL_TYPE
+                    }
+                    isValid={genericFieldInfo.licenseTerm.isValid}
+                    errorText={genericFieldInfo.licenseTerm.errorText}
+                />
+            </GridItem>
+            <GridItem colSpan={2} stretch lastColInRow>
+                <Input
+                    isValid={genericFieldInfo.description.isValid}
+                    errorText={genericFieldInfo.description.errorText}
+                    onChange={description =>
+                        onDataChanged({ description }, LA_EDITOR_FORM)
+                    }
+                    label={i18n('Description')}
+                    value={description}
+                    overlayPos="bottom"
+                    data-test-id="create-la-description"
+                    name="license-agreement-description"
+                    type="textarea"
+                />
+            </GridItem>
+        </GridSection>
+    );
 };
 
 class LicenseAgreementEditorView extends React.Component {
+    static propTypes = {
+        data: LicenseAgreementPropType,
+        previousData: LicenseAgreementPropType,
+        LANames: PropTypes.object,
+        isReadOnlyMode: PropTypes.bool,
+        onDataChanged: PropTypes.func.isRequired,
+        onSubmit: PropTypes.func.isRequired,
+        onCancel: PropTypes.func.isRequired,
 
-	static propTypes = {
-		data: LicenseAgreementPropType,
-		previousData: LicenseAgreementPropType,
-		LANames: PropTypes.object,
-		isReadOnlyMode: PropTypes.bool,
-		onDataChanged: PropTypes.func.isRequired,
-		onSubmit: PropTypes.func.isRequired,
-		onCancel: PropTypes.func.isRequired,
-
-		selectedTab: PropTypes.number,
-		onTabSelect: PropTypes.func,
+        selectedTab: PropTypes.number,
+        onTabSelect: PropTypes.func,
 
-		selectedFeatureGroupsButtonTab: PropTypes.number,
-		onFeatureGroupsButtonTabSelect: PropTypes.func,
-		featureGroupsList: DualListboxView.propTypes.availableList
-	};
+        selectedFeatureGroupsButtonTab: PropTypes.number,
+        onFeatureGroupsButtonTabSelect: PropTypes.func,
+        featureGroupsList: DualListboxView.propTypes.availableList
+    };
 
-	static defaultProps = {
-		selectedTab: LicenseAgreementEnums.SELECTED_LICENSE_AGREEMENT_TAB.GENERAL,
-		data: {}
-	};
+    static defaultProps = {
+        selectedTab:
+            LicenseAgreementEnums.SELECTED_LICENSE_AGREEMENT_TAB.GENERAL,
+        data: {}
+    };
 
-	state = {
-		localFeatureGroupsListFilter: ''
-	};
+    state = {
+        localFeatureGroupsListFilter: ''
+    };
 
-	render() {
-		let {selectedTab, onTabSelect, isReadOnlyMode, featureGroupsList, data, onDataChanged, genericFieldInfo} = this.props;
-		return (
-			<div>
-				{genericFieldInfo && <Form
-					ref='validationForm'
-					hasButtons={true}
-					onSubmit={ () => this.submit() }
-					onReset={ () => this.props.onCancel() }
-					labledButtons={true}
-					isReadOnlyMode={isReadOnlyMode}
-					isValid={this.props.isFormValid}
-					formReady={this.props.formReady}
-					onValidateForm={() => this.props.onValidateForm(LA_EDITOR_FORM) }
-					className='license-model-form license-agreement-form'>
-					<Tabs activeTab={onTabSelect ? selectedTab : undefined} onTabClick={onTabSelect} invalidTabs={this.props.invalidTabs} >
-						<Tab
-							tabId={LicenseAgreementEnums.SELECTED_LICENSE_AGREEMENT_TAB.GENERAL}
-							data-test-id='general-tab'
-							title={i18n('General')}>
-								<fieldset disabled={isReadOnlyMode}>
-									<GeneralTabContent data={data} genericFieldInfo={genericFieldInfo} onDataChanged={onDataChanged} validateLTChoice={(value)=>this.validateLTChoice(value)}
-										   validateName={(value)=>this.validateName(value)}/>
-								</fieldset>
-						</Tab>
-						<Tab
-							tabId={LicenseAgreementEnums.SELECTED_LICENSE_AGREEMENT_TAB.FEATURE_GROUPS}
-							data-test-id='feature-group-tab'
-							title={i18n('Feature Groups')}>
-								<fieldset disabled={isReadOnlyMode}>
-							{featureGroupsList.length > 0 ?
-									<DualListboxView
-										isReadOnlyMode={isReadOnlyMode}
-										filterTitle={dualBoxFilterTitle}
-										selectedValuesList={data.featureGroupsIds}
-										availableList={featureGroupsList}
-										onChange={ selectedValuesList => onDataChanged( { featureGroupsIds: selectedValuesList }, LA_EDITOR_FORM )}/> :
-									<p>{i18n('There are no available feature groups')}</p>}
-								</fieldset>
-						</Tab>
-					</Tabs>
-				</Form>}
-			</div>
-		);
-	}
+    render() {
+        let {
+            selectedTab,
+            onTabSelect,
+            isReadOnlyMode,
+            featureGroupsList,
+            data,
+            onDataChanged,
+            genericFieldInfo
+        } = this.props;
+        return (
+            <div>
+                {genericFieldInfo && (
+                    <Form
+                        ref="validationForm"
+                        hasButtons={true}
+                        onSubmit={() => this.submit()}
+                        onReset={() => this.props.onCancel()}
+                        labledButtons={true}
+                        isReadOnlyMode={isReadOnlyMode}
+                        isValid={this.props.isFormValid}
+                        formReady={this.props.formReady}
+                        onValidateForm={() =>
+                            this.props.onValidateForm(LA_EDITOR_FORM)
+                        }
+                        className="license-model-form license-agreement-form">
+                        <Tabs
+                            activeTab={onTabSelect ? selectedTab : undefined}
+                            onTabClick={onTabSelect}
+                            invalidTabs={this.props.invalidTabs}>
+                            <Tab
+                                tabId={
+                                    LicenseAgreementEnums
+                                        .SELECTED_LICENSE_AGREEMENT_TAB.GENERAL
+                                }
+                                data-test-id="general-tab"
+                                title={i18n('General')}>
+                                <fieldset disabled={isReadOnlyMode}>
+                                    <GeneralTabContent
+                                        data={data}
+                                        genericFieldInfo={genericFieldInfo}
+                                        onDataChanged={onDataChanged}
+                                        validateLTChoice={value =>
+                                            this.validateLTChoice(value)
+                                        }
+                                        validateName={value =>
+                                            this.validateName(value)
+                                        }
+                                    />
+                                </fieldset>
+                            </Tab>
+                            <Tab
+                                tabId={
+                                    LicenseAgreementEnums
+                                        .SELECTED_LICENSE_AGREEMENT_TAB
+                                        .FEATURE_GROUPS
+                                }
+                                data-test-id="feature-group-tab"
+                                title={i18n('Feature Groups')}>
+                                <fieldset disabled={isReadOnlyMode}>
+                                    {featureGroupsList.length > 0 ? (
+                                        <DualListboxView
+                                            isReadOnlyMode={isReadOnlyMode}
+                                            filterTitle={dualBoxFilterTitle}
+                                            selectedValuesList={
+                                                data.featureGroupsIds
+                                            }
+                                            availableList={featureGroupsList}
+                                            onChange={selectedValuesList =>
+                                                onDataChanged(
+                                                    {
+                                                        featureGroupsIds: selectedValuesList
+                                                    },
+                                                    LA_EDITOR_FORM
+                                                )
+                                            }
+                                        />
+                                    ) : (
+                                        <p>
+                                            {i18n(
+                                                'There are no available feature groups'
+                                            )}
+                                        </p>
+                                    )}
+                                </fieldset>
+                            </Tab>
+                        </Tabs>
+                    </Form>
+                )}
+            </div>
+        );
+    }
 
-	submit() {
-		const {data: licenseAgreement, previousData: previousLicenseAgreement} = this.props;
-		this.props.onSubmit({licenseAgreement, previousLicenseAgreement});
-	}
+    submit() {
+        const {
+            data: licenseAgreement,
+            previousData: previousLicenseAgreement
+        } = this.props;
+        this.props.onSubmit({ licenseAgreement, previousLicenseAgreement });
+    }
 
-	validateLTChoice(value) {
-		if (!value.choice) {
-			return {isValid: false, errorText: i18n('Field is required')};
-		}
-		return {isValid: true, errorText: ''};
-	}
+    validateLTChoice(value) {
+        if (!value.choice) {
+            return { isValid: false, errorText: i18n('Field is required') };
+        }
+        return { isValid: true, errorText: '' };
+    }
 
-	validateName(value) {
-		const {data: {id}, LANames} = this.props;
-		const isExists = Validator.isItemNameAlreadyExistsInList({itemId: id, itemName: value, list: LANames});
+    validateName(value) {
+        const { data: { id }, LANames } = this.props;
+        const isExists = Validator.isItemNameAlreadyExistsInList({
+            itemId: id,
+            itemName: value,
+            list: LANames
+        });
 
-		return !isExists ?  {isValid: true, errorText: ''} :
-			{isValid: false, errorText: i18n('License Agreement by the name \'' + value + '\' already exists. License agreement name must be unique')};
-	}
+        return !isExists
+            ? { isValid: true, errorText: '' }
+            : {
+                  isValid: false,
+                  errorText: i18n(
+                      "License Agreement by the name '" +
+                          value +
+                          "' already exists. License agreement name must be unique"
+                  )
+              };
+    }
 }
 
 export default LicenseAgreementEditorView;
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementListEditor.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementListEditor.js
index 72474ecdd3..cba39731b5 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementListEditor.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementListEditor.js
@@ -13,42 +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 LicenseAgreementActionHelper from './LicenseAgreementActionHelper.js';
 import LicenseAgreementListEditorView from './LicenseAgreementListEditorView.jsx';
-import {actionTypes as globalMoadlActions}  from 'nfvo-components/modal/GlobalModalConstants.js';
+import { actionTypes as globalMoadlActions } from 'nfvo-components/modal/GlobalModalConstants.js';
 
-const mapStateToProps = ({licenseModel: {licenseAgreement, licenseModelEditor}}) => {
-
-	let {licenseAgreementList} = licenseAgreement;
-	let {data} = licenseAgreement.licenseAgreementEditor;
-	let {vendorName, version} = licenseModelEditor.data;
-
-	return {
-		vendorName,
-		version,
-		licenseAgreementList,
-		isDisplayModal: Boolean(data),
-		isModalInEditMode: Boolean(data && data.id)
-	};
+const mapStateToProps = ({
+    licenseModel: { licenseAgreement, licenseModelEditor }
+}) => {
+    let { licenseAgreementList } = licenseAgreement;
+    let { data } = licenseAgreement.licenseAgreementEditor;
+    let { vendorName, version } = licenseModelEditor.data;
 
+    return {
+        vendorName,
+        version,
+        licenseAgreementList,
+        isDisplayModal: Boolean(data),
+        isModalInEditMode: Boolean(data && data.id)
+    };
 };
 
-const mapActionsToProps = (dispatch, {licenseModelId}) => {
-	return {
-		onAddLicenseAgreementClick: (version) => LicenseAgreementActionHelper.openLicenseAgreementEditor(dispatch, {licenseModelId, version}),
-		onEditLicenseAgreementClick: (licenseAgreement, version) => LicenseAgreementActionHelper.openLicenseAgreementEditor(dispatch, {licenseModelId, licenseAgreement, version}),
-		onDeleteLicenseAgreement: (licenseAgreement, version) => dispatch({
-			type: globalMoadlActions.GLOBAL_MODAL_WARNING,
-			data:{
-				msg: i18n('Are you sure you want to delete "{name}"?', {name: licenseAgreement.name}),
-				confirmationButtonText: i18n('Delete'),
-				title: i18n('Delete'),
-				onConfirmed: ()=>LicenseAgreementActionHelper.deleteLicenseAgreement(dispatch, {licenseModelId, licenseAgreementId: licenseAgreement.id, version})
-			}
-		})
-	};
+const mapActionsToProps = (dispatch, { licenseModelId }) => {
+    return {
+        onAddLicenseAgreementClick: version =>
+            LicenseAgreementActionHelper.openLicenseAgreementEditor(dispatch, {
+                licenseModelId,
+                version
+            }),
+        onEditLicenseAgreementClick: (licenseAgreement, version) =>
+            LicenseAgreementActionHelper.openLicenseAgreementEditor(dispatch, {
+                licenseModelId,
+                licenseAgreement,
+                version
+            }),
+        onDeleteLicenseAgreement: (licenseAgreement, version) =>
+            dispatch({
+                type: globalMoadlActions.GLOBAL_MODAL_WARNING,
+                data: {
+                    msg: i18n('Are you sure you want to delete "{name}"?', {
+                        name: licenseAgreement.name
+                    }),
+                    confirmationButtonText: i18n('Delete'),
+                    title: i18n('Delete'),
+                    onConfirmed: () =>
+                        LicenseAgreementActionHelper.deleteLicenseAgreement(
+                            dispatch,
+                            {
+                                licenseModelId,
+                                licenseAgreementId: licenseAgreement.id,
+                                version
+                            }
+                        )
+                }
+            })
+    };
 };
 
-export default connect(mapStateToProps, mapActionsToProps)(LicenseAgreementListEditorView);
+export default connect(mapStateToProps, mapActionsToProps)(
+    LicenseAgreementListEditorView
+);
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementListEditorView.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementListEditorView.jsx
index ad3cdb0b58..acec1e0ddb 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementListEditorView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementListEditorView.jsx
@@ -21,107 +21,151 @@ import Modal from 'nfvo-components/modal/Modal.jsx';
 import ListEditorView from 'nfvo-components/listEditor/ListEditorView.jsx';
 import ListEditorItemView from 'nfvo-components/listEditor/ListEditorItemView.jsx';
 import LicenseAgreementEditor from './LicenseAgreementEditor.js';
-import {extractValue} from './LicenseAgreementConstants';
+import { extractValue } from './LicenseAgreementConstants';
 
 class LicenseAgreementListEditorView extends React.Component {
-	static propTypes = {
-		vendorName: PropTypes.string,
-		licenseModelId: PropTypes.string.isRequired,
-		licenseAgreementList: PropTypes.array,
-		isReadOnlyMode: PropTypes.bool.isRequired,
-		isDisplayModal: PropTypes.bool,
-		isModalInEditMode: PropTypes.bool,
-		onAddLicenseAgreementClick: PropTypes.func,
-		onEditLicenseAgreementClick: PropTypes.func,
-		onDeleteLicenseAgreement: PropTypes.func,
-	};
+    static propTypes = {
+        vendorName: PropTypes.string,
+        licenseModelId: PropTypes.string.isRequired,
+        licenseAgreementList: PropTypes.array,
+        isReadOnlyMode: PropTypes.bool.isRequired,
+        isDisplayModal: PropTypes.bool,
+        isModalInEditMode: PropTypes.bool,
+        onAddLicenseAgreementClick: PropTypes.func,
+        onEditLicenseAgreementClick: PropTypes.func,
+        onDeleteLicenseAgreement: PropTypes.func
+    };
 
-	static defaultProps = {
-		licenseAgreementList: []
-	};
+    static defaultProps = {
+        licenseAgreementList: []
+    };
 
-	state = {
-		localFilter: ''
-	};
+    state = {
+        localFilter: ''
+    };
 
-	render() {
-		const {licenseModelId, isReadOnlyMode, isDisplayModal, isModalInEditMode, version} = this.props;
-		const {onAddLicenseAgreementClick} = this.props;
-		const {localFilter} = this.state;
+    render() {
+        const {
+            licenseModelId,
+            isReadOnlyMode,
+            isDisplayModal,
+            isModalInEditMode,
+            version
+        } = this.props;
+        const { onAddLicenseAgreementClick } = this.props;
+        const { localFilter } = this.state;
 
-		return (
-			<div className='license-model-list-editor license-agreement-list-editor'>
-				<ListEditorView
-					title={i18n('License Agreements')}
-					plusButtonTitle={i18n('Add License Agreement')}
-					onAdd={() => onAddLicenseAgreementClick(version)}
-					filterValue={localFilter}
-					onFilter={value => this.setState({localFilter: value})}
-					isReadOnlyMode={isReadOnlyMode}>
-					{this.filterList().map(licenseAgreement => this.renderLicenseAgreementListItem(licenseAgreement, isReadOnlyMode, version))}
-				</ListEditorView>
-				<Modal show={isDisplayModal} bsSize='large' animation={true} className='onborading-modal license-model-modal license-agreement-modal'>
-					<Modal.Header>
-						<Modal.Title>{`${isModalInEditMode ? i18n('Edit License Agreement') : i18n('Create New License Agreement')}`}</Modal.Title>
-					</Modal.Header>
-					<Modal.Body>
-						{
-							isDisplayModal && (
-								<LicenseAgreementEditor version={version} licenseModelId={licenseModelId} isReadOnlyMode={isReadOnlyMode} />
-							)
-						}
-					</Modal.Body>
-				</Modal>
-			</div>
-		);
-	}
+        return (
+            <div className="license-model-list-editor license-agreement-list-editor">
+                <ListEditorView
+                    title={i18n('License Agreements')}
+                    plusButtonTitle={i18n('Add License Agreement')}
+                    onAdd={() => onAddLicenseAgreementClick(version)}
+                    filterValue={localFilter}
+                    onFilter={value => this.setState({ localFilter: value })}
+                    isReadOnlyMode={isReadOnlyMode}>
+                    {this.filterList().map(licenseAgreement =>
+                        this.renderLicenseAgreementListItem(
+                            licenseAgreement,
+                            isReadOnlyMode,
+                            version
+                        )
+                    )}
+                </ListEditorView>
+                <Modal
+                    show={isDisplayModal}
+                    bsSize="large"
+                    animation={true}
+                    className="onborading-modal license-model-modal license-agreement-modal">
+                    <Modal.Header>
+                        <Modal.Title>{`${
+                            isModalInEditMode
+                                ? i18n('Edit License Agreement')
+                                : i18n('Create New License Agreement')
+                        }`}</Modal.Title>
+                    </Modal.Header>
+                    <Modal.Body>
+                        {isDisplayModal && (
+                            <LicenseAgreementEditor
+                                version={version}
+                                licenseModelId={licenseModelId}
+                                isReadOnlyMode={isReadOnlyMode}
+                            />
+                        )}
+                    </Modal.Body>
+                </Modal>
+            </div>
+        );
+    }
 
-	filterList() {
-		let {licenseAgreementList} = this.props;
-		let {localFilter} = this.state;
-		if (localFilter.trim()) {
-			const filter = new RegExp(escape(localFilter), 'i');
-			return licenseAgreementList.filter(({name = '', description = '', licenseTerm = ''}) => {
-				return escape(name).match(filter) || escape(description).match(filter) || escape(extractValue(licenseTerm)).match(filter);
-			});
-		}
-		else {
-			return licenseAgreementList;
-		}
-	}
+    filterList() {
+        let { licenseAgreementList } = this.props;
+        let { localFilter } = this.state;
+        if (localFilter.trim()) {
+            const filter = new RegExp(escape(localFilter), 'i');
+            return licenseAgreementList.filter(
+                ({ name = '', description = '', licenseTerm = '' }) => {
+                    return (
+                        escape(name).match(filter) ||
+                        escape(description).match(filter) ||
+                        escape(extractValue(licenseTerm)).match(filter)
+                    );
+                }
+            );
+        } else {
+            return licenseAgreementList;
+        }
+    }
 
-	renderLicenseAgreementListItem(licenseAgreement, isReadOnlyMode, version) {
-		let {id, name, description, licenseTerm, featureGroupsIds = []} = licenseAgreement;
-		let {onEditLicenseAgreementClick, onDeleteLicenseAgreement} = this.props;
-		return (
-			<ListEditorItemView
-				key={id}
-				onSelect={() => onEditLicenseAgreementClick(licenseAgreement, version)}
-				onDelete={() => onDeleteLicenseAgreement(licenseAgreement, version)}
-				className='list-editor-item-view'
-				isReadOnlyMode={isReadOnlyMode}>
-				<div className='list-editor-item-view-field'>
-					<div className='title'>{i18n('Name')}</div>
-					<div className='text name'>{name}</div>
-				</div>
-				<div className='list-editor-item-view-field'>
-					<div className='list-editor-item-view-field-tight'>
-						<div className='title'>{i18n('Type')}</div>
-						<div className='text type'>{extractValue(licenseTerm)}</div>
-					</div>
-					<div className='list-editor-item-view-field-tight'>
-						<div className='title'>{i18n('Feature')}</div>
-						<div className='title'>{i18n('Groups')}</div>
-						<div className='feature-groups-count'>{featureGroupsIds.length}</div>
-					</div>
-				</div>
-				<div className='list-editor-item-view-field'>
-					<div className='title'>{i18n('Description')}</div>
-					<div className='text description'>{description}</div>
-				</div>
-			</ListEditorItemView>
-		);
-	}
+    renderLicenseAgreementListItem(licenseAgreement, isReadOnlyMode, version) {
+        let {
+            id,
+            name,
+            description,
+            licenseTerm,
+            featureGroupsIds = []
+        } = licenseAgreement;
+        let {
+            onEditLicenseAgreementClick,
+            onDeleteLicenseAgreement
+        } = this.props;
+        return (
+            <ListEditorItemView
+                key={id}
+                onSelect={() =>
+                    onEditLicenseAgreementClick(licenseAgreement, version)
+                }
+                onDelete={() =>
+                    onDeleteLicenseAgreement(licenseAgreement, version)
+                }
+                className="list-editor-item-view"
+                isReadOnlyMode={isReadOnlyMode}>
+                <div className="list-editor-item-view-field">
+                    <div className="title">{i18n('Name')}</div>
+                    <div className="text name">{name}</div>
+                </div>
+                <div className="list-editor-item-view-field">
+                    <div className="list-editor-item-view-field-tight">
+                        <div className="title">{i18n('Type')}</div>
+                        <div className="text type">
+                            {extractValue(licenseTerm)}
+                        </div>
+                    </div>
+                    <div className="list-editor-item-view-field-tight">
+                        <div className="title">{i18n('Feature')}</div>
+                        <div className="title">{i18n('Groups')}</div>
+                        <div className="feature-groups-count">
+                            {featureGroupsIds.length}
+                        </div>
+                    </div>
+                </div>
+                <div className="list-editor-item-view-field">
+                    <div className="title">{i18n('Description')}</div>
+                    <div className="text description">{description}</div>
+                </div>
+            </ListEditorItemView>
+        );
+    }
 }
 
 export default LicenseAgreementListEditorView;
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementListReducer.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementListReducer.js
index 7d1a5ef8ee..213a63d565 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementListReducer.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseAgreement/LicenseAgreementListReducer.js
@@ -13,15 +13,18 @@
  * or implied. See the License for the specific language governing
  * permissions and limitations under the License.
  */
-import {actionTypes as licenseAgreementActionTypes} from './LicenseAgreementConstants';
+import { actionTypes as licenseAgreementActionTypes } from './LicenseAgreementConstants';
 
 export default (state = [], action) => {
-	switch (action.type) {
-		case licenseAgreementActionTypes.LICENSE_AGREEMENT_LIST_LOADED:
-			return [...action.response.results];
-		case licenseAgreementActionTypes.DELETE_LICENSE_AGREEMENT:
-			return state.filter(licenseAgreement => licenseAgreement.id !== action.licenseAgreementId);
-		default:
-			return state;
-	}
+    switch (action.type) {
+        case licenseAgreementActionTypes.LICENSE_AGREEMENT_LIST_LOADED:
+            return [...action.response.results];
+        case licenseAgreementActionTypes.DELETE_LICENSE_AGREEMENT:
+            return state.filter(
+                licenseAgreement =>
+                    licenseAgreement.id !== action.licenseAgreementId
+            );
+        default:
+            return state;
+    }
 };
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 674c329515..ebbe84abd3 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsActionHelper.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsActionHelper.js
@@ -15,191 +15,268 @@
  */
 import RestAPIUtil from 'nfvo-utils/RestAPIUtil.js';
 import Configuration from 'sdc-app/config/Configuration.js';
-import {actionTypes as licenseKeyGroupsConstants} from './LicenseKeyGroupsConstants.js';
-import {actionTypes as limitEditorActions} from 'sdc-app/onboarding/licenseModel/limits/LimitEditorConstants.js';
-import {default as getValue, getStrValue} from 'nfvo-utils/getValue.js';
+import { actionTypes as licenseKeyGroupsConstants } from './LicenseKeyGroupsConstants.js';
+import { actionTypes as limitEditorActions } from 'sdc-app/onboarding/licenseModel/limits/LimitEditorConstants.js';
+import { default as getValue, getStrValue } from 'nfvo-utils/getValue.js';
 import ItemsHelper from 'sdc-app/common/helpers/ItemsHelper.js';
 
 function baseUrl(licenseModelId, version) {
-	const restPrefix = Configuration.get('restPrefix');
-	const {id: versionId} = version;
-	return `${restPrefix}/v1.0/vendor-license-models/${licenseModelId}/versions/${versionId}/license-key-groups`;
+    const restPrefix = Configuration.get('restPrefix');
+    const { id: versionId } = version;
+    return `${restPrefix}/v1.0/vendor-license-models/${licenseModelId}/versions/${versionId}/license-key-groups`;
 }
 
 function fetchLicenseKeyGroupsList(licenseModelId, version) {
-	return RestAPIUtil.fetch(`${baseUrl(licenseModelId, version)}`);
+    return RestAPIUtil.fetch(`${baseUrl(licenseModelId, version)}`);
 }
 
 function deleteLicenseKeyGroup(licenseModelId, licenseKeyGroupId, version) {
-	return RestAPIUtil.destroy(`${baseUrl(licenseModelId, version)}/${licenseKeyGroupId}`);
+    return RestAPIUtil.destroy(
+        `${baseUrl(licenseModelId, version)}/${licenseKeyGroupId}`
+    );
 }
 
 function postLicenseKeyGroup(licenseModelId, licenseKeyGroup, version) {
-	return RestAPIUtil.post(baseUrl(licenseModelId, version), {
-		name: licenseKeyGroup.name,
-		description: licenseKeyGroup.description,
-		operationalScope: getValue(licenseKeyGroup.operationalScope),
-		type: licenseKeyGroup.type,
-		increments: licenseKeyGroup.increments,
-		thresholdValue: licenseKeyGroup.thresholdValue,
-		thresholdUnits: getValue(licenseKeyGroup.thresholdUnits),
-		startDate: licenseKeyGroup.startDate,
-		expiryDate: licenseKeyGroup.expiryDate
-	});
+    return RestAPIUtil.post(baseUrl(licenseModelId, version), {
+        name: licenseKeyGroup.name,
+        description: licenseKeyGroup.description,
+        operationalScope: getValue(licenseKeyGroup.operationalScope),
+        type: licenseKeyGroup.type,
+        increments: licenseKeyGroup.increments,
+        thresholdValue: licenseKeyGroup.thresholdValue,
+        thresholdUnits: getValue(licenseKeyGroup.thresholdUnits),
+        startDate: licenseKeyGroup.startDate,
+        expiryDate: licenseKeyGroup.expiryDate
+    });
 }
 
 function putLicenseKeyGroup(licenseModelId, licenseKeyGroup, version) {
-	return RestAPIUtil.put(`${baseUrl(licenseModelId, version)}/${licenseKeyGroup.id}`, {
-		name: licenseKeyGroup.name,
-		description: licenseKeyGroup.description,
-		operationalScope: getValue(licenseKeyGroup.operationalScope),
-		type: licenseKeyGroup.type,
-		increments: licenseKeyGroup.increments,
-		thresholdValue: licenseKeyGroup.thresholdValue,
-		thresholdUnits: getValue(licenseKeyGroup.thresholdUnits),
-		startDate: licenseKeyGroup.startDate,
-		expiryDate: licenseKeyGroup.expiryDate
-	});
+    return RestAPIUtil.put(
+        `${baseUrl(licenseModelId, version)}/${licenseKeyGroup.id}`,
+        {
+            name: licenseKeyGroup.name,
+            description: licenseKeyGroup.description,
+            operationalScope: getValue(licenseKeyGroup.operationalScope),
+            type: licenseKeyGroup.type,
+            increments: licenseKeyGroup.increments,
+            thresholdValue: licenseKeyGroup.thresholdValue,
+            thresholdUnits: getValue(licenseKeyGroup.thresholdUnits),
+            startDate: licenseKeyGroup.startDate,
+            expiryDate: licenseKeyGroup.expiryDate
+        }
+    );
 }
 
 function fetchLimitsList(licenseModelId, licenseKeyGroupId, version) {
-	return RestAPIUtil.fetch(`${baseUrl(licenseModelId, version)}/${licenseKeyGroupId}/limits`);
+    return RestAPIUtil.fetch(
+        `${baseUrl(licenseModelId, version)}/${licenseKeyGroupId}/limits`
+    );
 }
 
 function deleteLimit(licenseModelId, licenseKeyGroupId, version, limitId) {
-	return RestAPIUtil.destroy(`${baseUrl(licenseModelId, version)}/${licenseKeyGroupId}/limits/${limitId}`);
+    return RestAPIUtil.destroy(
+        `${baseUrl(
+            licenseModelId,
+            version
+        )}/${licenseKeyGroupId}/limits/${limitId}`
+    );
 }
 
 function postLimit(licenseModelId, licenseKeyGroupId, version, limit) {
-	return RestAPIUtil.post(`${baseUrl(licenseModelId, version)}/${licenseKeyGroupId}/limits`, {
-		name: limit.name,
-		type: limit.type,
-		description: limit.description,
-		metric: getStrValue(limit.metric),
-		value: limit.value,
-		unit: getStrValue(limit.unit),
-		aggregationFunction: getValue(limit.aggregationFunction),
-		time: getValue(limit.time)
-	});
+    return RestAPIUtil.post(
+        `${baseUrl(licenseModelId, version)}/${licenseKeyGroupId}/limits`,
+        {
+            name: limit.name,
+            type: limit.type,
+            description: limit.description,
+            metric: getStrValue(limit.metric),
+            value: limit.value,
+            unit: getStrValue(limit.unit),
+            aggregationFunction: getValue(limit.aggregationFunction),
+            time: getValue(limit.time)
+        }
+    );
 }
 
 function putLimit(licenseModelId, licenseKeyGroupId, version, limit) {
-
-	return RestAPIUtil.put(`${baseUrl(licenseModelId, version)}/${licenseKeyGroupId}/limits/${limit.id}`, {
-		name: limit.name,
-		type: limit.type,
-		description: limit.description,
-		metric: getStrValue(limit.metric),
-		value: limit.value,
-		unit: getStrValue(limit.unit),
-		aggregationFunction: getValue(limit.aggregationFunction),
-		time: getValue(limit.time)
-	});
+    return RestAPIUtil.put(
+        `${baseUrl(licenseModelId, version)}/${licenseKeyGroupId}/limits/${
+            limit.id
+        }`,
+        {
+            name: limit.name,
+            type: limit.type,
+            description: limit.description,
+            metric: getStrValue(limit.metric),
+            value: limit.value,
+            unit: getStrValue(limit.unit),
+            aggregationFunction: getValue(limit.aggregationFunction),
+            time: getValue(limit.time)
+        }
+    );
 }
 
 export default {
-	fetchLicenseKeyGroupsList(dispatch, {licenseModelId, version}) {
-		return fetchLicenseKeyGroupsList(licenseModelId, version).then(response => dispatch({
-			type: licenseKeyGroupsConstants.LICENSE_KEY_GROUPS_LIST_LOADED,
-			response
-		}));
-	},
-
-	openLicenseKeyGroupsEditor(dispatch, {licenseKeyGroup, licenseModelId, version} = {}) {
-		if (licenseModelId && version) {
-			this.fetchLimits(dispatch, {licenseModelId, version, licenseKeyGroup});
-		}
-		dispatch({
-			type: licenseKeyGroupsConstants.licenseKeyGroupsEditor.OPEN,
-			licenseKeyGroup
-		});
-	},
-
-	closeLicenseKeyGroupEditor(dispatch){
-		dispatch({
-			type: licenseKeyGroupsConstants.licenseKeyGroupsEditor.CLOSE
-		});
-	},
-
-	saveLicenseKeyGroup(dispatch, {licenseModelId, previousLicenseKeyGroup, licenseKeyGroup, version}) {
-		if (previousLicenseKeyGroup) {
-			return putLicenseKeyGroup(licenseModelId, licenseKeyGroup, version).then(() => {
-				dispatch({
-					type: licenseKeyGroupsConstants.EDIT_LICENSE_KEY_GROUP,
-					licenseKeyGroup
-				});
-				return ItemsHelper.checkItemStatus(dispatch, {itemId: licenseModelId, versionId: version.id});
-			});
-		}
-		else {
-			return postLicenseKeyGroup(licenseModelId, licenseKeyGroup, version).then(response => {
-				dispatch({
-					type: licenseKeyGroupsConstants.ADD_LICENSE_KEY_GROUP,
-					licenseKeyGroup: {
-						...licenseKeyGroup,
-						referencingFeatureGroups: [],
-						id: response.value
-					}
-				});
-				return ItemsHelper.checkItemStatus(dispatch, {itemId: licenseModelId, versionId: version.id});
-			});
-		}
-
-
-	},
-
-	deleteLicenseKeyGroup(dispatch, {licenseModelId, licenseKeyGroupId, version}){
-		return deleteLicenseKeyGroup(licenseModelId, licenseKeyGroupId, version).then(()=> {
-			dispatch({
-				type: licenseKeyGroupsConstants.DELETE_LICENSE_KEY_GROUP,
-				licenseKeyGroupId
-			});
-			return ItemsHelper.checkItemStatus(dispatch, {itemId: licenseModelId, versionId: version.id});
-		});
-	},
-
-	hideDeleteConfirm(dispatch) {
-		dispatch({
-			type: licenseKeyGroupsConstants.LICENSE_KEY_GROUPS_DELETE_CONFIRM,
-			licenseKeyGroupToDelete: false
-		});
-	},
-
-	openDeleteLicenseAgreementConfirm(dispatch, {licenseKeyGroup}) {
-		dispatch({
-			type: licenseKeyGroupsConstants.LICENSE_KEY_GROUPS_DELETE_CONFIRM,
-			licenseKeyGroupToDelete: licenseKeyGroup
-		});
-	},
-
-
-	fetchLimits(dispatch, {licenseModelId, version, licenseKeyGroup}) {
-		return fetchLimitsList(licenseModelId, licenseKeyGroup.id, version).then(response => {
-			dispatch({
-				type: licenseKeyGroupsConstants.licenseKeyGroupsEditor.LIMITS_LIST_LOADED,
-				response
-			});
-		});
-	},
-
-	submitLimit(dispatch, {licenseModelId, version, licenseKeyGroup, limit}) {
-		const promise = limit.id ? putLimit(licenseModelId,licenseKeyGroup.id, version, limit) :
-			 postLimit(licenseModelId,licenseKeyGroup.id, version, limit);
-		return promise.then(() => {
-			dispatch({
-				type: limitEditorActions.CLOSE
-			});
-			this.fetchLimits(dispatch, {licenseModelId, version, licenseKeyGroup});
-			return ItemsHelper.checkItemStatus(dispatch, {itemId: licenseModelId, versionId: version.id});
-		});
-	},
-
-	deleteLimit(dispatch, {licenseModelId, version, licenseKeyGroup, limit}) {
-		return deleteLimit(licenseModelId,licenseKeyGroup.id, version, limit.id).then(() => {
-			this.fetchLimits(dispatch, {licenseModelId, version, licenseKeyGroup});
-			return ItemsHelper.checkItemStatus(dispatch, {itemId: licenseModelId, versionId: version.id});
-		});
-	}
+    fetchLicenseKeyGroupsList(dispatch, { licenseModelId, version }) {
+        return fetchLicenseKeyGroupsList(licenseModelId, version).then(
+            response =>
+                dispatch({
+                    type:
+                        licenseKeyGroupsConstants.LICENSE_KEY_GROUPS_LIST_LOADED,
+                    response
+                })
+        );
+    },
+
+    openLicenseKeyGroupsEditor(
+        dispatch,
+        { licenseKeyGroup, licenseModelId, version } = {}
+    ) {
+        if (licenseModelId && version) {
+            this.fetchLimits(dispatch, {
+                licenseModelId,
+                version,
+                licenseKeyGroup
+            });
+        }
+        dispatch({
+            type: licenseKeyGroupsConstants.licenseKeyGroupsEditor.OPEN,
+            licenseKeyGroup
+        });
+    },
+
+    closeLicenseKeyGroupEditor(dispatch) {
+        dispatch({
+            type: licenseKeyGroupsConstants.licenseKeyGroupsEditor.CLOSE
+        });
+    },
+
+    saveLicenseKeyGroup(
+        dispatch,
+        { licenseModelId, previousLicenseKeyGroup, licenseKeyGroup, version }
+    ) {
+        if (previousLicenseKeyGroup) {
+            return putLicenseKeyGroup(
+                licenseModelId,
+                licenseKeyGroup,
+                version
+            ).then(() => {
+                dispatch({
+                    type: licenseKeyGroupsConstants.EDIT_LICENSE_KEY_GROUP,
+                    licenseKeyGroup
+                });
+                return ItemsHelper.checkItemStatus(dispatch, {
+                    itemId: licenseModelId,
+                    versionId: version.id
+                });
+            });
+        } else {
+            return postLicenseKeyGroup(
+                licenseModelId,
+                licenseKeyGroup,
+                version
+            ).then(response => {
+                dispatch({
+                    type: licenseKeyGroupsConstants.ADD_LICENSE_KEY_GROUP,
+                    licenseKeyGroup: {
+                        ...licenseKeyGroup,
+                        referencingFeatureGroups: [],
+                        id: response.value
+                    }
+                });
+                return ItemsHelper.checkItemStatus(dispatch, {
+                    itemId: licenseModelId,
+                    versionId: version.id
+                });
+            });
+        }
+    },
+
+    deleteLicenseKeyGroup(
+        dispatch,
+        { licenseModelId, licenseKeyGroupId, version }
+    ) {
+        return deleteLicenseKeyGroup(
+            licenseModelId,
+            licenseKeyGroupId,
+            version
+        ).then(() => {
+            dispatch({
+                type: licenseKeyGroupsConstants.DELETE_LICENSE_KEY_GROUP,
+                licenseKeyGroupId
+            });
+            return ItemsHelper.checkItemStatus(dispatch, {
+                itemId: licenseModelId,
+                versionId: version.id
+            });
+        });
+    },
+
+    hideDeleteConfirm(dispatch) {
+        dispatch({
+            type: licenseKeyGroupsConstants.LICENSE_KEY_GROUPS_DELETE_CONFIRM,
+            licenseKeyGroupToDelete: false
+        });
+    },
+
+    openDeleteLicenseAgreementConfirm(dispatch, { licenseKeyGroup }) {
+        dispatch({
+            type: licenseKeyGroupsConstants.LICENSE_KEY_GROUPS_DELETE_CONFIRM,
+            licenseKeyGroupToDelete: licenseKeyGroup
+        });
+    },
+
+    fetchLimits(dispatch, { licenseModelId, version, licenseKeyGroup }) {
+        return fetchLimitsList(
+            licenseModelId,
+            licenseKeyGroup.id,
+            version
+        ).then(response => {
+            dispatch({
+                type:
+                    licenseKeyGroupsConstants.licenseKeyGroupsEditor
+                        .LIMITS_LIST_LOADED,
+                response
+            });
+        });
+    },
 
+    submitLimit(dispatch, { licenseModelId, version, licenseKeyGroup, limit }) {
+        const promise = limit.id
+            ? putLimit(licenseModelId, licenseKeyGroup.id, version, limit)
+            : postLimit(licenseModelId, licenseKeyGroup.id, version, limit);
+        return promise.then(() => {
+            dispatch({
+                type: limitEditorActions.CLOSE
+            });
+            this.fetchLimits(dispatch, {
+                licenseModelId,
+                version,
+                licenseKeyGroup
+            });
+            return ItemsHelper.checkItemStatus(dispatch, {
+                itemId: licenseModelId,
+                versionId: version.id
+            });
+        });
+    },
 
+    deleteLimit(dispatch, { licenseModelId, version, licenseKeyGroup, limit }) {
+        return deleteLimit(
+            licenseModelId,
+            licenseKeyGroup.id,
+            version,
+            limit.id
+        ).then(() => {
+            this.fetchLimits(dispatch, {
+                licenseModelId,
+                version,
+                licenseKeyGroup
+            });
+            return ItemsHelper.checkItemStatus(dispatch, {
+                itemId: licenseModelId,
+                versionId: version.id
+            });
+        });
+    }
 };
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 c376cb3fbc..aad0a0b1fb 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsConstants.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsConstants.js
@@ -15,73 +15,88 @@
  */
 import keyMirror from 'nfvo-utils/KeyMirror.js';
 import i18n from 'nfvo-utils/i18n/i18n.js';
-import InputOptions, {other as optionInputOther} from 'nfvo-components/input/validation/InputOptions.jsx';
+import InputOptions, {
+    other as optionInputOther
+} from 'nfvo-components/input/validation/InputOptions.jsx';
 
 export const actionTypes = keyMirror({
-
-	LICENSE_KEY_GROUPS_LIST_LOADED: null,
-	DELETE_LICENSE_KEY_GROUP: null,
-	EDIT_LICENSE_KEY_GROUP: null,
-	ADD_LICENSE_KEY_GROUP: null,
-	LICENSE_KEY_GROUPS_DELETE_CONFIRM: null,
-	licenseKeyGroupsEditor: {
-		OPEN: null,
-		CLOSE: null,
-		DATA_CHANGED: null,
-		LIMITS_LIST_LOADED: null
-	}
+    LICENSE_KEY_GROUPS_LIST_LOADED: null,
+    DELETE_LICENSE_KEY_GROUP: null,
+    EDIT_LICENSE_KEY_GROUP: null,
+    ADD_LICENSE_KEY_GROUP: null,
+    LICENSE_KEY_GROUPS_DELETE_CONFIRM: null,
+    licenseKeyGroupsEditor: {
+        OPEN: null,
+        CLOSE: null,
+        DATA_CHANGED: null,
+        LIMITS_LIST_LOADED: null
+    }
 });
 
 export const defaultState = {
-	licenseKeyGroupsEditor: {
-		type: '',
-		operationalScope: {choices: [], other: ''}
-	}
+    licenseKeyGroupsEditor: {
+        type: '',
+        operationalScope: { choices: [], other: '' }
+    }
 };
 
 export const LKG_FORM_NAME = 'LKGFORM';
 
 export const optionsInputValues = {
-	OPERATIONAL_SCOPE: [
-		{enum: '', title: i18n('please select…')},
-		{enum: 'Network_Wide', title: 'Network Wide'},
-		{enum: 'Availability_Zone', title: 'Availability Zone'},
-		{enum: 'Data_Center', title: 'Data Center'},
-		{enum: 'Tenant', title: 'Tenant'},
-		{enum: 'VM', title: 'VM'},
-		{enum: 'CPU', title: 'CPU'},
-		{enum: 'Core', title: 'Core'}
-	],
-	TYPE: [
-		{enum: '', title: i18n('please select…')},
-		{enum: 'Universal', title: 'Universal'},
-		{enum: 'Unique', title: 'Unique'},
-		{enum: 'One_Time', title: 'One Time'}
-	]
+    OPERATIONAL_SCOPE: [
+        { enum: '', title: i18n('please select…') },
+        { enum: 'Network_Wide', title: 'Network Wide' },
+        { enum: 'Availability_Zone', title: 'Availability Zone' },
+        { enum: 'Data_Center', title: 'Data Center' },
+        { enum: 'Tenant', title: 'Tenant' },
+        { enum: 'VM', title: 'VM' },
+        { enum: 'CPU', title: 'CPU' },
+        { enum: 'Core', title: 'Core' }
+    ],
+    TYPE: [
+        { enum: '', title: i18n('please select…') },
+        { enum: 'Universal', title: 'Universal' },
+        { enum: 'Unique', title: 'Unique' },
+        { enum: 'One_Time', title: 'One Time' }
+    ]
 };
 
-export const extractValue = (item) => {
-	if (item === undefined) {return '';} //TODO fix it later
+export const extractValue = item => {
+    if (item === undefined) {
+        return '';
+    } //TODO fix it later
 
-	return  item ? item === optionInputOther.OTHER ? item : InputOptions.getTitleByName(optionsInputValues, item) : '';
+    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;
-	}
+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;
+    }
 };
 
 export const tabIds = {
-	GENERAL: 'GENERAL',
-	SP_LIMITS: 'SP_LIMITS',
-	VENDOR_LIMITS: 'VENDOR_LIMITS',
-	ADD_LIMIT_BUTTON: 'ADD_LIMIT_BUTTON'
+    GENERAL: 'GENERAL',
+    SP_LIMITS: 'SP_LIMITS',
+    VENDOR_LIMITS: 'VENDOR_LIMITS',
+    ADD_LIMIT_BUTTON: 'ADD_LIMIT_BUTTON'
 };
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 028fa9d3e4..fa62bba669 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsEditor.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsEditor.js
@@ -13,53 +13,79 @@
  * 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 LicenseKeyGroupsActionHelper from './LicenseKeyGroupsActionHelper.js';
 import LicenseKeyGroupsEditorView from './LicenseKeyGroupsEditorView.jsx';
 import LimitEditorActionHelper from '../limits/LimitEditorActionHelper.js';
 import ValidationHelper from 'sdc-app/common/helpers/ValidationHelper.js';
 
-const mapStateToProps = ({licenseModel: {licenseKeyGroup}}) => {
+const mapStateToProps = ({ licenseModel: { licenseKeyGroup } }) => {
+    let {
+        data,
+        genericFieldInfo,
+        formReady,
+        limitsList
+    } = licenseKeyGroup.licenseKeyGroupsEditor;
 
+    let previousData,
+        LKGNames = {};
+    const licenseKeyGroupId = data ? data.id : null;
+    if (licenseKeyGroupId) {
+        previousData = licenseKeyGroup.licenseKeyGroupsList.find(
+            licenseKeyGroup => licenseKeyGroup.id === licenseKeyGroupId
+        );
+    }
 
-	let {data, genericFieldInfo, formReady, limitsList} = licenseKeyGroup.licenseKeyGroupsEditor;
+    let isFormValid = ValidationHelper.checkFormValid(genericFieldInfo);
 
-	let previousData, LKGNames = {};
-	const licenseKeyGroupId = data ? data.id : null;
-	if(licenseKeyGroupId) {
-		previousData = licenseKeyGroup.licenseKeyGroupsList.find(licenseKeyGroup => licenseKeyGroup.id === licenseKeyGroupId);
-	}
+    const list = licenseKeyGroup.licenseKeyGroupsList;
+    for (let i = 0; i < list.length; i++) {
+        LKGNames[list[i].name.toLowerCase()] = list[i].id;
+    }
 
-	let isFormValid = ValidationHelper.checkFormValid(genericFieldInfo);
-
-	const list = licenseKeyGroup.licenseKeyGroupsList;
-	for (let i = 0; i < list.length; i++) {
-		LKGNames[list[i].name.toLowerCase()] = list[i].id;
-	}
-
-	return {
-		data,
-		previousData,
-		genericFieldInfo,
-		isFormValid,
-		formReady,
-		LKGNames,
-		limitsList
-	};
+    return {
+        data,
+        previousData,
+        genericFieldInfo,
+        isFormValid,
+        formReady,
+        LKGNames,
+        limitsList
+    };
 };
 
-const mapActionsToProps = (dispatch, {licenseModelId, version}) => {
-	return {
-		onDataChanged: (deltaData, formName, customValidations) => ValidationHelper.dataChanged(dispatch, {deltaData, formName, customValidations}),
-		onCancel: () => LicenseKeyGroupsActionHelper.closeLicenseKeyGroupEditor(dispatch),
-		onSubmit: ({previousLicenseKeyGroup, licenseKeyGroup, keepOpen}) => {
-			if (!keepOpen) {LicenseKeyGroupsActionHelper.closeLicenseKeyGroupEditor(dispatch);}
-			LicenseKeyGroupsActionHelper.saveLicenseKeyGroup(dispatch, {licenseModelId, previousLicenseKeyGroup, licenseKeyGroup, version});
-		},
-		onValidateForm: (formName) => ValidationHelper.validateForm(dispatch, formName),
-		onCloseLimitEditor: () => LimitEditorActionHelper.closeLimitsEditor(dispatch),
-		onOpenLimitEditor: (limit) => LimitEditorActionHelper.openLimitsEditor(dispatch, {limit})
-	};
+const mapActionsToProps = (dispatch, { licenseModelId, version }) => {
+    return {
+        onDataChanged: (deltaData, formName, customValidations) =>
+            ValidationHelper.dataChanged(dispatch, {
+                deltaData,
+                formName,
+                customValidations
+            }),
+        onCancel: () =>
+            LicenseKeyGroupsActionHelper.closeLicenseKeyGroupEditor(dispatch),
+        onSubmit: ({ previousLicenseKeyGroup, licenseKeyGroup, keepOpen }) => {
+            if (!keepOpen) {
+                LicenseKeyGroupsActionHelper.closeLicenseKeyGroupEditor(
+                    dispatch
+                );
+            }
+            LicenseKeyGroupsActionHelper.saveLicenseKeyGroup(dispatch, {
+                licenseModelId,
+                previousLicenseKeyGroup,
+                licenseKeyGroup,
+                version
+            });
+        },
+        onValidateForm: formName =>
+            ValidationHelper.validateForm(dispatch, formName),
+        onCloseLimitEditor: () =>
+            LimitEditorActionHelper.closeLimitsEditor(dispatch),
+        onOpenLimitEditor: limit =>
+            LimitEditorActionHelper.openLimitsEditor(dispatch, { limit })
+    };
 };
 
-export default connect(mapStateToProps, mapActionsToProps)(LicenseKeyGroupsEditorView);
+export default connect(mapStateToProps, mapActionsToProps)(
+    LicenseKeyGroupsEditorView
+);
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 b1a22f3d9a..e948e9cef8 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsEditorReducer.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsEditorReducer.js
@@ -13,82 +13,97 @@
  * or implied. See the License for the specific language governing
  * permissions and limitations under the License.
  */
-import {actionTypes, defaultState, LKG_FORM_NAME} from './LicenseKeyGroupsConstants.js';
+import {
+    actionTypes,
+    defaultState,
+    LKG_FORM_NAME
+} from './LicenseKeyGroupsConstants.js';
 import moment from 'moment';
-import {DATE_FORMAT} from 'sdc-app/onboarding/OnboardingConstants.js';
+import { DATE_FORMAT } from 'sdc-app/onboarding/OnboardingConstants.js';
 
 export default (state = {}, action) => {
-	switch (action.type) {
-		case actionTypes.licenseKeyGroupsEditor.OPEN:
-			let licenseKeyGroupData = {...action.licenseKeyGroup};
-			let {startDate, expiryDate} = licenseKeyGroupData;
-			if (startDate) {
-				licenseKeyGroupData.startDate = moment(startDate, DATE_FORMAT).format(DATE_FORMAT);
-			}
-			if (expiryDate) {
-				licenseKeyGroupData.expiryDate = moment(expiryDate, DATE_FORMAT).format(DATE_FORMAT);
-			}
-			return {
-				...state,
-				data: action.licenseKeyGroup ? licenseKeyGroupData : defaultState.licenseKeyGroupsEditor,
-				formReady: null,
-				formName: LKG_FORM_NAME,
-				genericFieldInfo: {
-					'description' : {
-						isValid: true,
-						errorText: '',
-						validations: [{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: []
-					},
-					'thresholdUnits' : {
-						isValid: true,
-						errorText: '',
-						validations: []
-					},
-					'thresholdValue' : {
-						isValid: true,
-						errorText: '',
-						validations: []
-					},
-					'increments' : {
-						isValid: true,
-						errorText: '',
-						validations: [{type: 'maxLength', data: 120}]
-					},
-					'startDate': {
-						isValid: true,
-						errorText: '',
-						validations: []
-					},
-					'expiryDate': {
-						isValid: true,
-						errorText: '',
-						validations: []
-					}
-				}
-			};
-		case actionTypes.licenseKeyGroupsEditor.LIMITS_LIST_LOADED:
-			return {
-				...state,
-				limitsList: action.response.results
-			};	
-		case actionTypes.licenseKeyGroupsEditor.CLOSE:
-			return {};
-		default:
-			return state;
-	}
+    switch (action.type) {
+        case actionTypes.licenseKeyGroupsEditor.OPEN:
+            let licenseKeyGroupData = { ...action.licenseKeyGroup };
+            let { startDate, expiryDate } = licenseKeyGroupData;
+            if (startDate) {
+                licenseKeyGroupData.startDate = moment(
+                    startDate,
+                    DATE_FORMAT
+                ).format(DATE_FORMAT);
+            }
+            if (expiryDate) {
+                licenseKeyGroupData.expiryDate = moment(
+                    expiryDate,
+                    DATE_FORMAT
+                ).format(DATE_FORMAT);
+            }
+            return {
+                ...state,
+                data: action.licenseKeyGroup
+                    ? licenseKeyGroupData
+                    : defaultState.licenseKeyGroupsEditor,
+                formReady: null,
+                formName: LKG_FORM_NAME,
+                genericFieldInfo: {
+                    description: {
+                        isValid: true,
+                        errorText: '',
+                        validations: [{ 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: []
+                    },
+                    thresholdUnits: {
+                        isValid: true,
+                        errorText: '',
+                        validations: []
+                    },
+                    thresholdValue: {
+                        isValid: true,
+                        errorText: '',
+                        validations: []
+                    },
+                    increments: {
+                        isValid: true,
+                        errorText: '',
+                        validations: [{ type: 'maxLength', data: 120 }]
+                    },
+                    startDate: {
+                        isValid: true,
+                        errorText: '',
+                        validations: []
+                    },
+                    expiryDate: {
+                        isValid: true,
+                        errorText: '',
+                        validations: []
+                    }
+                }
+            };
+        case actionTypes.licenseKeyGroupsEditor.LIMITS_LIST_LOADED:
+            return {
+                ...state,
+                limitsList: action.response.results
+            };
+        case actionTypes.licenseKeyGroupsEditor.CLOSE:
+            return {};
+        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 7cbab61a8a..a820f28dfd 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsEditorView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsEditorView.jsx
@@ -26,328 +26,498 @@ 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, tabIds} from './LicenseKeyGroupsConstants.js';
-import {optionsInputValues as LicenseModelOptionsInputValues} from '../LicenseModelConstants.js';
-import {validateStartDate, thresholdValueValidation} from '../LicenseModelValidations.js';
-import {other as optionInputOther} from 'nfvo-components/input/validation/InputOptions.jsx';
+import {
+    optionsInputValues as licenseKeyGroupOptionsInputValues,
+    LKG_FORM_NAME,
+    tabIds
+} from './LicenseKeyGroupsConstants.js';
+import { optionsInputValues as LicenseModelOptionsInputValues } from '../LicenseModelConstants.js';
+import {
+    validateStartDate,
+    thresholdValueValidation
+} from '../LicenseModelValidations.js';
+import { other as optionInputOther } from 'nfvo-components/input/validation/InputOptions.jsx';
 import InputOptions from 'nfvo-components/input/validation/InputOptions.jsx';
 
-import {DATE_FORMAT} from 'sdc-app/onboarding/OnboardingConstants.js';
+import { DATE_FORMAT } from 'sdc-app/onboarding/OnboardingConstants.js';
 
 import LicenseKeyGroupsLimits from './LicenseKeyGroupsLimits.js';
-import {limitType, NEW_LIMIT_TEMP_ID} from '../limits/LimitEditorConstants.js';
+import {
+    limitType,
+    NEW_LIMIT_TEMP_ID
+} from '../limits/LimitEditorConstants.js';
 
- const LicenseKeyGroupPropType = PropTypes.shape({
-	id: PropTypes.string,
-	name: PropTypes.string,
-	description: PropTypes.string,
-	increments: PropTypes.string,
-	operationalScope: PropTypes.shape({
-		choices: PropTypes.array,
-		other: PropTypes.string
-	}),
-	type: PropTypes.string,
-	 thresholdUnits: PropTypes.string,
-	 thresholdValue: PropTypes.number,
-	 startDate: PropTypes.string,
-	 expiryDate: PropTypes.string
+const LicenseKeyGroupPropType = PropTypes.shape({
+    id: PropTypes.string,
+    name: PropTypes.string,
+    description: PropTypes.string,
+    increments: PropTypes.string,
+    operationalScope: PropTypes.shape({
+        choices: PropTypes.array,
+        other: PropTypes.string
+    }),
+    type: PropTypes.string,
+    thresholdUnits: PropTypes.string,
+    thresholdValue: PropTypes.number,
+    startDate: PropTypes.string,
+    expiryDate: PropTypes.string
 });
 
-const LicenseKeyGroupFormContent = ({data, onDataChanged, genericFieldInfo, validateName, validateStartDate, thresholdValueValidation}) => {
-	let {name, description, increments, operationalScope, type, thresholdUnits, thresholdValue, startDate, expiryDate} = data;
-	return (
-		<GridSection hasLostColSet>
-			<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} lastColInRow>
-				<InputOptions
-					onInputChange={()=>{}}
-					isMultiSelect={true}
-					onEnumChange={operationalScope => onDataChanged({operationalScope:{choices: operationalScope, other: ''}},
-						LKG_FORM_NAME)}
-					onOtherChange={operationalScope => onDataChanged({operationalScope:{choices: [optionInputOther.OTHER],
-						other: operationalScope}}, LKG_FORM_NAME)}
-					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}
-					type='textarea'
-					overlayPos='bottom' />
-			</GridItem>
-			<GridItem colSpan={2} lastColInRow>
-				<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'
-					overlayPos='bottom'
-					type='select' >
-					{
-						licenseKeyGroupOptionsInputValues.TYPE.map(type =>
-						(<option key={type.enum} value={type.enum}>{type.title}</option>))
-					}
-				</Input>
-			</GridItem>
-			<GridItem>
-				<Input
-					onChange={e => {
-						// setting the unit to the correct value
-						const selectedIndex = e.target.selectedIndex;
-						const val = e.target.options[selectedIndex].value;
-						onDataChanged({thresholdUnits: val}, LKG_FORM_NAME);
-						// TODO make sure that the value is valid too
-						onDataChanged({thresholdValue: thresholdValue}, LKG_FORM_NAME,{thresholdValue : thresholdValueValidation});}
-
-					}
-					value={thresholdUnits}
-					label={i18n('Threshold Units')}
-					data-test-id='create-ep-threshold-units'
-					isValid={genericFieldInfo.thresholdUnits.isValid}
-					errorText={genericFieldInfo.thresholdUnits.errorText}
-					groupClassName='bootstrap-input-options'
-					className='input-options-select'
-					type='select' >
-					{LicenseModelOptionsInputValues.THRESHOLD_UNITS.map(mtype =>
-						<option key={mtype.enum} value={mtype.enum}>{`${mtype.title}`}</option>)}
-				</Input>
-			</GridItem>
-			<GridItem>
-				<Input
-					className='entitlement-pools-form-row-threshold-value'
-					onChange={thresholdValue => onDataChanged({thresholdValue}, LKG_FORM_NAME,
-						{thresholdValue : thresholdValueValidation})}
-					label={i18n('Threshold Value')}
-					isValid={genericFieldInfo.thresholdValue.isValid}
-					errorText={genericFieldInfo.thresholdValue.errorText}
-					data-test-id='create-ep-threshold-value'
-					value={thresholdValue}
-					type='text'/>
-			</GridItem>
-				<GridItem>
-				<Input
-					type='date'
-					label={i18n('Start Date')}
-					value={startDate}
-					dateFormat={DATE_FORMAT}
-					startDate={startDate}
-					endDate={expiryDate}
-					onChange={startDate => onDataChanged(
-						{startDate: startDate ? startDate.format(DATE_FORMAT) : ''},
-						LKG_FORM_NAME,
-						{startDate: validateStartDate}
-					)}
-					isValid={genericFieldInfo.startDate.isValid}
-					errorText={genericFieldInfo.startDate.errorText}
-					selectsStart/>
-			</GridItem>
-			<GridItem lastColInRow>
-				<Input
-					type='date'
-					label={i18n('Expiry Date')}
-					value={expiryDate}
-					dateFormat={DATE_FORMAT}
-					startDate={startDate}
-					endDate={expiryDate}
-					onChange={expiryDate => {
-						onDataChanged({expiryDate: expiryDate ? expiryDate.format(DATE_FORMAT) : ''}, LKG_FORM_NAME);
-						onDataChanged({startDate}, LKG_FORM_NAME, {startDate: validateStartDate});
-					}}
-					isValid={genericFieldInfo.expiryDate.isValid}
-					errorText={genericFieldInfo.expiryDate.errorText}
-					selectsEnd/>
-			</GridItem>
-			<GridItem colSpan={2}>
-				<Input
-					onChange={increments => onDataChanged({increments}, LKG_FORM_NAME)}
-					label={i18n('Increments')}
-					value={increments}
-					data-test-id='create-ep-increments'
-					type='text'/>
-			</GridItem>
-		</GridSection>
-	);
+const LicenseKeyGroupFormContent = ({
+    data,
+    onDataChanged,
+    genericFieldInfo,
+    validateName,
+    validateStartDate,
+    thresholdValueValidation
+}) => {
+    let {
+        name,
+        description,
+        increments,
+        operationalScope,
+        type,
+        thresholdUnits,
+        thresholdValue,
+        startDate,
+        expiryDate
+    } = data;
+    return (
+        <GridSection hasLostColSet>
+            <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} lastColInRow>
+                <InputOptions
+                    onInputChange={() => {}}
+                    isMultiSelect={true}
+                    onEnumChange={operationalScope =>
+                        onDataChanged(
+                            {
+                                operationalScope: {
+                                    choices: operationalScope,
+                                    other: ''
+                                }
+                            },
+                            LKG_FORM_NAME
+                        )
+                    }
+                    onOtherChange={operationalScope =>
+                        onDataChanged(
+                            {
+                                operationalScope: {
+                                    choices: [optionInputOther.OTHER],
+                                    other: operationalScope
+                                }
+                            },
+                            LKG_FORM_NAME
+                        )
+                    }
+                    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}
+                    type="textarea"
+                    overlayPos="bottom"
+                />
+            </GridItem>
+            <GridItem colSpan={2} lastColInRow>
+                <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"
+                    overlayPos="bottom"
+                    type="select">
+                    {licenseKeyGroupOptionsInputValues.TYPE.map(type => (
+                        <option key={type.enum} value={type.enum}>
+                            {type.title}
+                        </option>
+                    ))}
+                </Input>
+            </GridItem>
+            <GridItem>
+                <Input
+                    onChange={e => {
+                        // setting the unit to the correct value
+                        const selectedIndex = e.target.selectedIndex;
+                        const val = e.target.options[selectedIndex].value;
+                        onDataChanged({ thresholdUnits: val }, LKG_FORM_NAME);
+                        // TODO make sure that the value is valid too
+                        onDataChanged(
+                            { thresholdValue: thresholdValue },
+                            LKG_FORM_NAME,
+                            {
+                                thresholdValue: thresholdValueValidation
+                            }
+                        );
+                    }}
+                    value={thresholdUnits}
+                    label={i18n('Threshold Units')}
+                    data-test-id="create-ep-threshold-units"
+                    isValid={genericFieldInfo.thresholdUnits.isValid}
+                    errorText={genericFieldInfo.thresholdUnits.errorText}
+                    groupClassName="bootstrap-input-options"
+                    className="input-options-select"
+                    type="select">
+                    {LicenseModelOptionsInputValues.THRESHOLD_UNITS.map(
+                        mtype => (
+                            <option key={mtype.enum} value={mtype.enum}>{`${
+                                mtype.title
+                            }`}</option>
+                        )
+                    )}
+                </Input>
+            </GridItem>
+            <GridItem>
+                <Input
+                    className="entitlement-pools-form-row-threshold-value"
+                    onChange={thresholdValue =>
+                        onDataChanged({ thresholdValue }, LKG_FORM_NAME, {
+                            thresholdValue: thresholdValueValidation
+                        })
+                    }
+                    label={i18n('Threshold Value')}
+                    isValid={genericFieldInfo.thresholdValue.isValid}
+                    errorText={genericFieldInfo.thresholdValue.errorText}
+                    data-test-id="create-ep-threshold-value"
+                    value={thresholdValue}
+                    type="text"
+                />
+            </GridItem>
+            <GridItem>
+                <Input
+                    type="date"
+                    label={i18n('Start Date')}
+                    value={startDate}
+                    dateFormat={DATE_FORMAT}
+                    startDate={startDate}
+                    endDate={expiryDate}
+                    onChange={startDate =>
+                        onDataChanged(
+                            {
+                                startDate: startDate
+                                    ? startDate.format(DATE_FORMAT)
+                                    : ''
+                            },
+                            LKG_FORM_NAME,
+                            { startDate: validateStartDate }
+                        )
+                    }
+                    isValid={genericFieldInfo.startDate.isValid}
+                    errorText={genericFieldInfo.startDate.errorText}
+                    selectsStart
+                />
+            </GridItem>
+            <GridItem lastColInRow>
+                <Input
+                    type="date"
+                    label={i18n('Expiry Date')}
+                    value={expiryDate}
+                    dateFormat={DATE_FORMAT}
+                    startDate={startDate}
+                    endDate={expiryDate}
+                    onChange={expiryDate => {
+                        onDataChanged(
+                            {
+                                expiryDate: expiryDate
+                                    ? expiryDate.format(DATE_FORMAT)
+                                    : ''
+                            },
+                            LKG_FORM_NAME
+                        );
+                        onDataChanged({ startDate }, LKG_FORM_NAME, {
+                            startDate: validateStartDate
+                        });
+                    }}
+                    isValid={genericFieldInfo.expiryDate.isValid}
+                    errorText={genericFieldInfo.expiryDate.errorText}
+                    selectsEnd
+                />
+            </GridItem>
+            <GridItem colSpan={2}>
+                <Input
+                    onChange={increments =>
+                        onDataChanged({ increments }, LKG_FORM_NAME)
+                    }
+                    label={i18n('Increments')}
+                    value={increments}
+                    data-test-id="create-ep-increments"
+                    type="text"
+                />
+            </GridItem>
+        </GridSection>
+    );
 };
 
 class LicenseKeyGroupsEditorView extends React.Component {
-	static propTypes = {
-		data: LicenseKeyGroupPropType,
-		previousData: LicenseKeyGroupPropType,
-		LKGNames: PropTypes.object,
-		isReadOnlyMode: PropTypes.bool,
-		onDataChanged: PropTypes.func.isRequired,
-		onSubmit: PropTypes.func.isRequired,
-		onCancel: PropTypes.func.isRequired
-	};
-
-	static defaultProps = {
-		data: {}
-	};
-
-	componentDidUpdate(prevProps) {
-		if (this.props.formReady && this.props.formReady !== prevProps.formReady) { // if form validation succeeded -> continue with submit
-			this.submit();
-		}
-	}
+    static propTypes = {
+        data: LicenseKeyGroupPropType,
+        previousData: LicenseKeyGroupPropType,
+        LKGNames: PropTypes.object,
+        isReadOnlyMode: PropTypes.bool,
+        onDataChanged: PropTypes.func.isRequired,
+        onSubmit: PropTypes.func.isRequired,
+        onCancel: PropTypes.func.isRequired
+    };
 
-	state = {
-		localFeatureGroupsListFilter: '',
-		selectedTab: tabIds.GENERAL,
-		selectedLimit: ''
-	};
+    static defaultProps = {
+        data: {}
+    };
 
-	render() {
-		let {data = {}, onDataChanged, isReadOnlyMode, onCloseLimitEditor, genericFieldInfo, limitsList = []} = this.props;
-		let {selectedTab} = this.state;
-		const isTabsDisabled = !data.id || !this.props.isFormValid;
-		return (
-			<div className='license-keygroup-editor'>
-				<Tabs
-					type='menu'
-					activeTab={selectedTab}
-					onTabClick={(tabIndex)=>{
-						if (tabIndex === tabIds.ADD_LIMIT_BUTTON)  {
-							this.onAddLimit();
-						} else {
-							this.setState({selectedTab: tabIndex});
-							onCloseLimitEditor();
-							this.setState({selectedLimit: ''});
-						}
-					}}
-					invalidTabs={[]}>
-					<Tab tabId={tabIds.GENERAL} data-test-id='general-tab' title={i18n('General')}>
-						{ genericFieldInfo &&
-							<Form
-								ref='validationForm'
-								hasButtons={false}
-								isValid={this.props.isFormValid}
-								formReady={this.props.formReady}
-								onValidateForm={() => this.props.onValidateForm(LKG_FORM_NAME) }
-								labledButtons={true}
-								isReadOnlyMode={isReadOnlyMode}
-								className='license-model-form license-key-groups-form'>
-									<LicenseKeyGroupFormContent
-										data={data}
-										onDataChanged={onDataChanged}
-										genericFieldInfo={genericFieldInfo}
-										validateName={(value)=> this.validateName(value)}
-										validateStartDate={(value, state)=> validateStartDate(value, state)}
-										thresholdValueValidation={(value, state) => thresholdValueValidation(value, state)}/>
-							</Form>}
+    componentDidUpdate(prevProps) {
+        if (
+            this.props.formReady &&
+            this.props.formReady !== prevProps.formReady
+        ) {
+            // if form validation succeeded -> continue with submit
+            this.submit();
+        }
+    }
 
-					</Tab>
-					<Tab tabId={tabIds.SP_LIMITS} disabled={isTabsDisabled} data-test-id='general-tab' title={i18n('SP Limits')}>
-						{selectedTab === tabIds.SP_LIMITS &&
-							<LicenseKeyGroupsLimits
-								limitType={limitType.SERVICE_PROVIDER}
-								limitsList={limitsList.filter(item => item.type === limitType.SERVICE_PROVIDER)}
-								selectedLimit={this.state.selectedLimit}
-								onCloseLimitEditor={() => this.onCloseLimitEditor()}
-								onSelectLimit={limit => this.onSelectLimit(limit)}
-								isReadOnlyMode={isReadOnlyMode} />}
-					</Tab>
-					<Tab tabId={tabIds.VENDOR_LIMITS} disabled={isTabsDisabled} data-test-id='general-tab' title={i18n('Vendor Limits')}>
-						{selectedTab === tabIds.VENDOR_LIMITS &&
-							<LicenseKeyGroupsLimits
-								limitType={limitType.VENDOR}
-								limitsList={limitsList.filter(item => item.type === limitType.VENDOR)}
-								selectedLimit={this.state.selectedLimit}
-								onCloseLimitEditor={() => this.onCloseLimitEditor()}
-								onSelectLimit={limit => this.onSelectLimit(limit)}
-								isReadOnlyMode={isReadOnlyMode} />}
-					</Tab>
-					{selectedTab !== tabIds.GENERAL ?
-							<Button
-								className='add-limit-button'
-								tabId={tabIds.ADD_LIMIT_BUTTON}
-								btnType='link'
-								iconName='plus'
-								disabled={this.state.selectedLimit || isReadOnlyMode}>
-								{i18n('Add Limit')}
-							</Button>
-						:
-							<div key='empty_lm_tab_key'></div> // Render empty div to not break tabs
-					}
-				</Tabs>
+    state = {
+        localFeatureGroupsListFilter: '',
+        selectedTab: tabIds.GENERAL,
+        selectedLimit: ''
+    };
 
-				<GridSection className='license-model-modal-buttons license-key-group-editor-buttons'>
-					{!this.state.selectedLimit &&
-						<Button btnType='default' disabled={!this.props.isFormValid || isReadOnlyMode} onClick={() => this.submit()} type='reset'>
-							{i18n('Save')}
-						</Button>
-					}
-					<Button btnType={this.state.selectedLimit ? 'default' : 'outline'} onClick={() => this.props.onCancel()} type='reset'>
-						{i18n('Cancel')}
-					</Button>
-				</GridSection>
-			</div>
+    render() {
+        let {
+            data = {},
+            onDataChanged,
+            isReadOnlyMode,
+            onCloseLimitEditor,
+            genericFieldInfo,
+            limitsList = []
+        } = this.props;
+        let { selectedTab } = this.state;
+        const isTabsDisabled = !data.id || !this.props.isFormValid;
+        return (
+            <div className="license-keygroup-editor">
+                <Tabs
+                    type="menu"
+                    activeTab={selectedTab}
+                    onTabClick={tabIndex => {
+                        if (tabIndex === tabIds.ADD_LIMIT_BUTTON) {
+                            this.onAddLimit();
+                        } else {
+                            this.setState({ selectedTab: tabIndex });
+                            onCloseLimitEditor();
+                            this.setState({ selectedLimit: '' });
+                        }
+                    }}
+                    invalidTabs={[]}>
+                    <Tab
+                        tabId={tabIds.GENERAL}
+                        data-test-id="general-tab"
+                        title={i18n('General')}>
+                        {genericFieldInfo && (
+                            <Form
+                                ref="validationForm"
+                                hasButtons={false}
+                                isValid={this.props.isFormValid}
+                                formReady={this.props.formReady}
+                                onValidateForm={() =>
+                                    this.props.onValidateForm(LKG_FORM_NAME)
+                                }
+                                labledButtons={true}
+                                isReadOnlyMode={isReadOnlyMode}
+                                className="license-model-form license-key-groups-form">
+                                <LicenseKeyGroupFormContent
+                                    data={data}
+                                    onDataChanged={onDataChanged}
+                                    genericFieldInfo={genericFieldInfo}
+                                    validateName={value =>
+                                        this.validateName(value)
+                                    }
+                                    validateStartDate={(value, state) =>
+                                        validateStartDate(value, state)
+                                    }
+                                    thresholdValueValidation={(value, state) =>
+                                        thresholdValueValidation(value, state)
+                                    }
+                                />
+                            </Form>
+                        )}
+                    </Tab>
+                    <Tab
+                        tabId={tabIds.SP_LIMITS}
+                        disabled={isTabsDisabled}
+                        data-test-id="general-tab"
+                        title={i18n('SP Limits')}>
+                        {selectedTab === tabIds.SP_LIMITS && (
+                            <LicenseKeyGroupsLimits
+                                limitType={limitType.SERVICE_PROVIDER}
+                                limitsList={limitsList.filter(
+                                    item =>
+                                        item.type === limitType.SERVICE_PROVIDER
+                                )}
+                                selectedLimit={this.state.selectedLimit}
+                                onCloseLimitEditor={() =>
+                                    this.onCloseLimitEditor()
+                                }
+                                onSelectLimit={limit =>
+                                    this.onSelectLimit(limit)
+                                }
+                                isReadOnlyMode={isReadOnlyMode}
+                            />
+                        )}
+                    </Tab>
+                    <Tab
+                        tabId={tabIds.VENDOR_LIMITS}
+                        disabled={isTabsDisabled}
+                        data-test-id="general-tab"
+                        title={i18n('Vendor Limits')}>
+                        {selectedTab === tabIds.VENDOR_LIMITS && (
+                            <LicenseKeyGroupsLimits
+                                limitType={limitType.VENDOR}
+                                limitsList={limitsList.filter(
+                                    item => item.type === limitType.VENDOR
+                                )}
+                                selectedLimit={this.state.selectedLimit}
+                                onCloseLimitEditor={() =>
+                                    this.onCloseLimitEditor()
+                                }
+                                onSelectLimit={limit =>
+                                    this.onSelectLimit(limit)
+                                }
+                                isReadOnlyMode={isReadOnlyMode}
+                            />
+                        )}
+                    </Tab>
+                    {selectedTab !== tabIds.GENERAL ? (
+                        <Button
+                            className="add-limit-button"
+                            tabId={tabIds.ADD_LIMIT_BUTTON}
+                            btnType="link"
+                            iconName="plus"
+                            disabled={
+                                this.state.selectedLimit || isReadOnlyMode
+                            }>
+                            {i18n('Add Limit')}
+                        </Button>
+                    ) : (
+                        <div key="empty_lm_tab_key" />
+                    ) // Render empty div to not break tabs
+                    }
+                </Tabs>
 
-		);
-	}
+                <GridSection className="license-model-modal-buttons license-key-group-editor-buttons">
+                    {!this.state.selectedLimit && (
+                        <Button
+                            btnType="default"
+                            disabled={!this.props.isFormValid || isReadOnlyMode}
+                            onClick={() => this.submit()}
+                            type="reset">
+                            {i18n('Save')}
+                        </Button>
+                    )}
+                    <Button
+                        btnType={
+                            this.state.selectedLimit ? 'default' : 'outline'
+                        }
+                        onClick={() => this.props.onCancel()}
+                        type="reset">
+                        {i18n('Cancel')}
+                    </Button>
+                </GridSection>
+            </div>
+        );
+    }
 
-	submit() {
-		const {data: licenseKeyGroup, previousData: previousLicenseKeyGroup, formReady, onValidateForm, onSubmit} = this.props;
-		if (!formReady) {
-			onValidateForm(LKG_FORM_NAME);
-		} else {
-			onSubmit({licenseKeyGroup, previousLicenseKeyGroup});
-		}
-	}
+    submit() {
+        const {
+            data: licenseKeyGroup,
+            previousData: previousLicenseKeyGroup,
+            formReady,
+            onValidateForm,
+            onSubmit
+        } = this.props;
+        if (!formReady) {
+            onValidateForm(LKG_FORM_NAME);
+        } else {
+            onSubmit({ licenseKeyGroup, previousLicenseKeyGroup });
+        }
+    }
 
-	validateName(value) {
-		const {data: {id}, LKGNames} = this.props;
-		const isExists = Validator.isItemNameAlreadyExistsInList({itemId: id, itemName: value, list: LKGNames});
+    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')};
-	}
+        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"
+                  )
+              };
+    }
 
-	onSelectLimit(limit) {
-		if (limit.id === this.state.selectedLimit) {
-			this.setState({selectedLimit: ''});
-			return;
-		}
-		this.setState({selectedLimit: limit.id});
-		this.props.onOpenLimitEditor(limit);
-	}
+    onSelectLimit(limit) {
+        if (limit.id === this.state.selectedLimit) {
+            this.setState({ selectedLimit: '' });
+            return;
+        }
+        this.setState({ selectedLimit: limit.id });
+        this.props.onOpenLimitEditor(limit);
+    }
 
-	onCloseLimitEditor() {
-		this.setState({selectedLimit: ''});
-		this.props.onCloseLimitEditor();
-	}
+    onCloseLimitEditor() {
+        this.setState({ selectedLimit: '' });
+        this.props.onCloseLimitEditor();
+    }
 
-	onAddLimit() {
-		this.setState({selectedLimit: NEW_LIMIT_TEMP_ID});
-		this.props.onOpenLimitEditor();
-	}
+    onAddLimit() {
+        this.setState({ selectedLimit: NEW_LIMIT_TEMP_ID });
+        this.props.onOpenLimitEditor();
+    }
 }
 
 export default LicenseKeyGroupsEditorView;
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsLimits.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsLimits.js
index bd8f21a7c5..ad14c6c249 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsLimits.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsLimits.js
@@ -13,45 +13,75 @@
  * 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 globalModalActionTypes} from 'nfvo-components/modal/GlobalModalConstants.js';
+import { actionTypes as globalModalActionTypes } from 'nfvo-components/modal/GlobalModalConstants.js';
 import ValidationHelper from 'sdc-app/common/helpers/ValidationHelper.js';
 import Limits from 'sdc-app/onboarding/licenseModel/limits/Limits.jsx';
 
 import LicenseKeyGroupsActionHelper from './LicenseKeyGroupsActionHelper.js';
 
-const mapStateToProps = ({licenseModel: {licenseKeyGroup: {licenseKeyGroupsEditor: {data}}, limitEditor}, currentScreen}) => {
-	let  {props: {licenseModelId, version}} = currentScreen;
-	return {
-		parent: data,
-		limitEditor,
-		licenseModelId,
-		version
-	};
+const mapStateToProps = ({
+    licenseModel: {
+        licenseKeyGroup: { licenseKeyGroupsEditor: { data } },
+        limitEditor
+    },
+    currentScreen
+}) => {
+    let { props: { licenseModelId, version } } = currentScreen;
+    return {
+        parent: data,
+        limitEditor,
+        licenseModelId,
+        version
+    };
 };
 
-const mapActionsToProps = (dispatch) => {
-	return {
-		onDataChanged: (deltaData, formName, customValidations) => ValidationHelper.dataChanged(dispatch, {deltaData, formName, customValidations}),
-		onSubmit: (limit, licenseKeyGroup, licenseModelId, version) => LicenseKeyGroupsActionHelper.submitLimit(dispatch,
-			{
-				limit,
-				licenseKeyGroup,
-				licenseModelId,
-				version}),
-		onDelete: ({limit, parent, licenseModelId, version, onCloseLimitEditor, selectedLimit}) => dispatch({
-			type: globalModalActionTypes.GLOBAL_MODAL_WARNING,
-			data:{
-				msg: i18n('Are you sure you want to delete {name}?', {name: limit.name}),
-				confirmationButtonText: i18n('Delete'),
-				title: i18n('Delete'),
-				onConfirmed: ()=> LicenseKeyGroupsActionHelper.deleteLimit(dispatch, {limit, licenseKeyGroup: parent, licenseModelId, version}).then(() =>
-					selectedLimit === limit.id && onCloseLimitEditor()
-				)
-			}
-		})
-	};
+const mapActionsToProps = dispatch => {
+    return {
+        onDataChanged: (deltaData, formName, customValidations) =>
+            ValidationHelper.dataChanged(dispatch, {
+                deltaData,
+                formName,
+                customValidations
+            }),
+        onSubmit: (limit, licenseKeyGroup, licenseModelId, version) =>
+            LicenseKeyGroupsActionHelper.submitLimit(dispatch, {
+                limit,
+                licenseKeyGroup,
+                licenseModelId,
+                version
+            }),
+        onDelete: ({
+            limit,
+            parent,
+            licenseModelId,
+            version,
+            onCloseLimitEditor,
+            selectedLimit
+        }) =>
+            dispatch({
+                type: globalModalActionTypes.GLOBAL_MODAL_WARNING,
+                data: {
+                    msg: i18n('Are you sure you want to delete {name}?', {
+                        name: limit.name
+                    }),
+                    confirmationButtonText: i18n('Delete'),
+                    title: i18n('Delete'),
+                    onConfirmed: () =>
+                        LicenseKeyGroupsActionHelper.deleteLimit(dispatch, {
+                            limit,
+                            licenseKeyGroup: parent,
+                            licenseModelId,
+                            version
+                        }).then(
+                            () =>
+                                selectedLimit === limit.id &&
+                                onCloseLimitEditor()
+                        )
+                }
+            })
+    };
 };
 
 export default connect(mapStateToProps, mapActionsToProps)(Limits);
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 00c2092b83..6151c5997d 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsListEditor.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsListEditor.js
@@ -13,41 +13,62 @@
  * 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 globalMoadlActions}  from 'nfvo-components/modal/GlobalModalConstants.js';
+import { actionTypes as globalMoadlActions } from 'nfvo-components/modal/GlobalModalConstants.js';
 
 import LicenseKeyGroupsActionHelper from './LicenseKeyGroupsActionHelper.js';
-import LicenseKeyGroupsListEditorView, {generateConfirmationMsg} from './LicenseKeyGroupsListEditorView.jsx';
+import LicenseKeyGroupsListEditorView, {
+    generateConfirmationMsg
+} from './LicenseKeyGroupsListEditorView.jsx';
 
-const mapStateToProps = ({licenseModel: {licenseKeyGroup, licenseModelEditor}}) => {
-	let {licenseKeyGroupsList} = licenseKeyGroup;
-	let {data} = licenseKeyGroup.licenseKeyGroupsEditor;
-	let {vendorName} = licenseModelEditor.data;
+const mapStateToProps = ({
+    licenseModel: { licenseKeyGroup, licenseModelEditor }
+}) => {
+    let { licenseKeyGroupsList } = licenseKeyGroup;
+    let { data } = licenseKeyGroup.licenseKeyGroupsEditor;
+    let { vendorName } = licenseModelEditor.data;
 
-	return {
-		vendorName,
-		licenseKeyGroupsList,
-		isDisplayModal: Boolean(data),
-		isModalInEditMode: Boolean(data && data.id)
-	};
+    return {
+        vendorName,
+        licenseKeyGroupsList,
+        isDisplayModal: Boolean(data),
+        isModalInEditMode: Boolean(data && data.id)
+    };
 };
 
-const mapActionsToProps = (dispatch, {licenseModelId, version}) => {	
-	return {
-		onAddLicenseKeyGroupClick: () => LicenseKeyGroupsActionHelper.openLicenseKeyGroupsEditor(dispatch),
-		onEditLicenseKeyGroupClick: licenseKeyGroup => LicenseKeyGroupsActionHelper.openLicenseKeyGroupsEditor(dispatch, {licenseKeyGroup, licenseModelId, version}),
-		onDeleteLicenseKeyGroupClick: licenseKeyGroup => dispatch({
-			type: globalMoadlActions.GLOBAL_MODAL_WARNING,
-			data:{
-				msg: generateConfirmationMsg(licenseKeyGroup),
-				confirmationButtonText: i18n('Delete'),
-				title: i18n('Delete'),
-				onConfirmed: () => LicenseKeyGroupsActionHelper.deleteLicenseKeyGroup(dispatch, {licenseModelId, licenseKeyGroupId:licenseKeyGroup.id, version})
-			}
-		})
-	};
+const mapActionsToProps = (dispatch, { licenseModelId, version }) => {
+    return {
+        onAddLicenseKeyGroupClick: () =>
+            LicenseKeyGroupsActionHelper.openLicenseKeyGroupsEditor(dispatch),
+        onEditLicenseKeyGroupClick: licenseKeyGroup =>
+            LicenseKeyGroupsActionHelper.openLicenseKeyGroupsEditor(dispatch, {
+                licenseKeyGroup,
+                licenseModelId,
+                version
+            }),
+        onDeleteLicenseKeyGroupClick: licenseKeyGroup =>
+            dispatch({
+                type: globalMoadlActions.GLOBAL_MODAL_WARNING,
+                data: {
+                    msg: generateConfirmationMsg(licenseKeyGroup),
+                    confirmationButtonText: i18n('Delete'),
+                    title: i18n('Delete'),
+                    onConfirmed: () =>
+                        LicenseKeyGroupsActionHelper.deleteLicenseKeyGroup(
+                            dispatch,
+                            {
+                                licenseModelId,
+                                licenseKeyGroupId: licenseKeyGroup.id,
+                                version
+                            }
+                        )
+                }
+            })
+    };
 };
 
-export default connect(mapStateToProps, mapActionsToProps)(LicenseKeyGroupsListEditorView);
+export default connect(mapStateToProps, mapActionsToProps)(
+    LicenseKeyGroupsListEditorView
+);
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 5a98b7f575..4c8c8cee6f 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsListEditorView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsListEditorView.jsx
@@ -21,143 +21,205 @@ import ListEditorView from 'nfvo-components/listEditor/ListEditorView.jsx';
 import ListEditorItemView from 'nfvo-components/listEditor/ListEditorItemView.jsx';
 
 import LicenseKeyGroupsEditor from './LicenseKeyGroupsEditor.js';
-import InputOptions, {other as optionInputOther} from 'nfvo-components/input/validation/InputOptions.jsx';
-import {optionsInputValues} from './LicenseKeyGroupsConstants';
+import InputOptions, {
+    other as optionInputOther
+} from 'nfvo-components/input/validation/InputOptions.jsx';
+import { optionsInputValues } from './LicenseKeyGroupsConstants';
 
 class LicenseKeyGroupsListEditorView extends React.Component {
-	static propTypes = {
-		vendorName: PropTypes.string,
-		licenseModelId: PropTypes.string.isRequired,
-		licenseKeyGroupsList: PropTypes.array,
-		isReadOnlyMode: PropTypes.bool.isRequired,
-		isDisplayModal: PropTypes.bool,
-		isModalInEditMode: PropTypes.bool,
-		onAddLicenseKeyGroupClick: PropTypes.func,
-		onEditLicenseKeyGroupClick: PropTypes.func,
-		onDeleteLicenseKeyGroupClick: PropTypes.func
-	};
-
-	static defaultProps = {
-		licenseKeyGroupsList: []
-	};
-
-	state = {
-		localFilter: ''
-	};
-
-	render() {
-		let {licenseModelId, isReadOnlyMode, isDisplayModal, isModalInEditMode, version} = this.props;
-		let {onAddLicenseKeyGroupClick} = this.props;
-		const {localFilter} = this.state;
-
-		return (
-			<div className='license-model-list-editor license-key-groups-list-editor'>
-				<ListEditorView
-					title={i18n('License Key Groups')}
-					plusButtonTitle={i18n('Add License Key Group')}
-					onAdd={onAddLicenseKeyGroupClick}
-					filterValue={localFilter}
-					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='onborading-modal license-model-modal license-key-groups-modal'>
-					<Modal.Header>
-						<Modal.Title>{`${isModalInEditMode ? i18n('Edit License Key Group') : i18n('Create New License Key Group')}`}</Modal.Title>
-					</Modal.Header>
-					<Modal.Body>
-						{
-							isDisplayModal && (
-								<LicenseKeyGroupsEditor version={version} licenseModelId={licenseModelId} isReadOnlyMode={isReadOnlyMode}/>
-							)
-						}
-					</Modal.Body>
-				</Modal>
-			</div>
-		);
-	}
-
-	filterList() {
-		let {licenseKeyGroupsList} = this.props;
-		let {localFilter} = this.state;
-		if (localFilter.trim()) {
-			const filter = new RegExp(escape(localFilter), 'i');
-			return licenseKeyGroupsList.filter(({name = '', description = '', operationalScope = '', type = ''}) => {
-				return escape(name).match(filter) || escape(description).match(filter) || escape(this.extractValue(operationalScope)).match(filter) || escape(type).match(filter);
-			});
-		}
-		else {
-			return licenseKeyGroupsList;
-		}
-	}
-
-	renderLicenseKeyGroupListItem(licenseKeyGroup, isReadOnlyMode) {
-		let {id, name, description, operationalScope, type} = licenseKeyGroup;
-		let {onEditLicenseKeyGroupClick, onDeleteLicenseKeyGroupClick} = this.props;
-		return (
-			<ListEditorItemView
-				key={id}
-				onSelect={() => onEditLicenseKeyGroupClick(licenseKeyGroup)}
-				onDelete={() => onDeleteLicenseKeyGroupClick(licenseKeyGroup)}
-				className='list-editor-item-view'
-				isReadOnlyMode={isReadOnlyMode}>
-				<div className='list-editor-item-view-field'>
-					<div className='title'>{i18n('Name')}</div>
-					<div className='text name'>{name}</div>
-				</div>
-
-				<div className='list-editor-item-view-field'>
-					<div className='title'>{i18n('Operational Scope')}</div>
-					<div className='text operational-scope'>{operationalScope && this.getOperationalScopes(operationalScope)}</div>
-
-					<div className='title'>{i18n('Type')}</div>
-					<div className='text type'>{InputOptions.getTitleByName(optionsInputValues, type)}</div>
-				</div>
-				<div className='list-editor-item-view-field'>
-					<div className='title'>{i18n('Description')}</div>
-					<div className='text description'>{description}</div>
-				</div>
-			</ListEditorItemView>
-		);
-	}
-
-	getOperationalScopes(operationalScope) {
-
-		if (operationalScope.choices && operationalScope.choices.toString() === i18n(optionInputOther.OTHER)) {
-			return operationalScope.other;
-		} else if (operationalScope.choices) {
-			let allOpScopes = '';
-			for (let opScope of operationalScope.choices) {
-				allOpScopes += allOpScopes === '' ? InputOptions.getTitleByName(optionsInputValues, opScope) : `, ${InputOptions.getTitleByName(optionsInputValues, opScope)}`;
-			}
-			return allOpScopes;
-		} else {
-			return '';
-		}
-	}
-
-	extractValue(item) {
-		if (item === undefined) {
-			return '';
-		} //TODO fix it sooner rather than later
-
-		return item ? item.choice === optionInputOther.OTHER ? item.other : InputOptions.getTitleByName(optionsInputValues, item.choice) : '';
-	}
+    static propTypes = {
+        vendorName: PropTypes.string,
+        licenseModelId: PropTypes.string.isRequired,
+        licenseKeyGroupsList: PropTypes.array,
+        isReadOnlyMode: PropTypes.bool.isRequired,
+        isDisplayModal: PropTypes.bool,
+        isModalInEditMode: PropTypes.bool,
+        onAddLicenseKeyGroupClick: PropTypes.func,
+        onEditLicenseKeyGroupClick: PropTypes.func,
+        onDeleteLicenseKeyGroupClick: PropTypes.func
+    };
+
+    static defaultProps = {
+        licenseKeyGroupsList: []
+    };
+
+    state = {
+        localFilter: ''
+    };
+
+    render() {
+        let {
+            licenseModelId,
+            isReadOnlyMode,
+            isDisplayModal,
+            isModalInEditMode,
+            version
+        } = this.props;
+        let { onAddLicenseKeyGroupClick } = this.props;
+        const { localFilter } = this.state;
+
+        return (
+            <div className="license-model-list-editor license-key-groups-list-editor">
+                <ListEditorView
+                    title={i18n('License Key Groups')}
+                    plusButtonTitle={i18n('Add License Key Group')}
+                    onAdd={onAddLicenseKeyGroupClick}
+                    filterValue={localFilter}
+                    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="onborading-modal license-model-modal license-key-groups-modal">
+                    <Modal.Header>
+                        <Modal.Title>{`${
+                            isModalInEditMode
+                                ? i18n('Edit License Key Group')
+                                : i18n('Create New License Key Group')
+                        }`}</Modal.Title>
+                    </Modal.Header>
+                    <Modal.Body>
+                        {isDisplayModal && (
+                            <LicenseKeyGroupsEditor
+                                version={version}
+                                licenseModelId={licenseModelId}
+                                isReadOnlyMode={isReadOnlyMode}
+                            />
+                        )}
+                    </Modal.Body>
+                </Modal>
+            </div>
+        );
+    }
+
+    filterList() {
+        let { licenseKeyGroupsList } = this.props;
+        let { localFilter } = this.state;
+        if (localFilter.trim()) {
+            const filter = new RegExp(escape(localFilter), 'i');
+            return licenseKeyGroupsList.filter(
+                ({
+                    name = '',
+                    description = '',
+                    operationalScope = '',
+                    type = ''
+                }) => {
+                    return (
+                        escape(name).match(filter) ||
+                        escape(description).match(filter) ||
+                        escape(this.extractValue(operationalScope)).match(
+                            filter
+                        ) ||
+                        escape(type).match(filter)
+                    );
+                }
+            );
+        } else {
+            return licenseKeyGroupsList;
+        }
+    }
+
+    renderLicenseKeyGroupListItem(licenseKeyGroup, isReadOnlyMode) {
+        let { id, name, description, operationalScope, type } = licenseKeyGroup;
+        let {
+            onEditLicenseKeyGroupClick,
+            onDeleteLicenseKeyGroupClick
+        } = this.props;
+        return (
+            <ListEditorItemView
+                key={id}
+                onSelect={() => onEditLicenseKeyGroupClick(licenseKeyGroup)}
+                onDelete={() => onDeleteLicenseKeyGroupClick(licenseKeyGroup)}
+                className="list-editor-item-view"
+                isReadOnlyMode={isReadOnlyMode}>
+                <div className="list-editor-item-view-field">
+                    <div className="title">{i18n('Name')}</div>
+                    <div className="text name">{name}</div>
+                </div>
+
+                <div className="list-editor-item-view-field">
+                    <div className="title">{i18n('Operational Scope')}</div>
+                    <div className="text operational-scope">
+                        {operationalScope &&
+                            this.getOperationalScopes(operationalScope)}
+                    </div>
+
+                    <div className="title">{i18n('Type')}</div>
+                    <div className="text type">
+                        {InputOptions.getTitleByName(optionsInputValues, type)}
+                    </div>
+                </div>
+                <div className="list-editor-item-view-field">
+                    <div className="title">{i18n('Description')}</div>
+                    <div className="text description">{description}</div>
+                </div>
+            </ListEditorItemView>
+        );
+    }
+
+    getOperationalScopes(operationalScope) {
+        if (
+            operationalScope.choices &&
+            operationalScope.choices.toString() === i18n(optionInputOther.OTHER)
+        ) {
+            return operationalScope.other;
+        } else if (operationalScope.choices) {
+            let allOpScopes = '';
+            for (let opScope of operationalScope.choices) {
+                allOpScopes +=
+                    allOpScopes === ''
+                        ? InputOptions.getTitleByName(
+                              optionsInputValues,
+                              opScope
+                          )
+                        : `, ${InputOptions.getTitleByName(
+                              optionsInputValues,
+                              opScope
+                          )}`;
+            }
+            return allOpScopes;
+        } else {
+            return '';
+        }
+    }
+
+    extractValue(item) {
+        if (item === undefined) {
+            return '';
+        } //TODO fix it sooner rather than later
+
+        return item
+            ? item.choice === optionInputOther.OTHER
+              ? item.other
+              : InputOptions.getTitleByName(optionsInputValues, item.choice)
+            : '';
+    }
 }
 
 export default LicenseKeyGroupsListEditorView;
 
 export function generateConfirmationMsg(licenseKeyGroupToDelete) {
-	let name = licenseKeyGroupToDelete ? licenseKeyGroupToDelete.name : '';
-	let msg = i18n('Are you sure you want to delete "{name}"?', {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>
-	);
+    let name = licenseKeyGroupToDelete ? licenseKeyGroupToDelete.name : '';
+    let msg = i18n('Are you sure you want to delete "{name}"?', { 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 1f0a64e295..1cd1da0d82 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsListReducer.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/licenseKeyGroups/LicenseKeyGroupsListReducer.js
@@ -13,20 +13,29 @@
  * or implied. See the License for the specific language governing
  * permissions and limitations under the License.
  */
-import {actionTypes} from './LicenseKeyGroupsConstants.js';
+import { actionTypes } from './LicenseKeyGroupsConstants.js';
 export default (state = [], action) => {
-	switch (action.type) {
-		case actionTypes.LICENSE_KEY_GROUPS_LIST_LOADED:
-			return [...action.response.results];
-		case actionTypes.DELETE_LICENSE_KEY_GROUP:
-			return state.filter(licenseKeyGroup => licenseKeyGroup.id !== action.licenseKeyGroupId);
-		case actionTypes.ADD_LICENSE_KEY_GROUP:
-			return [...state, action.licenseKeyGroup];
-		case actionTypes.EDIT_LICENSE_KEY_GROUP:
-			const indexForEdit = state.findIndex(licenseKeyGroup => licenseKeyGroup.id === action.licenseKeyGroup.id);
-			return [...state.slice(0, indexForEdit), action.licenseKeyGroup, ...state.slice(indexForEdit + 1)];
-		default:
-			return state;
-	}
+    switch (action.type) {
+        case actionTypes.LICENSE_KEY_GROUPS_LIST_LOADED:
+            return [...action.response.results];
+        case actionTypes.DELETE_LICENSE_KEY_GROUP:
+            return state.filter(
+                licenseKeyGroup =>
+                    licenseKeyGroup.id !== action.licenseKeyGroupId
+            );
+        case actionTypes.ADD_LICENSE_KEY_GROUP:
+            return [...state, action.licenseKeyGroup];
+        case actionTypes.EDIT_LICENSE_KEY_GROUP:
+            const indexForEdit = state.findIndex(
+                licenseKeyGroup =>
+                    licenseKeyGroup.id === action.licenseKeyGroup.id
+            );
+            return [
+                ...state.slice(0, indexForEdit),
+                action.licenseKeyGroup,
+                ...state.slice(indexForEdit + 1)
+            ];
+        default:
+            return state;
+    }
 };
-
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditor.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditor.js
index d483383472..76ea36db98 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditor.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditor.js
@@ -1,25 +1,30 @@
-import {connect} from 'react-redux';
+import { connect } from 'react-redux';
 import ValidationHelper from 'sdc-app/common/helpers/ValidationHelper.js';
 import LimitEditor from './LimitEditor.jsx';
 
-const mapStateToProps = ({licenseModel: {limitEditor}}) => {
+const mapStateToProps = ({ licenseModel: { limitEditor } }) => {
+    let { data, genericFieldInfo, formReady } = limitEditor;
+    let isFormValid = ValidationHelper.checkFormValid(genericFieldInfo);
 
-	let {data, genericFieldInfo, formReady} = limitEditor;	
-	let isFormValid = ValidationHelper.checkFormValid(genericFieldInfo);
-
-	return {
-		data,		
-		genericFieldInfo,
-		isFormValid,
-		formReady
-	};
+    return {
+        data,
+        genericFieldInfo,
+        isFormValid,
+        formReady
+    };
 };
 
-const mapActionsToProps = (dispatch) => {
-	return {
-		onDataChanged: (deltaData, formName, customValidations) => ValidationHelper.dataChanged(dispatch, {deltaData, formName, customValidations}),
-		onValidateForm: (formName) => ValidationHelper.validateForm(dispatch, formName)
-	};
+const mapActionsToProps = dispatch => {
+    return {
+        onDataChanged: (deltaData, formName, customValidations) =>
+            ValidationHelper.dataChanged(dispatch, {
+                deltaData,
+                formName,
+                customValidations
+            }),
+        onValidateForm: formName =>
+            ValidationHelper.validateForm(dispatch, formName)
+    };
 };
 
-export default connect(mapStateToProps, mapActionsToProps)(LimitEditor);
\ No newline at end of file
+export default connect(mapStateToProps, mapActionsToProps)(LimitEditor);
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditor.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditor.jsx
index 54f057eaa4..0d1d4eaf10 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditor.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditor.jsx
@@ -5,206 +5,349 @@ 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 {LIMITS_FORM_NAME, selectValues} from './LimitEditorConstants.js';
+import { LIMITS_FORM_NAME, selectValues } from './LimitEditorConstants.js';
 import Button from 'sdc-ui/lib/react/Button.js';
 import Validator from 'nfvo-utils/Validator.js';
-import {other as optionInputOther} from 'nfvo-components/input/validation/InputOptions.jsx';
+import { other as optionInputOther } from 'nfvo-components/input/validation/InputOptions.jsx';
 import InputOptions from 'nfvo-components/input/validation/InputOptions.jsx';
 
 const LimitPropType = PropTypes.shape({
-	id: PropTypes.string,
-	name: PropTypes.string,
-	description: PropTypes.string,
-	metric: PropTypes.shape({
-		choice: PropTypes.string,
-		other: PropTypes.string
-	}),
-	value: PropTypes.string,
-	aggregationFunction: PropTypes.string,
-	time: PropTypes.string,
-	unit: PropTypes.shape({
-		choice: PropTypes.string,
-		other: PropTypes.string
-	})
+    id: PropTypes.string,
+    name: PropTypes.string,
+    description: PropTypes.string,
+    metric: PropTypes.shape({
+        choice: PropTypes.string,
+        other: PropTypes.string
+    }),
+    value: PropTypes.string,
+    aggregationFunction: PropTypes.string,
+    time: PropTypes.string,
+    unit: PropTypes.shape({
+        choice: PropTypes.string,
+        other: PropTypes.string
+    })
 });
 
 class LimitEditor extends React.Component {
-	static propTypes = {
-		data: LimitPropType,
-		limitsNames: PropTypes.object,
-		isReadOnlyMode: PropTypes.bool,
-		isFormValid: PropTypes.bool,
-		formReady: PropTypes.bool,
-		genericFieldInfo: PropTypes.object.isRequired,
-		onDataChanged: PropTypes.func.isRequired,
-		onSubmit: PropTypes.func.isRequired,
-		onValidateForm: PropTypes.func.isRequired,
-		onCancel: PropTypes.func.isRequired
-	};
+    static propTypes = {
+        data: LimitPropType,
+        limitsNames: PropTypes.object,
+        isReadOnlyMode: PropTypes.bool,
+        isFormValid: PropTypes.bool,
+        formReady: PropTypes.bool,
+        genericFieldInfo: PropTypes.object.isRequired,
+        onDataChanged: PropTypes.func.isRequired,
+        onSubmit: PropTypes.func.isRequired,
+        onValidateForm: PropTypes.func.isRequired,
+        onCancel: PropTypes.func.isRequired
+    };
 
-	componentDidUpdate(prevProps) {
-		if (this.props.formReady && this.props.formReady !== prevProps.formReady) {
-			this.submit();
-		}
-	}
+    componentDidUpdate(prevProps) {
+        if (
+            this.props.formReady &&
+            this.props.formReady !== prevProps.formReady
+        ) {
+            this.submit();
+        }
+    }
 
-	render() {
-		let {data = {}, onDataChanged, isReadOnlyMode, genericFieldInfo, onCancel, isFormValid, formReady, onValidateForm} = this.props;
-		let {name, description, metric, value, aggregationFunction, time, unit} = data;
-		return (
-			<div className='limit-editor'>
-			{!data.id &&
-			<div className='limit-editor-title'>
-				{data.name ? data.name : i18n('NEW LIMIT')}
-			</div>}
-			{
-				genericFieldInfo &&
-				<Form
-					ref='validationForm'
-					hasButtons={false}
-					isValid={isFormValid}
-					formReady={formReady}
-					onValidateForm={() => onValidateForm(LIMITS_FORM_NAME) }
-					labledButtons={false}
-					isReadOnlyMode={isReadOnlyMode}
-					className='limit-editor-form'>
-					<GridSection className='limit-editor-form-grid-section' hasLastColSet>
-						<GridItem colSpan={2}>
-							<Input
-								onChange={name => onDataChanged({name}, LIMITS_FORM_NAME, {name: () => this.validateName(name)})}
-								label={i18n('Name')}
-								data-test-id='limit-editor-name'
-								value={name}
-								isValid={genericFieldInfo.name.isValid}
-								errorText={genericFieldInfo.name.errorText}
-								isRequired={true}
-								type='text'/>
-						</GridItem>
-						<GridItem colSpan={2} lastColInRow>
-							<Input
-								onChange={description => onDataChanged({description}, LIMITS_FORM_NAME)}
-								label={i18n('Description')}
-								data-test-id='limit-editor-description'
-								value={description}
-								isValid={genericFieldInfo.description.isValid}
-								errorText={genericFieldInfo.description.errorText}
-								isRequired={false}
-								type='text'/>
-						</GridItem>
-						<GridItem colSpan={2}>
-							<InputOptions
-								onInputChange={()=>{}}
-								isMultiSelect={false}
-								isRequired={true}
-								onEnumChange={metric => onDataChanged({metric:{choice: metric, other: ''}},
-									LIMITS_FORM_NAME)}
-								onOtherChange={metric => onDataChanged({metric:{choice: optionInputOther.OTHER,
-									other: metric}}, LIMITS_FORM_NAME)}
-								label={i18n('Metric')}
-								data-test-id='limit-editor-metric'
-								type='select'
-								required={true}
-								selectedEnum={metric && metric.choice}
-								otherValue={metric && metric.other}
-								values={selectValues.METRIC}
-								isValid={genericFieldInfo.metric.isValid}
-								errorText={genericFieldInfo.metric.errorText} />
-						</GridItem>
-						<GridItem>
-							<Input
-								onChange={value => onDataChanged({value}, LIMITS_FORM_NAME)}
-								label={i18n('Metric value')}
-								data-test-id='limit-editor-metric-value'
-								value={value}
-								isValid={genericFieldInfo.value.isValid}
-								errorText={genericFieldInfo.value.errorText}
-								isRequired={true}
-								type='text'/>
-						</GridItem>
-						<GridItem lastColInRow>
-							<InputOptions
-								onInputChange={()=>{}}
-								isMultiSelect={false}
-								isRequired={false}
-								onEnumChange={unit => onDataChanged({unit:{choice: unit, other: ''}},
-									LIMITS_FORM_NAME)}
-								onOtherChange={unit => onDataChanged({unit:{choice: optionInputOther.OTHER,
-									other: unit}}, LIMITS_FORM_NAME)}
-								label={i18n('Units')}
-								data-test-id='limit-editor-units'
-								type='select'
-								required={false}
-								selectedEnum={unit && unit.choice}
-								otherValue={unit && unit.other}
-								values={selectValues.UNIT}
-								isValid={genericFieldInfo.unit.isValid}
-								errorText={genericFieldInfo.unit.errorText} />
-						</GridItem>
-						<GridItem colSpan={2}>
-							<Input
-								onChange={e => {
-									const selectedIndex = e.target.selectedIndex;
-									const val = e.target.options[selectedIndex].value;
-									onDataChanged({aggregationFunction: val}, LIMITS_FORM_NAME);}
-								}
-								value={aggregationFunction}
-								label={i18n('Aggregation Function')}
-								data-test-id='limit-editor-aggregation-function'
-								isValid={genericFieldInfo.aggregationFunction.isValid}
-								errorText={genericFieldInfo.aggregationFunction.errorText}
-								groupClassName='bootstrap-input-options'
-								className='input-options-select'
-								type='select' >
-								{selectValues.AGGREGATION_FUNCTION.map(mtype =>
-									<option key={mtype.enum} value={mtype.enum}>{`${mtype.title}`}</option>)}
-							</Input>
-						</GridItem>
-						<GridItem>
-							<Input
-								onChange={e => {
-									const selectedIndex = e.target.selectedIndex;
-									const val = e.target.options[selectedIndex].value;
-									onDataChanged({time: val}, LIMITS_FORM_NAME);}
-								}
-								value={time}
-								label={i18n('Time')}
-								data-test-id='limit-editor-time'
-								isValid={genericFieldInfo.time.isValid}
-								errorText={genericFieldInfo.time.errorText}
-								groupClassName='bootstrap-input-options'
-								className='input-options-select'
-								type='select' >
-								{selectValues.TIME.map(mtype =>
-									<option key={mtype.enum} value={mtype.enum}>{`${mtype.title}`}</option>)}
-							</Input>
-						</GridItem>
-					</GridSection>
-					<GridSection className='limit-editor-buttons'>
-						<Button btnType='outline' disabled={!isFormValid || isReadOnlyMode} onClick={() => this.submit()} type='reset'>{i18n('Save')}</Button>
-						<Button btnType='outline' color='gray' onClick={onCancel} type='reset'>{i18n('Cancel')}</Button>
-					</GridSection>
-				</Form>
-			}
-			</div>
-		);
-	}
+    render() {
+        let {
+            data = {},
+            onDataChanged,
+            isReadOnlyMode,
+            genericFieldInfo,
+            onCancel,
+            isFormValid,
+            formReady,
+            onValidateForm
+        } = this.props;
+        let {
+            name,
+            description,
+            metric,
+            value,
+            aggregationFunction,
+            time,
+            unit
+        } = data;
+        return (
+            <div className="limit-editor">
+                {!data.id && (
+                    <div className="limit-editor-title">
+                        {data.name ? data.name : i18n('NEW LIMIT')}
+                    </div>
+                )}
+                {genericFieldInfo && (
+                    <Form
+                        ref="validationForm"
+                        hasButtons={false}
+                        isValid={isFormValid}
+                        formReady={formReady}
+                        onValidateForm={() => onValidateForm(LIMITS_FORM_NAME)}
+                        labledButtons={false}
+                        isReadOnlyMode={isReadOnlyMode}
+                        className="limit-editor-form">
+                        <GridSection
+                            className="limit-editor-form-grid-section"
+                            hasLastColSet>
+                            <GridItem colSpan={2}>
+                                <Input
+                                    onChange={name =>
+                                        onDataChanged(
+                                            { name },
+                                            LIMITS_FORM_NAME,
+                                            {
+                                                name: () =>
+                                                    this.validateName(name)
+                                            }
+                                        )
+                                    }
+                                    label={i18n('Name')}
+                                    data-test-id="limit-editor-name"
+                                    value={name}
+                                    isValid={genericFieldInfo.name.isValid}
+                                    errorText={genericFieldInfo.name.errorText}
+                                    isRequired={true}
+                                    type="text"
+                                />
+                            </GridItem>
+                            <GridItem colSpan={2} lastColInRow>
+                                <Input
+                                    onChange={description =>
+                                        onDataChanged(
+                                            { description },
+                                            LIMITS_FORM_NAME
+                                        )
+                                    }
+                                    label={i18n('Description')}
+                                    data-test-id="limit-editor-description"
+                                    value={description}
+                                    isValid={
+                                        genericFieldInfo.description.isValid
+                                    }
+                                    errorText={
+                                        genericFieldInfo.description.errorText
+                                    }
+                                    isRequired={false}
+                                    type="text"
+                                />
+                            </GridItem>
+                            <GridItem colSpan={2}>
+                                <InputOptions
+                                    onInputChange={() => {}}
+                                    isMultiSelect={false}
+                                    isRequired={true}
+                                    onEnumChange={metric =>
+                                        onDataChanged(
+                                            {
+                                                metric: {
+                                                    choice: metric,
+                                                    other: ''
+                                                }
+                                            },
+                                            LIMITS_FORM_NAME
+                                        )
+                                    }
+                                    onOtherChange={metric =>
+                                        onDataChanged(
+                                            {
+                                                metric: {
+                                                    choice:
+                                                        optionInputOther.OTHER,
+                                                    other: metric
+                                                }
+                                            },
+                                            LIMITS_FORM_NAME
+                                        )
+                                    }
+                                    label={i18n('Metric')}
+                                    data-test-id="limit-editor-metric"
+                                    type="select"
+                                    required={true}
+                                    selectedEnum={metric && metric.choice}
+                                    otherValue={metric && metric.other}
+                                    values={selectValues.METRIC}
+                                    isValid={genericFieldInfo.metric.isValid}
+                                    errorText={
+                                        genericFieldInfo.metric.errorText
+                                    }
+                                />
+                            </GridItem>
+                            <GridItem>
+                                <Input
+                                    onChange={value =>
+                                        onDataChanged(
+                                            { value },
+                                            LIMITS_FORM_NAME
+                                        )
+                                    }
+                                    label={i18n('Metric value')}
+                                    data-test-id="limit-editor-metric-value"
+                                    value={value}
+                                    isValid={genericFieldInfo.value.isValid}
+                                    errorText={genericFieldInfo.value.errorText}
+                                    isRequired={true}
+                                    type="text"
+                                />
+                            </GridItem>
+                            <GridItem lastColInRow>
+                                <InputOptions
+                                    onInputChange={() => {}}
+                                    isMultiSelect={false}
+                                    isRequired={false}
+                                    onEnumChange={unit =>
+                                        onDataChanged(
+                                            {
+                                                unit: {
+                                                    choice: unit,
+                                                    other: ''
+                                                }
+                                            },
+                                            LIMITS_FORM_NAME
+                                        )
+                                    }
+                                    onOtherChange={unit =>
+                                        onDataChanged(
+                                            {
+                                                unit: {
+                                                    choice:
+                                                        optionInputOther.OTHER,
+                                                    other: unit
+                                                }
+                                            },
+                                            LIMITS_FORM_NAME
+                                        )
+                                    }
+                                    label={i18n('Units')}
+                                    data-test-id="limit-editor-units"
+                                    type="select"
+                                    required={false}
+                                    selectedEnum={unit && unit.choice}
+                                    otherValue={unit && unit.other}
+                                    values={selectValues.UNIT}
+                                    isValid={genericFieldInfo.unit.isValid}
+                                    errorText={genericFieldInfo.unit.errorText}
+                                />
+                            </GridItem>
+                            <GridItem colSpan={2}>
+                                <Input
+                                    onChange={e => {
+                                        const selectedIndex =
+                                            e.target.selectedIndex;
+                                        const val =
+                                            e.target.options[selectedIndex]
+                                                .value;
+                                        onDataChanged(
+                                            { aggregationFunction: val },
+                                            LIMITS_FORM_NAME
+                                        );
+                                    }}
+                                    value={aggregationFunction}
+                                    label={i18n('Aggregation Function')}
+                                    data-test-id="limit-editor-aggregation-function"
+                                    isValid={
+                                        genericFieldInfo.aggregationFunction
+                                            .isValid
+                                    }
+                                    errorText={
+                                        genericFieldInfo.aggregationFunction
+                                            .errorText
+                                    }
+                                    groupClassName="bootstrap-input-options"
+                                    className="input-options-select"
+                                    type="select">
+                                    {selectValues.AGGREGATION_FUNCTION.map(
+                                        mtype => (
+                                            <option
+                                                key={mtype.enum}
+                                                value={mtype.enum}>{`${
+                                                mtype.title
+                                            }`}</option>
+                                        )
+                                    )}
+                                </Input>
+                            </GridItem>
+                            <GridItem>
+                                <Input
+                                    onChange={e => {
+                                        const selectedIndex =
+                                            e.target.selectedIndex;
+                                        const val =
+                                            e.target.options[selectedIndex]
+                                                .value;
+                                        onDataChanged(
+                                            { time: val },
+                                            LIMITS_FORM_NAME
+                                        );
+                                    }}
+                                    value={time}
+                                    label={i18n('Time')}
+                                    data-test-id="limit-editor-time"
+                                    isValid={genericFieldInfo.time.isValid}
+                                    errorText={genericFieldInfo.time.errorText}
+                                    groupClassName="bootstrap-input-options"
+                                    className="input-options-select"
+                                    type="select">
+                                    {selectValues.TIME.map(mtype => (
+                                        <option
+                                            key={mtype.enum}
+                                            value={mtype.enum}>{`${
+                                            mtype.title
+                                        }`}</option>
+                                    ))}
+                                </Input>
+                            </GridItem>
+                        </GridSection>
+                        <GridSection className="limit-editor-buttons">
+                            <Button
+                                btnType="outline"
+                                disabled={!isFormValid || isReadOnlyMode}
+                                onClick={() => this.submit()}
+                                type="reset">
+                                {i18n('Save')}
+                            </Button>
+                            <Button
+                                btnType="outline"
+                                color="gray"
+                                onClick={onCancel}
+                                type="reset">
+                                {i18n('Cancel')}
+                            </Button>
+                        </GridSection>
+                    </Form>
+                )}
+            </div>
+        );
+    }
 
-	validateName(value) {
-		const {data: {id}, limitsNames} = this.props;
-		const isExists = Validator.isItemNameAlreadyExistsInList({itemId: id, itemName: value, list: limitsNames});
+    validateName(value) {
+        const { data: { id }, limitsNames } = this.props;
+        const isExists = Validator.isItemNameAlreadyExistsInList({
+            itemId: id,
+            itemName: value,
+            list: limitsNames
+        });
 
-		return !isExists ?  {isValid: true, errorText: ''} :
-		{isValid: false, errorText: i18n('Limit by the name \'' + value + '\' already exists. Limit name must be unique')};
-	}
+        return !isExists
+            ? { isValid: true, errorText: '' }
+            : {
+                  isValid: false,
+                  errorText: i18n(
+                      "Limit by the name '" +
+                          value +
+                          "' already exists. Limit name must be unique"
+                  )
+              };
+    }
 
-
-	submit() {
-		if (!this.props.formReady) {
-			this.props.onValidateForm(LIMITS_FORM_NAME);
-		} else {
-			this.props.onSubmit();
-		}
-	}
+    submit() {
+        if (!this.props.formReady) {
+            this.props.onValidateForm(LIMITS_FORM_NAME);
+        } else {
+            this.props.onSubmit();
+        }
+    }
 }
 
 export default LimitEditor;
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditorActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditorActionHelper.js
index 8ac845a1a7..a275808d01 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditorActionHelper.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditorActionHelper.js
@@ -14,41 +14,47 @@
  * permissions and limitations under the License.
  */
 
-import {actionTypes, selectValues} from './LimitEditorConstants.js';
-import {other as optionInputOther} from 'nfvo-components/input/validation/InputOptions.jsx';
-
+import { actionTypes, selectValues } from './LimitEditorConstants.js';
+import { other as optionInputOther } from 'nfvo-components/input/validation/InputOptions.jsx';
 
 const LimitEditorActionHelper = {
-	openLimitsEditor(dispatch, {limit}) {
-		let modifiedLimit = {...limit};
-		if (limit && limit.metric) {
-			modifiedLimit.metric = LimitEditorActionHelper.createChoiceObject(modifiedLimit.metric, selectValues.METRIC);
-		}
-		if (limit && limit.unit) {
-			modifiedLimit.unit = LimitEditorActionHelper.createChoiceObject(modifiedLimit.unit, selectValues.UNIT);
-		}
-		dispatch({type: actionTypes.OPEN, limitItem: modifiedLimit});
-	},
+    openLimitsEditor(dispatch, { limit }) {
+        let modifiedLimit = { ...limit };
+        if (limit && limit.metric) {
+            modifiedLimit.metric = LimitEditorActionHelper.createChoiceObject(
+                modifiedLimit.metric,
+                selectValues.METRIC
+            );
+        }
+        if (limit && limit.unit) {
+            modifiedLimit.unit = LimitEditorActionHelper.createChoiceObject(
+                modifiedLimit.unit,
+                selectValues.UNIT
+            );
+        }
+        dispatch({ type: actionTypes.OPEN, limitItem: modifiedLimit });
+    },
 
-	closeLimitsEditor(dispatch) {
-		dispatch({type: actionTypes.CLOSE});
-	},
+    closeLimitsEditor(dispatch) {
+        dispatch({ type: actionTypes.CLOSE });
+    },
 
-	createChoiceObject(value, optionsList) {
-		let option = optionsList.find(function(item) { return item.enum === value; });
-		if (!option) {
-			return {
-				choice: optionInputOther.OTHER,
-				other: value
-			};
-		}
-		else {
-			return {
-				choice: value,
-				other: ''
-			};
-		}
-	}
+    createChoiceObject(value, optionsList) {
+        let option = optionsList.find(function(item) {
+            return item.enum === value;
+        });
+        if (!option) {
+            return {
+                choice: optionInputOther.OTHER,
+                other: value
+            };
+        } else {
+            return {
+                choice: value,
+                other: ''
+            };
+        }
+    }
 };
 
 export default LimitEditorActionHelper;
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditorConstants.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditorConstants.js
index 9829e696c3..a916b9594c 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditorConstants.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditorConstants.js
@@ -3,62 +3,61 @@ import i18n from 'nfvo-utils/i18n/i18n.js';
 // import InputOptions, {other as optionInputOther} from 'nfvo-components/input/inputOptions/InputOptions.jsx';
 
 export const actionTypes = keyMirror({
-	OPEN: null,
-	CLOSE: null,
-	DATA_CHANGED: null,
+    OPEN: null,
+    CLOSE: null,
+    DATA_CHANGED: null
 });
 
 export const LIMITS_FORM_NAME = 'LIMITSFORM';
 
 export const selectValues = {
-	METRIC: [
-		{enum: '', title: i18n('please select…')},
-		{enum: 'BWTH', title: 'BWTH'},
-		{enum: 'Country', title: 'Country'},
-		{enum: 'Session', title: 'Session'},
-		{enum: 'LoB', title: 'LoB'},
-		{enum: 'Site', title: 'Site'},
-		{enum: 'Usage', title: 'Usage'}
-	],
-	UNIT: [
-		{enum: '', title: i18n('please select…')},
-		{enum: 'trunk', title: 'Trunks'},
-		{enum: 'user', title: 'Users'},
-		{enum: 'subscriber', title: 'Subscribers'},
-		{enum: 'session', title: 'Sessions'},
-		{enum: 'tenant', title: 'Tenants'},
-		{enum: 'token', title: 'Tokens'},
-		{enum: 'seats', title: 'Seats'},
-		{enum: 'TB', title: 'TB'},
-		{enum: 'GB', title: 'GB'},
-		{enum: 'MB', title: 'MB'}
-	],
-	AGGREGATION_FUNCTION: [
-		{enum: '', title: i18n('please select…')},
-		{enum: 'Peak', title: 'Peak'},
-		{enum: 'Average', title: 'Average'}
-	],
-	TIME: [
-		{enum: '', title: i18n('please select…')},
-		{enum: 'Day', title: 'Day'},
-		{enum: 'Month', title: 'Month'},
-		{enum: 'Hour', title: 'Hour'},
-		{enum: 'Minute', title: 'Minute'},
-		{enum: 'Second', title: 'Second'},
-		{enum: 'Milli-Second', title: 'Milli-Second'}
-	]
-
+    METRIC: [
+        { enum: '', title: i18n('please select…') },
+        { enum: 'BWTH', title: 'BWTH' },
+        { enum: 'Country', title: 'Country' },
+        { enum: 'Session', title: 'Session' },
+        { enum: 'LoB', title: 'LoB' },
+        { enum: 'Site', title: 'Site' },
+        { enum: 'Usage', title: 'Usage' }
+    ],
+    UNIT: [
+        { enum: '', title: i18n('please select…') },
+        { enum: 'trunk', title: 'Trunks' },
+        { enum: 'user', title: 'Users' },
+        { enum: 'subscriber', title: 'Subscribers' },
+        { enum: 'session', title: 'Sessions' },
+        { enum: 'tenant', title: 'Tenants' },
+        { enum: 'token', title: 'Tokens' },
+        { enum: 'seats', title: 'Seats' },
+        { enum: 'TB', title: 'TB' },
+        { enum: 'GB', title: 'GB' },
+        { enum: 'MB', title: 'MB' }
+    ],
+    AGGREGATION_FUNCTION: [
+        { enum: '', title: i18n('please select…') },
+        { enum: 'Peak', title: 'Peak' },
+        { enum: 'Average', title: 'Average' }
+    ],
+    TIME: [
+        { enum: '', title: i18n('please select…') },
+        { enum: 'Day', title: 'Day' },
+        { enum: 'Month', title: 'Month' },
+        { enum: 'Hour', title: 'Hour' },
+        { enum: 'Minute', title: 'Minute' },
+        { enum: 'Second', title: 'Second' },
+        { enum: 'Milli-Second', title: 'Milli-Second' }
+    ]
 };
 
 export const limitType = {
-	SERVICE_PROVIDER: 'ServiceProvider',
-	VENDOR: 'Vendor'
+    SERVICE_PROVIDER: 'ServiceProvider',
+    VENDOR: 'Vendor'
 };
 
 export const defaultState = {
-	LIMITS_EDITOR_DATA: {
-		metric: {choice: '', other: ''},
-	}
+    LIMITS_EDITOR_DATA: {
+        metric: { choice: '', other: '' }
+    }
 };
 
 export const NEW_LIMIT_TEMP_ID = 'NEW_LIMIT_TEMP_ID';
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditorReducer.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditorReducer.js
index 99d94a09cc..a0c3b0b1b1 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditorReducer.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitEditorReducer.js
@@ -14,58 +14,73 @@
  * permissions and limitations under the License.
  */
 
-import {actionTypes, LIMITS_FORM_NAME, defaultState} from './LimitEditorConstants.js';
-import {other as optionInputOther} from 'nfvo-components/input/validation/InputOptions.jsx';
+import {
+    actionTypes,
+    LIMITS_FORM_NAME,
+    defaultState
+} from './LimitEditorConstants.js';
+import { other as optionInputOther } from 'nfvo-components/input/validation/InputOptions.jsx';
 
 export default (state = {}, action) => {
-	switch (action.type) {
-		case actionTypes.OPEN:
-			return {
-				...state,
-				data: action.limitItem ? {...action.limitItem} : defaultState.LIMITS_EDITOR_DATA,
-				formReady: null,
-				formName: LIMITS_FORM_NAME,
-				genericFieldInfo: {
-					'description' : {
-						isValid: true,
-						errorText: '',
-						validations: [{type: 'maxLength', data: 1000}]
-					},
-					'name' : {
-						isValid: true,
-						errorText: '',
-						validations: [{type: 'required', data: true}, {type: 'maxLength', data: 120}]
-					},
-					'metric' : {
-						isValid: true,
-						errorText: '',
-						validations: [{type: 'required', data: true}, {type: 'requiredChoiceWithOther', data: optionInputOther.OTHER}]
-					},
-					'value' : {
-						isValid: true,
-						errorText: '',
-						validations: [{type: 'required', data: true}]
-					},
-					'unit' : {
-						isValid: true,
-						errorText: '',
-						validations: []
-					},
-					'aggregationFunction' : {
-						isValid: true,
-						errorText: '',
-						validations: []
-					},
-					'time' : {
-						isValid: true,
-						errorText: '',
-						validations: []
-					}
-				}
-			};
-		case actionTypes.CLOSE:
-			return {};
-		default:
-			return state;
-	}
+    switch (action.type) {
+        case actionTypes.OPEN:
+            return {
+                ...state,
+                data: action.limitItem
+                    ? { ...action.limitItem }
+                    : defaultState.LIMITS_EDITOR_DATA,
+                formReady: null,
+                formName: LIMITS_FORM_NAME,
+                genericFieldInfo: {
+                    description: {
+                        isValid: true,
+                        errorText: '',
+                        validations: [{ type: 'maxLength', data: 1000 }]
+                    },
+                    name: {
+                        isValid: true,
+                        errorText: '',
+                        validations: [
+                            { type: 'required', data: true },
+                            { type: 'maxLength', data: 120 }
+                        ]
+                    },
+                    metric: {
+                        isValid: true,
+                        errorText: '',
+                        validations: [
+                            { type: 'required', data: true },
+                            {
+                                type: 'requiredChoiceWithOther',
+                                data: optionInputOther.OTHER
+                            }
+                        ]
+                    },
+                    value: {
+                        isValid: true,
+                        errorText: '',
+                        validations: [{ type: 'required', data: true }]
+                    },
+                    unit: {
+                        isValid: true,
+                        errorText: '',
+                        validations: []
+                    },
+                    aggregationFunction: {
+                        isValid: true,
+                        errorText: '',
+                        validations: []
+                    },
+                    time: {
+                        isValid: true,
+                        errorText: '',
+                        validations: []
+                    }
+                }
+            };
+        case actionTypes.CLOSE:
+            return {};
+        default:
+            return state;
+    }
 };
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/Limits.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/Limits.jsx
index 4841d0335c..2667560935 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/Limits.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/Limits.jsx
@@ -18,99 +18,157 @@ import i18n from 'nfvo-utils/i18n/i18n.js';
 import ListEditorView from 'nfvo-components/listEditor/ListEditorView.jsx';
 import ListEditorItemView from 'nfvo-components/listEditor/ListEditorItemView.jsx';
 import LimitEditor from './LimitEditor.js';
-import {NEW_LIMIT_TEMP_ID, selectValues} from './LimitEditorConstants.js';
+import { NEW_LIMIT_TEMP_ID, selectValues } from './LimitEditorConstants.js';
 
-const LimitItem = ({isReadOnlyMode, limit, onDelete, onSelect}) => {
-	const {name, description, value, metric, aggregationFunction = '', time = ''} = limit;
-	const timeLabel = time ? `per ${time}` : '';
-	let metricOption = selectValues.METRIC.find(item => item.enum === metric);
-	metricOption = metricOption ? metricOption.title : metric;
+const LimitItem = ({ isReadOnlyMode, limit, onDelete, onSelect }) => {
+    const {
+        name,
+        description,
+        value,
+        metric,
+        aggregationFunction = '',
+        time = ''
+    } = limit;
+    const timeLabel = time ? `per ${time}` : '';
+    let metricOption = selectValues.METRIC.find(item => item.enum === metric);
+    metricOption = metricOption ? metricOption.title : metric;
 
-	return (
-		<ListEditorItemView
-			onDelete={onDelete}
-			onSelect={onSelect}
-			isReadOnlyMode={isReadOnlyMode}>
-			<div className='list-editor-item-view-field limit-name'>
-				<div className='text name'>{name}</div>
-			</div>
+    return (
+        <ListEditorItemView
+            onDelete={onDelete}
+            onSelect={onSelect}
+            isReadOnlyMode={isReadOnlyMode}>
+            <div className="list-editor-item-view-field limit-name">
+                <div className="text name">{name}</div>
+            </div>
 
-			<div className='list-editor-item-view-field limit-description'>
-				<div className='text description'>{description}</div>
-			</div>
+            <div className="list-editor-item-view-field limit-description">
+                <div className="text description">{description}</div>
+            </div>
 
-			<div className='list-editor-item-view-field limit-metric-details'>
-				<div className='text description'>{`${metricOption} ${value} ${aggregationFunction} ${timeLabel}`}</div>
-			</div>
-		</ListEditorItemView>
-	);
+            <div className="list-editor-item-view-field limit-metric-details">
+                <div className="text description">{`${metricOption} ${value} ${aggregationFunction} ${timeLabel}`}</div>
+            </div>
+        </ListEditorItemView>
+    );
 };
 
 class Limits extends React.Component {
+    state = {
+        localFilter: ''
+    };
 
+    render() {
+        const {
+            isReadOnlyMode = false,
+            limitEditor,
+            limitsList = [],
+            onCloseLimitEditor,
+            selectedLimit
+        } = this.props;
+        let limitsNames = {};
+        for (let i = 0; i < limitsList.length; i++) {
+            limitsNames[limitsList[i].name.toLowerCase()] = limitsList[i].id;
+        }
+        return (
+            <div className="license-model-limits-view">
+                <ListEditorView isReadOnlyMode={isReadOnlyMode}>
+                    {this.props.selectedLimit === NEW_LIMIT_TEMP_ID &&
+                        limitEditor.data && (
+                            <LimitEditor
+                                limitsNames={limitsNames}
+                                onCancel={onCloseLimitEditor}
+                                onSubmit={() => this.submit()}
+                                isReadOnlyMode={isReadOnlyMode}
+                            />
+                        )}
+                    {limitsList.length === 0 &&
+                        !limitEditor.data && (
+                            <div className="no-limits-text">
+                                {i18n('There are no limits')}
+                            </div>
+                        )}
+                    {limitsList.map(limit => (
+                        <div key={limit.id} className="limit-item-wrapper">
+                            <LimitItem
+                                onDelete={() => this.deleteLimit(limit)}
+                                onSelect={
+                                    selectedLimit
+                                        ? undefined
+                                        : () => this.props.onSelectLimit(limit)
+                                }
+                                clickable={!selectedLimit}
+                                isReadOnlyMode={isReadOnlyMode}
+                                limit={limit}
+                            />
+                            {limit.id === selectedLimit &&
+                                limitEditor.data && (
+                                    <LimitEditor
+                                        limitsNames={limitsNames}
+                                        onCancel={onCloseLimitEditor}
+                                        onSubmit={() => this.submit()}
+                                        isReadOnlyMode={isReadOnlyMode}
+                                    />
+                                )}
+                        </div>
+                    ))}
+                </ListEditorView>
+            </div>
+        );
+    }
 
-	state = {
-		localFilter: ''
-	};
+    submit() {
+        let {
+            onSubmit,
+            onCloseLimitEditor,
+            parent,
+            limitEditor,
+            licenseModelId,
+            version,
+            limitType
+        } = this.props;
+        onSubmit(
+            { type: limitType, ...limitEditor.data },
+            parent,
+            licenseModelId,
+            version
+        ).then(() => onCloseLimitEditor());
+    }
 
-	render() {
-		const {isReadOnlyMode = false, limitEditor, limitsList = [], onCloseLimitEditor, selectedLimit} = this.props;
-		let limitsNames = {};
-		for (let i = 0; i < limitsList.length; i++) {
-			limitsNames[limitsList[i].name.toLowerCase()] = limitsList[i].id;
-		}
-		return (
-			<div className='license-model-limits-view'>
-				<ListEditorView isReadOnlyMode={isReadOnlyMode}>
-					{this.props.selectedLimit === NEW_LIMIT_TEMP_ID && limitEditor.data &&
-						<LimitEditor limitsNames={limitsNames} onCancel={onCloseLimitEditor} onSubmit={ () => this.submit()} isReadOnlyMode={isReadOnlyMode}/>
-					}
-					{limitsList.length === 0 && !limitEditor.data && <div className='no-limits-text'>{i18n('There are no limits')}</div>}
-					{limitsList.map(limit =>
-					<div key={limit.id}  className='limit-item-wrapper'>
-						<LimitItem
-							onDelete={() => this.deleteLimit(limit)}
-							onSelect={selectedLimit ? undefined : () => this.props.onSelectLimit(limit)}
-							clickable={!selectedLimit}
-							isReadOnlyMode={isReadOnlyMode}
-							limit={limit}/>
-						{limit.id === selectedLimit &&  limitEditor.data &&
-							<LimitEditor
-								limitsNames={limitsNames}
-								onCancel={onCloseLimitEditor}
-								onSubmit={ () => this.submit()}
-								isReadOnlyMode={isReadOnlyMode} />
-						}
-					</div> )}
-				</ListEditorView>
+    deleteLimit(limit) {
+        let {
+            onDelete,
+            parent,
+            licenseModelId,
+            version,
+            onCloseLimitEditor,
+            selectedLimit
+        } = this.props;
+        onDelete({
+            limit,
+            parent,
+            licenseModelId,
+            version,
+            onCloseLimitEditor,
+            selectedLimit
+        });
+    }
 
-			</div>
-		);
-	}
-
-	submit() {
-		let {onSubmit, onCloseLimitEditor, parent, limitEditor, licenseModelId, version, limitType} = this.props;
-		onSubmit({type: limitType, ...limitEditor.data}, parent, licenseModelId, version).then(() => onCloseLimitEditor());
-	}
-
-	deleteLimit(limit) {
-		let {onDelete, parent, licenseModelId, version, onCloseLimitEditor, selectedLimit} = this.props;
-		onDelete({limit, parent, licenseModelId, version, onCloseLimitEditor, selectedLimit});
-	}
-
-	filterList() {
-		let {limitsList = []} = this.props;
-		let {localFilter} = this.state;
-		if (localFilter.trim()) {
-			const filter = new RegExp(escape(localFilter), 'i');
-			return limitsList.filter(({name = '', description = ''}) => {
-				return escape(name).match(filter) || escape(description).match(filter);
-			});
-		}
-		else {
-			return limitsList;
-		}
-	}
+    filterList() {
+        let { limitsList = [] } = this.props;
+        let { localFilter } = this.state;
+        if (localFilter.trim()) {
+            const filter = new RegExp(escape(localFilter), 'i');
+            return limitsList.filter(({ name = '', description = '' }) => {
+                return (
+                    escape(name).match(filter) ||
+                    escape(description).match(filter)
+                );
+            });
+        } else {
+            return limitsList;
+        }
+    }
 }
 
 export default Limits;
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitsServer.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitsServer.js
index 1b8ecb9d94..679f9975e5 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitsServer.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/limits/LimitsServer.js
@@ -16,31 +16,29 @@
 
 // items/{itemId}/users
 
-let list = [
-	
-];
+let list = [];
 
 export default {
-	fetch() {
-		return Promise.resolve({
-			listCount: list.length,
-			results: list
-		});
-	},
+    fetch() {
+        return Promise.resolve({
+            listCount: list.length,
+            results: list
+        });
+    },
 
-	put(url, payload) {
-		// let {removedUsers, addedUsers} = payload;
-		// users = users.filter(user => !removedUsers.map(user => user.userId).includes(user.userId)).concat(addedUsers);
-		payload.id = Math.random() * (1000 - 1) + 1;
-		list.push(payload);
-		return Promise.resolve();
-	},
+    put(url, payload) {
+        // let {removedUsers, addedUsers} = payload;
+        // users = users.filter(user => !removedUsers.map(user => user.userId).includes(user.userId)).concat(addedUsers);
+        payload.id = Math.random() * (1000 - 1) + 1;
+        list.push(payload);
+        return Promise.resolve();
+    },
 
-	destroy(url) {
-		const parts = url.split('/');
-		const id = parts[parts.length - 1];
-		let newList  = list.filter(item => item.id !== id);
-		list = newList;
-		return Promise.resolve();
-	}
-};
\ No newline at end of file
+    destroy(url) {
+        const parts = url.split('/');
+        const id = parts[parts.length - 1];
+        let newList = list.filter(item => item.id !== id);
+        list = newList;
+        return Promise.resolve();
+    }
+};
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/LicenseModelOverview.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/LicenseModelOverview.js
index 54941aaaf0..2b10e426d1 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/LicenseModelOverview.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/LicenseModelOverview.js
@@ -13,161 +13,214 @@
  * 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 LicenseModelActionHelper from 'sdc-app/onboarding/licenseModel/LicenseModelActionHelper.js';
 import LicenseModelOverviewView from './LicenseModelOverviewView.jsx';
-import {overviewEditorHeaders, selectedButton} from './LicenseModelOverviewConstants.js';
+import {
+    overviewEditorHeaders,
+    selectedButton
+} from './LicenseModelOverviewConstants.js';
 import licenseModelOverviewActionHelper from './licenseModelOverviewActionHelper.js';
 
 export const mapStateToProps = ({
-	licenseModel: {
-		licenseModelEditor,
-		entitlementPool,
-		licenseAgreement,
-		featureGroup,
-		licenseKeyGroup,
-		licenseModelOverview
-	}
+    licenseModel: {
+        licenseModelEditor,
+        entitlementPool,
+        licenseAgreement,
+        featureGroup,
+        licenseKeyGroup,
+        licenseModelOverview
+    }
 }) => {
-
-	let modalHeader, licensingDataList;
-	let isDisplayModal = false;
-
-	const reduceLicenseKeyGroups = (accum, licenseKeyGroupId) => {
-		let curLicenseKeyGroup = licenseKeyGroup.licenseKeyGroupsList.find(item => {return item.id === licenseKeyGroupId;});
-		if (curLicenseKeyGroup) {
-			accum.push({
-				...curLicenseKeyGroup,
-				itemType: overviewEditorHeaders.LICENSE_KEY_GROUP
-			});
-		}
-		return accum;
-	};
-
-	const reduceEntitlementPools = (accum, entitlementPoolId) => {
-		let curEntitlementPool = entitlementPool.entitlementPoolsList.find(item => {return item.id === entitlementPoolId;});
-		if (curEntitlementPool) {
-			accum.push ({
-				...curEntitlementPool,
-				itemType: overviewEditorHeaders.ENTITLEMENT_POOL
-			});
-		}
-		return accum;
-	};
-
-	const reduceFeatureGroups = (accum, featureGroupId) => {
-		let curFeatureGroup = featureGroup.featureGroupsList.find(item => {return item.id === featureGroupId;});
-		if (curFeatureGroup) {
-			let {entitlementPoolsIds = [], licenseKeyGroupsIds = []} = curFeatureGroup;
-			accum.push({
-				...curFeatureGroup,
-				itemType: overviewEditorHeaders.FEATURE_GROUP,
-				children: [
-					...entitlementPoolsIds.length ? entitlementPoolsIds.reduce(reduceEntitlementPools, []) : [],
-					...licenseKeyGroupsIds.length ? licenseKeyGroupsIds.reduce(reduceLicenseKeyGroups, []) : []
-				]
-			});
-		}
-		return accum;
-	};
-
-
-	const checkEP  = (accum, elem) => {
-		if (!elem.referencingFeatureGroups || !elem.referencingFeatureGroups.length) {
-			accum.push({
-				...elem,
-				itemType: overviewEditorHeaders.ENTITLEMENT_POOL
-			});
-		}
-		return accum;
-	};
-
-	const checkLG = (accum, elem) => {
-		if (!elem.referencingFeatureGroups || !elem.referencingFeatureGroups.length) {
-			accum.push({
-				...elem,
-				itemType: overviewEditorHeaders.LICENSE_KEY_GROUP
-			});
-		}
-		return accum;
-	};
-
-	const checkFG = (accum, elem) => {
-		if (!elem.referencingLicenseAgreements || !elem.referencingLicenseAgreements.length) {
-			let {entitlementPoolsIds = [], licenseKeyGroupsIds = []} = elem;
-			accum.push({
-				...elem,
-				itemType: overviewEditorHeaders.FEATURE_GROUP,
-
-				children: [
-					...entitlementPoolsIds.length ? entitlementPoolsIds.reduce(reduceEntitlementPools, []) : [],
-					...licenseKeyGroupsIds.length ? licenseKeyGroupsIds.reduce(reduceLicenseKeyGroups, []) : []
-				]
-
-			});
-		}
-		return accum;
-	};
-
-
-
-	const mapLicenseAgreementData = licenseAgreement => {
-		let {featureGroupsIds = []} = licenseAgreement;
-		return {
-			...licenseAgreement,
-			itemType: overviewEditorHeaders.LICENSE_AGREEMENT,
-			children: featureGroupsIds.length ? featureGroupsIds.reduce(reduceFeatureGroups, []) : []
-		};
-	};
-
-	if (entitlementPool.entitlementPoolEditor && entitlementPool.entitlementPoolEditor.data) {
-		modalHeader = overviewEditorHeaders.ENTITLEMENT_POOL;
-		isDisplayModal = true;
-	}else
-	if (licenseAgreement.licenseAgreementEditor && licenseAgreement.licenseAgreementEditor.data) {
-		modalHeader = overviewEditorHeaders.LICENSE_AGREEMENT;
-		isDisplayModal = true;
-	}else
-	if (featureGroup.featureGroupEditor && featureGroup.featureGroupEditor.data) {
-		modalHeader = overviewEditorHeaders.FEATURE_GROUP;
-		isDisplayModal = true;
-	}else
-	if (licenseKeyGroup.licenseKeyGroupsEditor && licenseKeyGroup.licenseKeyGroupsEditor.data) {
-		modalHeader = overviewEditorHeaders.LICENSE_KEY_GROUP;
-		isDisplayModal = true;
-	}
-
-	let orphanDataList = [
-		...featureGroup.featureGroupsList.reduce(checkFG, []),
-		...entitlementPool.entitlementPoolsList.reduce(checkEP, []),
-		...licenseKeyGroup.licenseKeyGroupsList.reduce(checkLG, [])
-	];
-
-	licensingDataList = licenseAgreement.licenseAgreementList && licenseAgreement.licenseAgreementList.length ? licenseAgreement.licenseAgreementList.map(mapLicenseAgreementData) : [];
-	let selectedTab = licenseModelOverview.selectedTab;
-	// on first entry, we will decide what tab to open depending on data. if there are no connections, we will open the orphans
-	if (selectedTab === null) {
-		selectedTab = (licensingDataList.length) ? selectedButton.VLM_LIST_VIEW : selectedButton.NOT_IN_USE;
-	}
-
-	return {
-		isDisplayModal,
-		modalHeader,
-		licenseModelId: licenseModelEditor.data.id,
-		version: licenseModelEditor.data.version,
-		licensingDataList,
-		orphanDataList,
-		selectedTab
-	};
+    let modalHeader, licensingDataList;
+    let isDisplayModal = false;
+
+    const reduceLicenseKeyGroups = (accum, licenseKeyGroupId) => {
+        let curLicenseKeyGroup = licenseKeyGroup.licenseKeyGroupsList.find(
+            item => {
+                return item.id === licenseKeyGroupId;
+            }
+        );
+        if (curLicenseKeyGroup) {
+            accum.push({
+                ...curLicenseKeyGroup,
+                itemType: overviewEditorHeaders.LICENSE_KEY_GROUP
+            });
+        }
+        return accum;
+    };
+
+    const reduceEntitlementPools = (accum, entitlementPoolId) => {
+        let curEntitlementPool = entitlementPool.entitlementPoolsList.find(
+            item => {
+                return item.id === entitlementPoolId;
+            }
+        );
+        if (curEntitlementPool) {
+            accum.push({
+                ...curEntitlementPool,
+                itemType: overviewEditorHeaders.ENTITLEMENT_POOL
+            });
+        }
+        return accum;
+    };
+
+    const reduceFeatureGroups = (accum, featureGroupId) => {
+        let curFeatureGroup = featureGroup.featureGroupsList.find(item => {
+            return item.id === featureGroupId;
+        });
+        if (curFeatureGroup) {
+            let {
+                entitlementPoolsIds = [],
+                licenseKeyGroupsIds = []
+            } = curFeatureGroup;
+            accum.push({
+                ...curFeatureGroup,
+                itemType: overviewEditorHeaders.FEATURE_GROUP,
+                children: [
+                    ...(entitlementPoolsIds.length
+                        ? entitlementPoolsIds.reduce(reduceEntitlementPools, [])
+                        : []),
+                    ...(licenseKeyGroupsIds.length
+                        ? licenseKeyGroupsIds.reduce(reduceLicenseKeyGroups, [])
+                        : [])
+                ]
+            });
+        }
+        return accum;
+    };
+
+    const checkEP = (accum, elem) => {
+        if (
+            !elem.referencingFeatureGroups ||
+            !elem.referencingFeatureGroups.length
+        ) {
+            accum.push({
+                ...elem,
+                itemType: overviewEditorHeaders.ENTITLEMENT_POOL
+            });
+        }
+        return accum;
+    };
+
+    const checkLG = (accum, elem) => {
+        if (
+            !elem.referencingFeatureGroups ||
+            !elem.referencingFeatureGroups.length
+        ) {
+            accum.push({
+                ...elem,
+                itemType: overviewEditorHeaders.LICENSE_KEY_GROUP
+            });
+        }
+        return accum;
+    };
+
+    const checkFG = (accum, elem) => {
+        if (
+            !elem.referencingLicenseAgreements ||
+            !elem.referencingLicenseAgreements.length
+        ) {
+            let { entitlementPoolsIds = [], licenseKeyGroupsIds = [] } = elem;
+            accum.push({
+                ...elem,
+                itemType: overviewEditorHeaders.FEATURE_GROUP,
+
+                children: [
+                    ...(entitlementPoolsIds.length
+                        ? entitlementPoolsIds.reduce(reduceEntitlementPools, [])
+                        : []),
+                    ...(licenseKeyGroupsIds.length
+                        ? licenseKeyGroupsIds.reduce(reduceLicenseKeyGroups, [])
+                        : [])
+                ]
+            });
+        }
+        return accum;
+    };
+
+    const mapLicenseAgreementData = licenseAgreement => {
+        let { featureGroupsIds = [] } = licenseAgreement;
+        return {
+            ...licenseAgreement,
+            itemType: overviewEditorHeaders.LICENSE_AGREEMENT,
+            children: featureGroupsIds.length
+                ? featureGroupsIds.reduce(reduceFeatureGroups, [])
+                : []
+        };
+    };
+
+    if (
+        entitlementPool.entitlementPoolEditor &&
+        entitlementPool.entitlementPoolEditor.data
+    ) {
+        modalHeader = overviewEditorHeaders.ENTITLEMENT_POOL;
+        isDisplayModal = true;
+    } else if (
+        licenseAgreement.licenseAgreementEditor &&
+        licenseAgreement.licenseAgreementEditor.data
+    ) {
+        modalHeader = overviewEditorHeaders.LICENSE_AGREEMENT;
+        isDisplayModal = true;
+    } else if (
+        featureGroup.featureGroupEditor &&
+        featureGroup.featureGroupEditor.data
+    ) {
+        modalHeader = overviewEditorHeaders.FEATURE_GROUP;
+        isDisplayModal = true;
+    } else if (
+        licenseKeyGroup.licenseKeyGroupsEditor &&
+        licenseKeyGroup.licenseKeyGroupsEditor.data
+    ) {
+        modalHeader = overviewEditorHeaders.LICENSE_KEY_GROUP;
+        isDisplayModal = true;
+    }
+
+    let orphanDataList = [
+        ...featureGroup.featureGroupsList.reduce(checkFG, []),
+        ...entitlementPool.entitlementPoolsList.reduce(checkEP, []),
+        ...licenseKeyGroup.licenseKeyGroupsList.reduce(checkLG, [])
+    ];
+
+    licensingDataList =
+        licenseAgreement.licenseAgreementList &&
+        licenseAgreement.licenseAgreementList.length
+            ? licenseAgreement.licenseAgreementList.map(mapLicenseAgreementData)
+            : [];
+    let selectedTab = licenseModelOverview.selectedTab;
+    // on first entry, we will decide what tab to open depending on data. if there are no connections, we will open the orphans
+    if (selectedTab === null) {
+        selectedTab = licensingDataList.length
+            ? selectedButton.VLM_LIST_VIEW
+            : selectedButton.NOT_IN_USE;
+    }
+
+    return {
+        isDisplayModal,
+        modalHeader,
+        licenseModelId: licenseModelEditor.data.id,
+        version: licenseModelEditor.data.version,
+        licensingDataList,
+        orphanDataList,
+        selectedTab
+    };
 };
 
-const mapActionsToProps = (dispatch, {licenseModelId}) => {
-	return {
-		onCallVCAction: action => {
-			LicenseModelActionHelper.performVCAction(dispatch, {licenseModelId, action});
-		},
-		onTabSelect: (buttonTab) => licenseModelOverviewActionHelper.selectVLMListView(dispatch,{buttonTab})
-	};
+const mapActionsToProps = (dispatch, { licenseModelId }) => {
+    return {
+        onCallVCAction: action => {
+            LicenseModelActionHelper.performVCAction(dispatch, {
+                licenseModelId,
+                action
+            });
+        },
+        onTabSelect: buttonTab =>
+            licenseModelOverviewActionHelper.selectVLMListView(dispatch, {
+                buttonTab
+            })
+    };
 };
 
-export default connect(mapStateToProps, mapActionsToProps)(LicenseModelOverviewView);
+export default connect(mapStateToProps, mapActionsToProps)(
+    LicenseModelOverviewView
+);
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/LicenseModelOverviewConstants.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/LicenseModelOverviewConstants.js
index 56b23384a7..b05da582f4 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/LicenseModelOverviewConstants.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/LicenseModelOverviewConstants.js
@@ -16,27 +16,27 @@
 import keyMirror from 'nfvo-utils/KeyMirror.js';
 
 export const overviewItems = keyMirror({
-	LICENSE_AGREEMENTS: 'License Agreements',
-	FEATURE_GROUPS: 'Feature Groups',
-	ENTITLEMENT_POOLS: 'Entitlement Pools',
-	LICENSE_KEY_GROUPS: 'License Key Groups'
+    LICENSE_AGREEMENTS: 'License Agreements',
+    FEATURE_GROUPS: 'Feature Groups',
+    ENTITLEMENT_POOLS: 'Entitlement Pools',
+    LICENSE_KEY_GROUPS: 'License Key Groups'
 });
 
 export const overviewEditorHeaders = keyMirror({
-	LICENSE_AGREEMENT: 'License Agreement',
-	FEATURE_GROUP: 'Feature Group',
-	ENTITLEMENT_POOL: 'Entitlement Pool',
-	LICENSE_KEY_GROUP: 'License Key Group'
+    LICENSE_AGREEMENT: 'License Agreement',
+    FEATURE_GROUP: 'Feature Group',
+    ENTITLEMENT_POOL: 'Entitlement Pool',
+    LICENSE_KEY_GROUP: 'License Key Group'
 });
 
 export const actionTypes = keyMirror({
-	LICENSE_MODEL_OVERVIEW_TAB_SELECTED: null,
-	LM_DATA_CHANGED: null
+    LICENSE_MODEL_OVERVIEW_TAB_SELECTED: null,
+    LM_DATA_CHANGED: null
 });
 
 export const selectedButton = {
-	VLM_LIST_VIEW: 'VLM_LIST_VIEW',
-	NOT_IN_USE: 'NOT_IN_USE'
+    VLM_LIST_VIEW: 'VLM_LIST_VIEW',
+    NOT_IN_USE: 'NOT_IN_USE'
 };
 
 export const VLM_DESCRIPTION_FORM = 'VLMDEWSCRIPTIONFORM';
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/LicenseModelOverviewView.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/LicenseModelOverviewView.jsx
index 39109af9a3..6899360597 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/LicenseModelOverviewView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/LicenseModelOverviewView.jsx
@@ -23,87 +23,137 @@ import EntitlementPoolsEditor from '../entitlementPools/EntitlementPoolsEditor.j
 import FeatureGroupEditor from '../featureGroups/FeatureGroupEditor.js';
 import LicenseAgreementEditor from '../licenseAgreement/LicenseAgreementEditor.js';
 import LicenseKeyGroupsEditor from '../licenseKeyGroups/LicenseKeyGroupsEditor.js';
-import {overviewEditorHeaders, selectedButton} from './LicenseModelOverviewConstants.js';
+import {
+    overviewEditorHeaders,
+    selectedButton
+} from './LicenseModelOverviewConstants.js';
 
 import SummaryView from './SummaryView.jsx';
 import VLMListView from './VLMListView.jsx';
 import ListButtons from './summary/ListButtons.jsx';
 
-
-const setModalClassName = (modalHeader) => {
-	switch (modalHeader) {
-		case overviewEditorHeaders.ENTITLEMENT_POOL:
-			return 'entitlement-pools-modal';
-		case overviewEditorHeaders.LICENSE_AGREEMENT:
-			return 'license-agreement-modal';
-		case overviewEditorHeaders.FEATURE_GROUP:
-			return 'feature-group-modal';
-		case overviewEditorHeaders.LICENSE_KEY_GROUP:
-			return 'license-key-groups-modal';
-		default:
-			return '';
-	}
+const setModalClassName = modalHeader => {
+    switch (modalHeader) {
+        case overviewEditorHeaders.ENTITLEMENT_POOL:
+            return 'entitlement-pools-modal';
+        case overviewEditorHeaders.LICENSE_AGREEMENT:
+            return 'license-agreement-modal';
+        case overviewEditorHeaders.FEATURE_GROUP:
+            return 'feature-group-modal';
+        case overviewEditorHeaders.LICENSE_KEY_GROUP:
+            return 'license-key-groups-modal';
+        default:
+            return '';
+    }
 };
 
 class LicenseModelOverviewView extends React.Component {
+    static propTypes = {
+        isDisplayModal: PropTypes.bool,
+        isReadOnlyMode: PropTypes.bool,
+        licenseModelId: PropTypes.string,
+        licensingDataList: PropTypes.array,
+        orphanDataList: PropTypes.array,
+        modalHeader: PropTypes.string,
+        selectedTab: PropTypes.string,
+        onTabSelect: PropTypes.func,
+        onCallVCAction: PropTypes.func,
+        onClose: PropTypes.func
+    };
 
-	static propTypes = {
-		isDisplayModal: PropTypes.bool,
-		isReadOnlyMode: PropTypes.bool,
-		licenseModelId: PropTypes.string,
-		licensingDataList: PropTypes.array,
-		orphanDataList: PropTypes.array,
-		modalHeader: PropTypes.string,
-		selectedTab: PropTypes.string,
-		onTabSelect: PropTypes.func,
-		onCallVCAction: PropTypes.func,
-		onClose: PropTypes.func
-	};
-
-	render() {
-		let {isDisplayModal, modalHeader, licensingDataList, selectedTab, onTabSelect, orphanDataList, isReadOnlyMode} = this.props;
-		let selectedInUse = selectedTab !== selectedButton.NOT_IN_USE;
-		let dataList = selectedInUse ? licensingDataList : orphanDataList;
-		return(
-			<div className='license-model-overview'>
-				<SummaryView  isReadOnlyMode={isReadOnlyMode}/>
-				<div className={classNames('overview-list-section ', !selectedInUse ? 'overview-list-orphans' : '' )}>
-					<div className='vlm-list-tab-panel'>
-						<ListButtons onTabSelect={onTabSelect}
-							 selectedTab={selectedTab}
-							 hasOrphans={orphanDataList.length > 0}
-							 hasLicensing={licensingDataList.length > 0}/>
-					</div>
-					<VLMListView licensingDataList={dataList} showInUse={selectedInUse}/>
-				</div>
-				{
-					isDisplayModal &&
-					<Modal show={isDisplayModal} bsSize='large' animation={true} className={classNames('onborading-modal license-model-modal', setModalClassName(modalHeader))}>
-						<Modal.Header>
-							<Modal.Title>{`${i18n('Create New ')}${i18n(modalHeader)}`}</Modal.Title>
-						</Modal.Header>
-						<Modal.Body>
-							{this.renderModalBody(modalHeader)}
-						</Modal.Body>
-					</Modal>
-				}
-			</div>
-		);
-	}
+    render() {
+        let {
+            isDisplayModal,
+            modalHeader,
+            licensingDataList,
+            selectedTab,
+            onTabSelect,
+            orphanDataList,
+            isReadOnlyMode
+        } = this.props;
+        let selectedInUse = selectedTab !== selectedButton.NOT_IN_USE;
+        let dataList = selectedInUse ? licensingDataList : orphanDataList;
+        return (
+            <div className="license-model-overview">
+                <SummaryView isReadOnlyMode={isReadOnlyMode} />
+                <div
+                    className={classNames(
+                        'overview-list-section ',
+                        !selectedInUse ? 'overview-list-orphans' : ''
+                    )}>
+                    <div className="vlm-list-tab-panel">
+                        <ListButtons
+                            onTabSelect={onTabSelect}
+                            selectedTab={selectedTab}
+                            hasOrphans={orphanDataList.length > 0}
+                            hasLicensing={licensingDataList.length > 0}
+                        />
+                    </div>
+                    <VLMListView
+                        licensingDataList={dataList}
+                        showInUse={selectedInUse}
+                    />
+                </div>
+                {isDisplayModal && (
+                    <Modal
+                        show={isDisplayModal}
+                        bsSize="large"
+                        animation={true}
+                        className={classNames(
+                            'onborading-modal license-model-modal',
+                            setModalClassName(modalHeader)
+                        )}>
+                        <Modal.Header>
+                            <Modal.Title>{`${i18n('Create New ')}${i18n(
+                                modalHeader
+                            )}`}</Modal.Title>
+                        </Modal.Header>
+                        <Modal.Body>
+                            {this.renderModalBody(modalHeader)}
+                        </Modal.Body>
+                    </Modal>
+                )}
+            </div>
+        );
+    }
 
-	renderModalBody(modalHeader) {
-		let {licenseModelId, version, isReadOnlyMode} = this.props;
-		switch (modalHeader) {
-			case overviewEditorHeaders.ENTITLEMENT_POOL:
-				return <EntitlementPoolsEditor version={version} licenseModelId={licenseModelId} isReadOnlyMode={isReadOnlyMode}/>;
-			case overviewEditorHeaders.LICENSE_AGREEMENT:
-				return <LicenseAgreementEditor version={version} licenseModelId={licenseModelId} isReadOnlyMode={isReadOnlyMode}/>;
-			case overviewEditorHeaders.FEATURE_GROUP:
-				return <FeatureGroupEditor version={version} licenseModelId={licenseModelId} isReadOnlyMode={isReadOnlyMode}/>;
-			case overviewEditorHeaders.LICENSE_KEY_GROUP:
-				return <LicenseKeyGroupsEditor version={version} licenseModelId={licenseModelId} isReadOnlyMode={isReadOnlyMode}/>;
-		}
-	}
+    renderModalBody(modalHeader) {
+        let { licenseModelId, version, isReadOnlyMode } = this.props;
+        switch (modalHeader) {
+            case overviewEditorHeaders.ENTITLEMENT_POOL:
+                return (
+                    <EntitlementPoolsEditor
+                        version={version}
+                        licenseModelId={licenseModelId}
+                        isReadOnlyMode={isReadOnlyMode}
+                    />
+                );
+            case overviewEditorHeaders.LICENSE_AGREEMENT:
+                return (
+                    <LicenseAgreementEditor
+                        version={version}
+                        licenseModelId={licenseModelId}
+                        isReadOnlyMode={isReadOnlyMode}
+                    />
+                );
+            case overviewEditorHeaders.FEATURE_GROUP:
+                return (
+                    <FeatureGroupEditor
+                        version={version}
+                        licenseModelId={licenseModelId}
+                        isReadOnlyMode={isReadOnlyMode}
+                    />
+                );
+            case overviewEditorHeaders.LICENSE_KEY_GROUP:
+                return (
+                    <LicenseKeyGroupsEditor
+                        version={version}
+                        licenseModelId={licenseModelId}
+                        isReadOnlyMode={isReadOnlyMode}
+                    />
+                );
+        }
+    }
 }
 
-export default  LicenseModelOverviewView;
+export default LicenseModelOverviewView;
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/SummaryView.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/SummaryView.jsx
index 4053f14ced..f416b0a07f 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/SummaryView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/SummaryView.jsx
@@ -13,24 +13,24 @@
  * or implied. See the License for the specific language governing
  * permissions and limitations under the License.
  */
-import React, {Component} from 'react';
+import React, { Component } from 'react';
 import i18n from 'nfvo-utils/i18n/i18n.js';
-import {default as VendorDataView} from './summary/VendorDataView.js';
-import {default as SummaryCountList} from './summary/SummaryCountList.js';
+import { default as VendorDataView } from './summary/VendorDataView.js';
+import { default as SummaryCountList } from './summary/SummaryCountList.js';
 
 class SummaryView extends Component {
-	render() {
-		const {isReadOnlyMode} = this.props;
-		return(
-			<div className='overview-top-section'>
-				<div className='page-title'>{i18n('overview')}</div>
-				<div className='license-model-overview-top'>
-					<VendorDataView isReadOnlyMode={isReadOnlyMode}/>
-					<SummaryCountList isReadOnlyMode={isReadOnlyMode}/>
-				</div>
-			</div>
-		);
-	}
+    render() {
+        const { isReadOnlyMode } = this.props;
+        return (
+            <div className="overview-top-section">
+                <div className="page-title">{i18n('overview')}</div>
+                <div className="license-model-overview-top">
+                    <VendorDataView isReadOnlyMode={isReadOnlyMode} />
+                    <SummaryCountList isReadOnlyMode={isReadOnlyMode} />
+                </div>
+            </div>
+        );
+    }
 }
 
 export default SummaryView;
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/VLMListView.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/VLMListView.jsx
index 012bd6e158..d91960e6a3 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/VLMListView.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/VLMListView.jsx
@@ -13,114 +13,130 @@
  * or implied. See the License for the specific language governing
  * permissions and limitations under the License.
  */
-import React, {Component} from 'react';
+import React, { Component } from 'react';
 import PropTypes from 'prop-types';
-import {Collapse} from 'react-bootstrap';
+import { Collapse } from 'react-bootstrap';
 import LicenseAgreement from './listItems/LicenseAgreement.jsx';
 import EntitlementPool from './listItems/EntitlementPool.jsx';
 import FeatureGroup from './listItems/FeatureGroup.jsx';
 import LicenseKeyGroup from './listItems/LicenseKeyGroup.jsx';
-import {overviewEditorHeaders} from './LicenseModelOverviewConstants.js';
+import { overviewEditorHeaders } from './LicenseModelOverviewConstants.js';
 
 class VLMListView extends Component {
+    static propTypes = {
+        licensingDataList: PropTypes.array,
+        showInUse: PropTypes.bool
+    };
 
-	static propTypes = {
-		licensingDataList: PropTypes.array,
-		showInUse: PropTypes.bool
-	};
+    state = {};
 
-	state = {
+    render() {
+        let { licensingDataList = [] } = this.props;
+        return (
+            <div className="vlm-list-view">
+                <div>
+                    <ul className="vlm-list" data-test-id="vlm-list">
+                        {licensingDataList.map(item =>
+                            this.renderLicensingItem(item)
+                        )}
+                    </ul>
+                </div>
+            </div>
+        );
+    }
 
-	};
+    renderLicensingItem(item) {
+        switch (item.itemType) {
+            case overviewEditorHeaders.LICENSE_AGREEMENT:
+                return this.renderLicenseAgreementItem(item);
+            case overviewEditorHeaders.FEATURE_GROUP:
+                return this.renderFeatureGroupItem(item);
+            case overviewEditorHeaders.LICENSE_KEY_GROUP:
+                return this.renderLicenseKeyGroupItem(item);
+            case overviewEditorHeaders.ENTITLEMENT_POOL:
+                return this.renderEntitlementPoolItem(item);
+            default:
+                return;
+        }
+    }
 
-	render() {
-		let {licensingDataList = []} = this.props;
-		return (
-			<div className='vlm-list-view'>
-				<div>
-					<ul className='vlm-list' data-test-id='vlm-list'>
-						{licensingDataList.map(item => this.renderLicensingItem(item))}
-					</ul>
-				</div>
-			</div>
-		);
-	}
+    renderLicenseAgreementItem(licenseAgreement) {
+        return (
+            <li key={licenseAgreement.id}>
+                <LicenseAgreement
+                    laData={licenseAgreement}
+                    isCollapsed={this.state[licenseAgreement.id]}
+                    onClick={event =>
+                        this.updateCollapsable(event, licenseAgreement.id)
+                    }
+                    isOrphan={!this.props.showInUse}
+                />
+                <Collapse in={this.state[licenseAgreement.id]}>
+                    <ul>
+                        {licenseAgreement.children &&
+                            licenseAgreement.children.map(item =>
+                                this.renderLicensingItem(item)
+                            )}
+                    </ul>
+                </Collapse>
+            </li>
+        );
+    }
 
-	renderLicensingItem(item) {
-		switch (item.itemType) {
-			case overviewEditorHeaders.LICENSE_AGREEMENT :
-				return this.renderLicenseAgreementItem(item);
-			case overviewEditorHeaders.FEATURE_GROUP :
-				return this.renderFeatureGroupItem(item);
-			case overviewEditorHeaders.LICENSE_KEY_GROUP :
-				return this.renderLicenseKeyGroupItem(item);
-			case overviewEditorHeaders.ENTITLEMENT_POOL:
-				return this.renderEntitlementPoolItem(item);
-			default:
-				return;
-		}
-	}
+    renderFeatureGroupItem(featureGroup) {
+        const { showInUse } = this.props;
+        return (
+            <li key={featureGroup.id}>
+                <FeatureGroup
+                    fgData={featureGroup}
+                    isCollapsed={this.state[featureGroup.id]}
+                    onClick={event =>
+                        this.updateCollapsable(event, featureGroup.id)
+                    }
+                    isOrphan={!this.props.showInUse}
+                />
+                {showInUse && (
+                    <Collapse in={this.state[featureGroup.id]}>
+                        <ul>
+                            {featureGroup.children &&
+                                featureGroup.children.map(item =>
+                                    this.renderLicensingItem(item)
+                                )}
+                        </ul>
+                    </Collapse>
+                )}
+            </li>
+        );
+    }
 
-	renderLicenseAgreementItem(licenseAgreement) {
-		return (
-			<li  key={licenseAgreement.id}>
-				<LicenseAgreement
-					laData={licenseAgreement}
-					isCollapsed={this.state[licenseAgreement.id]}
-					onClick={event => this.updateCollapsable(event, licenseAgreement.id) }
-					isOrphan={!this.props.showInUse}/>
-				<Collapse in={this.state[licenseAgreement.id]}>
-					<ul>
-						{licenseAgreement.children && licenseAgreement.children.map(item => this.renderLicensingItem(item))}
-					</ul>
-				</Collapse>
-			</li>
-		);
-	}
+    renderEntitlementPoolItem(entitlementPool) {
+        return (
+            <li key={entitlementPool.id}>
+                <EntitlementPool
+                    epData={entitlementPool}
+                    isOrphan={!this.props.showInUse}
+                />
+            </li>
+        );
+    }
 
-	renderFeatureGroupItem(featureGroup) {
-		const {showInUse} = this.props;
-		return (
-			<li key={featureGroup.id}>
-				<FeatureGroup
-					fgData={featureGroup}
-					isCollapsed={this.state[featureGroup.id]}
-					onClick={event=> this.updateCollapsable(event, featureGroup.id) }
-					isOrphan={!this.props.showInUse}/>
-				{
-					showInUse && <Collapse in={this.state[featureGroup.id]}>
-					<ul>
-						{featureGroup.children && featureGroup.children.map(item => this.renderLicensingItem(item))}
+    renderLicenseKeyGroupItem(licenseKeyGroup) {
+        return (
+            <li key={licenseKeyGroup.id}>
+                <LicenseKeyGroup
+                    lkgData={licenseKeyGroup}
+                    isOrphan={!this.props.showInUse}
+                />
+            </li>
+        );
+    }
 
-					</ul>
-				</Collapse>
-				}
-			</li>
-		);
-	}
-
-	renderEntitlementPoolItem(entitlementPool) {
-		return (
-			<li key={entitlementPool.id}>
-				<EntitlementPool epData={entitlementPool} isOrphan={!this.props.showInUse}/>
-			</li>
-		);
-	}
-
-	renderLicenseKeyGroupItem(licenseKeyGroup) {
-		return (
-			<li key={licenseKeyGroup.id}>
-				<LicenseKeyGroup lkgData={licenseKeyGroup} isOrphan={!this.props.showInUse}/>
-			</li>
-		);
-	}
-
-	updateCollapsable(event, id) {
-		event.stopPropagation();
-		let obj = {};
-		obj[id] = !this.state[id];
-		this.setState(obj);
-	}
+    updateCollapsable(event, id) {
+        event.stopPropagation();
+        let obj = {};
+        obj[id] = !this.state[id];
+        this.setState(obj);
+    }
 }
 
 export default VLMListView;
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/licenseModelOverviewActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/licenseModelOverviewActionHelper.js
index af9bc22b07..0e9fca7b4a 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/licenseModelOverviewActionHelper.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/licenseModelOverviewActionHelper.js
@@ -13,27 +13,27 @@
  * or implied. See the License for the specific language governing
  * permissions and limitations under the License.
  */
-import {actionTypes} from './LicenseModelOverviewConstants.js';
+import { actionTypes } from './LicenseModelOverviewConstants.js';
 
 export default {
-	selectVLMListView(dispatch, {buttonTab}) {
-		dispatch({
-			type: actionTypes.LICENSE_MODEL_OVERVIEW_TAB_SELECTED,
-			buttonTab
-		});
-	},
+    selectVLMListView(dispatch, { buttonTab }) {
+        dispatch({
+            type: actionTypes.LICENSE_MODEL_OVERVIEW_TAB_SELECTED,
+            buttonTab
+        });
+    },
 
-	editDescriptionOpen(dispatch, {description}) {
-		dispatch({
-			type: actionTypes.LM_DATA_CHANGED,
-			description
-		});
-	},
+    editDescriptionOpen(dispatch, { description }) {
+        dispatch({
+            type: actionTypes.LM_DATA_CHANGED,
+            description
+        });
+    },
 
-	editDescriptionClose(dispatch) {
-		dispatch({
-			type: actionTypes.LM_DATA_CHANGED,
-			description: undefined
-		});
-	}
+    editDescriptionClose(dispatch) {
+        dispatch({
+            type: actionTypes.LM_DATA_CHANGED,
+            description: undefined
+        });
+    }
 };
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/EntitlementPool.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/EntitlementPool.jsx
index 34d2ee6db5..60eba401c7 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/EntitlementPool.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/EntitlementPool.jsx
@@ -13,33 +13,46 @@
  * or implied. See the License for the specific language governing
  * permissions and limitations under the License.
  */
-import React, {Component} from 'react';
+import React, { Component } from 'react';
 import i18n from 'nfvo-utils/i18n/i18n.js';
-import {extractUnits} from '../../entitlementPools/EntitlementPoolsConstants.js';
+import { extractUnits } from '../../entitlementPools/EntitlementPoolsConstants.js';
 import ArrowCol from './listItemsComponents/ArrowCol.jsx';
 import ItemInfo from './listItemsComponents/ItemInfo.jsx';
 import IconCol from './listItemsComponents/IconCol.jsx';
-import {AdditionalDataCol, AdditionalDataElement} from './listItemsComponents/AdditionalDataCol.jsx';
+import {
+    AdditionalDataCol,
+    AdditionalDataElement
+} from './listItemsComponents/AdditionalDataCol.jsx';
 
 class EntitlementPool extends Component {
-	render() {
-		let {epData: {name, description, thresholdValue, thresholdUnits}, isOrphan} = this.props;
-		return (
-			<div className={`vlm-list-item vlm-list-item-ep ${isOrphan ? 'orphan-list-item' : ''}`} data-test-id='vlm-list-item-ep'>
-				{!isOrphan && <ArrowCol/>}
-				<IconCol className='ep-icon' text='EP'/>
-				<ItemInfo name={name} description={description}/>
-				<AdditionalDataCol>
-					{thresholdValue && <AdditionalDataElement
-						className='vlm-list-item-entitlement-metric'
-						name={i18n('Entitlement')}
-						value={`${thresholdValue} ${extractUnits(thresholdUnits)}`}/>
-					}
-				</AdditionalDataCol>
-			</div>
-		);
-	}
-
+    render() {
+        let {
+            epData: { name, description, thresholdValue, thresholdUnits },
+            isOrphan
+        } = this.props;
+        return (
+            <div
+                className={`vlm-list-item vlm-list-item-ep ${
+                    isOrphan ? 'orphan-list-item' : ''
+                }`}
+                data-test-id="vlm-list-item-ep">
+                {!isOrphan && <ArrowCol />}
+                <IconCol className="ep-icon" text="EP" />
+                <ItemInfo name={name} description={description} />
+                <AdditionalDataCol>
+                    {thresholdValue && (
+                        <AdditionalDataElement
+                            className="vlm-list-item-entitlement-metric"
+                            name={i18n('Entitlement')}
+                            value={`${thresholdValue} ${extractUnits(
+                                thresholdUnits
+                            )}`}
+                        />
+                    )}
+                </AdditionalDataCol>
+            </div>
+        );
+    }
 }
 
 export default EntitlementPool;
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/FeatureGroup.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/FeatureGroup.jsx
index 6d97dea358..df1d813408 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/FeatureGroup.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/FeatureGroup.jsx
@@ -13,49 +13,83 @@
  * or implied. See the License for the specific language governing
  * permissions and limitations under the License.
  */
-import React, {Component} from 'react';
-import {overviewEditorHeaders} from '../LicenseModelOverviewConstants.js';
+import React, { Component } from 'react';
+import { overviewEditorHeaders } from '../LicenseModelOverviewConstants.js';
 import ArrowCol from './listItemsComponents/ArrowCol.jsx';
 import ItemInfo from './listItemsComponents/ItemInfo.jsx';
 import IconCol from './listItemsComponents/IconCol.jsx';
 import i18n from 'nfvo-utils/i18n/i18n.js';
-import {AdditionalDataCol, AdditionalDataElement} from './listItemsComponents/AdditionalDataCol.jsx';
+import {
+    AdditionalDataCol,
+    AdditionalDataElement
+} from './listItemsComponents/AdditionalDataCol.jsx';
 
 class FeatureGroup extends Component {
-	render() {
-		let {fgData: {name, manufacturerReferenceNumber, description, children = []}, isCollapsed, onClick, isOrphan} = this.props;
-		return (
-			<div 
-				onClick={e => onClick(e)} 
-				className={`vlm-list-item vlm-list-item-fg ${isOrphan ? 'orphan-list-item' : ''} ${children.length && !isOrphan ? 'clickable' : ''}`} data-test-id='vlm-list-item-fg'>
-				{!isOrphan && <ArrowCol isCollapsed={isCollapsed} length={children.length} />}
-				<IconCol className='fg-icon' text='FG'/>
-				<ItemInfo name={name} description={description}>
-					<div className='children-count'>
-						<span className='count-value'>
-							{i18n('Entitlement Pools: ')}
-							<span data-test-id='vlm-list-ep-count-value'>
-								{`${children.filter(child => child.itemType === overviewEditorHeaders.ENTITLEMENT_POOL).length}`}
-							</span>
-						</span>
-						<span className='fg-pipeline-separator'>|</span>
-						<span className='count-value'>
-								{i18n('License Key Groups: ')}
-								<span data-test-id='vlm-list-lkg-count-value'>
-									{`${children.filter(child => child.itemType === overviewEditorHeaders.LICENSE_KEY_GROUP).length}`}
-								</span>
-						</span>
-					</div>
-				</ItemInfo>
-				<AdditionalDataCol>
-					<AdditionalDataElement
-						name={i18n('Manufacturer Reference Number')}
-						value={manufacturerReferenceNumber}
-						className='vlm-list-item-sku'/>
-				</AdditionalDataCol>
-			</div>
-		);
-	}
+    render() {
+        let {
+            fgData: {
+                name,
+                manufacturerReferenceNumber,
+                description,
+                children = []
+            },
+            isCollapsed,
+            onClick,
+            isOrphan
+        } = this.props;
+        return (
+            <div
+                onClick={e => onClick(e)}
+                className={`vlm-list-item vlm-list-item-fg ${
+                    isOrphan ? 'orphan-list-item' : ''
+                } ${children.length && !isOrphan ? 'clickable' : ''}`}
+                data-test-id="vlm-list-item-fg">
+                {!isOrphan && (
+                    <ArrowCol
+                        isCollapsed={isCollapsed}
+                        length={children.length}
+                    />
+                )}
+                <IconCol className="fg-icon" text="FG" />
+                <ItemInfo name={name} description={description}>
+                    <div className="children-count">
+                        <span className="count-value">
+                            {i18n('Entitlement Pools: ')}
+                            <span data-test-id="vlm-list-ep-count-value">
+                                {`${
+                                    children.filter(
+                                        child =>
+                                            child.itemType ===
+                                            overviewEditorHeaders.ENTITLEMENT_POOL
+                                    ).length
+                                }`}
+                            </span>
+                        </span>
+                        <span className="fg-pipeline-separator">|</span>
+                        <span className="count-value">
+                            {i18n('License Key Groups: ')}
+                            <span data-test-id="vlm-list-lkg-count-value">
+                                {`${
+                                    children.filter(
+                                        child =>
+                                            child.itemType ===
+                                            overviewEditorHeaders.LICENSE_KEY_GROUP
+                                    ).length
+                                }`}
+                            </span>
+                        </span>
+                    </div>
+                </ItemInfo>
+                <AdditionalDataCol>
+                    <AdditionalDataElement
+                        name={i18n('Manufacturer Reference Number')}
+                        value={manufacturerReferenceNumber}
+                        className="vlm-list-item-sku"
+                    />
+                </AdditionalDataCol>
+            </div>
+        );
+    }
 }
 
 export default FeatureGroup;
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/LicenseAgreement.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/LicenseAgreement.jsx
index dfbbe20d69..b409776c27 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/LicenseAgreement.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/LicenseAgreement.jsx
@@ -13,44 +13,73 @@
  * or implied. See the License for the specific language governing
  * permissions and limitations under the License.
  */
-import React, {Component} from 'react';
+import React, { Component } from 'react';
 import i18n from 'nfvo-utils/i18n/i18n.js';
-import InputOptions, {other as optionInputOther} from 'nfvo-components/input/validation/InputOptions.jsx';
-import {optionsInputValues} from '../../licenseAgreement/LicenseAgreementConstants.js';
+import InputOptions, {
+    other as optionInputOther
+} from 'nfvo-components/input/validation/InputOptions.jsx';
+import { optionsInputValues } from '../../licenseAgreement/LicenseAgreementConstants.js';
 import ArrowCol from './listItemsComponents/ArrowCol.jsx';
 import ItemInfo from './listItemsComponents/ItemInfo.jsx';
 import IconCol from './listItemsComponents/IconCol.jsx';
-import {AdditionalDataCol, AdditionalDataElement} from './listItemsComponents/AdditionalDataCol.jsx';
+import {
+    AdditionalDataCol,
+    AdditionalDataElement
+} from './listItemsComponents/AdditionalDataCol.jsx';
 
 class LicenseAgreement extends Component {
-	render() {
-		let {laData: {name, description, licenseTerm, children = []}, isCollapsed, onClick, isOrphan} = this.props;
-		return (
-			<div 
-				onClick={e => onClick(e)} 
-				className={`vlm-list-item vlm-list-item-la ${isOrphan ? 'orphan-list-item' : ''} ${children.length && !isOrphan ? 'clickable' : ''} `} 
-				data-test-id='vlm-list-la-item'>
-				{!isOrphan && <ArrowCol isCollapsed={isCollapsed} length={children.length} />}
-				<IconCol className='la-icon' text='LA'/>
-				<ItemInfo name={name} description={description}>
-					<div className='children-count'>
-						<span className='count-value'>{i18n('Feature Groups: ')}<span data-test-id='vlm-list-fg-count-value'>{`${children.length}`}</span></span>
-					</div>
-				</ItemInfo>
-				<AdditionalDataCol>
-					<AdditionalDataElement
-						name={i18n('License Model Type')}
-						value={this.extractValue(licenseTerm)}/>
-				</AdditionalDataCol>
-			</div>
-		);
-	}
+    render() {
+        let {
+            laData: { name, description, licenseTerm, children = [] },
+            isCollapsed,
+            onClick,
+            isOrphan
+        } = this.props;
+        return (
+            <div
+                onClick={e => onClick(e)}
+                className={`vlm-list-item vlm-list-item-la ${
+                    isOrphan ? 'orphan-list-item' : ''
+                } ${children.length && !isOrphan ? 'clickable' : ''} `}
+                data-test-id="vlm-list-la-item">
+                {!isOrphan && (
+                    <ArrowCol
+                        isCollapsed={isCollapsed}
+                        length={children.length}
+                    />
+                )}
+                <IconCol className="la-icon" text="LA" />
+                <ItemInfo name={name} description={description}>
+                    <div className="children-count">
+                        <span className="count-value">
+                            {i18n('Feature Groups: ')}
+                            <span data-test-id="vlm-list-fg-count-value">{`${
+                                children.length
+                            }`}</span>
+                        </span>
+                    </div>
+                </ItemInfo>
+                <AdditionalDataCol>
+                    <AdditionalDataElement
+                        name={i18n('License Model Type')}
+                        value={this.extractValue(licenseTerm)}
+                    />
+                </AdditionalDataCol>
+            </div>
+        );
+    }
 
-	extractValue(item) {
-		if (item === undefined) {return '';} //TODO fix it later
+    extractValue(item) {
+        if (item === undefined) {
+            return '';
+        } //TODO fix it later
 
-		return  item ? item.choice === optionInputOther.OTHER ? item.other : InputOptions.getTitleByName(optionsInputValues, item.choice) : '';
-	}
+        return item
+            ? item.choice === optionInputOther.OTHER
+              ? item.other
+              : InputOptions.getTitleByName(optionsInputValues, item.choice)
+            : '';
+    }
 }
 
 export default LicenseAgreement;
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/LicenseKeyGroup.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/LicenseKeyGroup.jsx
index b1036aae23..555acf8dbe 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/LicenseKeyGroup.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/LicenseKeyGroup.jsx
@@ -13,36 +13,53 @@
  * or implied. See the License for the specific language governing
  * permissions and limitations under the License.
  */
-import React, {Component} from 'react';
+import React, { Component } from 'react';
 import i18n from 'nfvo-utils/i18n/i18n.js';
-import {extractValue, getOperationalScopes} from '../../licenseKeyGroups/LicenseKeyGroupsConstants.js';
+import {
+    extractValue,
+    getOperationalScopes
+} from '../../licenseKeyGroups/LicenseKeyGroupsConstants.js';
 import ArrowCol from './listItemsComponents/ArrowCol.jsx';
 import ItemInfo from './listItemsComponents/ItemInfo.jsx';
 import IconCol from './listItemsComponents/IconCol.jsx';
-import {AdditionalDataCol, AdditionalDataElement} from './listItemsComponents/AdditionalDataCol.jsx';
+import {
+    AdditionalDataCol,
+    AdditionalDataElement
+} from './listItemsComponents/AdditionalDataCol.jsx';
 
 class LicenseKeyGroup extends Component {
-	render() {
-		let {lkgData: {name, description, operationalScope, type}, isOrphan} = this.props;
-		return (
-			<div className={`vlm-list-item vlm-list-item-lkg ${isOrphan ? 'orphan-list-item' : ''}`} data-test-id='vlm-list-item-lkg'>
-				{!isOrphan && <ArrowCol/>}
-				<IconCol className='lkg-icon' text='LKG'/>
-				<ItemInfo name={name} description={description}/>
-				<AdditionalDataCol>
-					{operationalScope && operationalScope.choices && <AdditionalDataElement
-						className='vlm-list-item-operational-scope'
-						name={i18n('Operational Scope')}
-						value={getOperationalScopes(operationalScope)}/>}
-					<AdditionalDataElement
-						className='vlm-list-item-group-type'
-						name={i18n('Type')}
-						value={extractValue(type)}/>
-				</AdditionalDataCol>
-			</div>
-		);
-	}
-
+    render() {
+        let {
+            lkgData: { name, description, operationalScope, type },
+            isOrphan
+        } = this.props;
+        return (
+            <div
+                className={`vlm-list-item vlm-list-item-lkg ${
+                    isOrphan ? 'orphan-list-item' : ''
+                }`}
+                data-test-id="vlm-list-item-lkg">
+                {!isOrphan && <ArrowCol />}
+                <IconCol className="lkg-icon" text="LKG" />
+                <ItemInfo name={name} description={description} />
+                <AdditionalDataCol>
+                    {operationalScope &&
+                        operationalScope.choices && (
+                            <AdditionalDataElement
+                                className="vlm-list-item-operational-scope"
+                                name={i18n('Operational Scope')}
+                                value={getOperationalScopes(operationalScope)}
+                            />
+                        )}
+                    <AdditionalDataElement
+                        className="vlm-list-item-group-type"
+                        name={i18n('Type')}
+                        value={extractValue(type)}
+                    />
+                </AdditionalDataCol>
+            </div>
+        );
+    }
 }
 
 export default LicenseKeyGroup;
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/listItemsComponents/AdditionalDataCol.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/listItemsComponents/AdditionalDataCol.jsx
index ffc0991354..0f9c783eac 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/listItemsComponents/AdditionalDataCol.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/listItemsComponents/AdditionalDataCol.jsx
@@ -16,37 +16,35 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 
-function AdditionalDataCol({children}) {
-	return (
-		<div className='list-item-section list-item-additional-data-col'>
-			<div className='additional-data-col-border'></div>
-			<div className='additional-data'>
-				{children}
-			</div>
-		</div>
-	);
+function AdditionalDataCol({ children }) {
+    return (
+        <div className="list-item-section list-item-additional-data-col">
+            <div className="additional-data-col-border" />
+            <div className="additional-data">{children}</div>
+        </div>
+    );
 }
 
 AdditionalDataCol.propTypes = {
-	children: PropTypes.oneOfType([
-		PropTypes.arrayOf(PropTypes.node),
-		PropTypes.node
-	])
+    children: PropTypes.oneOfType([
+        PropTypes.arrayOf(PropTypes.node),
+        PropTypes.node
+    ])
 };
 
-function AdditionalDataElement({className, name, value}) {
-	return (
-		<div className={className}>
-			<span className='additional-data-name'>{name}: </span>
-			<span className='additional-data-value'>{value}</span>
-		</div>
-	);
+function AdditionalDataElement({ className, name, value }) {
+    return (
+        <div className={className}>
+            <span className="additional-data-name">{name}: </span>
+            <span className="additional-data-value">{value}</span>
+        </div>
+    );
 }
 
 AdditionalDataElement.propTypes = {
-	name: PropTypes.string,
-	value: PropTypes.string,
-	className: PropTypes.string
+    name: PropTypes.string,
+    value: PropTypes.string,
+    className: PropTypes.string
 };
 
-export {AdditionalDataCol, AdditionalDataElement};
+export { AdditionalDataCol, AdditionalDataElement };
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/listItemsComponents/ArrowCol.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/listItemsComponents/ArrowCol.jsx
index 29aec64bdd..de12eae7d5 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/listItemsComponents/ArrowCol.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/listItemsComponents/ArrowCol.jsx
@@ -17,20 +17,24 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
 
-function ArrowCol ({isCollapsed, length}) {
-	return (
-		<div className='list-item-section list-item-arrow-col'>
-			<div className={classNames('arrow-icon', {'chevron': length > 0},
-				{'down': (length > 0 && isCollapsed)},
-				{'right': (length > 0 && (!isCollapsed))})} >
-			</div>
-		</div>
-	);
+function ArrowCol({ isCollapsed, length }) {
+    return (
+        <div className="list-item-section list-item-arrow-col">
+            <div
+                className={classNames(
+                    'arrow-icon',
+                    { chevron: length > 0 },
+                    { down: length > 0 && isCollapsed },
+                    { right: length > 0 && !isCollapsed }
+                )}
+            />
+        </div>
+    );
 }
 
 ArrowCol.propTypes = {
-	isCollapsed: PropTypes.bool,
-	length: PropTypes.number
+    isCollapsed: PropTypes.bool,
+    length: PropTypes.number
 };
 
 export default ArrowCol;
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/listItemsComponents/IconCol.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/listItemsComponents/IconCol.jsx
index 826248e510..61eeb03496 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/listItemsComponents/IconCol.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/listItemsComponents/IconCol.jsx
@@ -15,12 +15,14 @@
  */
 import React from 'react';
 
-function IconCol({className, text}) {
-	return (
-		<div className='list-item-section list-item-icon-col'>
-			<div className={`overview-list-icon ${className ? className : ''}`}>{text}</div>
-		</div>
-	);
+function IconCol({ className, text }) {
+    return (
+        <div className="list-item-section list-item-icon-col">
+            <div className={`overview-list-icon ${className ? className : ''}`}>
+                {text}
+            </div>
+        </div>
+    );
 }
 
 export default IconCol;
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/listItemsComponents/ItemInfo.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/listItemsComponents/ItemInfo.jsx
index 95ae123974..2d2cc8f754 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/listItemsComponents/ItemInfo.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/listItemsComponents/ItemInfo.jsx
@@ -16,25 +16,27 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 
-function ItemInfo({name, description, children}) {
-	return (
-		<div className='list-item-section vlm-item-info'>
-			<div className='vlm-list-item-title'>
-				<div className='item-name' data-test-id='vlm-list-item-name'>{name}</div>
-				{children}
-			</div>
-			<div className='vlm-list-item-description'>{description}</div>
-		</div>
-	);
+function ItemInfo({ name, description, children }) {
+    return (
+        <div className="list-item-section vlm-item-info">
+            <div className="vlm-list-item-title">
+                <div className="item-name" data-test-id="vlm-list-item-name">
+                    {name}
+                </div>
+                {children}
+            </div>
+            <div className="vlm-list-item-description">{description}</div>
+        </div>
+    );
 }
 
 ItemInfo.propTypes = {
-	name: PropTypes.string,
-	description: PropTypes.string,
-	children: PropTypes.oneOfType([
-		PropTypes.arrayOf(PropTypes.node),
-		PropTypes.node
-	])
+    name: PropTypes.string,
+    description: PropTypes.string,
+    children: PropTypes.oneOfType([
+        PropTypes.arrayOf(PropTypes.node),
+        PropTypes.node
+    ])
 };
 
 export default ItemInfo;
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/LicenseModelDescriptionEdit.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/LicenseModelDescriptionEdit.jsx
index af759f1206..04a00177d3 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/LicenseModelDescriptionEdit.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/LicenseModelDescriptionEdit.jsx
@@ -18,42 +18,54 @@ import i18n from 'nfvo-utils/i18n/i18n.js';
 import Input from 'nfvo-components/input/validation/Input.jsx';
 
 class LicenseModelDescriptionEdit extends React.Component {
-	render() {
-		//TODO check if buttons
-		let {onDataChanged, description, genericFieldInfo} = this.props;
-		let {isValid, errorText} = genericFieldInfo.description;
-		let saveButtonClassName = isValid ? 'description-save' : 'description-save disabled';
-		return(
-			<div className='vendor-description-edit'>
+    render() {
+        //TODO check if buttons
+        let { onDataChanged, description, genericFieldInfo } = this.props;
+        let { isValid, errorText } = genericFieldInfo.description;
+        let saveButtonClassName = isValid
+            ? 'description-save'
+            : 'description-save disabled';
+        return (
+            <div className="vendor-description-edit">
+                <Input
+                    onChange={description => onDataChanged({ description })}
+                    value={description}
+                    isValid={isValid}
+                    errorText={errorText}
+                    className="description-edit-textarea"
+                    type="textarea"
+                />
+                <div className="buttons-row">
+                    <div className="buttons-wrapper">
+                        <div
+                            onClick={() => this.submit()}
+                            className={saveButtonClassName}
+                            data-test-id="vlm-summary-vendor-desc-save-btn">
+                            {i18n('Save')}
+                        </div>
+                        <div
+                            onClick={() => this.onClose()}
+                            className="description-button"
+                            data-test-id="vlm-summary-vendor-desc-cancel-btn">
+                            {i18n('Cancel')}
+                        </div>
+                    </div>
+                </div>
+            </div>
+        );
+    }
 
-				<Input
-					onChange={description => onDataChanged({description})}
-					value={description}
-					isValid={isValid}
-					errorText={errorText}
-					className='description-edit-textarea'
-					type='textarea'/>
-				<div className='buttons-row'>
-					<div className='buttons-wrapper'>
-						<div onClick={() => this.submit()}  className={saveButtonClassName} data-test-id='vlm-summary-vendor-desc-save-btn'>{i18n('Save')}</div>
-						<div onClick={() => this.onClose()} className='description-button' data-test-id='vlm-summary-vendor-desc-cancel-btn'>{i18n('Cancel')}</div>
-					</div>
-				</div>
-			</div>
-		);
-	}
+    onClose() {
+        this.props.onClose();
+    }
 
-	onClose() {
-		this.props.onClose();
-	}
-
-	submit() {
-		let {onSubmit, data, description} = this.props;
-		onSubmit({
-			...data,
-			description: description.trim()
-		});
-	}
+    submit() {
+        let { onSubmit, data, description } = this.props;
+        onSubmit({
+            ...data,
+            description: description.trim()
+        });
+    }
 }
 
 export default LicenseModelDescriptionEdit;
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/ListButtons.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/ListButtons.jsx
index 3fcac3c1d8..d422d5d4b2 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/ListButtons.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/ListButtons.jsx
@@ -15,37 +15,39 @@
  */
 import React from 'react';
 import PropTypes from 'prop-types';
-import {selectedButton} from '../LicenseModelOverviewConstants.js';
+import { selectedButton } from '../LicenseModelOverviewConstants.js';
 import Tabs from 'sdc-ui/lib/react/Tabs.js';
 import Tab from 'sdc-ui/lib/react/Tab.js';
 import i18n from 'nfvo-utils/i18n/i18n.js';
 
-function ListButtons ({onTabSelect, selectedTab, hasOrphans, hasLicensing}) {
-	// no data, no tabs
-	if (!hasLicensing && !hasOrphans) {
-		return null;
-	}
-	return (
-		<Tabs 
-			onTabClick={(tabId) => onTabSelect(tabId)}
-			activeTab={selectedTab}
-			className='overview-buttons-section'
-			type='header' >
-			<Tab
-				tabId={selectedButton.VLM_LIST_VIEW}
-				title={i18n('Connections List')}
-				data-test-id='vlm-overview-vlmlist-tab' />
-			<Tab
-				tabId={selectedButton.NOT_IN_USE}
-				title={i18n('Orphans List')}
-				data-test-id='vlm-overview-orphans-tab' />
-		</Tabs>
-	);
+function ListButtons({ onTabSelect, selectedTab, hasOrphans, hasLicensing }) {
+    // no data, no tabs
+    if (!hasLicensing && !hasOrphans) {
+        return null;
+    }
+    return (
+        <Tabs
+            onTabClick={tabId => onTabSelect(tabId)}
+            activeTab={selectedTab}
+            className="overview-buttons-section"
+            type="header">
+            <Tab
+                tabId={selectedButton.VLM_LIST_VIEW}
+                title={i18n('Connections List')}
+                data-test-id="vlm-overview-vlmlist-tab"
+            />
+            <Tab
+                tabId={selectedButton.NOT_IN_USE}
+                title={i18n('Orphans List')}
+                data-test-id="vlm-overview-orphans-tab"
+            />
+        </Tabs>
+    );
 }
 
 ListButtons.propTypes = {
-	onTabSelect: PropTypes.func,
-	selectedInUse: PropTypes.bool
+    onTabSelect: PropTypes.func,
+    selectedInUse: PropTypes.bool
 };
 
 export default ListButtons;
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/SummaryCountItem.jsx b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/SummaryCountItem.jsx
index 50c547e042..144d9bcc1b 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/SummaryCountItem.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/SummaryCountItem.jsx
@@ -16,19 +16,43 @@
 import React from 'react';
 import SVGIcon from 'sdc-ui/lib/react/SVGIcon.js';
 
-function  SummaryCountItem ({name, counter, onAdd, onNavigate, isReadOnlyMode}) {
-	//TODO check for buttons
-	return(
-		<div className='summary-count-item'>
-			<div className='summary-name-and-count' onClick={onNavigate}>
-				<span className='item-name' onClick={onNavigate}>{name}</span>
-				<span className='item-count' onClick={onNavigate} data-test-id={'vlm-summary-vendor-counter-' + name.toLowerCase().replace(/\s/g,'-')}>({counter})</span>
-			</div>
-			<SVGIcon name='plusCircle' disabled={isReadOnlyMode} className={isReadOnlyMode ? 'disabled' : ''}
-				color='secondary' onClick={onAdd} data-test-id={'vlm-summary-vendor-add-btn-' + name.toLowerCase().replace(/\s/g,'-')}/>
-		</div>
-	);
+function SummaryCountItem({
+    name,
+    counter,
+    onAdd,
+    onNavigate,
+    isReadOnlyMode
+}) {
+    //TODO check for buttons
+    return (
+        <div className="summary-count-item">
+            <div className="summary-name-and-count" onClick={onNavigate}>
+                <span className="item-name" onClick={onNavigate}>
+                    {name}
+                </span>
+                <span
+                    className="item-count"
+                    onClick={onNavigate}
+                    data-test-id={
+                        'vlm-summary-vendor-counter-' +
+                        name.toLowerCase().replace(/\s/g, '-')
+                    }>
+                    ({counter})
+                </span>
+            </div>
+            <SVGIcon
+                name="plusCircle"
+                disabled={isReadOnlyMode}
+                className={isReadOnlyMode ? 'disabled' : ''}
+                color="secondary"
+                onClick={onAdd}
+                data-test-id={
+                    'vlm-summary-vendor-add-btn-' +
+                    name.toLowerCase().replace(/\s/g, '-')
+                }
+            />
+        </div>
+    );
 }
 
 export default SummaryCountItem;
-
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/SummaryCountList.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/SummaryCountList.js
index 15b6649543..711bb7a374 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/SummaryCountList.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/SummaryCountList.js
@@ -14,123 +14,158 @@
  * permissions and limitations under the License.
  */
 import React from 'react';
-import {connect} from 'react-redux';
+import { connect } from 'react-redux';
 
 import ScreensHelper from 'sdc-app/common/helpers/ScreensHelper.js';
-import {enums, screenTypes} from 'sdc-app/onboarding/OnboardingConstants.js';
+import { enums, screenTypes } from 'sdc-app/onboarding/OnboardingConstants.js';
 
 import EntitlementPoolsActionHelper from '../../entitlementPools/EntitlementPoolsActionHelper.js';
 import LicenseAgreementActionHelper from '../../licenseAgreement/LicenseAgreementActionHelper.js';
 import LicenseKeyGroupsActionHelper from '../../licenseKeyGroups/LicenseKeyGroupsActionHelper.js';
 import FeatureGroupsActionHelper from '../../featureGroups/FeatureGroupsActionHelper.js';
 
-import {overviewItems} from '../LicenseModelOverviewConstants.js';
+import { overviewItems } from '../LicenseModelOverviewConstants.js';
 import SummaryCountItem from './SummaryCountItem.jsx';
 
 export const mapStateToProps = ({
-	licenseModel: {
-		licenseModelEditor,
-		licenseAgreement: {licenseAgreementList},
-		featureGroup: {featureGroupsList},
-		entitlementPool: {entitlementPoolsList},
-		licenseKeyGroup: {licenseKeyGroupsList}
-	}
+    licenseModel: {
+        licenseModelEditor,
+        licenseAgreement: { licenseAgreementList },
+        featureGroup: { featureGroupsList },
+        entitlementPool: { entitlementPoolsList },
+        licenseKeyGroup: { licenseKeyGroupsList }
+    }
 }) => {
+    let { vendorName, description, id, version } = licenseModelEditor.data;
+    let counts = [
+        {
+            name: overviewItems.LICENSE_AGREEMENTS,
+            count: licenseAgreementList.length
+        },
+        { name: overviewItems.FEATURE_GROUPS, count: featureGroupsList.length },
+        {
+            name: overviewItems.ENTITLEMENT_POOLS,
+            count: entitlementPoolsList.length
+        },
+        {
+            name: overviewItems.LICENSE_KEY_GROUPS,
+            count: licenseKeyGroupsList.length
+        }
+    ];
 
-	let {vendorName, description, id, version} = licenseModelEditor.data;
-	let counts = [
-		{name: overviewItems.LICENSE_AGREEMENTS, count: licenseAgreementList.length},
-		{name: overviewItems.FEATURE_GROUPS, count: featureGroupsList.length},
-		{name: overviewItems.ENTITLEMENT_POOLS, count: entitlementPoolsList.length},
-		{name: overviewItems.LICENSE_KEY_GROUPS, count: licenseKeyGroupsList.length},
-	];
-
-	return {
-		vendorName,
-		licenseModelId: id,
-		description,
-		counts,
-		version
-	};
-
+    return {
+        vendorName,
+        licenseModelId: id,
+        description,
+        counts,
+        version
+    };
 };
 
-const mapActionsToProps = (dispatch) => {
-	return {
-		onEditorOpenClick: (name, licenseModelId, version) => {
-			switch (name) {
-				case overviewItems.ENTITLEMENT_POOLS:
-					EntitlementPoolsActionHelper.openEntitlementPoolsEditor(dispatch);
-					break;
-				case overviewItems.FEATURE_GROUPS:
-					FeatureGroupsActionHelper.openFeatureGroupsEditor(dispatch, {licenseModelId, version});
-					break;
-				case overviewItems.LICENSE_AGREEMENTS:
-					LicenseAgreementActionHelper.openLicenseAgreementEditor(dispatch, {licenseModelId, version});
-					break;
-				case overviewItems.LICENSE_KEY_GROUPS:
-					LicenseKeyGroupsActionHelper.openLicenseKeyGroupsEditor(dispatch);
-					break;
-				default:
-					break;
-			}
-		},
-		onNavigateClick: ({name, licenseModelId, version}) => {
-			let screenToNavigate;
-			switch (name) {
-				case overviewItems.ENTITLEMENT_POOLS:
-					screenToNavigate = enums.SCREEN.ENTITLEMENT_POOLS;
-					break;
-				case overviewItems.FEATURE_GROUPS:
-					screenToNavigate = enums.SCREEN.FEATURE_GROUPS;
-					break;
-				case overviewItems.LICENSE_AGREEMENTS:
-					screenToNavigate = enums.SCREEN.LICENSE_AGREEMENTS;
-					break;
-				case overviewItems.LICENSE_KEY_GROUPS:
-					screenToNavigate = enums.SCREEN.LICENSE_KEY_GROUPS;
-					break;
-				default:
-					break;
-			}
-			ScreensHelper.loadScreen(dispatch, {
-				screen: screenToNavigate, screenType: screenTypes.LICENSE_MODEL,
-				props: {licenseModelId, version}
-			});
-		}
-	};
+const mapActionsToProps = dispatch => {
+    return {
+        onEditorOpenClick: (name, licenseModelId, version) => {
+            switch (name) {
+                case overviewItems.ENTITLEMENT_POOLS:
+                    EntitlementPoolsActionHelper.openEntitlementPoolsEditor(
+                        dispatch
+                    );
+                    break;
+                case overviewItems.FEATURE_GROUPS:
+                    FeatureGroupsActionHelper.openFeatureGroupsEditor(
+                        dispatch,
+                        {
+                            licenseModelId,
+                            version
+                        }
+                    );
+                    break;
+                case overviewItems.LICENSE_AGREEMENTS:
+                    LicenseAgreementActionHelper.openLicenseAgreementEditor(
+                        dispatch,
+                        {
+                            licenseModelId,
+                            version
+                        }
+                    );
+                    break;
+                case overviewItems.LICENSE_KEY_GROUPS:
+                    LicenseKeyGroupsActionHelper.openLicenseKeyGroupsEditor(
+                        dispatch
+                    );
+                    break;
+                default:
+                    break;
+            }
+        },
+        onNavigateClick: ({ name, licenseModelId, version }) => {
+            let screenToNavigate;
+            switch (name) {
+                case overviewItems.ENTITLEMENT_POOLS:
+                    screenToNavigate = enums.SCREEN.ENTITLEMENT_POOLS;
+                    break;
+                case overviewItems.FEATURE_GROUPS:
+                    screenToNavigate = enums.SCREEN.FEATURE_GROUPS;
+                    break;
+                case overviewItems.LICENSE_AGREEMENTS:
+                    screenToNavigate = enums.SCREEN.LICENSE_AGREEMENTS;
+                    break;
+                case overviewItems.LICENSE_KEY_GROUPS:
+                    screenToNavigate = enums.SCREEN.LICENSE_KEY_GROUPS;
+                    break;
+                default:
+                    break;
+            }
+            ScreensHelper.loadScreen(dispatch, {
+                screen: screenToNavigate,
+                screenType: screenTypes.LICENSE_MODEL,
+                props: { licenseModelId, version }
+            });
+        }
+    };
 };
 
 export class SummaryCountList extends React.Component {
+    render() {
+        let { counts } = this.props;
+        return (
+            <div className="summary-count-list">
+                {counts.map(item => this.renderItem(item))}
+            </div>
+        );
+    }
 
-	render() {
-		let {counts} = this.props;
-		return(
-			<div className='summary-count-list'>
-				{counts.map(item => this.renderItem(item))}
-			</div>
-		);
-	}
-
-	renderItem(item){
-		const {name, count} = item;
-		const {isReadOnlyMode} = this.props;
-		return(
-			<SummaryCountItem isReadOnlyMode={isReadOnlyMode} name={name} counter={count} onNavigate={() => this.onNavigate(name)} onAdd={() => this.onAdd(name)} key={name} />
-		);
-	}
+    renderItem(item) {
+        const { name, count } = item;
+        const { isReadOnlyMode } = this.props;
+        return (
+            <SummaryCountItem
+                isReadOnlyMode={isReadOnlyMode}
+                name={name}
+                counter={count}
+                onNavigate={() => this.onNavigate(name)}
+                onAdd={() => this.onAdd(name)}
+                key={name}
+            />
+        );
+    }
 
-	onAdd(name) {
-		let {onEditorOpenClick, licenseModelId, isReadOnlyMode, version} = this.props;
-		if (!isReadOnlyMode) {
-			onEditorOpenClick(name, licenseModelId, version);
-		}
-	}
+    onAdd(name) {
+        let {
+            onEditorOpenClick,
+            licenseModelId,
+            isReadOnlyMode,
+            version
+        } = this.props;
+        if (!isReadOnlyMode) {
+            onEditorOpenClick(name, licenseModelId, version);
+        }
+    }
 
-	onNavigate(name) {
-		let {onNavigateClick, licenseModelId, version} = this.props;
-		onNavigateClick({licenseModelId, name, version});
-	}
+    onNavigate(name) {
+        let { onNavigateClick, licenseModelId, version } = this.props;
+        onNavigateClick({ licenseModelId, name, version });
+    }
 }
 
 export default connect(mapStateToProps, mapActionsToProps)(SummaryCountList);
diff --git a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/VendorDataView.js b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/VendorDataView.js
index 616355de41..62fc2c3cb3 100644
--- a/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/VendorDataView.js
+++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/VendorDataView.js
@@ -13,8 +13,8 @@
  * or implied. See the License for the specific language governing
  * permissions and limitations under the License.
  */
-import React, {Component} from 'react';
-import {connect} from 'react-redux';
+import React, { Component } from 'react';
+import { connect } from 'react-redux';
 
 import Tooltip from 'react-bootstrap/lib/Tooltip.js';
 import OverlayTrigger from 'react-bootstrap/lib/OverlayTrigger.js';
@@ -23,89 +23,139 @@ import ValidationHelper from 'sdc-app/common/helpers/ValidationHelper.js';
 import licenseModelOverviewActionHelper from '../licenseModelOverviewActionHelper.js';
 import LicenseModelActionHelper from '../../LicenseModelActionHelper.js';
 import LicenseModelDescriptionEdit from './LicenseModelDescriptionEdit.jsx';
-import {VLM_DESCRIPTION_FORM} from '../LicenseModelOverviewConstants.js';
+import { VLM_DESCRIPTION_FORM } from '../LicenseModelOverviewConstants.js';
 
 export const mapStateToProps = ({
-	licenseModel: {
-		licenseModelEditor: {data},
-		licenseModelOverview: {descriptionEditor: {data: descriptionData = {}, genericFieldInfo}}
-	}
+    licenseModel: {
+        licenseModelEditor: { data },
+        licenseModelOverview: {
+            descriptionEditor: { data: descriptionData = {}, genericFieldInfo }
+        }
+    }
 }) => {
-	let {description} = descriptionData;
-	return {
-		data,
-		description,
-		genericFieldInfo
-	};
+    let { description } = descriptionData;
+    return {
+        data,
+        description,
+        genericFieldInfo
+    };
 };
 
-const mapActionsToProps = (dispatch) => {
-	return {
-		onDataChanged: (deltaData) => ValidationHelper.dataChanged(dispatch, {deltaData, formName: VLM_DESCRIPTION_FORM}),
-		onCancel: () => licenseModelOverviewActionHelper.editDescriptionClose(dispatch),
-		onSubmit: (licenseModel) => {
-			licenseModelOverviewActionHelper.editDescriptionClose(dispatch);
-			LicenseModelActionHelper.saveLicenseModel(dispatch, {licenseModel});
-		},
-		onVendorDescriptionEdit: description => licenseModelOverviewActionHelper.editDescriptionOpen(dispatch,{description})
-	};
+const mapActionsToProps = dispatch => {
+    return {
+        onDataChanged: deltaData =>
+            ValidationHelper.dataChanged(dispatch, {
+                deltaData,
+                formName: VLM_DESCRIPTION_FORM
+            }),
+        onCancel: () =>
+            licenseModelOverviewActionHelper.editDescriptionClose(dispatch),
+        onSubmit: licenseModel => {
+            licenseModelOverviewActionHelper.editDescriptionClose(dispatch);
+            LicenseModelActionHelper.saveLicenseModel(dispatch, {
+                licenseModel
+            });
+        },
+        onVendorDescriptionEdit: description =>
+            licenseModelOverviewActionHelper.editDescriptionOpen(dispatch, {
+                description
+            })
+    };
 };
 
 export class VendorDataView extends Component {
-	render() {
-		let {data: {vendorName}, description, isReadOnlyMode} = this.props;
-		return (
-			<div className='vendor-data-view'>
-				<div className='vendor-title'>vendor</div>
-				<div className='vendor-name' data-test-id='vlm-summary-vendor-name'>{vendorName}</div>
-				{
-					description !== undefined && !isReadOnlyMode ? this.renderDescriptionEdit() : this.renderDescription()
-				}
-			</div>
-		);
-	}
+    render() {
+        let { data: { vendorName }, description, isReadOnlyMode } = this.props;
+        return (
+            <div className="vendor-data-view">
+                <div className="vendor-title">vendor</div>
+                <div
+                    className="vendor-name"
+                    data-test-id="vlm-summary-vendor-name">
+                    {vendorName}
+                </div>
+                {description !== undefined && !isReadOnlyMode
+                    ? this.renderDescriptionEdit()
+                    : this.renderDescription()}
+            </div>
+        );
+    }
 
-	componentWillUnmount() {
-		this.props.onCancel();
-	}
+    componentWillUnmount() {
+        this.props.onCancel();
+    }
 
+    renderDescription() {
+        let {
+            data: { description },
+            onVendorDescriptionEdit,
+            isReadOnlyMode
+        } = this.props;
+        return (
+            <div
+                onClick={() => {
+                    if (!isReadOnlyMode) {
+                        onVendorDescriptionEdit(description);
+                    }
+                }}
+                className={
+                    !isReadOnlyMode
+                        ? 'vendor-description'
+                        : 'vendor-description-readonly'
+                }>
+                {this.renderOverlay(
+                    <div
+                        className="description-data"
+                        data-test-id="vlm-summary-vendor-description">
+                        {description}
+                        {!isReadOnlyMode && <SVGIcon name="pencil" />}
+                    </div>
+                )}
+            </div>
+        );
+    }
 
-	renderDescription() {
-		let {data: {description}, onVendorDescriptionEdit, isReadOnlyMode} = this.props;
-		return (
-			<div onClick={() => {if (!isReadOnlyMode) {onVendorDescriptionEdit(description);}}} className={!isReadOnlyMode ? 'vendor-description' : 'vendor-description-readonly'}>
-				{this.renderOverlay(
-					<div className='description-data' data-test-id='vlm-summary-vendor-description'>
-						{description}
-						{!isReadOnlyMode && <SVGIcon name='pencil'/>}
-					</div>
-				)}
-			</div>
-		);
-	}
-
-	renderDescriptionEdit() {
-		let {onCancel, onDataChanged, onSubmit, description, genericFieldInfo, data} = this.props;
-		return(
-			<LicenseModelDescriptionEdit onClose={onCancel} onDataChanged={onDataChanged} onSubmit={onSubmit} data={data} genericFieldInfo={genericFieldInfo} description={description}/>
-		);
-	}
-
-	renderOverlay(children) {
-		let {data: {description}, isReadOnlyMode} = this.props;
-		if (isReadOnlyMode) {
-			return (
-				<OverlayTrigger
-					placement='bottom'
-					overlay={<Tooltip className='vendor-description-tooltip' id='tooltip-bottom'>{description}</Tooltip>}
-					delayShow={400}>
-					{children}
-				</OverlayTrigger>
-			);
-		}
-		return children;
-	}
+    renderDescriptionEdit() {
+        let {
+            onCancel,
+            onDataChanged,
+            onSubmit,
+            description,
+            genericFieldInfo,
+            data
+        } = this.props;
+        return (
+            <LicenseModelDescriptionEdit
+                onClose={onCancel}
+                onDataChanged={onDataChanged}
+                onSubmit={onSubmit}
+                data={data}
+                genericFieldInfo={genericFieldInfo}
+                description={description}
+            />
+        );
+    }
 
+    renderOverlay(children) {
+        let { data: { description }, isReadOnlyMode } = this.props;
+        if (isReadOnlyMode) {
+            return (
+                <OverlayTrigger
+                    placement="bottom"
+                    overlay={
+                        <Tooltip
+                            className="vendor-description-tooltip"
+                            id="tooltip-bottom">
+                            {description}
+                        </Tooltip>
+                    }
+                    delayShow={400}>
+                    {children}
+                </OverlayTrigger>
+            );
+        }
+        return children;
+    }
 }
 
 export default connect(mapStateToProps, mapActionsToProps)(VendorDataView);