2 * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
4 * Licensed under the Apache License, Version 2.0 (the "License");
5 * you may not use this file except in compliance with the License.
6 * You may obtain a copy of the License at
8 * http://www.apache.org/licenses/LICENSE-2.0
10 * Unless required by applicable law or agreed to in writing, software
11 * distributed under the License is distributed on an "AS IS" BASIS,
12 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express
13 * or implied. See the License for the specific language governing
14 * permissions and limitations under the License.
16 import React from 'react';
17 import {catalogItemTypeClasses, migrationStatusMapper} from './onboardingCatalog/OnboardingCatalogConstants.js';
18 import CatalogTile from './CatalogTile.jsx';
19 import VersionControllerUtils from 'nfvo-components/panel/versionController/VersionControllerUtils.js';
20 import {statusEnum, statusBarTextMap} from 'nfvo-components/panel/versionController/VersionControllerConstants.js';
21 import SVGIcon from 'nfvo-components/icon/SVGIcon.jsx';
22 import i18n from 'nfvo-utils/i18n/i18n.js';
23 import OverlayTrigger from 'react-bootstrap/lib/OverlayTrigger.js';
24 import tooltip from './onboardingCatalog/Tooltip.jsx';
28 const CatalogTileIcon = ({catalogItemTypeClass}) => (
29 <div className={'catalog-tile-icon ' + catalogItemTypeClass}>
30 <div className='icon'><SVGIcon
31 name={catalogItemTypeClass === catalogItemTypeClasses.LICENSE_MODEL ? 'vlm' : 'vsp' }/>
36 const ItemTypeTitle = ({catalogItemTypeClass}) => {
37 const itemTypeTitle = catalogItemTypeClass === catalogItemTypeClasses.LICENSE_MODEL ? i18n('VLM') : i18n('VSP');
39 <div className={`catalog-tile-type ${catalogItemTypeClass}`}>{itemTypeTitle}</div>
43 const CatalogTileVendorName = ({vendorName, catalogItemTypeClass}) => {
44 const name = catalogItemTypeClass === catalogItemTypeClasses.SOFTWARE_PRODUCT ? vendorName : '';
47 <OverlayTrigger placement='top' overlay={tooltip(name)}>
48 <div className='catalog-tile-vendor-name'>{name}</div>
54 const CatalogTileItemName = ({name}) => (
56 <OverlayTrigger placement='top' overlay={tooltip(name && name.toUpperCase())}>
57 <div className='catalog-tile-item-name'>{name}</div>
62 const VersionInfo = ({version}) => (
63 <div className='catalog-tile-version-info'>
64 <div className='catalog-tile-item-version' data-test-id='catalog-item-version'>
70 const EntityDetails = ({catalogItemData, catalogItemTypeClass}) => {
71 const {vendorName, name, version} = catalogItemData;
73 <div className='catalog-tile-entity-details'>
74 <CatalogTileVendorName catalogItemTypeClass={catalogItemTypeClass} vendorName={vendorName}/>
75 <CatalogTileItemName name={name}/>
76 <VersionInfo version={version.label} />
82 const ItemStatusInfo = ({catalogItemTypeClass, lockingUser, itemStatus}) => {
83 const status = statusBarTextMap[itemStatus];
84 const lockedBy = lockingUser ? ` by ${lockingUser}` : '';
85 const toolTipMsg = `${status}${lockedBy}`;
88 <div className={'catalog-tile-content ' + catalogItemTypeClass}>
89 <div className='catalog-tile-locking-user-name'>{i18n(status)}</div>
90 <OverlayTrigger placement='top' overlay={tooltip(toolTipMsg)}>
91 <div className='catalog-tile-check-in-status'><SVGIcon
92 name={itemStatus === statusEnum.CHECK_OUT_STATUS ? 'unlocked' : 'locked'}
93 data-test-id={itemStatus === statusEnum.CHECK_IN_STATUS ? 'catalog-item-checked-in' : 'catalog-item-checked-out'}/>
101 const CatalogItemDetails = ({catalogItemData, catalogItemTypeClass, onSelect, onMigrate}) => {
103 let {status: itemStatus} = VersionControllerUtils.getCheckOutStatusKindByUserID(catalogItemData.status, catalogItemData.lockingUser);
106 <CatalogTile catalogItemTypeClass={catalogItemTypeClass} onSelect={() => {
107 if (catalogItemData.isOldVersion && catalogItemData.isOldVersion === migrationStatusMapper.OLD_VERSION) {
109 softwareProduct: catalogItemData
114 }} data-test-id={catalogItemTypeClass}>
115 <div className='catalog-tile-top item-details'>
116 <ItemTypeTitle catalogItemTypeClass={catalogItemTypeClass}/>
117 <CatalogTileIcon catalogItemTypeClass={catalogItemTypeClass}/>
118 <EntityDetails catalogItemTypeClass={catalogItemTypeClass} catalogItemData={catalogItemData} />
119 <ItemStatusInfo itemStatus={itemStatus} catalogItemTypeClass={catalogItemTypeClass} lockingUser={catalogItemData.lockingUser} />
126 CatalogItemDetails.PropTypes = {
127 catalogItemData: React.PropTypes.obj,
128 catalogItemTypeClass: React.PropTypes.string,
129 onSelect: React.PropTypes.func,
130 onMigrate: React.PropTypes.func
133 export default CatalogItemDetails;