Browse Source

feat(App): refactor App and split it into BaseApp and App (continued)

There doesn't seem to be a strong need for the initialized React
Component state in BaseApp so remove/delete it.
j8
Lyubo Marinov 6 years ago
parent
commit
bfdfb5321c

+ 4
- 4
react/features/app/components/AbstractApp.js View File

10
 import { getDefaultURL } from '../functions';
10
 import { getDefaultURL } from '../functions';
11
 
11
 
12
 /**
12
 /**
13
- * {@code AbstractApp} component's property types.
13
+ * The type of React {@code Component} props of {@link AbstractApp}.
14
  */
14
  */
15
 export type Props = {
15
 export type Props = {
16
 
16
 
49
         super.componentWillMount();
49
         super.componentWillMount();
50
 
50
 
51
         this._init.then(() => {
51
         this._init.then(() => {
52
-            // If a URL was explicitly specified to this React Component,
53
-            // then open it; otherwise, use a default.
52
+            // If a URL was explicitly specified to this React Component, then
53
+            // open it; otherwise, use a default.
54
             this._openURL(toURLString(this.props.url) || this._getDefaultURL());
54
             this._openURL(toURLString(this.props.url) || this._getDefaultURL());
55
         });
55
         });
56
     }
56
     }
102
      * Creates an extra {@link ReactElement}s to be added (unconditionaly)
102
      * Creates an extra {@link ReactElement}s to be added (unconditionaly)
103
      * alongside the main element.
103
      * alongside the main element.
104
      *
104
      *
105
-     * @returns {ReactElement}
106
      * @abstract
105
      * @abstract
107
      * @protected
106
      * @protected
107
+     * @returns {ReactElement}
108
      */
108
      */
