Renamed onModalDismissed to onHide to keep it consistent with React-Bootstrap

3 files changed, 19 insertions, 18 deletions

diff --git a/web/react/components/access_history_modal.jsx b/web/react/components/access_history_modal.jsx
index 6a10f87b2..8306a4e8c 100644
--- a/web/react/components/access_history_modal.jsx
+++ b/web/react/components/access_history_modal.jsx
@@ -14,6 +14,7 @@ export default class AccessHistoryModal extends React.Component {
 
         this.onAuditChange = this.onAuditChange.bind(this);
         this.handleMoreInfo = this.handleMoreInfo.bind(this);
+        this.onShow = this.onShow.bind(this);
         this.onHide = this.onHide.bind(this);
         this.formatAuditInfo = this.formatAuditInfo.bind(this);
         this.handleRevokedSession = this.handleRevokedSession.bind(this);
@@ -38,7 +39,7 @@ export default class AccessHistoryModal extends React.Component {
     }
     onHide() {
         this.setState({moreInfo: []});
-        this.props.onModalDismissed();
+        this.props.onHide();
     }
     componentDidMount() {
         UserStore.addAuditsChangeListener(this.onAuditChange);
@@ -401,5 +402,5 @@ export default class AccessHistoryModal extends React.Component {
 
 AccessHistoryModal.propTypes = {
     show: React.PropTypes.bool.isRequired,
-    onModalDismissed: React.PropTypes.func.isRequired
+    onHide: React.PropTypes.func.isRequired
 };
diff --git a/web/react/components/activity_log_modal.jsx b/web/react/components/activity_log_modal.jsx
index 6c329d416..5c385c93d 100644
--- a/web/react/components/activity_log_modal.jsx
+++ b/web/react/components/activity_log_modal.jsx
@@ -4,7 +4,7 @@
 const UserStore = require('../stores/user_store.jsx');
 const Client = require('../utils/client.jsx');
 const AsyncClient = require('../utils/async_client.jsx');
-const Modal = ReactBootstrap.Modal;
+const Modal = require('./modal.jsx');
 const LoadingScreen = require('./loading_screen.jsx');
 const Utils = require('../utils/utils.jsx');
 
@@ -58,7 +58,7 @@ export default class ActivityLogModal extends React.Component {
     }
     onHide() {
         this.setState({moreInfo: []});
-        this.props.onModalDismissed();
+        this.props.onHide();
     }
     componentDidMount() {
         UserStore.addSessionsChangeListener(this.onListenerChange);
@@ -174,5 +174,5 @@ export default class ActivityLogModal extends React.Component {
 
 ActivityLogModal.propTypes = {
     show: React.PropTypes.bool.isRequired,
-    onModalDismissed: React.PropTypes.func.isRequired
+    onHide: React.PropTypes.func.isRequired
 };
diff --git a/web/react/components/toggle_modal_button.jsx b/web/react/components/toggle_modal_button.jsx
index 86ee439a5..51c8d1f20 100644
--- a/web/react/components/toggle_modal_button.jsx
+++ b/web/react/components/toggle_modal_button.jsx
@@ -24,29 +24,29 @@ export default class ModalToggleButton extends React.Component {
     render() {
         const {children, dialogType, dialogProps, ...props} = this.props;
 
-        // this assumes that all modals will have a show property and an onModalDismissed event
+        // this assumes that all modals will have a show property and an onHide event
         const dialog = React.createElement(this.props.dialogType, Object.assign({}, dialogProps, {
             show: this.state.show,
-            onModalDismissed: () => {
+            onHide: () => {
                 this.hide();
 
-                if (dialogProps.onModalDismissed) {
-                    dialogProps.onModalDismissed();
+                if (dialogProps.onHide) {
+                    dialogProps.onHide();
                 }
             }
         }));
 
+        // nesting the dialog in the anchor tag looks like it shouldn't work, but it does due to how react-bootstrap
+        // renders modals at the top level of the DOM instead of where you specify in the virtual DOM
         return (
-            <div style={{display: 'inline'}}>
-                <a
-                    {...props}
-                    href='#'
-                    onClick={this.show}
-                >
-                    {children}
-                </a>
+            <a
+                {...props}
+                href='#'
+                onClick={this.show}
+            >
+                {children}
                 {dialog}
-            </div>
+            </a>
         );
     }
 }