ソースを参照

fix(deep-linking): deep link first, then show unsupported

Re-structure the custom routing to split between
platforms instead of between intended route features.
This made it easier for me to understand where to
do the checks for unsupported browser after deep-linking
had been checked.
master
Leonard Kim 6年前
コミット
e47d2d13ce
1個のファイルの変更111行の追加52行の削除
  1. 111
    52
      react/features/app/getRouteToRender.js

+ 111
- 52
react/features/app/getRouteToRender.js ファイルの表示

@@ -40,69 +40,128 @@ export type Route = {
40 40
  */
41 41
 export function _getRouteToRender(stateful: Function | Object): Promise<Route> {
42 42
     const state = toState(stateful);
43
-    const { room } = state['features/base/conference'];
44
-    const isMobileApp = navigator.product === 'ReactNative';
45
-    const isMobileBrowser
46
-        = !isMobileApp && (Platform.OS === 'android' || Platform.OS === 'ios');
47
-    const route: Route = {
48
-        component: BlankPage,
49
-        href: undefined
50
-    };
51 43
 
52
-    return new Promise(resolve => {
53
-        // First, check if the current endpoint supports WebRTC. We are
54
-        // intentionally not performing the check for mobile browsers because:
55
-        // - the WelcomePage is mobile ready;
56
-        // - if the URL points to a conference, getDeepLinkingPage will take
57
-        //   care of it.
58
-        if (!isMobileBrowser && !JitsiMeetJS.isWebRtcSupported()) {
59
-            route.component = UnsupportedDesktopBrowser;
60
-            resolve(route);
44
+    if (navigator.product === 'ReactNative') {
45
+        return _getMobileRoute(state);
46
+    }
61 47
 
62
-            return;
63
-        }
48
+    return _getWebConferenceRoute(state) || _getWebWelcomePageRoute(state);
49
+}
50
+
51
+/**
52
+ * Returns the {@code Route} to display on the React Native app.
53
+ *
54
+ * @param {Object} state - The redux state.
55
+ * @returns {Promise<Route>}
56
+ */
57
+function _getMobileRoute(state): Promise<Route> {
58
+    const route = _getEmptyRoute();
59
+
60
+    if (isRoomValid(state['features/base/conference'].room)) {
61
+        route.component = Conference;
62
+    } else if (isWelcomePageAppEnabled(state)) {
63
+        route.component = WelcomePage;
64
+    } else {
65
+        route.component = BlankPage;
66
+    }
64 67
 
65
-        if (isRoomValid(room)) {
66
-            if (isMobileApp) {
68
+    return Promise.resolve(route);
69
+}
70
+
71
+/**
72
+ * Returns the {@code Route} to display when trying to access a conference if
73
+ * a valid conference is being joined.
74
+ *
75
+ * @param {Object} state - The redux state.
76
+ * @returns {Promise<Route>|undefined}
77
+ */
78
+function _getWebConferenceRoute(state): ?Promise<Route> {
79
+    if (!isRoomValid(state['features/base/conference'].room)) {
80
+        return;
81
+    }
82
+
83
+    const route = _getEmptyRoute();
84
+
85
+    // Update the location if it doesn't match. This happens when a room is
86
+    // joined from the welcome page. The reason for doing this instead of using
87
+    // the history API is that we want to load the config.js which takes the
88
+    // room into account.
89
+    const { locationURL } = state['features/base/connection'];
90
+
91
+    if (window.location.href !== locationURL.href) {
92
+        route.href = locationURL.href;
93
+
94
+        return Promise.resolve(route);
95
+    }
96
+
97
+    return getDeepLinkingPage(state)
98
+        .then(deepLinkComponent => {
99
+            if (deepLinkComponent) {
100
+                route.component = deepLinkComponent;
101
+            } else if (_isSupportedBrowser()) {
67 102
                 route.component = Conference;
68
-                resolve(route);
69 103
             } else {
70
-                // Update the location if it doesn't match. This happens when a
71
-                // room is joined from the welcome page. The reason for doing
72
-                // this instead of using the history API is that we want to load
73
-                // the config.js which takes the room into account.
74
-                const { locationURL } = state['features/base/connection'];
75
-
76
-                // eslint-disable-next-line no-negated-condition
77
-                if (window.location.href !== locationURL.href) {
78
-                    route.href = locationURL.href;
79
-                    resolve(route);
80
-                } else {
81
-                    // Maybe show deep-linking, otherwise go to Conference.
82
-                    getDeepLinkingPage(state).then(component => {
83
-                        route.component = component || Conference;
84
-                        resolve(route);
85
-                    });
86
-                }
104
+                route.component = UnsupportedDesktopBrowser;
87 105
             }
88 106
 
89
-            return;
107
+            return route;
108
+        });
109
+}
110
+
111
+/**
112
+ * Returns the {@code Route} to display when trying to access the welcome page.
113
+ *
114
+ * @param {Object} state - The redux state.
115
+ * @returns {Promise<Route>}
116
+ */
117
+function _getWebWelcomePageRoute(state): Promise<Route> {
118
+    const route = _getEmptyRoute();
119
+
120
+    if (isWelcomePageUserEnabled(state)) {
121
+        if (_isSupportedBrowser()) {
122
+            route.component = WelcomePage;
123
+        } else {
124
+            route.component = UnsupportedDesktopBrowser;
90 125
         }
126
+    } else {
127
+        // Web: if the welcome page is disabled, go directly to a random room.
91 128
 
92
-        if (!isWelcomePageUserEnabled(state)) {
93
-            // Web: if the welcome page is disabled, go directly to a random
94
-            // room.
129
+        let href = window.location.href;
95 130
 
96
-            let href = window.location.href;
131
+        href.endsWith('/') || (href += '/');
132
+        route.href = href + generateRoomWithoutSeparator();
133
+    }
97 134
 
98
-            href.endsWith('/') || (href += '/');
99
-            route.href = href + generateRoomWithoutSeparator();
100
-        } else if (isWelcomePageAppEnabled(state)) {
101
-            // Mobile: only go to the welcome page if enabled.
135
+    return Promise.resolve(route);
136
+}
102 137
 
103
-            route.component = WelcomePage;
104
-        }
138
+/**
139
+ * Returns whether or not the current browser should allow the app to display.
140
+ *
141
+ * @returns {boolean}
142
+ */
143
+function _isSupportedBrowser() {
144
+    if (navigator.product === 'ReactNative') {
145
+        return false;
146
+    }
105 147
 
106
-        resolve(route);
107
-    });
148
+    // We are intentionally allow mobile browsers because:
149
+    // - the WelcomePage is mobile ready;
150
+    // - if the URL points to a conference, getDeepLinkingPage will take
151
+    //   care of it.
152
+    return Platform.OS === 'android'
153
+        || Platform.OS === 'ios'
154
+        || JitsiMeetJS.isWebRtcSupported();
155
+}
156
+
157
+/**
158
+ * Returns the default {@code Route}.
159
+ *
160
+ * @returns {Route}
161
+ */
162
+function _getEmptyRoute(): Route {
163
+    return {
164
+        component: BlankPage,
165
+        href: undefined
166
+    };
108 167
 }

読み込み中…
キャンセル
保存