diff options
Diffstat (limited to 'ui/app/components')
-rw-r--r-- | ui/app/components/center.js | 43 | ||||
-rw-r--r-- | ui/app/components/confirmation.js | 68 | ||||
-rw-r--r-- | ui/app/components/spinner/index.js | 19 |
3 files changed, 59 insertions, 71 deletions
diff --git a/ui/app/components/center.js b/ui/app/components/center.js index 5e47d0c..e7e074a 100644 --- a/ui/app/components/center.js +++ b/ui/app/components/center.js @@ -3,38 +3,27 @@ // import React from 'react' +import PropTypes from 'prop-types' -class Center extends React.Component { +const Center = props => ( + <div className={"center-container center-" + props.direction}> + <div className="center-item" style={props.width ? {width: props.width + 'px'} : null}> + {props.children} + </div> + </div> +) - static get defaultProps() {return{ - width: null, - direction: 'both', - }} - - constructor(props) { - super(props) - } - - render() { - let style = null - if (this.props.width) { - style = {width: this.props.width + 'px'} - } - let className = "center-container center-" + this.props.direction - return ( - <div className={className}> - <div className="center-item" style={style}> - {this.props.children} - </div> - </div> - ) - } +Center.defaultProps = { + width: null, + direction: 'both' } Center.propTypes = { - children: React.PropTypes.oneOfType([ - React.PropTypes.element, - React.PropTypes.arrayOf(React.PropTypes.element) + children: PropTypes.oneOfType([ + PropTypes.element, + PropTypes.arrayOf( + PropTypes.element + ) ]) } diff --git a/ui/app/components/confirmation.js b/ui/app/components/confirmation.js index 6918616..deceb47 100644 --- a/ui/app/components/confirmation.js +++ b/ui/app/components/confirmation.js @@ -3,41 +3,43 @@ // import React from 'react' -import {Button, ButtonGroup, ButtonToolbar, Glyphicon, Modal} - from 'react-bootstrap' +import {Button, ButtonToolbar, Modal} from 'react-bootstrap' +import PropTypes from 'prop-types' -export default class Confirmation extends React.Component { +const Confirmation = props => ( + <Modal> + <Modal.Header closeButton> + <Modal.Title> + {props.title} + </Modal.Title> + </Modal.Header> + <Modal.Body> + <ButtonToolbar> + <Button onClick={props.onAccept} bsStyle="success"> + {props.acceptStr} + </Button> + <Button onClick={props.onCancel}> + {props.cancelStr} + </Button> + </ButtonToolbar> + </Modal.Body> + </Modal> +) - static get defaultProps() {return{ - title: "Are you sure?", - onCancel: null, - onAccept: null, - acceptStr: 'Accept', - cancelStr: 'Cancel' - }} - - constructor(props) { - super(props) - } +Confirmation.defaultProps = { + title: "Are you sure?", + onCancel: null, + onAccept: null, + acceptStr: 'Accept', + cancelStr: 'Cancel' +} - render() { - return ( - <Modal show={true} onHide={this.props.onCancel}> - <Modal.Header closeButton> - <Modal.Title>{this.props.title}</Modal.Title> - </Modal.Header> - <Modal.Body> - <ButtonToolbar> - <Button onClick={this.props.onAccept} bsStyle="success"> - {this.props.acceptStr} - </Button> - <Button onClick={this.props.onCancel}> - {this.props.cancelStr} - </Button> - </ButtonToolbar> - </Modal.Body> - </Modal> - ) - } +Confirmation.propTypes = { + className: PropTypes.string, + onCancel: PropTypes.func.isRequired, + onAccept: PropTypes.func.isRequired, + acceptStr: PropTypes.string, + cancelStr: PropTypes.string } +export default Confirmation diff --git a/ui/app/components/spinner/index.js b/ui/app/components/spinner/index.js index ffc3285..6cd3477 100644 --- a/ui/app/components/spinner/index.js +++ b/ui/app/components/spinner/index.js @@ -1,15 +1,12 @@ import React from 'react'; import './spinner.css'; -class Spinner extends React.Component { - render() { - let props = {} - return <div className="spinner"> - <div className="spin1"></div> - <div className="spin2"></div> - <div className="spin3"></div> - </div> - } -} +const Spinner = props => ( + <div className="spinner"> + <div className="spin1"></div> + <div className="spin2"></div> + <div className="spin3"></div> + </div> +) -export default Spinner
\ No newline at end of file +export default Spinner |