@dynamic-labs/react-native-extension 4.11.1 → 4.12.0

package/index.cjs

@@ -6,15 +6,15 @@ var assertPackageVersion = require('@dynamic-labs/assert-package-version');
 var reactNative = require('react-native');
 var react = require('react');
 var reactNativeWebview = require('react-native-webview');
-var messageTransport = require('@dynamic-labs/message-transport');
 var logger$1 = require('@dynamic-labs/logger');
+var messageTransport = require('@dynamic-labs/message-transport');
 var jsxRuntime = require('react/jsx-runtime');
 var reactNativePasskeyStamper = require('@turnkey/react-native-passkey-stamper');
 var expoLinking = require('expo-linking');
 var expoWebBrowser = require('expo-web-browser');
 var expoSecureStore = require('expo-secure-store');
 
-var version = "4.11.1";
+var version = "4.12.0";
 
 function _extends() {
   return _extends = Object.assign ? Object.assign.bind() : function (n) {
@@ -136,6 +136,15 @@ const WebView = ({
     onMessageHandler
   } = useMessageTransportWebViewBridge(core, webViewRef);
   const containerStyles = [styles['container'], visible ? styles.show : styles.hide];
+  /**
+   * Block the message transport when the webview is unmounted
+   */
+  react.useEffect(() => () => {
+    logger.warn(unmountWebViewWarningMessage);
+    core.messageTransport.block();
+  },
+  // eslint-disable-next-line react-hooks/exhaustive-deps -- we only care about the unmount callback
+  []);
   return /*#__PURE__*/jsxRuntime.jsx(reactNativeWebview.WebView, {
     ref: webViewRef,
     source: {
@@ -146,6 +155,19 @@ const WebView = ({
     onMessage: onMessageHandler,
     hideKeyboardAccessoryView: true,
     webviewDebuggingEnabled: _webviewDebuggingEnabled,
+    onContentProcessDidTerminate: () => {
+      var _a;
+      /**
+       * iOS and Android both may trigger this event when the webview
+       * is removed due to memory pressure.
+       *
+       * When the webview is killed by the OS, the message transport must
+       * be blocked to prevent the "No handlers registered" error while
+       * the webview is reloading
+       */
+      core.messageTransport.block();
+      (_a = webViewRef.current) === null || _a === void 0 ? void 0 : _a.reload();
+    },
     onError: () => core.initialization.error = new Error('Could not load Dynamic WebView')
   }, 'webview');
 };
@@ -153,6 +175,15 @@ const createWebView = props => {
   const WebViewWrapper = () => /*#__PURE__*/jsxRuntime.jsx(WebView, _extends({}, props));
   return WebViewWrapper;
 };
+const unmountWebViewWarningMessage = `WebView unmounted.
+
+The Dynamic WebView may malfunction if it is unmounted.
+
+Render the WebView at the top level of your component tree to ensure it is not unmounted.
+
+For more information, please refer to the documentation:
+https://docs.dynamic.xyz/react-native/react-native-extension
+`;
 
 /******************************************************************************
 Copyright (c) Microsoft Corporation.

package/index.js

@@ -2,15 +2,15 @@ import { assertPackageVersion } from '@dynamic-labs/assert-package-version';
 import { StyleSheet, Platform } from 'react-native';
 import { useRef, useEffect, useCallback, useState } from 'react';
 import { WebView as WebView$1 } from 'react-native-webview';
-import { parseMessageTransportData, createRequestChannel } from '@dynamic-labs/message-transport';
 import { Logger } from '@dynamic-labs/logger';
+import { parseMessageTransportData, createRequestChannel } from '@dynamic-labs/message-transport';
 import { jsx } from 'react/jsx-runtime';
 import { createPasskey, PasskeyStamper } from '@turnkey/react-native-passkey-stamper';
 import { createURL, openURL } from 'expo-linking';
 import { openAuthSessionAsync } from 'expo-web-browser';
 import { getItemAsync, deleteItemAsync, setItemAsync } from 'expo-secure-store';
 
-var version = "4.11.1";
+var version = "4.12.0";
 
 function _extends() {
   return _extends = Object.assign ? Object.assign.bind() : function (n) {
@@ -132,6 +132,15 @@ const WebView = ({
     onMessageHandler
   } = useMessageTransportWebViewBridge(core, webViewRef);
   const containerStyles = [styles['container'], visible ? styles.show : styles.hide];
+  /**
+   * Block the message transport when the webview is unmounted
+   */
+  useEffect(() => () => {
+    logger.warn(unmountWebViewWarningMessage);
+    core.messageTransport.block();
+  },
+  // eslint-disable-next-line react-hooks/exhaustive-deps -- we only care about the unmount callback
+  []);
   return /*#__PURE__*/jsx(WebView$1, {
     ref: webViewRef,
     source: {
@@ -142,6 +151,19 @@ const WebView = ({
     onMessage: onMessageHandler,
     hideKeyboardAccessoryView: true,
     webviewDebuggingEnabled: _webviewDebuggingEnabled,
+    onContentProcessDidTerminate: () => {
+      var _a;
+      /**
+       * iOS and Android both may trigger this event when the webview
+       * is removed due to memory pressure.
+       *
+       * When the webview is killed by the OS, the message transport must
+       * be blocked to prevent the "No handlers registered" error while
+       * the webview is reloading
+       */
+      core.messageTransport.block();
+      (_a = webViewRef.current) === null || _a === void 0 ? void 0 : _a.reload();
+    },
     onError: () => core.initialization.error = new Error('Could not load Dynamic WebView')
   }, 'webview');
 };
@@ -149,6 +171,15 @@ const createWebView = props => {
   const WebViewWrapper = () => /*#__PURE__*/jsx(WebView, _extends({}, props));
   return WebViewWrapper;
 };
+const unmountWebViewWarningMessage = `WebView unmounted.
+
+The Dynamic WebView may malfunction if it is unmounted.
+
+Render the WebView at the top level of your component tree to ensure it is not unmounted.
+
+For more information, please refer to the documentation:
+https://docs.dynamic.xyz/react-native/react-native-extension
+`;
 
 /******************************************************************************
 Copyright (c) Microsoft Corporation.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dynamic-labs/react-native-extension",
-  "version": "4.11.1",
+  "version": "4.12.0",
   "main": "./index.cjs",
   "module": "./index.js",
   "types": "./src/index.d.ts",
@@ -15,10 +15,10 @@
   },
   "dependencies": {
     "@turnkey/react-native-passkey-stamper": "0.2.15",
-    "@dynamic-labs/assert-package-version": "4.11.1",
-    "@dynamic-labs/client": "4.11.1",
-    "@dynamic-labs/logger": "4.11.1",
-    "@dynamic-labs/message-transport": "4.11.1"
+    "@dynamic-labs/assert-package-version": "4.12.0",
+    "@dynamic-labs/client": "4.12.0",
+    "@dynamic-labs/logger": "4.12.0",
+    "@dynamic-labs/message-transport": "4.12.0"
   },
   "peerDependencies": {
     "react": "^18.2.0",