summaryrefslogtreecommitdiffstats
path: root/openecomp-ui/src/sdc-app/onboarding/onboard/CatalogItemDetails.jsx
diff options
context:
space:
mode:
Diffstat (limited to 'openecomp-ui/src/sdc-app/onboarding/onboard/CatalogItemDetails.jsx')
-rw-r--r--openecomp-ui/src/sdc-app/onboarding/onboard/CatalogItemDetails.jsx72
1 files changed, 34 insertions, 38 deletions
diff --git a/openecomp-ui/src/sdc-app/onboarding/onboard/CatalogItemDetails.jsx b/openecomp-ui/src/sdc-app/onboarding/onboard/CatalogItemDetails.jsx
index c63fbff21b..3b3e2fcf40 100644
--- a/openecomp-ui/src/sdc-app/onboarding/onboard/CatalogItemDetails.jsx
+++ b/openecomp-ui/src/sdc-app/onboarding/onboard/CatalogItemDetails.jsx
@@ -18,45 +18,40 @@ import {catalogItemTypeClasses, migrationStatusMapper} from './onboardingCatalog
import CatalogTile from './CatalogTile.jsx';
import VersionControllerUtils from 'nfvo-components/panel/versionController/VersionControllerUtils.js';
import {statusEnum, statusBarTextMap} from 'nfvo-components/panel/versionController/VersionControllerConstants.js';
-import SVGIcon from 'nfvo-components/icon/SVGIcon.jsx';
+import SVGIcon from 'sdc-ui/lib/react/SVGIcon.js';
import i18n from 'nfvo-utils/i18n/i18n.js';
import OverlayTrigger from 'react-bootstrap/lib/OverlayTrigger.js';
import tooltip from './onboardingCatalog/Tooltip.jsx';
-
const CatalogTileIcon = ({catalogItemTypeClass}) => (
- <div className={'catalog-tile-icon ' + catalogItemTypeClass}>
- <div className='icon'><SVGIcon
- name={catalogItemTypeClass === catalogItemTypeClasses.LICENSE_MODEL ? 'vlm' : 'vsp' }/>
- </div>
+ <div className={'catalog-tile-icon ' + catalogItemTypeClass}>
+ <div className='icon'><SVGIcon
+ name={catalogItemTypeClass === catalogItemTypeClasses.LICENSE_MODEL ? 'vlm' : 'vsp' }/>
</div>
+ </div>
);
const ItemTypeTitle = ({catalogItemTypeClass}) => {
const itemTypeTitle = catalogItemTypeClass === catalogItemTypeClasses.LICENSE_MODEL ? i18n('VLM') : i18n('VSP');
- return(
+ return (
<div className={`catalog-tile-type ${catalogItemTypeClass}`}>{itemTypeTitle}</div>
);
};
-const CatalogTileVendorName = ({vendorName, catalogItemTypeClass}) => {
- const name = catalogItemTypeClass === catalogItemTypeClasses.SOFTWARE_PRODUCT ? vendorName : '';
- return(
- <div>
- <OverlayTrigger placement='top' overlay={tooltip(name)}>
- <div className='catalog-tile-vendor-name'>{name}</div>
- </OverlayTrigger>
- </div>
+const CatalogTileVendorName = ({vendorName, catalogItemTypeClass}) => {
+ const name = catalogItemTypeClass === catalogItemTypeClasses.SOFTWARE_PRODUCT ? vendorName : '';
+ return ( name ?
+ <OverlayTrigger placement='top' overlay={tooltip(name)}>
+ <div className='catalog-tile-vendor-name'>{name}</div>
+ </OverlayTrigger> : <div className='catalog-tile-vendor-name'>{name}</div>
);
};
const CatalogTileItemName = ({name}) => (
- <div>
- <OverlayTrigger placement='top' overlay={tooltip(name && name.toUpperCase())}>
- <div className='catalog-tile-item-name'>{name}</div>
- </OverlayTrigger>
- </div>
+ <OverlayTrigger placement='top' overlay={tooltip(name && name.toUpperCase())}>
+ <div className='catalog-tile-item-name'>{name}</div>
+ </OverlayTrigger>
);
const VersionInfo = ({version}) => (
@@ -64,7 +59,7 @@ const VersionInfo = ({version}) => (
<div className='catalog-tile-item-version' data-test-id='catalog-item-version'>
V {version}
</div>
- </div>
+ </div>
);
const EntityDetails = ({catalogItemData, catalogItemTypeClass}) => {
@@ -73,54 +68,55 @@ const EntityDetails = ({catalogItemData, catalogItemTypeClass}) => {
<div className='catalog-tile-entity-details'>
<CatalogTileVendorName catalogItemTypeClass={catalogItemTypeClass} vendorName={vendorName}/>
<CatalogTileItemName name={name}/>
- <VersionInfo version={version.label} />
- </div>
+ <VersionInfo version={version.label}/>
+ </div>
);
};
-const ItemStatusInfo = ({catalogItemTypeClass, lockingUser, itemStatus}) => {
+const ItemStatusInfo = ({catalogItemTypeClass, lockingUser, itemStatus}) => {
const status = statusBarTextMap[itemStatus];
const lockedBy = lockingUser ? ` by ${lockingUser}` : '';
const toolTipMsg = `${status}${lockedBy}`;
return (
- <div className={'catalog-tile-content ' + catalogItemTypeClass}>
+ <div className={'catalog-tile-content ' + catalogItemTypeClass}>
<div className='catalog-tile-locking-user-name'>{i18n(status)}</div>
- <OverlayTrigger placement='top' overlay={tooltip(toolTipMsg)}>
+ <OverlayTrigger placement='top' overlay={tooltip(toolTipMsg)}>
<div className='catalog-tile-check-in-status'><SVGIcon
name={itemStatus === statusEnum.CHECK_OUT_STATUS ? 'unlocked' : 'locked'}
data-test-id={itemStatus === statusEnum.CHECK_IN_STATUS ? 'catalog-item-checked-in' : 'catalog-item-checked-out'}/>
</div>
- </OverlayTrigger>
+ </OverlayTrigger>
</div>
-
+
);
};
-const CatalogItemDetails = ({catalogItemData, catalogItemTypeClass, onSelect, onMigrate}) => {
-
+const CatalogItemDetails = ({catalogItemData, catalogItemTypeClass, onSelect, onMigrate}) => {
+
let {status: itemStatus} = VersionControllerUtils.getCheckOutStatusKindByUserID(catalogItemData.status, catalogItemData.lockingUser);
-
+
return (
<CatalogTile catalogItemTypeClass={catalogItemTypeClass} onSelect={() => {
if (catalogItemData.isOldVersion && catalogItemData.isOldVersion === migrationStatusMapper.OLD_VERSION) {
onMigrate({
softwareProduct: catalogItemData
});
- } else {
+ }
+ else {
onSelect();
}
}} data-test-id={catalogItemTypeClass}>
- <div className='catalog-tile-top item-details'>
- <ItemTypeTitle catalogItemTypeClass={catalogItemTypeClass}/>
- <CatalogTileIcon catalogItemTypeClass={catalogItemTypeClass}/>
- <EntityDetails catalogItemTypeClass={catalogItemTypeClass} catalogItemData={catalogItemData} />
- <ItemStatusInfo itemStatus={itemStatus} catalogItemTypeClass={catalogItemTypeClass} lockingUser={catalogItemData.lockingUser} />
+ <div className='catalog-tile-top item-details'>
+ <ItemTypeTitle catalogItemTypeClass={catalogItemTypeClass}/>
+ <CatalogTileIcon catalogItemTypeClass={catalogItemTypeClass}/>
+ <EntityDetails catalogItemTypeClass={catalogItemTypeClass} catalogItemData={catalogItemData}/>
+ <ItemStatusInfo itemStatus={itemStatus} catalogItemTypeClass={catalogItemTypeClass} lockingUser={catalogItemData.lockingUser}/>
</div>
</CatalogTile>
);
-
+
};
CatalogItemDetails.PropTypes = {