109
     _createExtraElement() {
109
     _createExtraElement() {
110
         return (
110
         return (

+ 27
- 28
react/features/app/components/App.native.js View File

27
 declare var __DEV__;
27
 declare var __DEV__;
28
 
28
 
29
 /**
29
 /**
30
- * App component's property types.
30
+ * The type of React {@code Component} props of {@link App}.
31
  */
31
  */
32
 type Props = AbstractAppProps & {
32
 type Props = AbstractAppProps & {
33
 
33
 
34
     /**
34
     /**
35
-     * Whether the add people feature is enabled or not.
35
+     * Whether the add people feature is enabled.
36
      */
36
      */
37
     addPeopleEnabled: boolean,
37
     addPeopleEnabled: boolean,
38
 
38
 
39
     /**
39
     /**
40
-     * Whether the dial-out feature is enabled or not.
40
+     * Whether the dial-out feature is enabled.
41
      */
41
      */
42
     dialOutEnabled: boolean,
42
     dialOutEnabled: boolean,
43
 
43
 
44
     /**
44
     /**
45
-     * Whether Picture-in-Picture is enabled. If {@code true}, a toolbar
46
-     * button is rendered in the {@link Conference} view to afford entering
45
+     * Whether Picture-in-Picture is enabled. If {@code true}, a toolbar button
46
+     * is rendered in the {@link Conference} view to afford entering
47
      * Picture-in-Picture.
47
      * Picture-in-Picture.
48
      */
48
      */
49
     pictureInPictureEnabled: boolean,
49
     pictureInPictureEnabled: boolean,
50
 
50
 
51
     /**
51
     /**
52
-     * Whether the Welcome page is enabled. If {@code true}, the Welcome
53
-     * page is rendered when the {@link App} is not at a location (URL)
54
-     * identifying a Jitsi Meet conference/room.
52
+     * Whether the Welcome page is enabled. If {@code true}, the Welcome page is
53
+     * rendered when the {@link App} is not at a location (URL) identifying
54
+     * a Jitsi Meet conference/room.
55
      */
55
      */
56
     welcomePageEnabled: boolean
56
     welcomePageEnabled: boolean
57
 };
57
 };
58
 
58
 
59
 /**
59
 /**
60
- * Root application component.
60
+ * Root app {@code Component} on mobile/React Native.
61
  *
61
  *
62
  * @extends AbstractApp
62
  * @extends AbstractApp
63
  */
63
  */
64
 export class App extends AbstractApp {
64
 export class App extends AbstractApp {
65
     /**
65
     /**
66
-     * Initializes a new App instance.
66
+     * Initializes a new {@code App} instance.
67
      *
67
      *
68
-     * @param {Object} props - The read-only React Component props with which
69
-     * the new instance is to be initialized.
68
+     * @param {Props} props - The read-only React {@code Component} props with
69
+     * which the new instance is to be initialized.
70
      */
70
      */
71
     constructor(props: Props) {
71
     constructor(props: Props) {
72
         super(props);
72
         super(props);
76
 
76
 
77
         // In the Release configuration, React Native will (intentionally) throw
77
         // In the Release configuration, React Native will (intentionally) throw
78
         // an unhandled JavascriptException for an unhandled JavaScript error.
78
         // an unhandled JavascriptException for an unhandled JavaScript error.
79
-        // This will effectively kill the application. In accord with the Web,
80
-        // do not kill the application.
79
+        // This will effectively kill the app. In accord with the Web, do not
80
+        // kill the app.
81
         this._maybeDisableExceptionsManager();
81
         this._maybeDisableExceptionsManager();
82
     }
82
     }
83
 
83
 
130
      * {@link ExceptionsManager#handleException} on platforms and in
130
      * {@link ExceptionsManager#handleException} on platforms and in
131
      * configurations on/in which the use of the method in questions has been
131
      * configurations on/in which the use of the method in questions has been
132
      * determined to be undesirable. For example, React Native will
132
      * determined to be undesirable. For example, React Native will
133
-     * (intentionally) throw an unhandled JavascriptException for an
133
+     * (intentionally) throw an unhandled {@code JavascriptException} for an
134
      * unhandled JavaScript error in the Release configuration. This will
134
      * unhandled JavaScript error in the Release configuration. This will
135
-     * effectively kill the application. In accord with the Web, do not kill the
136
-     * application.
135
+     * effectively kill the app. In accord with the Web, do not kill the app.
137
      *
136
      *
138
      * @private
137
      * @private
139
      * @returns {void}
138
      * @returns {void}
148
             // A solution based on RTCSetFatalHandler was implemented on iOS and
147
             // A solution based on RTCSetFatalHandler was implemented on iOS and
149
             // it is preferred because it is at a later step of the
148
             // it is preferred because it is at a later step of the
150
             // error/exception handling and it is specific to fatal
149
             // error/exception handling and it is specific to fatal
151
-            // errors/exceptions which were observed to kill the application.
152
-            // The solution implemented bellow was tested on Android only so it
153
-            // is considered safest to use it there only.
150
+            // errors/exceptions which were observed to kill the app. The
151
+            // solution implemented bellow was tested on Android only so it is
152
+            // considered safest to use it there only.
154
             return;
153
             return;
155
         }
154
         }
156
 
155
 
167
 
166
 
168
     /**
167
     /**
169
      * Notified by React's Linking API that a specific URL registered to be
168
      * Notified by React's Linking API that a specific URL registered to be
170
-     * handled by this App was activated.
169
+     * handled by this app was activated.
171
      *
170
      *
172
      * @param {Object} event - The details of the notification/event.
171
      * @param {Object} event - The details of the notification/event.
173
-     * @param {string} event.url - The URL registered to be handled by this App
172
+     * @param {string} event.url - The URL registered to be handled by this app
174
      * which was activated.
173
      * which was activated.
175
      * @private
174
      * @private
176
      * @returns {void}
175
      * @returns {void}
183
 /**
182
 /**
184
  * Handles a (possibly unhandled) JavaScript error by preventing React Native
183
  * Handles a (possibly unhandled) JavaScript error by preventing React Native
185
  * from converting a fatal error into an unhandled native exception which will
184
  * from converting a fatal error into an unhandled native exception which will
186
- * kill the application.
185
+ * kill the app.
187
  *
186
  *
188
  * @param {Error} error - The (possibly unhandled) JavaScript error to handle.
187
  * @param {Error} error - The (possibly unhandled) JavaScript error to handle.
189
- * @param {boolean} fatal - True if the specified error is fatal; otherwise,
190
- * false.
188
+ * @param {boolean} fatal - If the specified error is fatal, {@code true};
189
+ * otherwise, {@code false}.
191
  * @private
190
  * @private
192
  * @returns {void}
191
  * @returns {void}
193
  */
192
  */
195
     if (fatal) {
194
     if (fatal) {
196
         // In the Release configuration, React Native will (intentionally) throw
195
         // In the Release configuration, React Native will (intentionally) throw
197
         // an unhandled JavascriptException for an unhandled JavaScript error.
196
         // an unhandled JavascriptException for an unhandled JavaScript error.
198
-        // This will effectively kill the application. In accord with the Web,
199
-        // do not kill the application.
197
+        // This will effectively kill the app. In accord with the Web, do not
198
+        // kill the app.
200
         console.error(error);
199
         console.error(error);
201
     } else {
200
     } else {
202
         // Forward to the next globalHandler of ErrorUtils.
201
         // Forward to the next globalHandler of ErrorUtils.
203
-        const next = _handleException.next;
202
+        const { next } = _handleException;
204
 
203
 
205
         typeof next === 'function' && next(error, fatal);
204
         typeof next === 'function' && next(error, fatal);
206
     }
205
     }

+ 11
- 11
react/features/app/components/App.web.js View File

11
 import { AbstractApp } from './AbstractApp';
11
 import { AbstractApp } from './AbstractApp';
12
 
12
 
13
 /**
13
 /**
14
- * Root application component.
14
+ * Root app {@code Component} on Web/React.
15
  *
15
  *
16
  * @extends AbstractApp
16
  * @extends AbstractApp
17
  */
17
  */
18
 export class App extends AbstractApp {
18
 export class App extends AbstractApp {
19
+    /**
20
+     * Gets a Location object from the window with information about the current
21
+     * location of the document.
22
+     *
23
+     * @inheritdoc
24
+     */
25
+    getWindowLocation() {
26
+        return window.location;
27
+    }
28
+
19
     /**
29
     /**
20
      * Overrides the parent method to inject {@link AtlasKitThemeProvider} as
30
      * Overrides the parent method to inject {@link AtlasKitThemeProvider} as
21
      * the top most component.
31
      * the top most component.
29
             </AtlasKitThemeProvider>
39
             </AtlasKitThemeProvider>
30
         );
40
         );
31
     }
41
     }
32
-
33
-    /**
34
-     * Gets a Location object from the window with information about the current
35
-     * location of the document.
36
-     *
37
-     * @inheritdoc
38
-     */
39
-    getWindowLocation() {
40
-        return window.location;
41
-    }
42
 }
42
 }

+ 13
- 30
react/features/base/app/components/BaseApp.js View File

20
 
20
 
21
 declare var APP: Object;
21
 declare var APP: Object;
22
 
22
 
23
+/**
24
+ * The type of the React {@code Component} state of {@link BaseApp}.
25
+ */
23
 type State = {
26
 type State = {
24
 
27
 
25
     /**
28
     /**
26
-     * The state of the »possible« async initialization of
27
-     * the {@code BaseApp}.
28
-     */
29
-    initialized: boolean,
30
-
31
-    /**
32
-     * The Route rendered by this {@code BaseApp}.
29
+     * The {@code Route} rendered by the {@code BaseApp}.
33
      */
30
      */
34
     route: Object,
31
     route: Object,
35
 
32
 
36
     /**
33
     /**
37
-     * The redux store used by this {@code BaseApp}.
34
+     * The redux store used by the {@code BaseApp}.
38
      */
35
      */
39
     store: Object
36
     store: Object
40
 };
37
 };
57
         super(props);
54
         super(props);
58
 
55
 
59
         this.state = {
56
         this.state = {
60
-            initialized: false,
61
             route: {},
57
             route: {},
62
 
58
 
63
             // $FlowFixMe
59
             // $FlowFixMe
65
         };
61
         };
66
 
62
 
67
         /**
63
         /**
68
-         * Make the mobile {@code BaseApp} wait until the
69
-         * {@code AsyncStorage} implementation of {@code Storage} initializes
70
-         * fully.
64
+         * Make the mobile {@code BaseApp} wait until the {@code AsyncStorage}
65
+         * implementation of {@code Storage} initializes fully.
71
          *
66
          *
72
          * @private
67
          * @private
73
          * @see {@link #_initStorage}
68
          * @see {@link #_initStorage}
83
     }
78
     }
84
 
79
 
85
     /**
80
     /**
86
-     * Initialize the application.
81
+     * Initializes the app.
87
      *
82
      *
88
      * @inheritdoc
83
      * @inheritdoc
89
      */
84
      */
90
     componentWillMount() {
85
     componentWillMount() {
91
-        this._init.then(() => {
92
-            const { dispatch } = this.state.store;
93
-
94
-            dispatch(appWillMount(this));
95
-
96
-            // We set the initialized state here and not in the constructor to
97
-            // make sure that {@code componentWillMount} gets invoked before
98
-            // the app tries to render the actual app content.
99
-            this.setState({ initialized: true });
100
-        });
86
+        this._init.then(() => this.state.store.dispatch(appWillMount(this)));
101
     }
87
     }
102
 
88
 
103
     /**
89
     /**
104
-     * De-initialize the application.
90
+     * De-initializes the app.
105
      *
91
      *
106
      * @inheritdoc
92
      * @inheritdoc
107
      */
93
      */
108
     componentWillUnmount() {
94
     componentWillUnmount() {
109
-        const { dispatch } = this.state.store;
110
-
111
-        dispatch(appWillUnmount(this));
95
+        this.state.store.dispatch(appWillUnmount(this));
112
     }
96
     }
113
 
97
 
114
     /**
98
     /**
133
      * @returns {ReactElement}
117
      * @returns {ReactElement}
134
      */
118
      */
135
     render() {
119
     render() {
136
-        const { initialized, route, store } = this.state;
137
-        const { component } = route;
120
+        const { route: { component }, store } = this.state;
138
 
121
 
139
-        if (initialized && component) {
122
+        if (store && component) {
140
             return (
123
             return (
141
                 <I18nextProvider i18n = { i18next }>
124
                 <I18nextProvider i18n = { i18next }>
142
                     <Provider store = { store }>
125
                     <Provider store = { store }>

Loading…
Cancel
Save