openecomp-ui/src/sdc-app/onboarding/onboard/onboardingCatalog/VSPOverlay.jsx

   1 /*!
   2  * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
   3  *
   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
   7  *
   8  * http://www.apache.org/licenses/LICENSE-2.0
   9  *
  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.
  15  */
  16 import React from 'react';
  17 import i18n from 'nfvo-utils/i18n/i18n.js';
  18 import {migrationStatusMapper} from './OnboardingCatalogConstants.js';
  19
  20 const VSPOverlay = ({VSPList, onSelectVSP, onSeeMore, onMigrate}) => (
  21         <div className='vsp-overlay-wrapper' onClick={(e) => {
  22                 e.stopPropagation();
  23                 e.preventDefault();
  24         }}>
  25                 <div className='vsp-overlay-arrow'></div>
  26                 <div className='vsp-overlay'>
  27                         <div className='vsp-overlay-title'>{i18n('Recently Edited')}</div>
  28                         <div className='vsp-overlay-list'>
  29                                 {VSPList.slice(0, 5).map(vsp => <div key={vsp.id} className='vsp-overlay-detail' onClick={() => {
  30                                         if (vsp.isOldVersion && vsp.isOldVersion === migrationStatusMapper.OLD_VERSION) {
  31                                                 onMigrate({
  32                                                         softwareProduct: vsp
  33                                                 });
  34                                         } else {
  35                                                 onSelectVSP(vsp);
  36                                         }
  37                                 }
  38                                 }>{i18n(vsp.name)}</div>)}
  39                         </div>
  40                         {VSPList.length > 5 && <div className='vsp-overlay-see-more' onClick={onSeeMore}>{i18n('See More')}</div>}
  41                 </div>
  42         </div>
  43 );
  44
  45 VSPOverlay.PropTypes = {
  46         VSPList: React.PropTypes.array,
  47         onSelectVSP: React.PropTypes.func
  48 };
  49
  50 export default VSPOverlay;