Adding Prettier and fixing up eslint version

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

5 files changed, 363 insertions, 240 deletions

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);