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

react/features/mobile/network-activity/actionTypes.js

@@ -1,37 +0,0 @@
-/**
- * The type of redux action to add a network request to the redux store/state.
- *
- * {
- *     type: _ADD_NETWORK_REQUEST,
- *     request: Object
- * }
- *
- * @protected
- */
-export const _ADD_NETWORK_REQUEST = '_ADD_NETWORK_REQUEST';
-
-/**
- * The type of redux action to remove all network requests from the redux
- * store/state.
- *
- * {
- *     type: _REMOVE_ALL_NETWORK_REQUESTS,
- * }
- *
- * @protected
- */
-export const _REMOVE_ALL_NETWORK_REQUESTS
-    = '_REMOVE_ALL_NETWORK_REQUESTS';
-
-/**
- * The type of redux action to remove a network request from the redux
- * store/state.
- *
- * {
- *     type: _REMOVE_NETWORK_REQUEST,
- *     request: Object
- * }
- *
- * @protected
- */
-export const _REMOVE_NETWORK_REQUEST = '_REMOVE_NETWORK_REQUEST';

react/features/mobile/network-activity/components/NetworkActivityIndicator.js

@@ -1,55 +0,0 @@
-// @flow
-
-import React, { Component } from 'react';
-
-import { LoadingIndicator } from '../../../base/react';
-import { connect } from '../../../base/redux';
-
-/**
- * The type of the React {@code Component} props of
- * {@link NetworkActivityIndicator}.
- */
-type Props = {
-
-    /**
-     * Indicates whether there is network activity i.e. ongoing network
-     * requests.
-     */
-    _networkActivity: boolean
-};
-
-/**
- * The React {@code Component} which renders a progress indicator when there
- * are ongoing network requests.
- */
-class NetworkActivityIndicator extends Component<Props> {
-    /**
-     * Implements React's {@link Component#render()}.
-     *
-     * @inheritdoc
-     * @returns {ReactElement}
-     */
-    render() {
-        return this.props._networkActivity ? <LoadingIndicator /> : null;
-    }
-}
-
-/**
- * Maps (parts of) the redux state to the React {@code Component} props of
- * {@code NetworkActivityIndicator}.
- *
- * @param {Object} state - The redux state.
- * @private
- * @returns {{
- *     _networkActivity: boolean
- * }}
- */
-function _mapStateToProps(state) {
-    const { requests } = state['features/network-activity'];
-
-    return {
-        _networkActivity: Boolean(requests && requests.size)
-    };
-}
-
-export default connect(_mapStateToProps)(NetworkActivityIndicator);

react/features/mobile/network-activity/components/index.js

@@ -1,3 +0,0 @@
-export {
-    default as NetworkActivityIndicator
-} from './NetworkActivityIndicator';

react/features/mobile/network-activity/index.js

@@ -1,4 +0,0 @@
-export * from './components';
-
-import './middleware';
-import './reducer';

react/features/mobile/network-activity/middleware.js

@@ -1,81 +0,0 @@
-/* @flow */
-
-import XHRInterceptor from 'react-native/Libraries/Network/XHRInterceptor';
-
-import { APP_WILL_MOUNT, APP_WILL_UNMOUNT } from '../../base/app';
-import { MiddlewareRegistry } from '../../base/redux';
-
-import {
-    _ADD_NETWORK_REQUEST,
-    _REMOVE_ALL_NETWORK_REQUESTS,
-    _REMOVE_NETWORK_REQUEST
-} from './actionTypes';
-
-/**
- * Middleware which captures app startup and conference actions in order to
- * clear the image cache.
- *
- * @returns {Function}
- */
-MiddlewareRegistry.register(store => next => action => {
-    const result = next(action);
-
-    switch (action.type) {
-    case APP_WILL_MOUNT:
-        _startNetInterception(store);
-        break;
-
-    case APP_WILL_UNMOUNT:
-        _stopNetInterception(store);
-        break;
-    }
-
-    return result;
-});
-
-/**
- * Starts intercepting network requests. Only XHR requests are supported at the
- * moment.
- *
- * Ongoing request information is kept in redux, and it's removed as soon as a
- * given request is complete.
- *
- * @param {Object} store - The redux store.
- * @private
- * @returns {void}
- */
-function _startNetInterception({ dispatch }) {
-    XHRInterceptor.setOpenCallback((method, url, xhr) => dispatch({
-        type: _ADD_NETWORK_REQUEST,
-        request: xhr,
-
-        // The following are not really necessary read anywhere at the time of
-        // this writing but are provided anyway if the reducer chooses to
-        // remember them:
-        method,
-        url
-    }));
-    XHRInterceptor.setResponseCallback((...args) => dispatch({
-        type: _REMOVE_NETWORK_REQUEST,
-
-        // XXX The XHR is the last argument of the responseCallback.
-        request: args[args.length - 1]
-    }));
-
-    XHRInterceptor.enableInterception();
-}
-
-/**
- * Stops intercepting network requests.
- *
- * @param {Object} store - The redux store.
- * @private
- * @returns {void}
- */
-function _stopNetInterception({ dispatch }) {
-    XHRInterceptor.disableInterception();
-
-    dispatch({
-        type: _REMOVE_ALL_NETWORK_REQUESTS
-    });
-}

