sdc-workflow-designer-ui/src/main/frontend/src/shared/modal/ModalWrapperView.jsx

   1 /*
   2 * Copyright © 2018 European Support Limited
   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 or implied.
  13 * See the License for the specific language governing permissions and
  14 * limitations under the License.
  15 */
  16
  17 import React from 'react';
  18 import PropTypes from 'prop-types';
  19
  20 import {
  21     Modal,
  22     ModalHeader,
  23     ModalTitle,
  24     ModalBody,
  25     ModalFooter
  26 } from 'onap-ui-react';
  27
  28 import modalWrapperComponents from 'shared/modal/modalWrapperComponents';
  29
  30 class ModalWrapperView extends React.Component {
  31     constructor(props) {
  32         super(props);
  33
  34         this.handleClose = this.handleClose.bind(this);
  35     }
  36
  37     handleClose() {
  38         const { hideModal, onClose } = this.props;
  39
  40         hideModal();
  41
  42         if (typeof onClose === 'function') {
  43             onClose();
  44         }
  45     }
  46
  47     render() {
  48         const { modal } = this.props;
  49
  50         if (!modal || !modal.type) {
  51             return null;
  52         }
  53
  54         const {
  55             size,
  56             type,
  57             title,
  58             body,
  59             withButtons,
  60             actionButtonText,
  61             actionButtonClick,
  62             closeButtonText,
  63             customComponentName,
  64             customComponentProps
  65         } = modal;
  66
  67         const CustomComponent =
  68             customComponentName && modalWrapperComponents[customComponentName];
  69
  70         return (
  71             <Modal show size={size} type={type}>
  72                 <ModalHeader onClose={this.handleClose} type={type}>
  73                     {title && <ModalTitle>{title}</ModalTitle>}
  74                 </ModalHeader>
  75                 {body && <ModalBody>{body}</ModalBody>}
  76                 {CustomComponent && (
  77                     <CustomComponent {...customComponentProps} />
  78                 )}
  79                 {withButtons && (
  80                     <ModalFooter
  81                         actionButtonText={actionButtonText}
  82                         actionButtonClick={actionButtonClick}
  83                         closeButtonText={closeButtonText}
  84                         onClose={this.handleClose}
  85                         withButtons
  86                     />
  87                 )}
  88             </Modal>
  89         );
  90     }
  91 }
  92
  93 ModalWrapperView.propTypes = {
  94     hideModal: PropTypes.func,
  95     onClose: PropTypes.func,
  96     modal: PropTypes.object
  97 };
  98
  99 export default ModalWrapperView;