You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

App.native.js 8.1KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259
  1. // @flow
  2. import React from 'react';
  3. import { SafeAreaProvider } from 'react-native-safe-area-context';
  4. import SplashScreen from 'react-native-splash-screen';
  5. import { DialogContainer } from '../../base/dialog';
  6. import { updateFlags } from '../../base/flags/actions';
  7. import { CALL_INTEGRATION_ENABLED, SERVER_URL_CHANGE_ENABLED } from '../../base/flags/constants';
  8. import { getFeatureFlag } from '../../base/flags/functions';
  9. import { Platform } from '../../base/react';
  10. import { DimensionsDetector, clientResized, setSafeAreaInsets } from '../../base/responsive-ui';
  11. import { updateSettings } from '../../base/settings';
  12. import { _getRouteToRender } from '../getRouteToRender.native';
  13. import logger from '../logger';
  14. import { AbstractApp } from './AbstractApp';
  15. import type { Props as AbstractAppProps } from './AbstractApp';
  16. // Register middlewares and reducers.
  17. import '../middlewares';
  18. import '../reducers';
  19. declare var __DEV__;
  20. /**
  21. * The type of React {@code Component} props of {@link App}.
  22. */
  23. type Props = AbstractAppProps & {
  24. /**
  25. * An object of colors that override the default colors of the app/sdk.
  26. */
  27. colorScheme: ?Object,
  28. /**
  29. * Identifier for this app on the native side.
  30. */
  31. externalAPIScope: string,
  32. /**
  33. * An object with the feature flags.
  34. */
  35. flags: Object,
  36. /**
  37. * An object with user information (display name, email, avatar URL).
  38. */
  39. userInfo: ?Object
  40. };
  41. /**
  42. * Root app {@code Component} on mobile/React Native.
  43. *
  44. * @augments AbstractApp
  45. */
  46. export class App extends AbstractApp {
  47. /**
  48. * The deferred for the initialisation {{promise, resolve, reject}}.
  49. */
  50. _init: Object;
  51. /**
  52. * Initializes a new {@code App} instance.
  53. *
  54. * @param {Props} props - The read-only React {@code Component} props with
  55. * which the new instance is to be initialized.
  56. */
  57. constructor(props: Props) {
  58. super(props);
  59. // In the Release configuration, React Native will (intentionally) throw
  60. // an unhandled JavascriptException for an unhandled JavaScript error.
  61. // This will effectively kill the app. In accord with the Web, do not
  62. // kill the app.
  63. this._maybeDisableExceptionsManager();
  64. // Bind event handler so it is only bound once per instance.
  65. this._onDimensionsChanged = this._onDimensionsChanged.bind(this);
  66. this._onSafeAreaInsetsChanged = this._onSafeAreaInsetsChanged.bind(this);
  67. }
  68. /**
  69. * Initializes the color scheme.
  70. *
  71. * @inheritdoc
  72. *
  73. * @returns {void}
  74. */
  75. async componentDidMount() {
  76. await super.componentDidMount();
  77. SplashScreen.hide();
  78. }
  79. /**
  80. * Initializes feature flags and updates settings.
  81. *
  82. * @returns {void}
  83. */
  84. async _extraInit() {
  85. const { dispatch, getState } = this.state.store;
  86. const route = await _getRouteToRender();
  87. // We need the root navigator to be set early.
  88. await this._navigate(route);
  89. // We set these early enough so then we avoid any unnecessary re-renders.
  90. dispatch(updateFlags(this.props.flags));
  91. // Check if serverURL is configured externally and not allowed to change.
  92. const serverURLChangeEnabled = getFeatureFlag(getState(), SERVER_URL_CHANGE_ENABLED, true);
  93. if (!serverURLChangeEnabled) {
  94. // As serverURL is provided externally, so we push it to settings.
  95. if (typeof this.props.url !== 'undefined') {
  96. const { serverURL } = this.props.url;
  97. if (typeof serverURL !== 'undefined') {
  98. dispatch(updateSettings({ serverURL }));
  99. }
  100. }
  101. }
  102. dispatch(updateSettings(this.props.userInfo || {}));
  103. // Update settings with feature-flag.
  104. const callIntegrationEnabled = this.props.flags[CALL_INTEGRATION_ENABLED];
  105. if (typeof callIntegrationEnabled !== 'undefined') {
  106. dispatch(updateSettings({ disableCallIntegration: !callIntegrationEnabled }));
  107. }
  108. }
  109. /**
  110. * Overrides the parent method to inject {@link DimensionsDetector} as
  111. * the top most component.
  112. *
  113. * @override
  114. */
  115. _createMainElement(component, props) {
  116. return (
  117. <SafeAreaProvider>
  118. <DimensionsDetector
  119. onDimensionsChanged = { this._onDimensionsChanged }
  120. onSafeAreaInsetsChanged = { this._onSafeAreaInsetsChanged }>
  121. { super._createMainElement(component, props) }
  122. </DimensionsDetector>
  123. </SafeAreaProvider>
  124. );
  125. }
  126. /**
  127. * Attempts to disable the use of React Native
  128. * {@link ExceptionsManager#handleException} on platforms and in
  129. * configurations on/in which the use of the method in questions has been
  130. * determined to be undesirable. For example, React Native will
  131. * (intentionally) throw an unhandled {@code JavascriptException} for an
  132. * unhandled JavaScript error in the Release configuration. This will
  133. * effectively kill the app. In accord with the Web, do not kill the app.
  134. *
  135. * @private
  136. * @returns {void}
  137. */
  138. _maybeDisableExceptionsManager() {
  139. if (__DEV__) {
  140. // As mentioned above, only the Release configuration was observed
  141. // to suffer.
  142. return;
  143. }
  144. if (Platform.OS !== 'android') {
  145. // A solution based on RTCSetFatalHandler was implemented on iOS and
  146. // it is preferred because it is at a later step of the
  147. // error/exception handling and it is specific to fatal
  148. // errors/exceptions which were observed to kill the app. The
  149. // solution implemented below was tested on Android only so it is
  150. // considered safest to use it there only.
  151. return;
  152. }
  153. const oldHandler = global.ErrorUtils.getGlobalHandler();
  154. const newHandler = _handleException;
  155. if (!oldHandler || oldHandler !== newHandler) {
  156. newHandler.next = oldHandler;
  157. global.ErrorUtils.setGlobalHandler(newHandler);
  158. }
  159. }
  160. _onDimensionsChanged: (width: number, height: number) => void;
  161. /**
  162. * Updates the known available size for the app to occupy.
  163. *
  164. * @param {number} width - The component's current width.
  165. * @param {number} height - The component's current height.
  166. * @private
  167. * @returns {void}
  168. */
  169. _onDimensionsChanged(width: number, height: number) {
  170. const { dispatch } = this.state.store;
  171. dispatch(clientResized(width, height));
  172. }
  173. /**
  174. * Updates the safe are insets values.
  175. *
  176. * @param {Object} insets - The insets.
  177. * @param {number} insets.top - The top inset.
  178. * @param {number} insets.right - The right inset.
  179. * @param {number} insets.bottom - The bottom inset.
  180. * @param {number} insets.left - The left inset.
  181. * @private
  182. * @returns {void}
  183. */
  184. _onSafeAreaInsetsChanged(insets) {
  185. const { dispatch } = this.state.store;
  186. dispatch(setSafeAreaInsets(insets));
  187. }
  188. /**
  189. * Renders the platform specific dialog container.
  190. *
  191. * @returns {React$Element}
  192. */
  193. _renderDialogContainer() {
  194. return (
  195. <DialogContainer />
  196. );
  197. }
  198. }
  199. /**
  200. * Handles a (possibly unhandled) JavaScript error by preventing React Native
  201. * from converting a fatal error into an unhandled native exception which will
  202. * kill the app.
  203. *
  204. * @param {Error} error - The (possibly unhandled) JavaScript error to handle.
  205. * @param {boolean} fatal - If the specified error is fatal, {@code true};
  206. * otherwise, {@code false}.
  207. * @private
  208. * @returns {void}
  209. */
  210. function _handleException(error, fatal) {
  211. if (fatal) {
  212. // In the Release configuration, React Native will (intentionally) throw
  213. // an unhandled JavascriptException for an unhandled JavaScript error.
  214. // This will effectively kill the app. In accord with the Web, do not
  215. // kill the app.
  216. logger.error(error);
  217. } else {
  218. // Forward to the next globalHandler of ErrorUtils.
  219. const { next } = _handleException;
  220. typeof next === 'function' && next(error, fatal);
  221. }
  222. }