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 import ListEditorView from 'nfvo-components/listEditor/ListEditorView.jsx';
  21 import ListEditorItemView from 'nfvo-components/listEditor/ListEditorItemView.jsx';
  22
  23 import LicenseKeyGroupsEditor from './LicenseKeyGroupsEditor.js';
  24 import InputOptions, {
  25     other as optionInputOther
  26 } from 'nfvo-components/input/validation/InputOptions.jsx';
  27 import { optionsInputValues } from './LicenseKeyGroupsConstants';
  28
  29 class LicenseKeyGroupsListEditorView extends React.Component {
  30     static propTypes = {
  31         vendorName: PropTypes.string,
  32         licenseModelId: PropTypes.string.isRequired,
  33         licenseKeyGroupsList: PropTypes.array,
  34         isReadOnlyMode: PropTypes.bool.isRequired,
  35         isDisplayModal: PropTypes.bool,
  36         isModalInEditMode: PropTypes.bool,
  37         onAddLicenseKeyGroupClick: PropTypes.func,
  38         onEditLicenseKeyGroupClick: PropTypes.func,
  39         onDeleteLicenseKeyGroupClick: PropTypes.func
  40     };
  41
  42     static defaultProps = {
  43         licenseKeyGroupsList: []
  44     };
  45
  46     state = {
  47         localFilter: ''
  48     };
  49
  50     render() {
  51         let {
  52             licenseModelId,
  53             isReadOnlyMode,
  54             isDisplayModal,
  55             isModalInEditMode,
  56             version
  57         } = this.props;
  58         let { onAddLicenseKeyGroupClick } = this.props;
  59         const { localFilter } = this.state;
  60
  61         return (
  62             <div className="license-model-list-editor license-key-groups-list-editor">
  63                 <ListEditorView
  64                     title={i18n('License Key Groups')}
  65                     plusButtonTitle={i18n('Add License Key Group')}
  66                     onAdd={onAddLicenseKeyGroupClick}
  67                     filterValue={localFilter}
  68                     onFilter={value => this.setState({ localFilter: value })}
  69                     isReadOnlyMode={isReadOnlyMode}>
  70                     {this.filterList().map(licenseKeyGroup =>
  71                         this.renderLicenseKeyGroupListItem(
  72                             licenseKeyGroup,
  73                             isReadOnlyMode
  74                         )
  75                     )}
  76                 </ListEditorView>
  77                 <Modal
  78                     show={isDisplayModal}
  79                     bsSize="large"
  80                     animation={true}
  81                     className="onborading-modal license-model-modal license-key-groups-modal">
  82                     <Modal.Header>
  83                         <Modal.Title>{`${
  84                             isModalInEditMode
  85                                 ? i18n('Edit License Key Group')
  86                                 : i18n('Create New License Key Group')
  87                         }`}</Modal.Title>
  88                     </Modal.Header>
  89                     <Modal.Body>
  90                         {isDisplayModal && (
  91                             <LicenseKeyGroupsEditor
  92                                 version={version}
  93                                 licenseModelId={licenseModelId}
  94                                 isReadOnlyMode={isReadOnlyMode}
  95                             />
  96                         )}
  97                     </Modal.Body>
  98                 </Modal>
  99             </div>
 100         );
 101     }
 102
 103     filterList() {
 104         let { licenseKeyGroupsList } = this.props;
 105         let { localFilter } = this.state;
 106         if (localFilter.trim()) {
 107             const filter = new RegExp(escape(localFilter), 'i');
 108             return licenseKeyGroupsList.filter(
 109                 ({ name = '', description = '', type = '' }) => {
 110                     return (
 111                         escape(name).match(filter) ||
 112                         escape(description).match(filter) ||
 113                         escape(type).match(filter)
 114                     );
 115                 }
 116             );
 117         } else {
 118             return licenseKeyGroupsList;
 119         }
 120     }
 121
 122     renderLicenseKeyGroupListItem(licenseKeyGroup, isReadOnlyMode) {
 123         let { id, name, description, type } = licenseKeyGroup;
 124         let {
 125             onEditLicenseKeyGroupClick,
 126             onDeleteLicenseKeyGroupClick
 127         } = this.props;
 128         return (
 129             <ListEditorItemView
 130                 key={id}
 131                 onSelect={() => onEditLicenseKeyGroupClick(licenseKeyGroup)}
 132                 onDelete={() => onDeleteLicenseKeyGroupClick(licenseKeyGroup)}
 133                 className="list-editor-item-view"
 134                 isReadOnlyMode={isReadOnlyMode}>
 135                 <div className="list-editor-item-view-field">
 136                     <div className="title">{i18n('Name')}</div>
 137                     <div className="text name">{name}</div>
 138                 </div>
 139
 140                 <div className="list-editor-item-view-field">
 141                     <div className="title">{i18n('Type')}</div>
 142                     <div className="text type">
 143                         {InputOptions.getTitleByName(optionsInputValues, type)}
 144                     </div>
 145                 </div>
 146
 147                 <div className="list-editor-item-view-field">
 148                     <div className="title">{i18n('Description')}</div>
 149                     <div className="text description">{description}</div>
 150                 </div>
 151             </ListEditorItemView>
 152         );
 153     }
 154
 155     extractValue(item) {
 156         if (item === undefined) {
 157             return '';
 158         } //TODO fix it sooner rather than later
 159
 160         return item
 161             ? item.choice === optionInputOther.OTHER
 162               ? item.other
 163               : InputOptions.getTitleByName(optionsInputValues, item.choice)
 164             : '';
 165     }
 166 }
 167
 168 export default LicenseKeyGroupsListEditorView;
 169
 170 export function generateConfirmationMsg(licenseKeyGroupToDelete) {
 171     let name = licenseKeyGroupToDelete ? licenseKeyGroupToDelete.name : '';
 172     let msg = i18n('Are you sure you want to delete "{name}"?', { name: name });
 173     let subMsg =
 174         licenseKeyGroupToDelete.referencingFeatureGroups &&
 175         licenseKeyGroupToDelete.referencingFeatureGroups.length > 0
 176             ? i18n(
 177                   'This license key group is associated with one or more feature groups'
 178               )
 179             : '';
 180     return (
 181         <div>
 182             <p>{msg}</p>
 183             <p>{subMsg}</p>
 184         </div>
 185     );
 186 }