pushes, start of lifecycle

ios/RNN.m

 
 -(void)registerForJsEvents
 {
-	[[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(onJavaScriptLoaded) name:RCTJavaScriptDidLoadNotification object:nil];
+	[[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(onJavaScriptLoaded) name:RCTJavaScriptDidLoadNotification object:self.bridge];
 	
 #pragma GCC diagnostic push
 #pragma GCC diagnostic ignored "-Wdeprecated-declarations"
-	[[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(onJavaScriptDevReload) name:RCTReloadNotification object:nil];
+	[[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(onJavaScriptDevReload) name:RCTReloadNotification object:self.bridge];
 #pragma GCC diagnostic pop
 }
 

ios/RNNControllerFactory.m

 
 #import "RNNControllerFactory.h"
-
-#import "RNN.h"
-#import "RCTRootView.h"
-
-@interface RNNLayoutNode : NSObject
-@property NSString* type;
-@property NSString* nodeId;
-@property NSDictionary* data;
-@property NSArray* children;
-@end
-
-@implementation RNNLayoutNode
-
-+(instancetype)create:(NSDictionary *)json
-{
-	RNNLayoutNode* node = [RNNLayoutNode new];
-	node.type = json[@"type"];
-	node.nodeId = json[@"id"];
-	node.data = json[@"data"];
-	node.children = json[@"children"];
-	return node;
-}
-
--(BOOL)isContainer
-{
-	return [self.type isEqualToString:@"Container"];
-}
-
--(BOOL)isContainerStack
-{
-	return [self.type isEqualToString:@"ContainerStack"];
-}
-
--(BOOL)isTabs
-{
-	return [self.type isEqualToString:@"Tabs"];
-}
-
--(BOOL)isSideMenuRoot
-{
-	return [self.type isEqualToString:@"SideMenuRoot"];
-}
-
--(BOOL)isSideMenuLeft
-{
-	return [self.type isEqualToString:@"SideMenuLeft"];
-}
-
--(BOOL)isSideMenuRight
-{
-	return [self.type isEqualToString:@"SideMenuRight"];
-}
-
--(BOOL)isSideMenuCenter
-{
-	return [self.type isEqualToString:@"SideMenuCenter"];
-}
-@end
+#import "RNNLayoutNode.h"
+#import "RNNRootViewController.h"
 
 @implementation RNNControllerFactory
 
 
 -(UIViewController*)createContainer:(RNNLayoutNode*)node
 {
-	NSString* containerName = node.data[@"name"];
-	
-	RCTRootView *reactView = [[RCTRootView alloc] initWithBridge:RNN.instance.bridge
-													  moduleName:containerName
-											   initialProperties:@{@"id": node.nodeId}];
-	
-	UIViewController* controller = [UIViewController new];
-	controller.view = reactView;
-	return controller;
+	return [[RNNRootViewController alloc]initWithNode:node];
 }
 
 -(UINavigationController*)createContainerStack:(RNNLayoutNode*)node

ios/RNNLayoutNode.h

+
+#import <Foundation/Foundation.h>
+#import <UIKit/UIKit.h>
+
+@interface RNNLayoutNode : NSObject
+
+@property NSString* type;
+@property NSString* nodeId;
+@property NSDictionary* data;
+@property NSArray* children;
+
++(instancetype)create:(NSDictionary *)json;
+
+-(BOOL)isContainer;
+-(BOOL)isContainerStack;
+-(BOOL)isTabs;
+-(BOOL)isSideMenuRoot;
+-(BOOL)isSideMenuLeft;
+-(BOOL)isSideMenuRight;
+-(BOOL)isSideMenuCenter;
+
+@end

ios/RNNLayoutNode.m

+
+#import "RNNLayoutNode.h"
+
+@implementation RNNLayoutNode
+
++(instancetype)create:(NSDictionary *)json
+{
+	RNNLayoutNode* node = [RNNLayoutNode new];
+	node.type = json[@"type"];
+	node.nodeId = json[@"id"];
+	node.data = json[@"data"];
+	node.children = json[@"children"];
+	return node;
+}
+
+-(BOOL)isContainer
+{
+	return [self.type isEqualToString:@"Container"];
+}
+-(BOOL)isContainerStack
+{
+	return [self.type isEqualToString:@"ContainerStack"];
+}
+-(BOOL)isTabs
+{
+	return [self.type isEqualToString:@"Tabs"];
+}
+-(BOOL)isSideMenuRoot
+{
+	return [self.type isEqualToString:@"SideMenuRoot"];
+}
+-(BOOL)isSideMenuLeft
+{
+	return [self.type isEqualToString:@"SideMenuLeft"];
+}
+-(BOOL)isSideMenuRight
+{
+	return [self.type isEqualToString:@"SideMenuRight"];
+}
+-(BOOL)isSideMenuCenter
+{
+	return [self.type isEqualToString:@"SideMenuCenter"];
+}
+
+@end

ios/RNNRootViewController.h

+
+#import <Foundation/Foundation.h>
+#import <UIKit/UIKit.h>
+#import "RNNLayoutNode.h"
+
+@interface RNNRootViewController : UIViewController
+
+-(instancetype)initWithNode:(RNNLayoutNode*)node;
+
+@end

ios/RNNRootViewController.m

+
+#import "RNNRootViewController.h"
+#import "RCTRootView.h"
+#import "RNN.h"
+
+@interface RNNRootViewController()
+@end
+
+@implementation RNNRootViewController
+
+-(instancetype)initWithNode:(RNNLayoutNode*)node
+{
+	self = [super init];
+	NSString* containerName = node.data[@"name"];
+	
+	self.view = [[RCTRootView alloc] initWithBridge:RNN.instance.bridge
+													  moduleName:containerName
+											   initialProperties:@{@"id": node.nodeId}];
+	return self;
+}
+
+-(void)viewDidAppear:(BOOL)animated
+{
+	[super viewDidAppear:animated];
+	//send the event onAppear
+}
+
+-(void)viewDidDisappear:(BOOL)animated
+{
+	[super viewDidDisappear:animated];
+	//send the event onDisappear
+}
+
+@end

ios/ReactNativeNavigation.xcodeproj/project.pbxproj

 		7BBFE5441E25330E002A6182 /* RNNBridgeModule.m in Sources */ = {isa = PBXBuildFile; fileRef = 7BBFE5431E25330E002A6182 /* RNNBridgeModule.m */; };
 		7BBFE5611E253F97002A6182 /* RNN.m in Sources */ = {isa = PBXBuildFile; fileRef = 7BBFE5601E253F97002A6182 /* RNN.m */; };
 		7BC9346E1E26886E00EFA125 /* RNNControllerFactory.m in Sources */ = {isa = PBXBuildFile; fileRef = 7BC9346D1E26886E00EFA125 /* RNNControllerFactory.m */; };
+		7BEF0D181E437684003E96B0 /* RNNRootViewController.h in Headers */ = {isa = PBXBuildFile; fileRef = 7BEF0D161E437684003E96B0 /* RNNRootViewController.h */; };
+		7BEF0D191E437684003E96B0 /* RNNRootViewController.m in Sources */ = {isa = PBXBuildFile; fileRef = 7BEF0D171E437684003E96B0 /* RNNRootViewController.m */; };
+		7BEF0D1C1E43771B003E96B0 /* RNNLayoutNode.h in Headers */ = {isa = PBXBuildFile; fileRef = 7BEF0D1A1E43771B003E96B0 /* RNNLayoutNode.h */; };
+		7BEF0D1D1E43771B003E96B0 /* RNNLayoutNode.m in Sources */ = {isa = PBXBuildFile; fileRef = 7BEF0D1B1E43771B003E96B0 /* RNNLayoutNode.m */; };
 /* End PBXBuildFile section */
 
 /* Begin PBXCopyFilesBuildPhase section */
 		7BBFE5601E253F97002A6182 /* RNN.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RNN.m; sourceTree = "<group>"; };
 		7BC9346C1E26886E00EFA125 /* RNNControllerFactory.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = RNNControllerFactory.h; sourceTree = "<group>"; };
 		7BC9346D1E26886E00EFA125 /* RNNControllerFactory.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RNNControllerFactory.m; sourceTree = "<group>"; };
+		7BEF0D161E437684003E96B0 /* RNNRootViewController.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = RNNRootViewController.h; sourceTree = "<group>"; };
+		7BEF0D171E437684003E96B0 /* RNNRootViewController.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RNNRootViewController.m; sourceTree = "<group>"; };
+		7BEF0D1A1E43771B003E96B0 /* RNNLayoutNode.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = RNNLayoutNode.h; sourceTree = "<group>"; };
+		7BEF0D1B1E43771B003E96B0 /* RNNLayoutNode.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = RNNLayoutNode.m; sourceTree = "<group>"; };
 		D8AFADBD1BEE6F3F00A4592D /* libReactNativeNavigation.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = libReactNativeNavigation.a; sourceTree = BUILT_PRODUCTS_DIR; };
 /* End PBXFileReference section */
 
 			children = (
 				7BA500761E254908001B9E1B /* RNNSplashScreen.h */,
 				7BA500771E254908001B9E1B /* RNNSplashScreen.m */,
+				7BEF0D1A1E43771B003E96B0 /* RNNLayoutNode.h */,
+				7BEF0D1B1E43771B003E96B0 /* RNNLayoutNode.m */,
 				7BC9346C1E26886E00EFA125 /* RNNControllerFactory.h */,
 				7BC9346D1E26886E00EFA125 /* RNNControllerFactory.m */,
+				7BEF0D161E437684003E96B0 /* RNNRootViewController.h */,
+				7BEF0D171E437684003E96B0 /* RNNRootViewController.m */,
 			);
 			name = Controllers;
 			sourceTree = "<group>";
 				7B1126A41E2D2B6C00F9B03B /* ReactNativeNavigation.h in Headers */,
 				7B1126A31E2D2B6C00F9B03B /* RNNSplashScreen.h in Headers */,
 				7B1126A51E2D2B6C00F9B03B /* RNN.h in Headers */,
+				7BEF0D181E437684003E96B0 /* RNNRootViewController.h in Headers */,
 				7B1126A61E2D2B6C00F9B03B /* RNNBridgeModule.h in Headers */,
 				7B1126A71E2D2B6C00F9B03B /* RNNEventEmitter.h in Headers */,
 				7B1126A91E2D2B6C00F9B03B /* RNNControllerFactory.h in Headers */,
+				7BEF0D1C1E43771B003E96B0 /* RNNLayoutNode.h in Headers */,
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 		};
 			isa = PBXSourcesBuildPhase;
 			buildActionMask = 2147483647;
 			files = (
+				7BEF0D191E437684003E96B0 /* RNNRootViewController.m in Sources */,
 				7B1126A01E2D263F00F9B03B /* RNNEventEmitter.m in Sources */,
 				7BA500751E2544B9001B9E1B /* ReactNativeNavigation.m in Sources */,
 				7BBFE5441E25330E002A6182 /* RNNBridgeModule.m in Sources */,
+				7BEF0D1D1E43771B003E96B0 /* RNNLayoutNode.m in Sources */,
 				7BA500781E254908001B9E1B /* RNNSplashScreen.m in Sources */,
 				7BBFE5611E253F97002A6182 /* RNN.m in Sources */,
 				7BC9346E1E26886E00EFA125 /* RNNControllerFactory.m in Sources */,

playground/e2e/app.test.js

     elementByLabel('Switch to tab based app with side menus').swipeRight();
     expect(elementByLabel('This is a side menu screen')).toBeVisible();
   });
+
+  xit('screen lifecycle', () => {
+    elementByLabel('Switch to lifecycle screen').tap();
+    expect(elementByLabel('Appeared!')).toBeVisible();
+  });
 });
 
 function elementByLabel(label) {

playground/src/containers/LifecycleScreen.js

+import React, { Component } from 'react';
+import { View, Text } from 'react-native';
+
+class LifecycleScreen extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      text: 'nothing yet'
+    };
+  }
+
+  onAppear() {
+    this.setState({ text: 'Appeared!' });
+  }
+
+  onDisappear() {
+    this.setState({ text: 'Disappeared!' });
+  }
+
+  render() {
+    return (
+      <View style={styles.root}>
+        <Text style={styles.h1}>{this.state.text}</Text>
+      </View>
+    );
+  }
+}
+export default LifecycleScreen;
+
+const styles = {
+  root: {
+    flexGrow: 1,
+    justifyContent: 'center',
+    alignItems: 'center',
+    backgroundColor: '#f5fcff'
+  },
+  h1: {
+    fontSize: 24,
+    textAlign: 'center',
+    margin: 10
+  }
+};

