summaryrefslogtreecommitdiffstats
path: root/web/react/components/toggle_modal_button.jsx
diff options
context:
space:
mode:
authorhmhealey <harrisonmhealey@gmail.com>2015-11-10 10:27:10 -0500
committerhmhealey <harrisonmhealey@gmail.com>2015-11-17 11:04:31 -0500
commit9cdf820f7b154b312d5022fec20754141b0d8476 (patch)
treebbb6db666500b045f5093a7ab597afca987c10a9 /web/react/components/toggle_modal_button.jsx
parent0b52e85ba73e5b3badeb1703462c5d05d3a7d224 (diff)
downloadchat-9cdf820f7b154b312d5022fec20754141b0d8476.tar.gz
chat-9cdf820f7b154b312d5022fec20754141b0d8476.tar.bz2
chat-9cdf820f7b154b312d5022fec20754141b0d8476.zip
Added ToggleModalButton component
Diffstat (limited to 'web/react/components/toggle_modal_button.jsx')
-rw-r--r--web/react/components/toggle_modal_button.jsx62
1 files changed, 62 insertions, 0 deletions
diff --git a/web/react/components/toggle_modal_button.jsx b/web/react/components/toggle_modal_button.jsx
new file mode 100644
index 000000000..86ee439a5
--- /dev/null
+++ b/web/react/components/toggle_modal_button.jsx
@@ -0,0 +1,62 @@
+// Copyright (c) 2015 Mattermost, Inc. All Rights Reserved.
+// See License.txt for license information.
+
+export default class ModalToggleButton extends React.Component {
+ constructor(props) {
+ super(props);
+
+ this.show = this.show.bind(this);
+ this.hide = this.hide.bind(this);
+
+ this.state = {
+ show: false
+ };
+ }
+
+ show() {
+ this.setState({show: true});
+ }
+
+ hide() {
+ this.setState({show: false});
+ }
+
+ render() {
+ const {children, dialogType, dialogProps, ...props} = this.props;
+
+ // this assumes that all modals will have a show property and an onModalDismissed event
+ const dialog = React.createElement(this.props.dialogType, Object.assign({}, dialogProps, {
+ show: this.state.show,
+ onModalDismissed: () => {
+ this.hide();
+
+ if (dialogProps.onModalDismissed) {
+ dialogProps.onModalDismissed();
+ }
+ }
+ }));
+
+ return (
+ <div style={{display: 'inline'}}>
+ <a
+ {...props}
+ href='#'
+ onClick={this.show}
+ >
+ {children}
+ </a>
+ {dialog}
+ </div>
+ );
+ }
+}
+
+ModalToggleButton.propTypes = {
+ children: React.PropTypes.node.isRequired,
+ dialogType: React.PropTypes.func.isRequired,
+ dialogProps: React.PropTypes.object
+};
+
+ModalToggleButton.defaultProps = {
+ dialogProps: {}
+};