Explorar el Código

rn,blank-page: refactor BlankPage

- Remove network-activity "feature"
    - It wasn't in use
    - It relied on internal React Native components, bound to break anytime
- Show an infinite loading indicator
- Style it just like the LoadConfigOverlay
    - Since it kinda represents the opposite, an "unload" then SDK is done
j8
Saúl Ibarra Corretgé hace 6 años
padre
commit
d33b700477

+ 0
- 37
react/features/mobile/network-activity/actionTypes.js Ver fichero

1
-/**
2
- * The type of redux action to add a network request to the redux store/state.
3
- *
4
- * {
5
- *     type: _ADD_NETWORK_REQUEST,
6
- *     request: Object
7
- * }
8
- *
9
- * @protected
10
- */
11
-export const _ADD_NETWORK_REQUEST = '_ADD_NETWORK_REQUEST';
12
-
13
-/**
14
- * The type of redux action to remove all network requests from the redux
15
- * store/state.
16
- *
17
- * {
18
- *     type: _REMOVE_ALL_NETWORK_REQUESTS,
19
- * }
20
- *
21
- * @protected
22
- */
23
-export const _REMOVE_ALL_NETWORK_REQUESTS
24
-    = '_REMOVE_ALL_NETWORK_REQUESTS';
25
-
26
-/**
27
- * The type of redux action to remove a network request from the redux
28
- * store/state.
29
- *
30
- * {
31
- *     type: _REMOVE_NETWORK_REQUEST,
32
- *     request: Object
33
- * }
34
- *
35
- * @protected
36
- */
37
-export const _REMOVE_NETWORK_REQUEST = '_REMOVE_NETWORK_REQUEST';

+ 0
- 55
react/features/mobile/network-activity/components/NetworkActivityIndicator.js Ver fichero

1
-// @flow
2
-
3
-import React, { Component } from 'react';
4
-
5
-import { LoadingIndicator } from '../../../base/react';
6
-import { connect } from '../../../base/redux';
7
-
8
-/**
9
- * The type of the React {@code Component} props of
10
- * {@link NetworkActivityIndicator}.
11
- */
12
-type Props = {
13
-
14
-    /**
15
-     * Indicates whether there is network activity i.e. ongoing network
16
-     * requests.
17
-     */
18
-    _networkActivity: boolean
19
-};
20
-
21
-/**
22
- * The React {@code Component} which renders a progress indicator when there
23
- * are ongoing network requests.
24
- */
25
-class NetworkActivityIndicator extends Component<Props> {
26
-    /**
27
-     * Implements React's {@link Component#render()}.
28
-     *
29
-     * @inheritdoc
30
-     * @returns {ReactElement}
31
-     */
32
-    render() {
33
-        return this.props._networkActivity ? <LoadingIndicator /> : null;
34
-    }
35
-}
36
-
37
-/**
38
- * Maps (parts of) the redux state to the React {@code Component} props of
39
- * {@code NetworkActivityIndicator}.
40
- *
41
- * @param {Object} state - The redux state.
42
- * @private
43
- * @returns {{
44
- *     _networkActivity: boolean
45
- * }}
46
- */
47
-function _mapStateToProps(state) {
48
-    const { requests } = state['features/network-activity'];
49
-
50
-    return {
51
-        _networkActivity: Boolean(requests && requests.size)
52
-    };
53
-}
54
-
55
-export default connect(_mapStateToProps)(NetworkActivityIndicator);

+ 0
- 3
react/features/mobile/network-activity/components/index.js Ver fichero

1
-export {
2
-    default as NetworkActivityIndicator
3
-} from './NetworkActivityIndicator';

+ 0
- 4
react/features/mobile/network-activity/index.js Ver fichero

1
-export * from './components';
2
-
3
-import './middleware';
4
-import './reducer';

+ 0
- 81
react/features/mobile/network-activity/middleware.js Ver fichero