playground/src/containers/WelcomeScreen.js

         <Text style={styles.h1}>{`React Native Navigation!`}</Text>
         <Button title="Switch to tab based app" onPress={this.onClickSwitchToTabs} />
         <Button title="Switch to app with side menus" onPress={this.onClickSwitchToSideMenus} />
+        <Button title="Switch to lifecycle screen" onPress={this.onClickLifecycleScreen} />
         <Button title="Push" onPress={this.onClickPush} />
         <Text style={styles.footer}>{`this.props.id = ${this.props.id}`}</Text>
       </View>
       }
     });
   }
+
+  onClickLifecycleScreen() {
+    Navigation.on(this.props.id).push({
+      name: 'com.example.LifecycleScreen'
+    });
+  }
 }
 
 export default WelcomeScreen;

playground/src/containers/index.js

 
 import WelcomeScreen from './WelcomeScreen';
 import SimpleScreen from './SimpleScreen';
+import LifecycleScreen from './LifecycleScreen';
 
 export function registerContainers() {
   Navigation.registerContainer(`com.example.WelcomeScreen`, () => WelcomeScreen);
   Navigation.registerContainer(`com.example.SimpleScreen`, () => SimpleScreen);
+  Navigation.registerContainer(`com.example.LifecycleScreen`, () => LifecycleScreen);
 }

