PLT-4507 Don't mount modals until opened to make resetting state automatic (#4358)

* Don't mount modals until opened to make resetting state automatic

* Move dimiss handler to be fired after modal exit animation complete

1 files changed, 11 insertions, 11 deletions

diff --git a/webapp/components/channel_info_modal.jsx b/webapp/components/channel_info_modal.jsx
index 7e0ff3873..fce4b75db 100644
--- a/webapp/components/channel_info_modal.jsx
+++ b/webapp/components/channel_info_modal.jsx
@@ -11,16 +11,16 @@ import * as TextFormatting from 'utils/text_formatting.jsx';
 import React from 'react';
 
 export default class ChannelInfoModal extends React.Component {
-    shouldComponentUpdate(nextProps) {
-        if (nextProps.show !== this.props.show) {
-            return true;
-        }
+    constructor(props) {
+        super(props);
 
-        if (!Utils.areObjectsEqual(nextProps.channel, this.props.channel)) {
-            return true;
-        }
+        this.onHide = this.onHide.bind(this);
+
+        this.state = {show: true};
+    }
 
-        return false;
+    onHide() {
+        this.setState({show: false});
     }
 
     render() {
@@ -83,8 +83,9 @@ export default class ChannelInfoModal extends React.Component {
         return (
             <Modal
                 dialogClassName='about-modal'
-                show={this.props.show}
-                onHide={this.props.onHide}
+                show={this.state.show}
+                onHide={this.onHide}
+                onExited={this.props.onHide}
             >
                 <Modal.Header closeButton={true}>
                     <Modal.Title>
@@ -123,7 +124,6 @@ export default class ChannelInfoModal extends React.Component {
 }
 
 ChannelInfoModal.propTypes = {
-    show: React.PropTypes.bool.isRequired,
     onHide: React.PropTypes.func.isRequired,
     channel: React.PropTypes.object.isRequired
 };