1
-/* @flow */
2
-
3
-import XHRInterceptor from 'react-native/Libraries/Network/XHRInterceptor';
4
-
5
-import { APP_WILL_MOUNT, APP_WILL_UNMOUNT } from '../../base/app';
6
-import { MiddlewareRegistry } from '../../base/redux';
7
-
8
-import {
9
-    _ADD_NETWORK_REQUEST,
10
-    _REMOVE_ALL_NETWORK_REQUESTS,
11
-    _REMOVE_NETWORK_REQUEST
12
-} from './actionTypes';
13
-
14
-/**
15
- * Middleware which captures app startup and conference actions in order to
16
- * clear the image cache.
17
- *
18
- * @returns {Function}
19
- */
20
-MiddlewareRegistry.register(store => next => action => {
21
-    const result = next(action);
22
-
23
-    switch (action.type) {
24
-    case APP_WILL_MOUNT:
25
-        _startNetInterception(store);
26
-        break;
27
-
28
-    case APP_WILL_UNMOUNT:
29
-        _stopNetInterception(store);
30
-        break;
31
-    }
32
-
33
-    return result;
34
-});
35
-
36
-/**
37
- * Starts intercepting network requests. Only XHR requests are supported at the
38
- * moment.
39
- *
40
- * Ongoing request information is kept in redux, and it's removed as soon as a
41
- * given request is complete.
42
- *
43
- * @param {Object} store - The redux store.
44
- * @private
45
- * @returns {void}
46
- */
47
-function _startNetInterception({ dispatch }) {
48
-    XHRInterceptor.setOpenCallback((method, url, xhr) => dispatch({
49
-        type: _ADD_NETWORK_REQUEST,
50
-        request: xhr,
51
-
52
-        // The following are not really necessary read anywhere at the time of
53
-        // this writing but are provided anyway if the reducer chooses to
54
-        // remember them:
55
-        method,
56
-        url
57
-    }));
58
-    XHRInterceptor.setResponseCallback((...args) => dispatch({
59
-        type: _REMOVE_NETWORK_REQUEST,
60
-
61
-        // XXX The XHR is the last argument of the responseCallback.
62
-        request: args[args.length - 1]
63
-    }));
64
-
65
-    XHRInterceptor.enableInterception();
66
-}
67
-
68
-/**
69
- * Stops intercepting network requests.
70
- *
71
- * @param {Object} store - The redux store.
72
- * @private
73
- * @returns {void}
74
- */
75
-function _stopNetInterception({ dispatch }) {
76
-    XHRInterceptor.disableInterception();
77
-
78
-    dispatch({
79
-        type: _REMOVE_ALL_NETWORK_REQUESTS
80
-    });
81
-}

+ 0
- 60
react/features/mobile/network-activity/reducer.js Ver fichero

1
-// @flow
2
-
3
-import { ReducerRegistry, set } from '../../base/redux';
4
-
5
-import {
6
-    _ADD_NETWORK_REQUEST,
7
-    _REMOVE_ALL_NETWORK_REQUESTS,
8
-    _REMOVE_NETWORK_REQUEST
9
-} from './actionTypes';
10
-
11
-/**
12
- * The default/initial redux state of the feature network-activity.
13
- *
14
- * @type {{
15
- *     requests: Map
16
- * }}
17
- */
18
-const DEFAULT_STATE = {
19
-    /**
20
-     * The ongoing network requests i.e. the network request which have been
21
-     * added to the redux store/state and have not been removed.
22
-     *
23
-     * @type {Map}
24
-     */
25
-    requests: new Map()
26
-};
27
-
28
-ReducerRegistry.register(
29
-    'features/network-activity',
30
-    (state = DEFAULT_STATE, action) => {
31
-        switch (action.type) {
32
-        case _ADD_NETWORK_REQUEST: {
33
-            const {
34
-                type, // eslint-disable-line no-unused-vars
35
-
36
-                request: key,
37
-                ...value
38
-            } = action;
39
-            const requests = new Map(state.requests);
40
-
41
-            requests.set(key, value);
42
-
43
-            return set(state, 'requests', requests);
44
-        }
45
-
46
-        case _REMOVE_ALL_NETWORK_REQUESTS:
47
-            return set(state, 'requests', DEFAULT_STATE.requests);
48
-
49
-        case _REMOVE_NETWORK_REQUEST: {
50
-            const { request: key } = action;
51
-            const requests = new Map(state.requests);
52
-
53
-            requests.delete(key);
54
-
55
-            return set(state, 'requests', requests);
56
-        }
57
-        }
58
-
59
-        return state;
60
-    });

