gerrit.onap Code Review - sdc.git/blob

   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 PropTypes from 'prop-types';
  18 import i18n from 'nfvo-utils/i18n/i18n.js';
  19 import Modal from 'nfvo-components/modal/Modal.jsx';
  20
  21 import ListEditorView from 'nfvo-components/listEditor/ListEditorView.jsx';
  22 import ListEditorItemView from 'nfvo-components/listEditor/ListEditorItemView.jsx';
  23 import LicenseAgreementEditor from './LicenseAgreementEditor.js';
  24 import { extractValue } from './LicenseAgreementConstants';
  25
  26 class LicenseAgreementListEditorView extends React.Component {
  27     static propTypes = {
  28         vendorName: PropTypes.string,
  29         licenseModelId: PropTypes.string.isRequired,
  30         licenseAgreementList: PropTypes.array,
  31         isReadOnlyMode: PropTypes.bool.isRequired,
  32         isDisplayModal: PropTypes.bool,
  33         isModalInEditMode: PropTypes.bool,
  34         onAddLicenseAgreementClick: PropTypes.func,
  35         onEditLicenseAgreementClick: PropTypes.func,
  36         onDeleteLicenseAgreement: PropTypes.func
  37     };
  38
  39     static defaultProps = {
  40         licenseAgreementList: []
  41     };
  42
  43     state = {
  44         localFilter: ''
  45     };
  46
  47     render() {
  48         const {
  49             licenseModelId,
  50             isReadOnlyMode,
  51             isDisplayModal,
  52             isModalInEditMode,
  53             version
  54         } = this.props;
  55         const { onAddLicenseAgreementClick } = this.props;
  56         const { localFilter } = this.state;
  57
  58         return (
  59             <div className="license-model-list-editor license-agreement-list-editor">
  60                 <ListEditorView
  61                     title={i18n('License Agreements')}
  62                     plusButtonTitle={i18n('Add License Agreement')}
  63                     onAdd={() => onAddLicenseAgreementClick(version)}
  64                     filterValue={localFilter}
  65                     onFilter={value => this.setState({ localFilter: value })}
  66                     isReadOnlyMode={isReadOnlyMode}>
  67                     {this.filterList().map(licenseAgreement =>
  68                         this.renderLicenseAgreementListItem(
  69                             licenseAgreement,
  70                             isReadOnlyMode,
  71                             version
  72                         )
  73                     )}
  74                 </ListEditorView>
  75                 <Modal
  76                     show={isDisplayModal}
  77                     bsSize="large"
  78                     animation={true}
  79                     className="onborading-modal license-model-modal license-agreement-modal">
  80                     <Modal.Header>
  81                         <Modal.Title>{`${
  82                             isModalInEditMode
  83                                 ? i18n('Edit License Agreement')
  84                                 : i18n('Create New License Agreement')
  85                         }`}</Modal.Title>
  86                     </Modal.Header>
  87                     <Modal.Body>
  88                         {isDisplayModal && (
  89                             <LicenseAgreementEditor
  90                                 version={version}
  91                                 licenseModelId={licenseModelId}
  92                                 isReadOnlyMode={isReadOnlyMode}
  93                             />
  94                         )}
  95                     </Modal.Body>
  96                 </Modal>
  97             </div>
  98         );
  99     }
 100
 101     filterList() {
 102         let { licenseAgreementList } = this.props;
 103         let { localFilter } = this.state;
 104         if (localFilter.trim()) {
 105             const filter = new RegExp(escape(localFilter), 'i');
 106             return licenseAgreementList.filter(
 107                 ({ name = '', description = '', licenseTerm = '' }) => {
 108                     return (
 109                         escape(name).match(filter) ||
 110                         escape(description).match(filter) ||
 111                         escape(extractValue(licenseTerm)).match(filter)
 112                     );
 113                 }
 114             );
 115         } else {
 116             return licenseAgreementList;
 117         }
 118     }
 119
 120     renderLicenseAgreementListItem(licenseAgreement, isReadOnlyMode, version) {
 121         let {
 122             id,
 123             name,
 124             description,
 125             licenseTerm,
 126             featureGroupsIds = []
 127         } = licenseAgreement;
 128         let {
 129             onEditLicenseAgreementClick,
 130             onDeleteLicenseAgreement
 131         } = this.props;
 132         return (
 133             <ListEditorItemView
 134                 key={id}
 135                 onSelect={() =>
 136                     onEditLicenseAgreementClick(licenseAgreement, version)
 137                 }
 138                 onDelete={() =>
 139                     onDeleteLicenseAgreement(licenseAgreement, version)
 140                 }
 141                 className="list-editor-item-view"
 142                 isReadOnlyMode={isReadOnlyMode}>
 143                 <div className="list-editor-item-view-field">
 144                     <div className="title">{i18n('Name')}</div>
 145                     <div className="text name">{name}</div>
 146                 </div>
 147                 <div className="list-editor-item-view-field">
 148                     <div className="list-editor-item-view-field-tight">
 149                         <div className="title">{i18n('Type')}</div>
 150                         <div className="text type">
 151                             {extractValue(licenseTerm)}
 152                         </div>
 153                     </div>
 154                     <div className="list-editor-item-view-field-tight">
 155                         <div className="title">{i18n('Feature')}</div>
 156                         <div className="title">{i18n('Groups')}</div>
 157                         <div className="feature-groups-count">
 158                             {featureGroupsIds.length}
 159                         </div>
 160                     </div>
 161                 </div>
 162                 <div className="list-editor-item-view-field">
 163                     <div className="title">{i18n('Description')}</div>
 164                     <div className="text description">{description}</div>
 165                 </div>
 166             </ListEditorItemView>
 167         );
 168     }
 169 }
 170
 171 export default LicenseAgreementListEditorView;