From 768f706f6f017ca605e0b292619e46b24fda1767 Mon Sep 17 00:00:00 2001 From: svishnev Date: Thu, 18 Oct 2018 14:34:47 +0300 Subject: vendor view issues fix Issue-ID: SDC-1850 Change-Id: I13f39b82ea152399ccd43914c893856bc6063cb1 Signed-off-by: svishnev --- .../src/sdc-app/onboarding/onboard/Onboard.js | 2 + .../onboardingCatalog/OnboardingCatalogView.jsx | 32 ++------ .../onboard/onboardingCatalog/VSPOverlay.jsx | 91 +++++++++++++--------- .../onboardingCatalog/VendorCatalogView.jsx | 52 +++++++------ .../onboard/onboardingCatalog/VendorItem.jsx | 37 +++++---- .../onboarding/onboard/workspace/WorkspaceView.jsx | 30 +++---- 6 files changed, 119 insertions(+), 125 deletions(-) (limited to 'openecomp-ui/src/sdc-app/onboarding/onboard') diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/Onboard.js b/openecomp-ui/src/sdc-app/onboarding/onboard/Onboard.js index ea70f9c0b8..34f9b88a7b 100644 --- a/openecomp-ui/src/sdc-app/onboarding/onboard/Onboard.js +++ b/openecomp-ui/src/sdc-app/onboarding/onboard/Onboard.js @@ -23,6 +23,7 @@ import SoftwareProductCreationActionHelper from '../softwareProduct/creation/Sof import sortByStringProperty from 'nfvo-utils/sortByStringProperty.js'; import { tabsMapping } from './onboardingCatalog/OnboardingCatalogConstants.js'; import { itemStatus } from 'sdc-app/common/helpers/ItemsHelperConstants.js'; +import { catalogItemStatuses } from './onboardingCatalog/OnboardingCatalogConstants.js'; export const mapStateToProps = ({ onboard: { onboardingCatalog, activeTab, searchValue, filter }, @@ -95,6 +96,7 @@ export const mapStateToProps = ({ } return { + isArchived: filter.itemStatus === catalogItemStatuses.ARCHIVED, finalizedLicenseModelList, finalizedSoftwareProductList, licenseModelList, diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogView.jsx b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogView.jsx index 86c437d888..ec3d4550ef 100644 --- a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogView.jsx @@ -44,44 +44,22 @@ class OnboardingCatalogView extends React.Component { selectedVendor, searchValue, onMigrate, - filteredItems + filteredItems, + isArchived } = this.props; const { vlmList, vspList } = filteredItems; switch (activeTab) { case tabsMapping.ARCHIVE: - return ( - - onSelectLicenseModel( - item, - users, - WCTabsMapping.CATALOG - ) - } - onSelectVSP={(item, users) => - onSelectSoftwareProduct( - item, - users, - WCTabsMapping.CATALOG - ) - } - filter={searchValue} - onMigrate={onMigrate} - /> - ); case tabsMapping.ACTIVE: return ( onSelectLicenseModel( item, @@ -100,10 +78,12 @@ class OnboardingCatalogView extends React.Component { onMigrate={onMigrate} /> ); + case tabsMapping.BY_VENDOR: default: return ( ( -
{ - e.stopPropagation(); - e.preventDefault(); - }}> -
-
-
{i18n('Recently Edited')}
-
- {VSPList.slice(0, 5).map(vsp => ( -
{ - if ( - vsp.isOldVersion && - vsp.isOldVersion === - migrationStatusMapper.OLD_VERSION - ) { - onMigrate({ - softwareProduct: vsp - }); - } else { - onSelectVSP(vsp); - } - }}> - {i18n(vsp.name)} +const VspOverlayItem = ({ vsp, onClick }) => { + const handleClick = () => onClick(vsp); + return ( +
+ {i18n(vsp.name)} +
+ ); +}; + +VspOverlayItem.propTypes = { + vsp: PropTypes.object, + onClick: PropTypes.func +}; + +const VSPOverlay = ({ VSPList, onSelectVSP, onSeeMore, onMigrate }) => { + const handleSelect = vsp => { + if ( + vsp.isOldVersion && + vsp.isOldVersion === migrationStatusMapper.OLD_VERSION + ) { + onMigrate({ + softwareProduct: vsp + }); + } else { + onSelectVSP(vsp); + } + }; + return ( +
{ + e.stopPropagation(); + e.preventDefault(); + }}> +
+
+
+ {i18n('Recently Edited')} +
+
+ {VSPList.slice(0, 5).map(vsp => ( + + ))} +
+ {VSPList.length > 5 && ( +
+ {i18n('See More')}
- ))} + )}
- {VSPList.length > 5 && ( -
- {i18n('See More')} -
- )}
-
-); + ); +}; VSPOverlay.PropTypes = { VSPList: PropTypes.array, diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/VendorCatalogView.jsx b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/VendorCatalogView.jsx index 02f8d50c5c..ec45258eb9 100644 --- a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/VendorCatalogView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/VendorCatalogView.jsx @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2018 European Support Limited * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * + * + * http://www.apache.org/licenses/LICENSE-2.0 + * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express - * or implied. See the License for the specific language governing - * permissions and limitations under the License. + * 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 VendorItem from './VendorItem.jsx'; @@ -30,24 +30,27 @@ const VendorList = ({ onVendorSelect, filter, onMigrate, - users + users, + isArchived }) => { + const showAddButtons = !isArchived; + const handeleSelectVSP = vsp => onSelectVSP(vsp, users); + const handleOnVspButtonClick = (hasVSP, vlm) => + onVspOverlayChange(vlm.id === currentOverlay || !hasVSP ? null : vlm); + return ( - + {filterCatalogItemsByType({ items: licenseModelList, filter }).map( vlm => ( onSelectVSP(vsp, users)} + onSelectVSP={handeleSelectVSP} shouldShowOverlay={currentOverlay === vlm.id} - onVSPButtonClick={hasVSP => - onVspOverlayChange( - vlm.id === currentOverlay || !hasVSP - ? null - : vlm - ) - } + onVSPButtonClick={handleOnVspButtonClick} onVendorSelect={onVendorSelect} onMigrate={onMigrate} vendor={vlm} @@ -66,21 +69,24 @@ const SoftwareProductListByVendor = ({ onSelectVLM, filter, onMigrate, - users + users, + isArchived }) => { + const handleAddVsp = !isArchived + ? () => onAddVSP(selectedVendor.id) + : false; + const handleOnSelect = () => onSelectVLM(selectedVendor, users); return (
{ - onAddVSP(selectedVendor.id); - }} + onAddVSP={handleAddVsp} vendorPageOptions={{ selectedVendor, onBack: () => onVendorSelect(false) }}> onSelectVLM(selectedVendor, users)} + onSelect={handleOnSelect} catalogItemTypeClass={catalogItemTypes.LICENSE_MODEL} onMigrate={onMigrate} catalogItemData={selectedVendor} diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/VendorItem.jsx b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/VendorItem.jsx index fda47ef3e8..d3e0eb4313 100644 --- a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/VendorItem.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/VendorItem.jsx @@ -41,18 +41,15 @@ class VendorItem extends React.Component { onAddVSP: PropTypes.func, onVSPButtonClick: PropTypes.func }; - + handleSeeMore = () => { + const { onVendorSelect, vendor } = this.props; + onVendorSelect(vendor); + }; render() { - let { - vendor, - onSelectVSP, - shouldShowOverlay, - onVendorSelect, - onMigrate - } = this.props; + let { vendor, onSelectVSP, shouldShowOverlay, onMigrate } = this.props; let { softwareProductList = [], name } = vendor; return ( - onVendorSelect(vendor)}> + this.handleVspCountClick(e)} + onClick={this.handleVspCountClick} data-test-id="catalog-vsp-count" disabled={!softwareProductList.length}> {`${softwareProductList.length.toString()} ${i18n( @@ -80,7 +77,7 @@ class VendorItem extends React.Component { onMigrate={onMigrate} VSPList={softwareProductList} onSelectVSP={onSelectVSP} - onSeeMore={() => onVendorSelect(vendor)} + onSeeMore={this.handleSeeMore} /> )} @@ -92,7 +89,7 @@ class VendorItem extends React.Component { btnType="link" color="primary" iconName="plusThin" - onClick={e => this.onCreateVspClick(e)}> + onClick={this.onCreateVspClick}> {i18n('Create new VSP')} @@ -101,26 +98,28 @@ class VendorItem extends React.Component { ); } - onCreateVspClick(e) { + onCreateVspClick = e => { e.stopPropagation(); e.preventDefault(); const { onAddVSP, vendor: { id } } = this.props; onAddVSP(id); - } + }; handleClickOutside = () => { - this.props.onVSPButtonClick(false); + const { onVSPButtonClick, vlm } = this.props; + onVSPButtonClick(false, vlm); }; - handleVspCountClick(e) { + handleVspCountClick = e => { e.stopPropagation(); e.preventDefault(); const { onVSPButtonClick, - vendor: { softwareProductList } + vendor: { softwareProductList }, + vlm } = this.props; const hasVSP = Boolean(softwareProductList.length); - onVSPButtonClick(hasVSP); - } + onVSPButtonClick(hasVSP, vlm); + }; } export default VendorItem; diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/workspace/WorkspaceView.jsx b/openecomp-ui/src/sdc-app/onboarding/onboard/workspace/WorkspaceView.jsx index bef88df14d..8cc396f6fc 100644 --- a/openecomp-ui/src/sdc-app/onboarding/onboard/workspace/WorkspaceView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/onboard/workspace/WorkspaceView.jsx @@ -17,7 +17,6 @@ import React from 'react'; import DetailsCatalogView from '../DetailsCatalogView.jsx'; import i18n from 'nfvo-utils/i18n/i18n.js'; import { tabsMapping } from 'sdc-app/onboarding/onboard/OnboardConstants.js'; -import { tabsMapping as catalogTabsMappping } from '../onboardingCatalog/OnboardingCatalogConstants.js'; const WorkspaceView = props => { let { @@ -28,10 +27,13 @@ const WorkspaceView = props => { onSelectSoftwareProduct, searchValue, onMigrate, - catalogActiveTab, - filteredItems: { vspList, vlmList } + filteredItems: { vspList, vlmList }, + isArchived } = props; - + const handleSelectVSP = (item, users) => + onSelectSoftwareProduct(item, users, tabsMapping.WORKSPACE); + const handleSelectVLM = (item, users) => + onSelectLicenseModel(item, users, tabsMapping.WORKSPACE); return (
@@ -41,22 +43,10 @@ const WorkspaceView = props => { VLMList={vlmList} VSPList={vspList} users={users} - onAddVLM={ - catalogActiveTab === catalogTabsMappping.ACTIVE - ? onAddLicenseModelClick - : undefined - } - onAddVSP={ - catalogActiveTab === catalogTabsMappping.ACTIVE - ? onAddSoftwareProductClick - : undefined - } - onSelectVLM={(item, users) => - onSelectLicenseModel(item, users, tabsMapping.WORKSPACE) - } - onSelectVSP={(item, users) => - onSelectSoftwareProduct(item, users, tabsMapping.WORKSPACE) - } + onAddVLM={!isArchived ? onAddLicenseModelClick : undefined} + onAddVSP={!isArchived ? onAddSoftwareProductClick : undefined} + onSelectVLM={handleSelectVLM} + onSelectVSP={handleSelectVSP} onMigrate={onMigrate} filter={searchValue} /> -- cgit 1.2.3-korg