App.js

import React from 'react';
import { API_URL } from 'react-native-dotenv';
import { Platform, AsyncStorage } from 'react-native';
import { createBottomTabNavigator, createStackNavigator, createSwitchNavigator } from 'react-navigation';
import CustomTabBar from './Custom/CustomTabBar';
import CustomHeader from './Custom/CustomHeader';
import OneSignal from 'react-native-onesignal';
import Login from './Login';
import Register from './Register';
import ForgotPassword from './ForgotPassword';
import MyAccount from './More/MyAccount';
import Privacy from './More/Privacy';
import MyPromoCodes from './More/MyPromoCodes';
import MyBookings from './More/MyBookings';
import MyOrders from './More/MyOrders';
import MyFavorites from './More/MyFavorites';
import MyPreOrders from './More/MyPreOrders';
import VenuePromo from './Promo/VenuePromo';
import BookingPromo from './Promo/BookingPromo';
import DeliveryPromo from './Promo/DeliveryPromo';
import PreOrderPromo from './Promo/PreOrderPromo';
import PickUpPromo from './Promo/PickUpPromo';
import MenuPromo from './Promo/MenuPromo';
import MediaPromo from './Promo/MediaPromo';
import VicePost from './Vice/VicePost';
import Venue from './Venue/Venue';
import VenueMedia from './Venue/VenueMedia';
import VenueMenu from './Venue/VenueMenu';
import Booking from './Venue/Order/Booking';
import PreOrder from './Venue/Order/PreOrder';
import PickUp from './Venue/Order/PickUp';
import Delivery from './Venue/Order/Delivery';
import ViceUser from './Vice/ViceUser';
import ViceVenue from './Vice/ViceVenue';
import ViceMedia from './Vice/ViceMedia';
import Review from './Vice/Review';
import Payment from './Payment/Payment';
import ChatMessaging from './Chat/ChatMessaging';
import Filter from './Filter';
import LoadingScreen from './LoadingScreen'
import More from './More/More';
import Vice from './Vice/Vice';
import Venues from './Venue/Venues';
import Promos from './Promo/Promos';
import Chats from './Chat/Chats';
import Search from './Search';

const PromosStack = createStackNavigator(
  {
    Promos: Promos,
    VenuePromo: {
      screen: VenuePromo,
      path: 'venue_promo/:promo',
    },
    BookingPromo: {
      screen: BookingPromo,
      path: 'booking_promo/:promo'
    },
    DeliveryPromo: {
      screen: DeliveryPromo,
      path: 'delivery_promo/:promo'
    },
    PreOrderPromo: {
      screen: PreOrderPromo,
      path: 'pre_order_promo/:promo'
    },
    MenuPromo: {
      screen: MenuPromo,
      path: 'menu_promo/:promo'
    },
    MediaPromo: {
      screen: MediaPromo,
      path: 'media_promo/:promo'
    },
    PickUpPromo: {
      screen: PickUpPromo,
      path: 'pick_up_promo/:promo'
    },
    Filter: Filter,
    Search: Search,
  },
  {
    initialRouteName: 'Promos',
    navigationOptions: {
      header: (props) => <CustomHeader {...props} />,
      headerTransparent: true,
      headerTintColor: 'white',
      headerStyle: {
        borderBottomWidth: 0, // Remove the hairline bottom border
        ...Platform.select({
          android: {
            shadowColor: 'transparent',
            shadowOpacity: 0,
            shadowRadius: 0,
            shadowOffset: {
              height: 0,
              width: 0,
            },
            elevation: 0,
          }
        }),
      },
    }
  }
);

const ViceStack = createStackNavigator(
  {
    Vice: Vice,
    ViceUser: {
      screen: ViceUser,
      path: 'vice_user/:from/:name'
    },
    ViceVenue: {
      screen: ViceVenue,
      path: 'vice_venue/:venue'
    },
    ViceMedia: {
      screen: ViceMedia,
      path: 'vice_media/:venue'
    },
    Venue: {
      screen: Venue,
      path: 'venue/:venue'
    },
    Review: Review,
    Payment: Payment,
    Filter: Filter,
    Search: Search,
  },
  {
    initialRouteName: 'Vice',
    navigationOptions: {
      header: (props) => <CustomHeader {...props} />,
      headerTransparent: true,
      headerTintColor: 'white',
      headerStyle: {
        borderBottomWidth: 0, // Remove the hairline bottom border
        ...Platform.select({
          android: {
            shadowColor: 'transparent',
            shadowOpacity: 0,
            shadowRadius: 0,
            shadowOffset: {
              height: 0,
              width: 0,
            },
            elevation: 0,
          }
        }),
      }
    }
  }
);

