summaryrefslogtreecommitdiffstats
path: root/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview
diff options
context:
space:
mode:
Diffstat (limited to 'openecomp-ui/src/sdc-app/onboarding/licenseModel/overview')
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/LicenseModelOverview.js349
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/LicenseModelOverviewConstants.js24
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/LicenseModelOverviewView.jsx194
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/SummaryView.jsx30
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/VLMListView.jsx202
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/licenseModelOverviewActionHelper.js38
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/EntitlementPool.jsx55
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/FeatureGroup.jsx108
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/LicenseAgreement.jsx89
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/LicenseKeyGroup.jsx65
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/listItemsComponents/AdditionalDataCol.jsx46
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/listItemsComponents/ArrowCol.jsx26
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/listItemsComponents/IconCol.jsx14
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/listItemsComponents/ItemInfo.jsx34
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/LicenseModelDescriptionEdit.jsx80
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/ListButtons.jsx50
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/SummaryCountItem.jsx50
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/SummaryCountList.js227
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/VendorDataView.js196
19 files changed, 1109 insertions, 768 deletions
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);