import React from 'react'; import { createStackNavigator, createAppContainer, createSwitchNavigator, createDrawerNavigator } from 'react-navigation'; import { Provider } from 'react-redux'; import { useScreens } from 'react-native-screens'; // eslint-disable-line import/no-unresolved import { Linking } from 'react-native'; import firebase from 'react-native-firebase'; import PropTypes from 'prop-types'; import { appInit } from './actions'; import { deepLinkingOpen } from './actions/deepLinking'; import OnboardingView from './views/OnboardingView'; import NewServerView from './views/NewServerView'; import LoginSignupView from './views/LoginSignupView'; import AuthLoadingView from './views/AuthLoadingView'; import RoomsListView from './views/RoomsListView'; import RoomView from './views/RoomView'; import NewMessageView from './views/NewMessageView'; import DirectoryView from './views/DirectoryView'; import LoginView from './views/LoginView'; import Navigation from './lib/Navigation'; import Sidebar from './views/SidebarView'; import ProfileView from './views/ProfileView'; import SettingsView from './views/SettingsView'; import LanguageView from './views/LanguageView'; import AdminPanelView from './views/AdminPanelView'; import RoomActionsView from './views/RoomActionsView'; import RoomInfoView from './views/RoomInfoView'; import RoomInfoEditView from './views/RoomInfoEditView'; import RoomMembersView from './views/RoomMembersView'; import SearchMessagesView from './views/SearchMessagesView'; import ReadReceiptsView from './views/ReadReceiptView'; import ThreadMessagesView from './views/ThreadMessagesView'; import MessagesView from './views/MessagesView'; import SelectedUsersView from './views/SelectedUsersView'; import CreateChannelView from './views/CreateChannelView'; import LegalView from './views/LegalView'; import ForgotPasswordView from './views/ForgotPasswordView'; import RegisterView from './views/RegisterView'; import OAuthView from './views/OAuthView'; import SetUsernameView from './views/SetUsernameView'; import { HEADER_BACKGROUND, HEADER_TITLE, HEADER_BACK } from './constants/colors'; import parseQuery from './lib/methods/helpers/parseQuery'; import { initializePushNotifications, onNotification } from './notifications/push'; import store from './lib/createStore'; import NotificationBadge from './notifications/inApp'; useScreens(); const parseDeepLinking = (url) => { if (url) { url = url.replace(/rocketchat:\/\/|https:\/\/go.rocket.chat\//, ''); const regex = /^(room|auth)\?/; if (url.match(regex)) { url = url.replace(regex, '').trim(); if (url) { return parseQuery(url); } } } return null; }; const defaultHeader = { headerStyle: { backgroundColor: HEADER_BACKGROUND }, headerTitleStyle: { color: HEADER_TITLE }, headerBackTitle: null, headerTintColor: HEADER_BACK }; // Outside const OutsideStack = createStackNavigator({ OnboardingView: { screen: OnboardingView, header: null }, NewServerView, LoginSignupView, LoginView, ForgotPasswordView, RegisterView, LegalView }, { defaultNavigationOptions: defaultHeader }); const OAuthStack = createStackNavigator({ OAuthView }, { defaultNavigationOptions: defaultHeader }); const OutsideStackModal = createStackNavigator({ OutsideStack, OAuthStack }, { mode: 'modal', headerMode: 'none' }); // Inside const ChatsStack = createStackNavigator({ RoomsListView, RoomView, RoomActionsView, RoomInfoView, RoomInfoEditView, RoomMembersView, SearchMessagesView, SelectedUsersView, ThreadMessagesView, MessagesView, ReadReceiptsView, DirectoryView }, { defaultNavigationOptions: defaultHeader }); ChatsStack.navigationOptions = ({ navigation }) => { let drawerLockMode = 'unlocked'; if (navigation.state.index > 0) { drawerLockMode = 'locked-closed'; } return { drawerLockMode }; }; const ProfileStack = createStackNavigator({ ProfileView }, { defaultNavigationOptions: defaultHeader }); ProfileStack.navigationOptions = ({ navigation }) => { let drawerLockMode = 'unlocked'; if (navigation.state.index > 0) { drawerLockMode = 'locked-closed'; } return { drawerLockMode }; }; const SettingsStack = createStackNavigator({ SettingsView, LanguageView }, { defaultNavigationOptions: defaultHeader }); const AdminPanelStack = createStackNavigator({ AdminPanelView }, { defaultNavigationOptions: defaultHeader }); SettingsStack.navigationOptions = ({ navigation }) => { let drawerLockMode = 'unlocked'; if (navigation.state.index > 0) { drawerLockMode = 'locked-closed'; } return { drawerLockMode }; }; const ChatsDrawer = createDrawerNavigator({ ChatsStack, ProfileStack, SettingsStack, AdminPanelStack }, { contentComponent: Sidebar }); const NewMessageStack = createStackNavigator({ NewMessageView, SelectedUsersViewCreateChannel: SelectedUsersView, CreateChannelView }, { defaultNavigationOptions: defaultHeader }); const InsideStackModal = createStackNavigator({ Main: ChatsDrawer, NewMessageStack }, { mode: 'modal', headerMode: 'none' }); const SetUsernameStack = createStackNavigator({ SetUsernameView }); class CustomInsideStack extends React.Component { static router = InsideStackModal.router; static propTypes = { navigation: PropTypes.object } render() { const { navigation } = this.props; return ( ); } } const App = createAppContainer(createSwitchNavigator( { OutsideStack: OutsideStackModal, InsideStack: CustomInsideStack, AuthLoading: AuthLoadingView, SetUsernameStack }, { initialRouteName: 'AuthLoading' } )); // gets the current screen from navigation state const getActiveRouteName = (navigationState) => { if (!navigationState) { return null; } const route = navigationState.routes[navigationState.index]; // dive into nested navigators if (route.routes) { return getActiveRouteName(route); } return route.routeName; }; const onNavigationStateChange = (prevState, currentState) => { const currentScreen = getActiveRouteName(currentState); const prevScreen = getActiveRouteName(prevState); if (prevScreen !== currentScreen) { firebase.analytics().setCurrentScreen(currentScreen); } }; export default class Root extends React.Component { constructor(props) { super(props); this.init(); } componentDidMount() { this.listenerTimeout = setTimeout(() => { Linking.addEventListener('url', ({ url }) => { const parsedDeepLinkingURL = parseDeepLinking(url); if (parsedDeepLinkingURL) { store.dispatch(deepLinkingOpen(parsedDeepLinkingURL)); } }); }, 5000); } componentWillUnmount() { clearTimeout(this.listenerTimeout); } init = async() => { const [notification, deepLinking] = await Promise.all([initializePushNotifications(), Linking.getInitialURL()]); const parsedDeepLinkingURL = parseDeepLinking(deepLinking); if (notification) { onNotification(notification); } else if (parsedDeepLinkingURL) { store.dispatch(deepLinkingOpen(parsedDeepLinkingURL)); } else { store.dispatch(appInit()); } } render() { return ( { Navigation.setTopLevelNavigator(navigatorRef); }} onNavigationStateChange={onNavigationStateChange} /> ); } }