diff --git a/react/features/app/getRouteToRender.js b/react/features/app/getRouteToRender.js index 2df37afcb..b897286ec 100644 --- a/react/features/app/getRouteToRender.js +++ b/react/features/app/getRouteToRender.js @@ -40,69 +40,128 @@ export type Route = { */ export function _getRouteToRender(stateful: Function | Object): Promise { const state = toState(stateful); - const { room } = state['features/base/conference']; - const isMobileApp = navigator.product === 'ReactNative'; - const isMobileBrowser - = !isMobileApp && (Platform.OS === 'android' || Platform.OS === 'ios'); - const route: Route = { + + if (navigator.product === 'ReactNative') { + return _getMobileRoute(state); + } + + return _getWebConferenceRoute(state) || _getWebWelcomePageRoute(state); +} + +/** + * Returns the {@code Route} to display on the React Native app. + * + * @param {Object} state - The redux state. + * @returns {Promise} + */ +function _getMobileRoute(state): Promise { + const route = _getEmptyRoute(); + + if (isRoomValid(state['features/base/conference'].room)) { + route.component = Conference; + } else if (isWelcomePageAppEnabled(state)) { + route.component = WelcomePage; + } else { + route.component = BlankPage; + } + + return Promise.resolve(route); +} + +/** + * Returns the {@code Route} to display when trying to access a conference if + * a valid conference is being joined. + * + * @param {Object} state - The redux state. + * @returns {Promise|undefined} + */ +function _getWebConferenceRoute(state): ?Promise { + if (!isRoomValid(state['features/base/conference'].room)) { + return; + } + + const route = _getEmptyRoute(); + + // Update the location if it doesn't match. This happens when a room is + // joined from the welcome page. The reason for doing this instead of using + // the history API is that we want to load the config.js which takes the + // room into account. + const { locationURL } = state['features/base/connection']; + + if (window.location.href !== locationURL.href) { + route.href = locationURL.href; + + return Promise.resolve(route); + } + + return getDeepLinkingPage(state) + .then(deepLinkComponent => { + if (deepLinkComponent) { + route.component = deepLinkComponent; + } else if (_isSupportedBrowser()) { + route.component = Conference; + } else { + route.component = UnsupportedDesktopBrowser; + } + + return route; + }); +} + +/** + * Returns the {@code Route} to display when trying to access the welcome page. + * + * @param {Object} state - The redux state. + * @returns {Promise} + */ +function _getWebWelcomePageRoute(state): Promise { + const route = _getEmptyRoute(); + + if (isWelcomePageUserEnabled(state)) { + if (_isSupportedBrowser()) { + route.component = WelcomePage; + } else { + route.component = UnsupportedDesktopBrowser; + } + } else { + // Web: if the welcome page is disabled, go directly to a random room. + + let href = window.location.href; + + href.endsWith('/') || (href += '/'); + route.href = href + generateRoomWithoutSeparator(); + } + + return Promise.resolve(route); +} + +/** + * Returns whether or not the current browser should allow the app to display. + * + * @returns {boolean} + */ +function _isSupportedBrowser() { + if (navigator.product === 'ReactNative') { + return false; + } + + // We are intentionally allow mobile browsers because: + // - the WelcomePage is mobile ready; + // - if the URL points to a conference, getDeepLinkingPage will take + // care of it. + return Platform.OS === 'android' + || Platform.OS === 'ios' + || JitsiMeetJS.isWebRtcSupported(); +} + +/** + * Returns the default {@code Route}. + * + * @returns {Route} + */ +function _getEmptyRoute(): Route { + return { component: BlankPage, href: undefined }; - - return new Promise(resolve => { - // First, check if the current endpoint supports WebRTC. We are - // intentionally not performing the check for mobile browsers because: - // - the WelcomePage is mobile ready; - // - if the URL points to a conference, getDeepLinkingPage will take - // care of it. - if (!isMobileBrowser && !JitsiMeetJS.isWebRtcSupported()) { - route.component = UnsupportedDesktopBrowser; - resolve(route); - - return; - } - - if (isRoomValid(room)) { - if (isMobileApp) { - route.component = Conference; - resolve(route); - } else { - // Update the location if it doesn't match. This happens when a - // room is joined from the welcome page. The reason for doing - // this instead of using the history API is that we want to load - // the config.js which takes the room into account. - const { locationURL } = state['features/base/connection']; - - // eslint-disable-next-line no-negated-condition - if (window.location.href !== locationURL.href) { - route.href = locationURL.href; - resolve(route); - } else { - // Maybe show deep-linking, otherwise go to Conference. - getDeepLinkingPage(state).then(component => { - route.component = component || Conference; - resolve(route); - }); - } - } - - return; - } - - if (!isWelcomePageUserEnabled(state)) { - // Web: if the welcome page is disabled, go directly to a random - // room. - - let href = window.location.href; - - href.endsWith('/') || (href += '/'); - route.href = href + generateRoomWithoutSeparator(); - } else if (isWelcomePageAppEnabled(state)) { - // Mobile: only go to the welcome page if enabled. - - route.component = WelcomePage; - } - - resolve(route); - }); }