src/containers/ContainerWrapper.js

           <OriginalContainer
             {...this.state.allProps}
             id={this.state.id}
+            key={this.state.id}
           />
         );
       }

src/containers/ContainerWrapper.test.js

+/* eslint-disable consistent-this, react/no-multi-comp */
 import React, { Component } from 'react';
 import { AppRegistry, Text } from 'react-native';
 import renderer from 'react-test-renderer';
   class MyContainer extends Component {
     constructor(props) {
       super(props);
-      myContainerRef = this; //eslint-disable-line
+      myContainerRef = this;
     }
 
     render() {
     }
   }
 
-  class TestParent extends Component { //eslint-disable-line
+  class TestParent extends Component {
     constructor(props) {
       super(props);
-      testParentRef = this; //eslint-disable-line
+      testParentRef = this;
       this.ChildClass = props.ChildClass;
       this.state = { propsFromState: {} };
     }
     testParentRef.setState({ propsFromState: { id: 'ERROR' } });
     expect(myContainerRef.props.id).toEqual('container1');
   });
+
+  it('assignes key by id', () => {
+    const NavigationContainer = ContainerWrapper.wrap(containerName, MyContainer, store);
+    renderer.create(<NavigationContainer id={'container123'} />);
+    expect(myContainerRef.props.id).toEqual('container123');
+    expect(myContainerRef._reactInternalInstance._currentElement.key).toEqual('container123');
+  });
+
+  xdescribe('container lifecycle', () => {
+    const onStartCallback = jest.fn();
+    const onStopCallback = jest.fn();
+
+    class MyLifecycleContainer extends MyContainer {
+      onStart() {
+        onStartCallback();
+      }
+
+      onStop() {
+        onStopCallback();
+      }
+    }
+
+    it('', () => {
+      //
+    });
+  });
 });