github.com/replicatedhq/ship@v0.55.0/web/init/src/components/kustomize/kustomize_overlay/KustomizeModal.jsx (about) 1 import React from "react"; 2 import Modal from "react-modal"; 3 import PropTypes from "prop-types"; 4 5 const KustomizeModal = ({ 6 isOpen, 7 onRequestClose, 8 discardOverlay, 9 message, 10 subMessage, 11 discardMessage, 12 }) => ( 13 <Modal 14 isOpen={isOpen} 15 onRequestClose={onRequestClose} 16 shouldReturnFocusAfterClose={false} 17 ariaHideApp={false} 18 contentLabel="Modal" 19 className="Modal DefaultSize" 20 > 21 <div className="Modal-header"> 22 <p>{ message }</p> 23 </div> 24 <div className="flex flex-column Modal-body"> 25 <p className="u-fontSize--large u-fontWeight--normal u-color--dustyGray u-lineHeight--more">{ subMessage }</p> 26 <div className="flex justifyContent--flexEnd u-marginTop--20"> 27 <button className="btn secondary u-marginRight--10" onClick={() => onRequestClose("")}>Cancel</button> 28 <button type="button" className="btn primary" onClick={discardOverlay}>{discardMessage}</button> 29 </div> 30 </div> 31 </Modal> 32 ); 33 34 KustomizeModal.propTypes = { 35 // boolean to control whether the modal is open 36 isOpen: PropTypes.bool, 37 onRequestClose: PropTypes.func, 38 // function invoked when pressing the "confirm" button 39 discardOverlay: PropTypes.func, 40 // header message to display at the top of the modal 41 message: PropTypes.string, 42 // message to display in the body of the modal 43 subMessage: PropTypes.string, 44 // text to display within the delete button 45 discardMessage: PropTypes.string, 46 } 47 48 export default KustomizeModal;