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 7.2KB

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