//@flow
import rxjsconfig from 'recompose/rxjsObservableConfig';
import setObservableConfig from 'recompose/setObservableConfig';
setObservableConfig(rxjsconfig);

import React, { Component } from 'react';
import { StatusBar } from 'react-native';
import { ThemeContext, getTheme } from 'react-native-material-ui';
import { NativeRouter, Route, Redirect, AndroidBackButton, Switch } from 'react-router-native';
import Nav from './pages/Nav';
import FoodItemDetail from './pages/FoodItemDetail';
import PlaceDetail from './pages/PlaceDetail';
import CreateFoodItem from './pages/CreateFoodItem';
import LoginPage from './pages/LoginPage';
import LandingPage from './pages/LandingPage';
import ZipcodePage from './pages/ZipcodePage';
import { AppContainer } from './components/AppContainer';

import theme from './ui-theme';

console.disableYellowBox = true;

export default class App extends Component {
	static displayName = 'App';

	render() {
		return (
			<NativeRouter>
				<AndroidBackButton>
					<ThemeContext.Provider value={getTheme(theme)}>
						<AppContainer>
							<StatusBar backgroundColor={theme.statusBarColor} />
							<Redirect from="/" to="/landing" replace />
							<Switch>
								<Route path="/landing" component={LandingPage} />
								<Route path="/list/:type" component={Nav} />
								<Route path="/foodItem/:id" component={FoodItemDetail} />
								<Route path="/place/:id" component={PlaceDetail} />
								<Route path="/login" component={LoginPage} />
								<Route path="/logout" component={LoginPage} />
								<Route path="/zipcode" component={ZipcodePage} />
								<Route path="/createFoodItem" component={CreateFoodItem} />
							</Switch>
						</AppContainer>
					</ThemeContext.Provider>
				</AndroidBackButton>
			</NativeRouter>
		);
	}
}