Fix inspector on top of Modal

Summary:
Very similar to #9600.
Does not trigger on DEV, but there are two inspectors: one underneath and one
above the modal. This looks like something we should fix, but the only solution
I've come up with so far was to mangle the event that AppContainer listens to, so that
only the AppContainer in the modal responds to it. This seems pretty ugly, I'd
rather look for something else. Wdyt?

Reviewed By: frantic

Differential Revision: D3937096

fbshipit-source-id: a6e648b6d583088514d6ba8df7851f9a8ef48f74

Libraries/Modal/Modal.js

@@ -11,6 +11,7 @@
  */
 'use strict';
 
+const AppContainer = require('AppContainer');
 const I18nManager = require('I18nManager');
 const Platform = require('Platform');
 const PropTypes = require('react/lib/ReactPropTypes');
@@ -146,6 +147,12 @@ class Modal extends React.Component {
       }
     }
 
+    const innerChildren = __DEV__ ?
+      ( <AppContainer>
+          {this.props.children}
+        </AppContainer>) :
+      this.props.children;
+
     return (
       <RCTModalHostView
         animationType={animationType}
@@ -158,7 +165,7 @@ class Modal extends React.Component {
         onOrientationChange={this.props.onOrientationChange}
         >
         <View style={[styles.container, containerStyles]}>
-          {this.props.children}
+          {innerChildren}
         </View>
       </RCTModalHostView>
     );