summaryrefslogtreecommitdiffstats
path: root/web/react
diff options
context:
space:
mode:
authorTomi M <tomitm@gmail.com>2015-10-07 16:25:47 -0700
committerTomi M <tomitm@gmail.com>2015-10-07 16:33:56 -0700
commite7eca9a9ed990818ef0081078139a967078b8a80 (patch)
tree2a71cf91b1b0343e1ac3146bb173963df2661b26 /web/react
parent5a28562354d56590ec87cf0a1e9358cd1a70854a (diff)
downloadchat-e7eca9a9ed990818ef0081078139a967078b8a80.tar.gz
chat-e7eca9a9ed990818ef0081078139a967078b8a80.tar.bz2
chat-e7eca9a9ed990818ef0081078139a967078b8a80.zip
Use ReactBootstrap.Modal instead.
Diffstat (limited to 'web/react')
-rw-r--r--web/react/components/about_build_modal.jsx84
-rw-r--r--web/react/components/navbar_dropdown.jsx17
-rw-r--r--web/react/pages/channel.jsx6
3 files changed, 58 insertions, 49 deletions
diff --git a/web/react/components/about_build_modal.jsx b/web/react/components/about_build_modal.jsx
index 87a58ba97..d582f6bc8 100644
--- a/web/react/components/about_build_modal.jsx
+++ b/web/react/components/about_build_modal.jsx
@@ -1,60 +1,62 @@
// Copyright (c) 2015 Spinpunch, Inc. All Rights Reserved.
// See License.txt for license information.
+var Modal = ReactBootstrap.Modal;
+
export default class AboutBuildModal extends React.Component {
+ constructor(props) {
+ super(props);
+ this.doHide = this.doHide.bind(this);
+ }
+
+ doHide() {
+ this.props.onModalDismissed();
+ }
+
render() {
const config = global.window.config;
return (
- <div
- className='modal fade'
- ref='modal'
- id='about_build'
- tabIndex='-1'
- role='dialog'
- aria-hidden='true'
+ <Modal
+ show={this.props.show}
+ onHide={this.doHide}
>
- <div className='modal-dialog'>
- <div className='modal-content'>
- <div className='modal-header'>
- <button
- type='button'
- className='close'
- data-dismiss='modal'
- aria-label='Close'
- >
- <span aria-hidden='true'>&times;</span>
- </button>
- <h4
- className='modal-title'
- >
- <span className='name'>{`Mattermost ${config.Version}`}</span>
- </h4>
- </div>
- <div className='modal-body'>
- <div className='row form-group'>
+ <Modal.Header closeButton={true}>
+ <Modal.Title>{`Mattermost ${config.Version}`}</Modal.Title>
+ </Modal.Header>
+ <Modal.Body>
+ <div className='row form-group'>
<div className='col-sm-3 info__label'>{'Build Number:'}</div>
<div className='col-sm-9'>{config.BuildNumber}</div>
- </div>
- <div className='row form-group'>
+ </div>
+ <div className='row form-group'>
<div className='col-sm-3 info__label'>{'Build Date:'}</div>
<div className='col-sm-9'>{config.BuildDate}</div>
- </div>
- <div className='row'>
+ </div>
+ <div className='row'>
<div className='col-sm-3 info__label'>{'Build Hash:'}</div>
<div className='col-sm-9'>{config.BuildHash}</div>
- </div>
- </div>
- <div className='modal-footer'>
- <button
- type='button'
- className='btn btn-default'
- data-dismiss='modal'
- >{'Close'}</button>
</div>
- </div>
- </div>
- </div>
+ </Modal.Body>
+ <Modal.Footer>
+ <button
+ type='button'
+ className='btn btn-default'
+ onClick={this.doHide}
+ >
+ {'Close'}
+ </button>
+ </Modal.Footer>
+ </Modal>
);
}
}
+
+AboutBuildModal.defaultProps = {
+ show: false
+};
+
+AboutBuildModal.propTypes = {
+ show: React.PropTypes.bool.isRequired,
+ onModalDismissed: React.PropTypes.func.isRequired
+}; \ No newline at end of file
diff --git a/web/react/components/navbar_dropdown.jsx b/web/react/components/navbar_dropdown.jsx
index 1adb0d8c6..b90ce4170 100644
--- a/web/react/components/navbar_dropdown.jsx
+++ b/web/react/components/navbar_dropdown.jsx
@@ -6,6 +6,8 @@ var client = require('../utils/client.jsx');
var UserStore = require('../stores/user_store.jsx');
var TeamStore = require('../stores/team_store.jsx');
+var AboutBuildModal = require('./about_build_modal.jsx');
+
var Constants = require('../utils/constants.jsx');
function getStateFromStores() {
@@ -18,7 +20,9 @@ export default class NavbarDropdown extends React.Component {
this.blockToggle = false;
this.handleLogoutClick = this.handleLogoutClick.bind(this);
+ this.handleAboutModal = this.handleAboutModal.bind(this);
this.onListenerChange = this.onListenerChange.bind(this);
+ this.aboutModalDismissed = this.aboutModalDismissed.bind(this);
this.state = getStateFromStores();
}
@@ -26,6 +30,12 @@ export default class NavbarDropdown extends React.Component {
e.preventDefault();
client.logout();
}
+ handleAboutModal() {
+ this.setState({showAboutModal: true});
+ }
+ aboutModalDismissed() {
+ this.setState({showAboutModal: false});
+ }
componentDidMount() {
UserStore.addTeamsChangeListener(this.onListenerChange);
TeamStore.addChangeListener(this.onListenerChange);
@@ -226,12 +236,15 @@ export default class NavbarDropdown extends React.Component {
<li>
<a
href='#'
- data-toggle='modal'
- data-target='#about_build'
+ onClick={this.handleAboutModal}
>
{'About Mattermost'}
</a>
</li>
+ <AboutBuildModal
+ show={this.state.showAboutModal}
+ onModalDismissed={this.aboutModalDismissed}
+ />
</ul>
</li>
</ul>
diff --git a/web/react/pages/channel.jsx b/web/react/pages/channel.jsx
index 3eed91366..c333fd57d 100644
--- a/web/react/pages/channel.jsx
+++ b/web/react/pages/channel.jsx
@@ -30,7 +30,6 @@ var ErrorStore = require('../stores/error_store.jsx');
var ChannelLoader = require('../components/channel_loader.jsx');
var MentionList = require('../components/mention_list.jsx');
var ChannelInfoModal = require('../components/channel_info_modal.jsx');
-var AboutBuildModal = require('../components/about_build_modal.jsx');
var AccessHistoryModal = require('../components/access_history_modal.jsx');
var ActivityLogModal = require('../components/activity_log_modal.jsx');
var RemovedFromChannelModal = require('../components/removed_from_channel_modal.jsx');
@@ -152,11 +151,6 @@ function setupChannelPage(props) {
);
React.render(
- <AboutBuildModal />,
- document.getElementById('about_build_modal')
- );
-
- React.render(
<MoreChannelsModal />,
document.getElementById('more_channels_modal')
);