diff options
Diffstat (limited to 'openecomp-ui/src/sdc-app/onboarding/licenseModel/overview')
19 files changed, 1198 insertions, 0 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 new file mode 100644 index 0000000000..1ca4f37988 --- /dev/null +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/LicenseModelOverview.js @@ -0,0 +1,163 @@ +/*! + * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express + * or implied. See the License for the specific language governing + * permissions and limitations under the License. + */ +import {connect} from 'react-redux'; +import LicenseModelActionHelper from 'sdc-app/onboarding/licenseModel/LicenseModelActionHelper.js'; +import VersionControllerUtils from 'nfvo-components/panel/versionController/VersionControllerUtils.js'; +import LicenseModelOverviewView from './LicenseModelOverviewView.jsx'; +import {overviewEditorHeaders, selectedButton} from './LicenseModelOverviewConstants.js'; +import licenseModelOverviewActionHelper from './licenseModelOverviewActionHelper.js'; + +export const mapStateToProps = ({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; + } + + if (licenseModelOverview.selectedTab === selectedButton.NOT_IN_USE) { + licensingDataList = [ + ...featureGroup.featureGroupsList.reduce(checkFG, []), + ...entitlementPool.entitlementPoolsList.reduce(checkEP, []), + ...licenseKeyGroup.licenseKeyGroupsList.reduce(checkLG, []) + ]; + }else { + licensingDataList = licenseAgreement.licenseAgreementList && licenseAgreement.licenseAgreementList.length ? licenseAgreement.licenseAgreementList.map(mapLicenseAgreementData) : []; + } + + return { + isReadOnlyMode: VersionControllerUtils.isReadOnly(licenseModelEditor.data), + isDisplayModal, + modalHeader, + licenseModelId: licenseModelEditor.data.id, + version: licenseModelEditor.data.version, + licensingDataList, + selectedTab: licenseModelOverview.selectedTab + + }; +}; + +const mapActionsToProps = (dispatch, {licenseModelId}) => { + return { + onCallVCAction: action => { + LicenseModelActionHelper.performVCAction(dispatch, {licenseModelId, action}); + }, + onTabSelect: (buttonTab) => licenseModelOverviewActionHelper.selectVLMListView(dispatch,{buttonTab}) + }; +}; + +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 new file mode 100644 index 0000000000..b5a27ed018 --- /dev/null +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/LicenseModelOverviewConstants.js @@ -0,0 +1,42 @@ +/*! + * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express + * or implied. See the License for the specific language governing + * permissions and limitations under the License. + */ +import 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' +}); + +export const overviewEditorHeaders = keyMirror({ + 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 +}); + +export const selectedButton = keyMirror({ + VLM_LIST_VIEW: null, + NOT_IN_USE: null +}); + +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 new file mode 100644 index 0000000000..d6c79ddb52 --- /dev/null +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/LicenseModelOverviewView.jsx @@ -0,0 +1,105 @@ +/*! + * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express + * or implied. See the License for the specific language governing + * permissions and limitations under the License. + */ +import React from 'react'; +import i18n from 'nfvo-utils/i18n/i18n.js'; +import Modal from 'nfvo-components/modal/Modal.jsx'; +import classNames from 'classnames'; + +import EntitlementPoolsEditor from '../entitlementPools/EntitlementPoolsEditor.js'; +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 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 ''; + } +}; + +class LicenseModelOverviewView extends React.Component { + + static propTypes = { + isDisplayModal: React.PropTypes.bool, + isReadOnlyMode: React.PropTypes.bool, + licenseModelId: React.PropTypes.string, + licensingDataList: React.PropTypes.array, + modalHeader: React.PropTypes.string, + selectedTab: React.PropTypes.symbol, + onTabSelect: React.PropTypes.func, + onCallVCAction: React.PropTypes.func, + onClose: React.PropTypes.func + }; + + render() { + let {isDisplayModal, modalHeader, licensingDataList, selectedTab, onTabSelect} = this.props; + let selectedInUse = selectedTab !== selectedButton.NOT_IN_USE; + + return( + <div className='license-model-overview'> + <SummaryView/> + <div className={classNames('overview-list-section ', !selectedInUse ? 'overview-list-orphans' : '' )}> + <div className='vlm-list-tab-panel'> + <div className='section-title'>{selectedInUse ? i18n('VLM List View') : i18n('Entities not in Use')}</div> + <ListButtons onTabSelect={onTabSelect} selectedInUse={selectedInUse}/> + </div> + <VLMListView licensingDataList={licensingDataList} showInUse={selectedInUse}/> + </div> + { + isDisplayModal && + <Modal show={isDisplayModal} bsSize='large' animation={true} className={classNames('onborading-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} = this.props; + switch (modalHeader) { + case overviewEditorHeaders.ENTITLEMENT_POOL: + return <EntitlementPoolsEditor version={version} licenseModelId={licenseModelId} isReadOnlyMode={false}/>; + case overviewEditorHeaders.LICENSE_AGREEMENT: + return <LicenseAgreementEditor version={version} licenseModelId={licenseModelId} isReadOnlyMode={false}/>; + case overviewEditorHeaders.FEATURE_GROUP: + return <FeatureGroupEditor version={version} licenseModelId={licenseModelId} isReadOnlyMode={false}/>; + case overviewEditorHeaders.LICENSE_KEY_GROUP: + return <LicenseKeyGroupsEditor version={version} licenseModelId={licenseModelId} isReadOnlyMode={false}/>; + } + } +} + +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 new file mode 100644 index 0000000000..6fcdb477e6 --- /dev/null +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/SummaryView.jsx @@ -0,0 +1,33 @@ +/*! + * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express + * or implied. See the License for the specific language governing + * permissions and limitations under the License. + */ +import React from 'react'; +import i18n from 'nfvo-utils/i18n/i18n.js'; +import {default as VendorDataView} from './summary/VendorDataView.js'; +import {default as SummaryCountList} from './summary/SummaryCountList.js'; + +function SummaryView() { + return( + <div className='overview-top-section'> + <div className='overview-title'>{i18n('overview')}</div> + <div className='license-model-overview-top'> + <VendorDataView/> + <SummaryCountList/> + </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 new file mode 100644 index 0000000000..119008a849 --- /dev/null +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/VLMListView.jsx @@ -0,0 +1,123 @@ +/*! + * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express + * or implied. See the License for the specific language governing + * permissions and limitations under the License. + */ +import React, {Component} from 'react'; +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'; + +class VLMListView extends Component { + + static propTypes = { + licensingDataList: React.PropTypes.array, + showInUse: React.PropTypes.bool + }; + + 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; + } + } + + renderLicenseAgreementItem(licenseAgreement) { + return ( + <li key={licenseAgreement.id}> + <LicenseAgreement + laData={licenseAgreement} + isCollapsed={this.state[licenseAgreement.id]} + onClick={event => this.updateCollapsable(event, licenseAgreement.id) }/> + <Collapse in={this.state[licenseAgreement.id]}> + <ul> + {licenseAgreement.children && licenseAgreement.children.map(item => this.renderLicensingItem(item))} + </ul> + </Collapse> + </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) }/> + { + showInUse && <Collapse in={this.state[featureGroup.id]}> + <ul> + {featureGroup.children && featureGroup.children.map(item => this.renderLicensingItem(item))} + + </ul> + </Collapse> + } + </li> + ); + } + + renderEntitlementPoolItem(entitlementPool) { + return ( + <li key={entitlementPool.id}> + <EntitlementPool epData={entitlementPool} /> + </li> + ); + } + + renderLicenseKeyGroupItem(licenseKeyGroup) { + return ( + <li key={licenseKeyGroup.id}> + <LicenseKeyGroup lkgData={licenseKeyGroup} /> + </li> + ); + } + + 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 new file mode 100644 index 0000000000..f0286ba3bb --- /dev/null +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/licenseModelOverviewActionHelper.js @@ -0,0 +1,39 @@ +/*! + * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express + * or implied. See the License for the specific language governing + * permissions and limitations under the License. + */ +import {actionTypes} from './LicenseModelOverviewConstants.js'; + +export default { + selectVLMListView(dispatch, {buttonTab}) { + dispatch({ + type: actionTypes.LICENSE_MODEL_OVERVIEW_TAB_SELECTED, + buttonTab + }); + }, + + editDescriptionOpen(dispatch, {description}) { + dispatch({ + type: actionTypes.LM_DATA_CHANGED, + description + }); + }, + + editDescriptionClose(dispatch) { + dispatch({ + type: actionTypes.LM_DATA_CHANGED, + description: false + }); + } +}; 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 new file mode 100644 index 0000000000..94977b40d1 --- /dev/null +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/EntitlementPool.jsx @@ -0,0 +1,53 @@ +/*! + * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express + * or implied. See the License for the specific language governing + * permissions and limitations under the License. + */ +import React, {Component} from 'react'; +import i18n from 'nfvo-utils/i18n/i18n.js'; +import {extractValue, 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'; + +class EntitlementPool extends Component { + render() { + let {epData: {name, description, manufacturerReferenceNumber}} = this.props; + return ( + <div className='vlm-list-item vlm-list-item-ep' data-test-id='vlm-list-item-ep'> + <ArrowCol/> + <IconCol className='ep-icon'/> + <ItemInfo name={name} description={description}/> + <AdditionalDataCol> + <AdditionalDataElement + className='vlm-list-item-entitlement-metric' + name={i18n('Entitlement')} + value={this.getEntitlement()}/> + <AdditionalDataElement + name={i18n('Manufacturer Reference Number')} + value={manufacturerReferenceNumber} + className='vlm-list-item-sku'/> + </AdditionalDataCol> + </div> + ); + } + + getEntitlement() { + let {epData: {entitlementMetric, aggregationFunction, time, thresholdValue, thresholdUnits}} = this.props; + return `${extractValue(aggregationFunction)} ${extractValue(entitlementMetric)} per ${extractValue(time)} ${thresholdValue} ${extractUnits(thresholdUnits)}`; + } + +} + +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 new file mode 100644 index 0000000000..8dbd46a29e --- /dev/null +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/FeatureGroup.jsx @@ -0,0 +1,50 @@ +/*! + * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express + * or implied. See the License for the specific language governing + * permissions and limitations under the License. + */ +import React, {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'; + +class FeatureGroup extends Component { + render() { + let {fgData: {name, description, children = []}, isCollapsed, onClick} = this.props; + return ( + <div onClick={e => onClick(e)} className='vlm-list-item vlm-list-item-fg' data-test-id='vlm-list-item-fg'> + <ArrowCol isCollapsed={isCollapsed} length={children.length} /> + <IconCol className='fg-icon'/> + <ItemInfo name={name} description={description}> + <div className='children-count'> + <span className='count-value'> + Entitlement Pools: + <span data-test-id='vlm-list-ep-count-value'> + {`${children.filter(child => child.itemType === overviewEditorHeaders.ENTITLEMENT_POOL).length}`} + </span> + </span> + <span className='count-value'> + 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> + </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 new file mode 100644 index 0000000000..dd4686d330 --- /dev/null +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/LicenseAgreement.jsx @@ -0,0 +1,53 @@ +/*! + * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express + * or implied. See the License for the specific language governing + * permissions and limitations under the License. + */ +import React, {Component} from 'react'; +import i18n from 'nfvo-utils/i18n/i18n.js'; +import InputOptions, {other as optionInputOther} from 'nfvo-components/input/inputOptions/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'; + +class LicenseAgreement extends Component { + render() { + let {laData: {name, description, licenseTerm, children = []}, isCollapsed, onClick} = this.props; + return ( + <div onClick={e => onClick(e)} className='vlm-list-item vlm-list-item-la' data-test-id='vlm-list-la-item'> + <ArrowCol isCollapsed={isCollapsed} length={children.length} /> + <IconCol className='la-icon'/> + <ItemInfo name={name} description={description}> + <div className='children-count'> + <span className='count-value'>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 + + 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 new file mode 100644 index 0000000000..9722b83336 --- /dev/null +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/LicenseKeyGroup.jsx @@ -0,0 +1,48 @@ +/*! + * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express + * or implied. See the License for the specific language governing + * permissions and limitations under the License. + */ +import React, {Component} from 'react'; +import i18n from 'nfvo-utils/i18n/i18n.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'; + +class LicenseKeyGroup extends Component { + render() { + let {lkgData: {name, description, operationalScope, type}} = this.props; + return ( + <div className='vlm-list-item vlm-list-item-lkg' data-test-id='vlm-list-item-lkg'> + <ArrowCol/> + <IconCol className='lkg-icon'/> + <ItemInfo name={name} description={description}/> + <AdditionalDataCol> + <AdditionalDataElement + className='vlm-list-item-operational-scope' + name={i18n('Operational Scope')} + value={operationalScope && 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 new file mode 100644 index 0000000000..5b5daafb4f --- /dev/null +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/listItemsComponents/AdditionalDataCol.jsx @@ -0,0 +1,51 @@ +/*! + * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express + * or implied. See the License for the specific language governing + * permissions and limitations under the License. + */ +import React from 'react'; + +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> + ); +} + +AdditionalDataCol.propTypes = { + children: React.PropTypes.oneOfType([ + React.PropTypes.arrayOf(React.PropTypes.node), + React.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> + ); +} + +AdditionalDataElement.propTypes = { + name: React.PropTypes.string, + value: React.PropTypes.string, + className: React.PropTypes.string +}; + +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 new file mode 100644 index 0000000000..a5eb9d27dd --- /dev/null +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/listItemsComponents/ArrowCol.jsx @@ -0,0 +1,35 @@ +/*! + * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express + * or implied. See the License for the specific language governing + * permissions and limitations under the License. + */ +import React from 'react'; +import 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> + ); +} + +ArrowCol.propTypes = { + isCollapsed: React.PropTypes.bool, + length: React.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 new file mode 100644 index 0000000000..7fd7fcb88a --- /dev/null +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/listItemsComponents/IconCol.jsx @@ -0,0 +1,26 @@ +/*! + * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express + * or implied. See the License for the specific language governing + * permissions and limitations under the License. + */ +import React from 'react'; + +function IconCol({className}) { + return ( + <div className='list-item-section list-item-icon-col'> + <div className={className}></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 new file mode 100644 index 0000000000..655a0dd4a8 --- /dev/null +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/listItems/listItemsComponents/ItemInfo.jsx @@ -0,0 +1,39 @@ +/*! + * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express + * or implied. See the License for the specific language governing + * permissions and limitations under the License. + */ +import React from 'react'; + +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: React.PropTypes.string, + description: React.PropTypes.string, + children: React.PropTypes.oneOfType([ + React.PropTypes.arrayOf(React.PropTypes.node), + React.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 new file mode 100644 index 0000000000..0c0103fc10 --- /dev/null +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/LicenseModelDescriptionEdit.jsx @@ -0,0 +1,56 @@ +/*! + * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express + * or implied. See the License for the specific language governing + * permissions and limitations under the License. + */ +import React from 'react'; +import Input from 'nfvo-components/input/validation/Input.jsx'; + +class LicenseModelDescriptionEdit extends React.Component { + render() { + let {onDataChanged, description, genericFieldInfo} = this.props; + let saveButtonClassName = (genericFieldInfo.description.isValid) ? 'description-save' : 'description-save disabled'; + return( + <div className='vendor-description-edit'> + + <Input + onChange={description => onDataChanged({description})} + value={description} + isValid={genericFieldInfo.description.isValid} + errorText={genericFieldInfo.description.errorText} + className='description-edit-textarea' + type='textarea'/> + <div className='buttons-row'> + <div className='buttons-wrapper'> + <div onClick={() => this.onClose()} className='description-button' data-test-id='vlm-summary-vendor-desc-cancel-btn'>cancel</div> + <div onClick={() => this.submit()} className={saveButtonClassName} data-test-id='vlm-summary-vendor-desc-save-btn'>save</div> + </div> + </div> + </div> + ); + } + + onClose() { + this.props.onClose(); + } + + submit() { + let {onSubmit, data, description} = this.props; + onSubmit({ + ...data, + description: description + }); + } +} + +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 new file mode 100644 index 0000000000..730ccb33f1 --- /dev/null +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/ListButtons.jsx @@ -0,0 +1,39 @@ +/*! + * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express + * or implied. See the License for the specific language governing + * permissions and limitations under the License. + */ +import React from 'react'; +import {selectedButton} from '../LicenseModelOverviewConstants.js'; + +function ListButtons ({onTabSelect, selectedInUse}) { + return ( + <div className='overview-buttons-section'> + <div onClick={()=>onTabSelect(selectedButton.VLM_LIST_VIEW)} + className={selectedInUse ? 'button-vlm-list-view vlm-list-icon selected' : 'button-vlm-list-view vlm-list-icon' } + data-test-id='vlm-overview-vlmlist-tab'></div> + <div onClick={()=>onTabSelect(selectedButton.NOT_IN_USE)} + className={selectedInUse ? 'button-vlm-list-view entities-list-icon' : 'button-vlm-list-view entities-list-icon selected' } + data-test-id='vlm-overview-orphans-tab' > + </div> + + </div> + ); +} + +ListButtons.propTypes = { + onTabSelect: React.PropTypes.func, + selectedInUse: React.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 new file mode 100644 index 0000000000..66f2cc6838 --- /dev/null +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/SummaryCountItem.jsx @@ -0,0 +1,31 @@ +/*! + * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express + * or implied. See the License for the specific language governing + * permissions and limitations under the License. + */ +import React from 'react'; + +function SummaryCountItem ({name, counter, onAdd, onNavigate, isReadOnlyMode}) { + 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> + <div className={isReadOnlyMode ? 'add-button disabled' : 'add-button'} 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 new file mode 100644 index 0000000000..c69a092d23 --- /dev/null +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/SummaryCountList.js @@ -0,0 +1,126 @@ +/*! + * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express + * or implied. See the License for the specific language governing + * permissions and limitations under the License. + */ +import React from 'react'; +import {connect} from 'react-redux'; + +import VersionControllerUtils from 'nfvo-components/panel/versionController/VersionControllerUtils.js'; + +import OnboardingActionHelper from '../../../OnboardingActionHelper.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 SummaryCountItem from './SummaryCountItem.jsx'; + +export const mapStateToProps = ({licenseModel: {licenseModelEditor, licenseAgreement: {licenseAgreementList}, + featureGroup: {featureGroupsList}, entitlementPool: {entitlementPoolsList}, licenseKeyGroup: {licenseKeyGroupsList}}}) => { + + let {vendorName, description, id, version} = licenseModelEditor.data; + + let isReadOnlyMode = VersionControllerUtils.isReadOnly(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, + isReadOnlyMode, + 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}) => { + switch (name) { + case overviewItems.ENTITLEMENT_POOLS: + OnboardingActionHelper.navigateToEntitlementPools(dispatch, {licenseModelId, version}); + break; + case overviewItems.FEATURE_GROUPS: + OnboardingActionHelper.navigateToFeatureGroups(dispatch, {licenseModelId, version}); + break; + case overviewItems.LICENSE_AGREEMENTS: + OnboardingActionHelper.navigateToLicenseAgreements(dispatch, {licenseModelId, version}); + break; + case overviewItems.LICENSE_KEY_GROUPS: + OnboardingActionHelper.navigateToLicenseKeyGroups(dispatch, {licenseModelId, version}); + break; + default: + break; + } + } + }; +}; + +export class SummaryCountList extends React.Component { + + 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} /> + ); + } + + 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}); + } +} + +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 new file mode 100644 index 0000000000..1d65ab9869 --- /dev/null +++ b/openecomp-ui/src/sdc-app/onboarding/licenseModel/overview/summary/VendorDataView.js @@ -0,0 +1,86 @@ +/*! + * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express + * or implied. See the License for the specific language governing + * permissions and limitations under the License. + */ +import React from 'react'; +import {connect} from 'react-redux'; + +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 VersionControllerUtils from 'nfvo-components/panel/versionController/VersionControllerUtils.js'; +import {VLM_DESCRIPTION_FORM} from '../LicenseModelOverviewConstants.js'; + +export const mapStateToProps = ({licenseModel: {licenseModelEditor: {data}, licenseModelOverview: {descriptionEditor: {data: descriptionData, genericFieldInfo} }}}) => { + let description = (descriptionData && descriptionData.description) ? descriptionData.description : null; + let isReadOnlyMode = VersionControllerUtils.isReadOnly(data); + return { + data, + description, + genericFieldInfo, + isReadOnlyMode + }; +}; + +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 React.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 && !isReadOnlyMode ? this.renderDescriptionEdit() : this.renderDescription() + } + </div> + ); + } + + renderDescription() { + let {data: {description}, onVendorDescriptionEdit, isReadOnlyMode} = this.props; + return ( + <div onClick={() => {if (!isReadOnlyMode) {onVendorDescriptionEdit(description);}}} className={!isReadOnlyMode ? 'vendor-description' : 'vendor-description-readonly'}> + <div className='description-data' data-test-id='vlm-summary-vendor-description'> + {description} + </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}/> + ); + } + +} + +export default connect(mapStateToProps, mapActionsToProps)(VendorDataView); + |