diff options
Diffstat (limited to 'openecomp-ui/src/sdc-app/onboarding/onboard/CatalogItemDetails.jsx')
-rw-r--r-- | openecomp-ui/src/sdc-app/onboarding/onboard/CatalogItemDetails.jsx | 72 |
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 = { |