const VenuesStack = createStackNavigator(
  {
    Venues: Venues,
    Venue: {
      screen: Venue,
      path: 'venue/:venue'
    },
    VenueMedia: {
      screen: VenueMedia,
      path: 'venue_media/:venue'
    },
    VenueMenu: {
      screen: VenueMenu,
      path: 'venue_menu/:venue'
    },
    Booking: {
      screen: Booking,
      path: 'booking/:venue'
    },

    Delivery: {
      screen: Delivery,
      path: 'delivery:/venue'
    },
    PreOrder: {
      screen: PreOrder,
      path: 'pre_order/:venue'
    },
    PickUpPromo: {
      screen: PickUpPromo,
      path: 'pick_up_promo/:promo'
    },
    PickUp: {
      screen: PickUp,
      path: 'pick_up/:venue'
    },
    Post: {
      screen: VicePost,
      path: 'post/:post/:venue'
    },
    Review: Review,
    Payment: Payment,
    Filter: Filter,
    Search: Search,
  },
  {
    navigationOptions: {
      initialRouteName: 'Venues',
      header: (props) => <CustomHeader {...props} />,
      headerTransparent: true,
      headerTintColor: 'white',
      headerStyle: {
        borderBottomWidth: 0, // Remove the hairline bottom border
        ...Platform.select({
          android: {
            shadowColor: 'transparent',
            shadowOpacity: 0,
            shadowRadius: 0,
            shadowOffset: {
              height: 0,
              width: 0,
            },
            elevation: 0,
          }
        }),
      },
    }
  }
);

const ChatsStack = createStackNavigator(
  {
    Chats: Chats,
    ChatMessaging: {
      screen: ChatMessaging,
      path: 'chat_messaging/:chat_id'
    },
    Review: Review,
    Payment: Payment,
    Search: Search,
  },
  {
    initialRouteName: 'Chats',
    navigationOptions: {
      header: (props) => <CustomHeader {...props} />,
      headerTransparent: true,
      headerTintColor: 'white',
      headerStyle: {
        borderBottomWidth: 0, // Remove the hairline bottom border
        ...Platform.select({
          android: {
            shadowColor: 'transparent',
            shadowOpacity: 0,
            shadowRadius: 0,
            shadowOffset: {
              height: 0,
              width: 0,
            },
            elevation: 0,
          }
        }),
      },
    }
  }
);

const MoreStack = createStackNavigator(
  {
    More: More,
    MyAccount: MyAccount,
    Privacy: Privacy,
    MyPromoCodes: MyPromoCodes,
    MyBookings: MyBookings,
    MyOrders: MyOrders,
    MyFavorites: MyFavorites,
    MyPreOrders: MyPreOrders,
    ViceUser: {
      screen: ViceUser,
      path: 'vice_user/:from/:name'
    },
    Post: {
      screen: VicePost,
      path: 'post/:post/:venue'
    },
  },
  {
    initialRouteName: 'More',
    navigationOptions: {
      header: (props) => <CustomHeader {...props} />,
      headerTransparent: true,
      headerTintColor: 'white',
      headerStyle: {
        borderBottomWidth: 0, // Remove the hairline bottom border
        ...Platform.select({
          android: {
            shadowColor: 'transparent',
            shadowOpacity: 0,
            shadowRadius: 0,
            shadowOffset: {
              height: 0,
              width: 0,
            },
            elevation: 0,
          }
        }),
      },
    }
  }
);

const AppStack = createBottomTabNavigator(
  {
    Promos: PromosStack,
    Vice: ViceStack,
    Venues: VenuesStack,
    Chats: ChatsStack,
    More: MoreStack,
  }, {
    tabBarComponent: (props) => <CustomTabBar {...props} />,
    initialRouteName: 'Promos',
  });

const AuthStack = createStackNavigator(
  {
    Login: Login,
    Register: Register,
    ForgotPassword: ForgotPassword,
  }
);

const AppNavigator = createSwitchNavigator(
  {
    AuthLoading: LoadingScreen,
    App: AppStack,
    Auth: AuthStack,
  },
  {
    initialRouteName: 'AuthLoading'
  }
);

const prefix = Platform.OS === 'android' ? 'atlacarte://atlacarte/' : 'atlacarte://';

export default class App extends React.Component {
  constructor(props) {
    super(props)
  }

  componentWillMount() {
    OneSignal.addEventListener('received', this.onReceived)
    OneSignal.addEventListener('opened', this.onOpened)
    OneSignal.addEventListener('ids', this.onIds)
    OneSignal.inFocusDisplaying(2)
  }

  componentWillUnmount() {
    OneSignal.removeEventListener('received', this.onReceived)
    OneSignal.removeEventListener('opened', this.onOpened)
    OneSignal.removeEventListener('ids', this.onIds)
  }

  onReceived(notification) {
    console.log(`Notification received: ${notification}`)
  }

  onOpened(openResult) {
    if (openResult.notification.payload.additionalData["type"] === "chat_id") {
      this.props.navigation.navigate('ChatMessaging', {
        chat_id: openResult.notification.payload.additionalData["chat_id"],
        from: openResult.notification.payload.title
      })
    } else if (openResult.notification.payload.additionalData["type"] === "chat-id") {
      this.props.navigation.navigate('ChatMessaging', {
        chat_id: openResult.notification.payload.additionalData["chat-id"],
        from: openResult.notification.payload.title
      })
    } else {
      this.props.navigation.navigate('Promos')
    }
  }

  async onIds(device) {
    console.log(`Device info: ${device}`)

    const token = await AsyncStorage.getItem('bearer')

    if (token !== null) {
      fetch(`${API_URL}/api/v1/user/me/setDevice/${device.userId}`, {
        method: 'GET',
        headers: {
          'Accept': 'javascript/json',
          'Authorization': `Bearer ${token}`,
          'Content-Type': 'multipart/form-data'
        },
      })
    }
  }

  render() {
    return <AppNavigator uriPrefix={prefix} />;
  }
}