react/features/mobile/network-activity/reducer.js

@@ -1,60 +0,0 @@
-// @flow
-
-import { ReducerRegistry, set } from '../../base/redux';
-
-import {
-    _ADD_NETWORK_REQUEST,
-    _REMOVE_ALL_NETWORK_REQUESTS,
-    _REMOVE_NETWORK_REQUEST
-} from './actionTypes';
-
-/**
- * The default/initial redux state of the feature network-activity.
- *
- * @type {{
- *     requests: Map
- * }}
- */
-const DEFAULT_STATE = {
-    /**
-     * The ongoing network requests i.e. the network request which have been
-     * added to the redux store/state and have not been removed.
-     *
-     * @type {Map}
-     */
-    requests: new Map()
-};
-
-ReducerRegistry.register(
-    'features/network-activity',
-    (state = DEFAULT_STATE, action) => {
-        switch (action.type) {
-        case _ADD_NETWORK_REQUEST: {
-            const {
-                type, // eslint-disable-line no-unused-vars
-
-                request: key,
-                ...value
-            } = action;
-            const requests = new Map(state.requests);
-
-            requests.set(key, value);
-
-            return set(state, 'requests', requests);
-        }
-
-        case _REMOVE_ALL_NETWORK_REQUESTS:
-            return set(state, 'requests', DEFAULT_STATE.requests);
-
-        case _REMOVE_NETWORK_REQUEST: {
-            const { request: key } = action;
-            const requests = new Map(state.requests);
-
-            requests.delete(key);
-
-            return set(state, 'requests', requests);
-        }
-        }
-
-        return state;
-    });

react/features/welcome/components/BlankPage.native.js

@@ -1,18 +1,27 @@
 // @flow
 
 import React, { Component } from 'react';
+import { View } from 'react-native';
 import type { Dispatch } from 'redux';
 
+import { ColorSchemeRegistry } from '../../base/color-scheme';
+import { LoadingIndicator } from '../../base/react';
 import { connect } from '../../base/redux';
+import { StyleType } from '../../base/styles';
 import { destroyLocalTracks } from '../../base/tracks';
-import { NetworkActivityIndicator } from '../../mobile/network-activity';
 
-import LocalVideoTrackUnderlay from './LocalVideoTrackUnderlay';
+import styles from './styles';
 
 /**
  * The type of React {@code Component} props of {@link BlankPage}.
  */
 type Props = {
+
+    /**
+     * The color schemed style of the component.
+     */
+    _styles: StyleType,
+
     dispatch: Dispatch<any>
 };
 
@@ -40,12 +49,32 @@ class BlankPage extends Component<Props> {
      * @returns {ReactElement}
      */
     render() {
+        const { _styles } = this.props;
+
         return (
-            <LocalVideoTrackUnderlay>
+            <View
-                <NetworkActivityIndicator />
+                style = { [
-            </LocalVideoTrackUnderlay>
+                    styles.blankPageWrapper,
+                    _styles.loadingOverlayWrapper
+                ] }>
+                <LoadingIndicator
+                    color = { _styles.indicatorColor }
+                    size = 'large' />
+            </View>
         );
     }
 }
 
-export default connect()(BlankPage);
+/**
+ * Maps part of the Redux state to the props of this component.
+ *
+ * @param {Object} state - The Redux state.
+ * @returns {Props}
+ */
+function _mapStateToProps(state) {
+    return {
+        _styles: ColorSchemeRegistry.get(state, 'LoadConfigOverlay')
+    };
+}
+
+export default connect(_mapStateToProps)(BlankPage);

react/features/welcome/components/styles.js

@@ -1,5 +1,7 @@
 // @flow
 
+import { StyleSheet } from 'react-native';
+
 import { BoxModel, ColorPalette } from '../../base/styles';
 
 export const PLACEHOLDER_TEXT_COLOR = 'rgba(255, 255, 255, 0.3)';
@@ -38,6 +40,17 @@ export default {
         flexDirection: 'row'
     },
 
+    /**
+     * View that is rendered when there is no welcome page.
+     */
+    blankPageWrapper: {
+        ...StyleSheet.absoluteFillObject,
+        alignItems: 'center',
+        flex: 1,
+        flexDirection: 'column',
+        justifyContent: 'center'
+    },
+
     /**
      * Join button style.
      */