summaryrefslogtreecommitdiffstats
path: root/web/react/components/channel_info_modal.jsx
diff options
context:
space:
mode:
Diffstat (limited to 'web/react/components/channel_info_modal.jsx')
-rw-r--r--web/react/components/channel_info_modal.jsx97
1 files changed, 63 insertions, 34 deletions
diff --git a/web/react/components/channel_info_modal.jsx b/web/react/components/channel_info_modal.jsx
index 6d999870a..b658dbe6e 100644
--- a/web/react/components/channel_info_modal.jsx
+++ b/web/react/components/channel_info_modal.jsx
@@ -3,57 +3,86 @@
var ChannelStore = require('../stores/channel_store.jsx');
-module.exports = React.createClass({
- componentDidMount: function() {
+export default class CommandList extends React.Component {
+ constructor(props) {
+ super(props);
+
+ this.state = {
+ channel_id: ChannelStore.getCurrentId()
+ };
+ }
+
+ componentDidMount() {
var self = this;
- if(this.refs.modal) {
- $(this.refs.modal.getDOMNode()).on('show.bs.modal', function(e) {
- var button = e.relatedTarget;
- self.setState({ channel_id: $(button).attr('data-channelid') });
- });
+ if (this.refs.modal) {
+ $(this.refs.modal.getDOMNode()).on('show.bs.modal', function show(e) {
+ var button = e.relatedTarget;
+ self.setState({channel_id: $(button).attr('data-channelid')});
+ });
}
- },
- getInitialState: function() {
- return { channel_id: ChannelStore.getCurrentId() };
- },
- render: function() {
+ }
+
+ render() {
var channel = ChannelStore.get(this.state.channel_id);
if (!channel) {
channel = {};
- channel.display_name = "No Channel Found";
- channel.name = "No Channel Found";
- channel.id = "No Channel Found";
+ channel.display_name = 'No Channel Found';
+ channel.name = 'No Channel Found';
+ channel.id = 'No Channel Found';
}
return (
- <div className="modal fade" ref="modal" id="channel_info" tabIndex="-1" role="dialog" aria-hidden="true">
- <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" id="myModalLabel"><span className="name">{channel.display_name}</span></h4>
+ <div
+ className='modal fade'
+ ref='modal'
+ id='channel_info'
+ tabIndex='-1'
+ role='dialog'
+ aria-hidden='true'
+ >
+ <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'
+ id='myModalLabel'
+ >
+ <span className='name'>{channel.display_name}</span>
+ </h4>
</div>
- <div className="modal-body">
- <div className="row form-group">
- <div className="col-sm-3 info__label">Channel Name: </div>
- <div className="col-sm-9">{channel.display_name}</div>
+ <div className='modal-body'>
+ <div className='row form-group'>
+ <div className='col-sm-3 info__label'>Channel Name: </div>
+ <div className='col-sm-9'>{channel.display_name}</div>
</div>
- <div className="row form-group">
- <div className="col-sm-3 info__label">Channel Handle:</div>
- <div className="col-sm-9">{channel.name}</div>
+ <div className='row form-group'>
+ <div className='col-sm-3 info__label'>Channel Handle:</div>
+ <div className='col-sm-9'>{channel.name}</div>
</div>
- <div className="row">
- <div className="col-sm-3 info__label">Channel ID:</div>
- <div className="col-sm-9">{channel.id}</div>
+ <div className='row'>
+ <div className='col-sm-3 info__label'>Channel ID:</div>
+ <div className='col-sm-9'>{channel.id}</div>
</div>
</div>
- <div className="modal-footer">
- <button type="button" className="btn btn-default" data-dismiss="modal">Close</button>
+ <div className='modal-footer'>
+ <button
+ type='button'
+ className='btn btn-default'
+ data-dismiss='modal'
+ >Close</button>
</div>
</div>
</div>
</div>
);
}
-});
+}