To be able to use some wallets in your application, they require a way to redirect back to your app via deep linkin. This short guide will give the practical steps to achieve it on both Android and iOS.

If you want to learn more about deep linking please check the official documentation for Android and iOS.

The short version is that you need to tell the Android OS that your application can manage certain urls. You define this URL in your AndroidManifest.xml and when another app (e.g. a wallet) asks the Android OS to open the url, the OS will check which apps can open it and send you the request.

Open your AndroidManifest.xml and add the following code inside your main <activity> block:

<activity
    android:name="com.example.android.GizmosActivity"
    <intent-filter>
        <action android:name="android.intent.action.VIEW" />
        <category android:name="android.intent.category.DEFAULT" />
        <category android:name="android.intent.category.BROWSABLE" />
        <data android:scheme="your.scheme" />
    </intent-filter>
</activity>

To understand how this works, please refer to the Android's developer official documentation.

Open your Info.plist file and add a new CFBundleURLTypes key:

<key>CFBundleURLTypes</key>
	<array>
		<dict>
			<key>CFBundleURLSchemes</key>
			<array>
				<string>your.scheme</string>
			</array>
		</dict>
	</array>

Next, open your AppDelegate.mm file and import the RCTLinkingManager header file and add the following method:

#import <React/RCTLinkingManager.h>

...

// Linking API
- (BOOL)application:(UIApplication *)application openURL:(NSURL *)url options:(NSDictionary<UIApplicationOpenURLOptionsKey,id> *)options {
  return [super application:application openURL:url options:options] || [RCTLinkingManager application:application openURL:url options:options];
}

To understand how this works, please refer to the iOS's developer official documentation.

Metro currently does not implement tree shaking, i.e. it does not attempt to remove unused code from the JS bundle. For instance, given this code snippet:

import { partition } from "lodash";

Metro will bundle all of lodash in your bundle even though you're only using a small part of it. For more details, see issues #227 and #632.

For this reason we recommend using a tool like metro-serializer-esbuild.

metro-serializer-esbuild is designed to be used at the React Native app level. It is a custom serializer for Metro, the React Native bundler, that leverages esbuild for faster JavaScript transformations.

• Integration with Build Process: The serializer integrates with your app's build process, which is managed at the app level, not the SDK level.

• App-Specific Configuration: Since it affects how your JavaScript code is transformed and bundled, it's more appropriate to configure this as part of your specific app's build setup, where you have control over the bundler's behavior.

• SDK Independence: SDKs (Software Development Kits) are generally designed to be independent of specific build tools or serializers. They provide functionality to apps but don't dictate how the app should be built or bundled.

• Flexibility for App Developers: Using it at the app level allows individual app developers to decide whether they want to use metro-serializer-esbuild based on their specific needs and setup.

In summary, you should use metro-serializer-esbuild at the React Native app level for better integration with the build process and to keep the SDK independent of specific build tools.