React Navigation

App.js

import React from 'react';
import {
  StyleSheet,
  View,
  StatusBar
} from 'react-native';
import { Provider } from 'react-redux';

import RootNavigator from './src/navigation/RootNavigator';
import store from './src/store';

export default class App extends React.Component {
  render() {
    return (
      <Provider store={store}>
        <View style={styles.container}>
          <StatusBar
            barStyle="light-content"
            backgroundColor="#ff4c4c"
          />
          <RootNavigator />
        </View>
      </Provider>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
  },
});

AppNavigator.js

import React from 'react';
import { createBottomTabNavigator } from 'react-navigation';

import HomeScreen from '../screens/app/HomeScreen';
import AppointmentsScreen from '../screens/app/AppointmentsScreen';
import SearchScreen from '../screens/app/SearchScreen';
import SettingsScreen from '../screens/app/SettingsScreen';

export default createBottomTabNavigator(
  {
    Home: HomeScreen,
    Appointments: AppointmentsScreen,
    Search: SearchScreen,
    Settings: SettingsScreen,
  },
  {
    initialRouteName: 'Home'
  }
);

HomeScreen.js

import React, { Component } from 'react';
import {
  StyleSheet,
  AsyncStorage,
  ScrollView,
  Button
} from 'react-native';

class HomeScreen extends React.Component {
  static navigationOptions = {
    title: 'Profile',
  };

  signOutAsync = async () => {
    await AsyncStorage.clear();
    this.props.navigation.navigate('Auth');
  };

  render() {
    return (
      <ScrollView style={styles.container}>
        <Button title="Sign Out" onPress={this.signOutAsync} />
      </ScrollView>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1
  }
});

export default HomeScreen;

RootNavigator.js

import React from 'react';
import { createSwitchNavigator } from 'react-navigation';

import AuthNavigator from './AuthNavigator';
import AppNavigator from './AppNavigator';


export default createSwitchNavigator(
  {
    Auth: AuthNavigator,
    App: {
      screen: AppNavigator,
      navigationOptions: {
        headerStyle: {
          backgroundColor: '#ff4c4c',
        },
        headerTintColor: '#fff',
        headerTitleStyle: {
          fontWeight: 'bold',
        }
      }
    }
  },
  {
    initialRouteName: 'Auth',
  }
);