From 7fdf733a64670fceefc3ded35cfa581e1c458179 Mon Sep 17 00:00:00 2001 From: Einav Weiss Keidar Date: Tue, 20 Mar 2018 14:45:40 +0200 Subject: Adding Prettier and fixing up eslint version Issue-ID: SDC-1094 Change-Id: Ie83ad95a03899345dd90235daf0323cbe3bc6afd Signed-off-by: Einav Weiss Keidar --- .../OnboardingCatalogActionHelper.js | 131 +++++----- .../OnboardingCatalogConstants.js | 38 +-- .../onboardingCatalog/OnboardingCatalogReducer.js | 19 +- .../onboardingCatalog/OnboardingCatalogUtils.js | 6 +- .../onboardingCatalog/OnboardingCatalogView.jsx | 274 +++++++++++++-------- .../onboard/onboardingCatalog/Tooltip.jsx | 24 +- .../onboard/onboardingCatalog/VSPOverlay.jsx | 68 +++-- .../onboardingCatalog/VendorCatalogReducer.js | 40 +-- .../onboardingCatalog/VendorCatalogView.jsx | 134 ++++++---- .../onboard/onboardingCatalog/VendorItem.jsx | 158 ++++++------ 10 files changed, 545 insertions(+), 347 deletions(-) (limited to 'openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog') diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogActionHelper.js index a85c79edd9..aebb829a88 100644 --- a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogActionHelper.js +++ b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogActionHelper.js @@ -15,69 +15,88 @@ */ import React from 'react'; import i18n from 'nfvo-utils/i18n/i18n.js'; -import {actionTypes} from './OnboardingCatalogConstants.js'; -import {actionTypes as modalActionTypes} from 'nfvo-components/modal/GlobalModalConstants.js'; +import { actionTypes } from './OnboardingCatalogConstants.js'; +import { actionTypes as modalActionTypes } from 'nfvo-components/modal/GlobalModalConstants.js'; import OnboardActionHelper from '../OnboardActionHelper.js'; import SoftwareProductActionHelper from 'sdc-app/onboarding/softwareProduct/SoftwareProductActionHelper.js'; - function getMessageForMigration(name) { - return ( -
-
{i18n('{name} needs to be updated. Click ‘Checkout & Update’, to proceed.', {name: name})}
-
{i18n('Please don’t forget to submit afterwards')}
-
- ); + return ( +
+
+ {i18n( + '{name} needs to be updated. Click ‘Checkout & Update’, to proceed.', + { name: name } + )} +
+
{i18n('Please don’t forget to submit afterwards')}
+
+ ); } const OnboardingCatalogActionHelper = { - changeVspOverlay(dispatch, vendor) { - dispatch({ - type: actionTypes.CHANGE_VSP_OVERLAY, - vendorId: vendor ? vendor.id : null - }); - }, - closeVspOverlay(dispatch) { - dispatch({ - type: actionTypes.CLOSE_VSP_OVERLAY - }); - }, - changeActiveTab(dispatch, activeTab) { - OnboardActionHelper.clearSearchValue(dispatch); - dispatch({ - type: actionTypes.CHANGE_ACTIVE_CATALOG_TAB, - activeTab - }); - }, - onVendorSelect(dispatch, {vendor}) { - OnboardActionHelper.clearSearchValue(dispatch); - dispatch({ - type: actionTypes.ONBOARDING_CATALOG_OPEN_VENDOR_PAGE, - selectedVendor: vendor - }); - }, - onMigrate(dispatch, softwareProduct) { - const {name, lockingUser} = softwareProduct; - if (NaN === NaN) { // TODO - dispatch({ - type: modalActionTypes.GLOBAL_MODAL_WARNING, - data: { - title: 'WARNING', - msg: i18n('{name} is locked by user {lockingUser} for self-healing', {name: name, lockingUser: lockingUser}) - } - }); - } else { - dispatch({ - type: modalActionTypes.GLOBAL_MODAL_WARNING, - data:{ - title: 'WARNING', - msg: getMessageForMigration(softwareProduct.name.toUpperCase()), - confirmationButtonText: i18n('Checkout & Update'), - onConfirmed: ()=>SoftwareProductActionHelper.migrateSoftwareProduct(dispatch, {softwareProduct}) - } - }); - } - } + changeVspOverlay(dispatch, vendor) { + dispatch({ + type: actionTypes.CHANGE_VSP_OVERLAY, + vendorId: vendor ? vendor.id : null + }); + }, + closeVspOverlay(dispatch) { + dispatch({ + type: actionTypes.CLOSE_VSP_OVERLAY + }); + }, + changeActiveTab(dispatch, activeTab) { + OnboardActionHelper.clearSearchValue(dispatch); + dispatch({ + type: actionTypes.CHANGE_ACTIVE_CATALOG_TAB, + activeTab + }); + }, + onVendorSelect(dispatch, { vendor }) { + OnboardActionHelper.clearSearchValue(dispatch); + dispatch({ + type: actionTypes.ONBOARDING_CATALOG_OPEN_VENDOR_PAGE, + selectedVendor: vendor + }); + }, + onMigrate(dispatch, softwareProduct) { + const { name, lockingUser } = softwareProduct; + if (NaN === NaN) { + // TODO + dispatch({ + type: modalActionTypes.GLOBAL_MODAL_WARNING, + data: { + title: 'WARNING', + msg: i18n( + '{name} is locked by user {lockingUser} for self-healing', + { + name: name, + lockingUser: lockingUser + } + ) + } + }); + } else { + dispatch({ + type: modalActionTypes.GLOBAL_MODAL_WARNING, + data: { + title: 'WARNING', + msg: getMessageForMigration( + softwareProduct.name.toUpperCase() + ), + confirmationButtonText: i18n('Checkout & Update'), + onConfirmed: () => + SoftwareProductActionHelper.migrateSoftwareProduct( + dispatch, + { + softwareProduct + } + ) + } + }); + } + } }; export default OnboardingCatalogActionHelper; diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogConstants.js b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogConstants.js index 239ae4545f..f0cefdcde3 100644 --- a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogConstants.js +++ b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogConstants.js @@ -16,41 +16,41 @@ import keyMirror from 'nfvo-utils/KeyMirror.js'; export const catalogItemTypes = Object.freeze({ - LICENSE_MODEL: 'license-model', - SOFTWARE_PRODUCT: 'software-product' + LICENSE_MODEL: 'license-model', + SOFTWARE_PRODUCT: 'software-product' }); export const catalogItemTypeClasses = { - LICENSE_MODEL: 'license-model-type', - SOFTWARE_PRODUCT: 'software-product-type', - VENDOR: 'vendor-type' + LICENSE_MODEL: 'license-model-type', + SOFTWARE_PRODUCT: 'software-product-type', + VENDOR: 'vendor-type' }; export const catalogItemStatuses = { - DRAFT: 'Draft', - CERTIFIED: 'Certified', - ARCHIVED: 'ARCHIVED' + DRAFT: 'Draft', + CERTIFIED: 'Certified', + ARCHIVED: 'ARCHIVED' }; export const modalMapper = { - 'license-model': 'LICENSE_MODEL', - 'software-product': 'SOFTWARE_PRODUCT' + 'license-model': 'LICENSE_MODEL', + 'software-product': 'SOFTWARE_PRODUCT' }; export const tabsMapping = { - 'BY_VENDOR': 1, - 'ACTIVE': 2, - 'ARCHIVE': 3 + BY_VENDOR: 1, + ACTIVE: 2, + ARCHIVE: 3 }; export const migrationStatusMapper = { - OLD_VERSION: 'True', + OLD_VERSION: 'True' }; export const actionTypes = keyMirror({ - ONBOARDING_CATALOG_OPEN_VENDOR_PAGE: null, - CHANGE_ACTIVE_CATALOG_TAB: null, - CHANGE_SEARCH_VALUE: null, - CHANGE_VSP_OVERLAY: null, - CLOSE_VSP_OVERLAY: null + ONBOARDING_CATALOG_OPEN_VENDOR_PAGE: null, + CHANGE_ACTIVE_CATALOG_TAB: null, + CHANGE_SEARCH_VALUE: null, + CHANGE_VSP_OVERLAY: null, + CLOSE_VSP_OVERLAY: null }); diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogReducer.js b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogReducer.js index 3f8a833074..9796cf8918 100644 --- a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogReducer.js +++ b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogReducer.js @@ -13,18 +13,21 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -import {actionTypes, tabsMapping} from './OnboardingCatalogConstants.js'; -import {combineReducers} from 'redux'; +import { actionTypes, tabsMapping } from './OnboardingCatalogConstants.js'; +import { combineReducers } from 'redux'; import vendorCatalogReducer from './VendorCatalogReducer.js'; const onboardingCatalogReducer = combineReducers({ - vendorCatalog: vendorCatalogReducer, - activeTab: (state = tabsMapping.ACTIVE, action) => action.type === actionTypes.CHANGE_ACTIVE_CATALOG_TAB ? action.activeTab : state + vendorCatalog: vendorCatalogReducer, + activeTab: (state = tabsMapping.ACTIVE, action) => + action.type === actionTypes.CHANGE_ACTIVE_CATALOG_TAB + ? action.activeTab + : state }); export default (state, action) => { - if (action.type === actionTypes.RESET_ONBOARDING_CATALOG_STORE) { - state = undefined; - } - return onboardingCatalogReducer(state, action); + if (action.type === actionTypes.RESET_ONBOARDING_CATALOG_STORE) { + state = undefined; + } + return onboardingCatalogReducer(state, action); }; diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogUtils.js b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogUtils.js index 78258255ec..d1e401f57d 100644 --- a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogUtils.js +++ b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogUtils.js @@ -14,6 +14,8 @@ * permissions and limitations under the License. */ -export const filterCatalogItemsByType = ({items, filter}) => { - return items.filter(item => item.name.toLowerCase().indexOf(filter.toLowerCase()) > -1); +export const filterCatalogItemsByType = ({ items, filter }) => { + return items.filter( + item => item.name.toLowerCase().indexOf(filter.toLowerCase()) > -1 + ); }; 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 8ae8549688..2cc32c2936 100644 --- a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/OnboardingCatalogView.jsx @@ -18,120 +18,202 @@ import i18n from 'nfvo-utils/i18n/i18n.js'; import classnames from 'classnames'; import DetailsCatalogView from 'sdc-app/onboarding/onboard/DetailsCatalogView.jsx'; import VendorCatalogView from './VendorCatalogView.jsx'; -import { tabsMapping} from './OnboardingCatalogConstants.js'; -import {tabsMapping as WCTabsMapping} from 'sdc-app/onboarding/onboard/OnboardConstants.js'; +import { tabsMapping } from './OnboardingCatalogConstants.js'; +import { tabsMapping as WCTabsMapping } from 'sdc-app/onboarding/onboard/OnboardConstants.js'; import featureToggle from 'sdc-app/features/featureToggle.js'; -import {featureToggleNames} from 'sdc-app/features/FeaturesConstants.js'; +import { featureToggleNames } from 'sdc-app/features/FeaturesConstants.js'; -const Separator = () => ( -
-); +const Separator = () =>
; -const Tab = ({onTabPress, title, dataTestId, activeTab, tabMapping}) => ( -
onTabPress(tabMapping)} - data-test-id={dataTestId}> - {title} -
+const Tab = ({ onTabPress, title, dataTestId, activeTab, tabMapping }) => ( +
onTabPress(tabMapping)} + data-test-id={dataTestId}> + {title} +
); const ArchiveTab = featureToggle(featureToggleNames.ARCHIVE_ITEM)(Tab); -const ArchiveTabSeparator = featureToggle(featureToggleNames.ARCHIVE_ITEM)(Separator); +const ArchiveTabSeparator = featureToggle(featureToggleNames.ARCHIVE_ITEM)( + Separator +); -const CatalogHeaderTabs = (props) => ( -
- - - - - -
+const CatalogHeaderTabs = props => ( +
+ + + + + +
); -const CatalogHeader = ({activeTab, onTabPress}) => ( -
- -
+const CatalogHeader = ({ activeTab, onTabPress }) => ( +
+ +
); const FilterCatalogHeader = () => ( -
-
-
- {i18n('ONBOARD CATALOG')} -
-
-
+
+
+
+ {i18n('ONBOARD CATALOG')} +
+
+
); - -const FeaturedCatalogHeader = featureToggle(featureToggleNames.FILTER)({AComp: FilterCatalogHeader, BComp: CatalogHeader}); +const FeaturedCatalogHeader = featureToggle(featureToggleNames.FILTER)({ + AComp: FilterCatalogHeader, + BComp: CatalogHeader +}); class OnboardingCatalogView extends React.Component { - renderViewByTab(activeTab){ - const {finalizedLicenseModelList: licenseModelList, fullLicenseModelList, users, vspOverlay, finalizedSoftwareProductList: softwareProductList, onSelectLicenseModel, onSelectSoftwareProduct, - onAddLicenseModelClick, onAddSoftwareProductClick, onVspOverlayChange, onVendorSelect, selectedVendor, searchValue, onMigrate, - archivedSoftwareProductList, archivedLicenseModelList} = this.props; + renderViewByTab(activeTab) { + const { + finalizedLicenseModelList: licenseModelList, + fullLicenseModelList, + users, + vspOverlay, + finalizedSoftwareProductList: softwareProductList, + onSelectLicenseModel, + onSelectSoftwareProduct, + onAddLicenseModelClick, + onAddSoftwareProductClick, + onVspOverlayChange, + onVendorSelect, + selectedVendor, + searchValue, + onMigrate, + archivedSoftwareProductList, + archivedLicenseModelList + } = this.props; - 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, users, WCTabsMapping.CATALOG)} - onSelectVSP={(item, users) => onSelectSoftwareProduct(item, users, WCTabsMapping.CATALOG)} - filter={searchValue} - onMigrate={onMigrate}/> - ); - case tabsMapping.BY_VENDOR: - default: - return ( - onSelectSoftwareProduct(item, users, WCTabsMapping.CATALOG)} - onSelectVLM={(item, users) => onSelectLicenseModel(item, users, WCTabsMapping.CATALOG)} - vspOverlay={vspOverlay} - onVendorSelect={onVendorSelect} - selectedVendor={selectedVendor} - onVspOverlayChange={onVspOverlayChange} - onMigrate={onMigrate} - filter={searchValue}/> - ); - } - } + 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, + users, + WCTabsMapping.CATALOG + ) + } + onSelectVSP={(item, users) => + onSelectSoftwareProduct( + item, + users, + WCTabsMapping.CATALOG + ) + } + filter={searchValue} + onMigrate={onMigrate} + /> + ); + case tabsMapping.BY_VENDOR: + default: + return ( + + onSelectSoftwareProduct( + item, + users, + WCTabsMapping.CATALOG + ) + } + onSelectVLM={(item, users) => + onSelectLicenseModel( + item, + users, + WCTabsMapping.CATALOG + ) + } + vspOverlay={vspOverlay} + onVendorSelect={onVendorSelect} + selectedVendor={selectedVendor} + onVspOverlayChange={onVspOverlayChange} + onMigrate={onMigrate} + filter={searchValue} + /> + ); + } + } - render() { - const {selectedVendor, catalogActiveTab: activeTab, onCatalogTabClick, onSearch, searchValue} = this.props; - return ( -
- {!selectedVendor && onSearch(event.target.value)} - activeTab={activeTab} - onTabPress={tab => onCatalogTabClick(tab)} - searchValue={searchValue}/>} - {this.renderViewByTab(activeTab)} -
- ); - } + render() { + const { + selectedVendor, + catalogActiveTab: activeTab, + onCatalogTabClick, + onSearch, + searchValue + } = this.props; + return ( +
+ {!selectedVendor && ( + onSearch(event.target.value)} + activeTab={activeTab} + onTabPress={tab => onCatalogTabClick(tab)} + searchValue={searchValue} + /> + )} + {this.renderViewByTab(activeTab)} +
+ ); + } } export default OnboardingCatalogView; diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/Tooltip.jsx b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/Tooltip.jsx index 80d9b07ac9..2f00bf95ed 100644 --- a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/Tooltip.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/Tooltip.jsx @@ -19,13 +19,27 @@ import Tooltip from 'react-bootstrap/lib/Tooltip.js'; import OverlayTrigger from 'react-bootstrap/lib/OverlayTrigger.js'; const tooltip = (msg, className = '') => ( - {msg} + + {msg} + ); -export const TooltipWrapper = ({placement = 'top', className = '', tooltipClassName = '', dataTestId, delayShow = 0, children}) => ( - -
{children}
- +export const TooltipWrapper = ({ + placement = 'top', + className = '', + tooltipClassName = '', + dataTestId, + delayShow = 0, + children +}) => ( + +
+ {children} +
+ ); export default tooltip; diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/VSPOverlay.jsx b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/VSPOverlay.jsx index a2852e5afa..c2eb8250f8 100644 --- a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/VSPOverlay.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/VSPOverlay.jsx @@ -16,36 +16,52 @@ import React from 'react'; import PropTypes from 'prop-types'; import i18n from 'nfvo-utils/i18n/i18n.js'; -import {migrationStatusMapper} from './OnboardingCatalogConstants.js'; +import { migrationStatusMapper } from './OnboardingCatalogConstants.js'; -const VSPOverlay = ({VSPList, onSelectVSP, onSeeMore, onMigrate}) => ( -
{ - 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)}
)} -
- {VSPList.length > 5 &&
{i18n('See More')}
} -
-
+const VSPOverlay = ({ VSPList, onSelectVSP, onSeeMore, onMigrate }) => ( +
{ + 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)} +
+ ))} +
+ {VSPList.length > 5 && ( +
+ {i18n('See More')} +
+ )} +
+
); VSPOverlay.PropTypes = { - VSPList: PropTypes.array, - onSelectVSP: PropTypes.func + VSPList: PropTypes.array, + onSelectVSP: PropTypes.func }; export default VSPOverlay; diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/VendorCatalogReducer.js b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/VendorCatalogReducer.js index dd8b41bd22..2d22a2db90 100644 --- a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/VendorCatalogReducer.js +++ b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/VendorCatalogReducer.js @@ -13,26 +13,26 @@ * or implied. See the License for the specific language governing * permissions and limitations under the License. */ -import {actionTypes} from './OnboardingCatalogConstants.js'; +import { actionTypes } from './OnboardingCatalogConstants.js'; export default (state = {}, action) => { - switch(action.type) { - case actionTypes.ONBOARDING_CATALOG_OPEN_VENDOR_PAGE: - return { - ...state, - selectedVendor: action.selectedVendor - }; - case actionTypes.CHANGE_VSP_OVERLAY: - return { - ...state, - vspOverlay: action.vendorId - }; - case actionTypes.CLOSE_VSP_OVERLAY: - return { - ...state, - vspOverlay: null - }; - default: - return state; - } + switch (action.type) { + case actionTypes.ONBOARDING_CATALOG_OPEN_VENDOR_PAGE: + return { + ...state, + selectedVendor: action.selectedVendor + }; + case actionTypes.CHANGE_VSP_OVERLAY: + return { + ...state, + vspOverlay: action.vendorId + }; + case actionTypes.CLOSE_VSP_OVERLAY: + return { + ...state, + vspOverlay: null + }; + default: + return state; + } }; 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 9914ea2154..02f8d50c5c 100644 --- a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/VendorCatalogView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/VendorCatalogView.jsx @@ -17,58 +17,100 @@ import React from 'react'; import VendorItem from './VendorItem.jsx'; import CatalogList from '../CatalogList.jsx'; import CatalogItemDetails from '../CatalogItemDetails.jsx'; -import {catalogItemTypes} from './OnboardingCatalogConstants.js'; -import {filterCatalogItemsByType} from './OnboardingCatalogUtils.js'; +import { catalogItemTypes } from './OnboardingCatalogConstants.js'; +import { filterCatalogItemsByType } from './OnboardingCatalogUtils.js'; -const VendorList = ({onAddVLM, onAddVSP, onSelectVSP, licenseModelList = [], vspOverlay: currentOverlay, onVspOverlayChange, onVendorSelect, filter, onMigrate, users}) => { - return( - - { - filterCatalogItemsByType({items: licenseModelList, filter}).map(vlm => - onSelectVSP(vsp, users)} - shouldShowOverlay={currentOverlay === vlm.id} - onVSPButtonClick={(hasVSP) => onVspOverlayChange(vlm.id === currentOverlay || !hasVSP ? null : vlm)} - onVendorSelect={onVendorSelect} - onMigrate={onMigrate} - vendor={vlm}/>) - } - - ); +const VendorList = ({ + onAddVLM, + onAddVSP, + onSelectVSP, + licenseModelList = [], + vspOverlay: currentOverlay, + onVspOverlayChange, + onVendorSelect, + filter, + onMigrate, + users +}) => { + return ( + + {filterCatalogItemsByType({ items: licenseModelList, filter }).map( + vlm => ( + onSelectVSP(vsp, users)} + shouldShowOverlay={currentOverlay === vlm.id} + onVSPButtonClick={hasVSP => + onVspOverlayChange( + vlm.id === currentOverlay || !hasVSP + ? null + : vlm + ) + } + onVendorSelect={onVendorSelect} + onMigrate={onMigrate} + vendor={vlm} + /> + ) + )} + + ); }; -const SoftwareProductListByVendor = ({onAddVSP, selectedVendor, onVendorSelect, onSelectVSP, onSelectVLM, filter, onMigrate, users}) => { - return( -
- {onAddVSP(selectedVendor.id);}} vendorPageOptions={{selectedVendor, onBack: () => onVendorSelect(false)}}> - onSelectVLM(selectedVendor, users)} - catalogItemTypeClass={catalogItemTypes.LICENSE_MODEL} - onMigrate={onMigrate} - catalogItemData={selectedVendor}/> - { - filterCatalogItemsByType({items: selectedVendor.softwareProductList, filter}).map(vsp => - onSelectVSP(vsp, users)} - catalogItemData={vsp}/> - ) - } - -
- ); +const SoftwareProductListByVendor = ({ + onAddVSP, + selectedVendor, + onVendorSelect, + onSelectVSP, + onSelectVLM, + filter, + onMigrate, + users +}) => { + return ( +
+ { + onAddVSP(selectedVendor.id); + }} + vendorPageOptions={{ + selectedVendor, + onBack: () => onVendorSelect(false) + }}> + onSelectVLM(selectedVendor, users)} + catalogItemTypeClass={catalogItemTypes.LICENSE_MODEL} + onMigrate={onMigrate} + catalogItemData={selectedVendor} + /> + {filterCatalogItemsByType({ + items: selectedVendor.softwareProductList, + filter + }).map(vsp => ( + onSelectVSP(vsp, users)} + catalogItemData={vsp} + /> + ))} + +
+ ); }; class VendorCatalogView extends React.Component { - render() { - let {selectedVendor} = this.props; - return( selectedVendor ? : ); - } + render() { + let { selectedVendor } = this.props; + return selectedVendor ? ( + + ) : ( + + ); + } } export default VendorCatalogView; 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 158282cc48..bef47d5acf 100644 --- a/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/VendorItem.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/VendorItem.jsx @@ -16,82 +16,102 @@ import React from 'react'; import PropTypes from 'prop-types'; import i18n from 'nfvo-utils/i18n/i18n.js'; -import {Tile, TileInfo, TileInfoLine, TileFooter, TileFooterCell, Button} from 'sdc-ui/lib/react'; +import { + Tile, + TileInfo, + TileInfoLine, + TileFooter, + TileFooterCell, + Button +} from 'sdc-ui/lib/react'; import VSPOverlay from './VSPOverlay.jsx'; -import {TooltipWrapper} from './Tooltip.jsx'; +import { TooltipWrapper } from './Tooltip.jsx'; class VendorItem extends React.Component { + static PropTypes = { + softwareProductList: PropTypes.array, + vendor: PropTypes.object, + shouldShowOverlay: PropTypes.bool, + onSelectVSP: PropTypes.func, + onVendorSelect: PropTypes.func, + onAddVSP: PropTypes.func, + onVSPButtonClick: PropTypes.func + }; - static PropTypes = { - softwareProductList: PropTypes.array, - vendor: PropTypes.object, - shouldShowOverlay: PropTypes.bool, - onSelectVSP: PropTypes.func, - onVendorSelect: PropTypes.func, - onAddVSP: PropTypes.func, - onVSPButtonClick: PropTypes.func - }; + render() { + let { + vendor, + onSelectVSP, + shouldShowOverlay, + onVendorSelect, + onMigrate + } = this.props; + let { softwareProductList = [], name } = vendor; + return ( + onVendorSelect(vendor)}> + + + + {name} + + + + + {shouldShowOverlay && + softwareProductList.length > 0 && ( + onVendorSelect(vendor)} + /> + )} + + + + + + + + + ); + } - render() { - let {vendor, onSelectVSP, shouldShowOverlay, onVendorSelect, onMigrate} = this.props; - let {softwareProductList = [], name} = vendor; - return ( - onVendorSelect(vendor)}> - - - {name} - - - - {shouldShowOverlay && softwareProductList.length > 0 && - onVendorSelect(vendor)} /> - } - - - - - - - - - ); - } - - onCreateVspClick(e) { - e.stopPropagation(); - e.preventDefault(); - const {onAddVSP, vendor: {id}} = this.props; - onAddVSP(id); - } - - handleVspCountClick(e){ - e.stopPropagation(); - e.preventDefault(); - const {onVSPButtonClick, vendor: {softwareProductList}} = this.props; - const hasVSP = Boolean(softwareProductList.length); - onVSPButtonClick(hasVSP); - } + onCreateVspClick(e) { + e.stopPropagation(); + e.preventDefault(); + const { onAddVSP, vendor: { id } } = this.props; + onAddVSP(id); + } + handleVspCountClick(e) { + e.stopPropagation(); + e.preventDefault(); + const { + onVSPButtonClick, + vendor: { softwareProductList } + } = this.props; + const hasVSP = Boolean(softwareProductList.length); + onVSPButtonClick(hasVSP); + } } export default VendorItem; -- cgit 1.2.3-korg