Make <Modal> visible by default

Summary: Make <Modal> visible by default and fix the scenario where we present a modal immediately when adding it to the view hierarchy. Closes facebook#3724 Closes facebook#2952 public Reviewed By: nicklockwood Differential Revision: D2595938 fb-gh-sync-id: 1571790d36fe486f1fbbed9f2d66f1e6add73d91
skillz · Nov 9, 2015 · 649015c · 649015c
1 parent 48599c0
commit 649015c
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 4 deletions.
diff --git a/Examples/UIExplorer/ModalExample.js b/Examples/UIExplorer/ModalExample.js
@@ -143,6 +143,7 @@ var styles = StyleSheet.create({
   },
   innerContainer: {
     borderRadius: 10,
+    alignItems: 'center',
   },
   row: {
     alignItems: 'center',
@@ -158,6 +159,7 @@ var styles = StyleSheet.create({
     borderRadius: 5,
     flex: 1,
     height: 44,
+    alignSelf: 'stretch',
     justifyContent: 'center',
     overflow: 'hidden',
   },

diff --git a/Libraries/Modal/Modal.js b/Libraries/Modal/Modal.js
@@ -59,9 +59,14 @@ class Modal extends React.Component {
 Modal.propTypes = {
   animated: PropTypes.bool,
   transparent: PropTypes.bool,
+  visible: PropTypes.bool,
   onDismiss: PropTypes.func,
 };
 
+Modal.defaultProps = {
+  visible: true,
+};
+
 var styles = StyleSheet.create({
   modal: {
     position: 'absolute',

diff --git a/React/Views/RCTModalHostView.m b/React/Views/RCTModalHostView.m
@@ -76,15 +76,22 @@ - (void)dismissModalViewController
   }
 }
 
-- (void)didMoveToSuperview
+- (void)didMoveToWindow
 {
-  [super didMoveToSuperview];
+  [super didMoveToWindow];
 
-  if (self.superview) {
+  if (!_isPresented && self.window) {
     RCTAssert(self.reactViewController, @"Can't present modal view controller without a presenting view controller");
     [self.reactViewController presentViewController:_modalViewController animated:self.animated completion:nil];
     _isPresented = YES;
-  } else {
+  }
+}
+
+- (void)didMoveToSuperview
+{
+  [super didMoveToSuperview];
+
+  if (_isPresented && !self.superview) {
     [self dismissModalViewController];
   }
 }