import React, { Component } from 'react';
import { AppRegistry, NavigatorIOS } from 'react-native';
import { Provider } from 'react-redux';
import { applyMiddleware, createStore } from 'redux';
import Thunk from 'redux-thunk';

import Config from './config';
import { APP_NAVIGATE } from './features/base/navigation';
import { ReducerRegistry } from './features/base/redux';
import { Conference } from './features/conference';
// FIXME Don't import private styles. Move common/shared styles to a feature in
// base.
import { init, styles, WelcomePage } from './features/welcome';

/**
 * This router middleware is used to abstract navigation
 * inside the app for both native and web.
 */
const router = store => next => action => {
    if (action.type === APP_NAVIGATE) {
        switch (action.screen) {
        case 'home':
            return action.navigator.push({
                title: 'Jitsi Meet',
                component: WelcomePage
            });
        case 'conference':
            action.navigator.push({
                title: action.room,
                component: Conference
            });
            store.dispatch(init(Config, action.room));
            return;
        }
    }
    return next(action);
};


const reducer = ReducerRegistry.combineReducers();
const store = createStore(reducer, applyMiddleware(Thunk, router));

class Root extends Component {
    render() {
        return (
            <Provider store={store}>
                <NavigatorIOS
                    style={styles.navContainer}
                    initialRoute={{
                        title: 'Jitsi Meet',
                        component: WelcomePage
                    }}
                />
          </Provider>
        );
    }
}

AppRegistry.registerComponent('JitsiMeetApp', () => Root);

@@ -66,19 +66,16 @@
 avigator
-IOS
  %7D from 
@@ -631,19 +631,16 @@
 vigation
-%0A *
  inside 
@@ -655,16 +655,19 @@
 for both
+%0A *
  native 
@@ -1225,17 +1225,16 @@
 n);%0A%7D;%0A%0A
-%0A
 const re
@@ -1384,102 +1384,696 @@
     
-render() %7B%0A        return (%0A            %3CProvider store=%7Bstore%7D%3E%0A                %3CNavigatorIOS
+/**%0A     * Initializes a new Root instance.%0A     *%0A     * @param %7Bobject%7D props - the read-only properties with which the new%0A     * instance is to be initialized%0A     */%0A    constructor(props) %7B%0A        super(props);%0A%0A        // Bind event handlers so they are only bound once for every instance.%0A        this._navigatorRenderScene = this._navigatorRenderScene.bind(this);%0A    %7D%0A%0A    render() %7B%0A        return (%0A            %3CProvider store=%7Bstore%7D%3E%0A                %3CNavigator%0A                    initialRoute=%7B%7B%0A                        title: 'Jitsi Meet',%0A                        component: WelcomePage%0A                    %7D%7D%0A                    renderScene=%7Bthis._navigatorRenderScene%7D
 %0A   
@@ -2137,192 +2137,928 @@
     
+/%3E%0A
     
-initialRoute=%7B%7B
+      %3C/Provider%3E%0A        );%0A    %7D%0A%0A    /**%0A     * Renders the scene identified by a specific route in a specific Navigator.
 %0A     
+*%0A
      
-              title: 'Jitsi Meet',%0A                        component: WelcomePage%0A                    %7D%7D
+* @param %7Bobject%7D route - the route which identifies the scene to be%0A     * rendered in the specified navigator. In the fashion of NavigatorIOS, the%0A     * specified route is expected to define a value for its component property%0A     * which is the type of React component to be rendered.%0A     * @param %7BNavigator%7D navigator - the Navigator in which the scene%0A     * identified by the specified route is to be rendered%0A     * @private
 %0A     
+*/%0A
     
-       /%3E%0A          %3C/P
+_navigatorRenderScene(route, navigator) %7B%0A        // We started with NavigatorIOS and then switched to Navigator in order%0A        // to support And
 ro
-v
 id
-er%3E%0A        
+ as well. In order to reduce the number of%0A        // modifications, accept the same format of route definition.%0A        return React.createElement(route.component, %7B navigator %7D
 );%0A 

Fix Navigator on Android