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

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