+ 35
- 6
react/features/welcome/components/BlankPage.native.js Ver fichero

1
 // @flow
1
 // @flow
2
 
2
 
3
 import React, { Component } from 'react';
3
 import React, { Component } from 'react';
4
+import { View } from 'react-native';
4
 import type { Dispatch } from 'redux';
5
 import type { Dispatch } from 'redux';
5
 
6
 
7
+import { ColorSchemeRegistry } from '../../base/color-scheme';
8
+import { LoadingIndicator } from '../../base/react';
6
 import { connect } from '../../base/redux';
9
 import { connect } from '../../base/redux';
10
+import { StyleType } from '../../base/styles';
7
 import { destroyLocalTracks } from '../../base/tracks';
11
 import { destroyLocalTracks } from '../../base/tracks';
8
-import { NetworkActivityIndicator } from '../../mobile/network-activity';
9
 
12
 
10
-import LocalVideoTrackUnderlay from './LocalVideoTrackUnderlay';
13
+import styles from './styles';
11
 
14
 
12
 /**
15
 /**
13
  * The type of React {@code Component} props of {@link BlankPage}.
16
  * The type of React {@code Component} props of {@link BlankPage}.
14
  */
17
  */
15
 type Props = {
18
 type Props = {
19
+
20
+    /**
21
+     * The color schemed style of the component.
22
+     */
23
+    _styles: StyleType,
24
+
16
     dispatch: Dispatch<any>
25
     dispatch: Dispatch<any>
17
 };
26
 };
18
 
27
 
40
      * @returns {ReactElement}
49
      * @returns {ReactElement}
41
      */
50
      */
42
     render() {
51
     render() {
52
+        const { _styles } = this.props;
53
+
43
         return (
54
         return (
44
-            <LocalVideoTrackUnderlay>
45
-                <NetworkActivityIndicator />
46
-            </LocalVideoTrackUnderlay>
55
+            <View
56
+                style = { [
57
+                    styles.blankPageWrapper,
58
+                    _styles.loadingOverlayWrapper
59
+                ] }>
60
+                <LoadingIndicator
61
+                    color = { _styles.indicatorColor }
62
+                    size = 'large' />
63
+            </View>
47
         );
64
         );
48
     }
65
     }
49
 }
66
 }
50
 
67
 
51
-export default connect()(BlankPage);
68
+/**
69
+ * Maps part of the Redux state to the props of this component.
70
+ *
71
+ * @param {Object} state - The Redux state.
72
+ * @returns {Props}
73
+ */
74
+function _mapStateToProps(state) {
75
+    return {
76
+        _styles: ColorSchemeRegistry.get(state, 'LoadConfigOverlay')
77
+    };
78
+}
79
+
80
+export default connect(_mapStateToProps)(BlankPage);

+ 13
- 0
react/features/welcome/components/styles.js Ver fichero

1
 // @flow
1
 // @flow
2
 
2
 
3
+import { StyleSheet } from 'react-native';
4
+
3
 import { BoxModel, ColorPalette } from '../../base/styles';
5
 import { BoxModel, ColorPalette } from '../../base/styles';
4
 
6
 
5
 export const PLACEHOLDER_TEXT_COLOR = 'rgba(255, 255, 255, 0.3)';
7
 export const PLACEHOLDER_TEXT_COLOR = 'rgba(255, 255, 255, 0.3)';
38
         flexDirection: 'row'
40
         flexDirection: 'row'
39
     },
41
     },
40
 
42
 
43
+    /**
44
+     * View that is rendered when there is no welcome page.
45
+     */
46
+    blankPageWrapper: {
47
+        ...StyleSheet.absoluteFillObject,
48
+        alignItems: 'center',
49
+        flex: 1,
50
+        flexDirection: 'column',
51
+        justifyContent: 'center'
52
+    },
53
+
41
     /**
54
     /**
42
      * Join button style.
55
      * Join button style.
43
      */
56
      */

Loading…
Cancelar
Guardar