Skip to content

docs(react-native): update deep link setup instructions #668

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
alex72508 merged 6 commits into from
Mar 13, 2026
Merged

docs(react-native): update deep link setup instructions #668

Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
3470996
docs(react-native): update deep link setup for iOS (Objective-C)
victoreronmosele Feb 22, 2026
5f1821c
docs(react-native): update deep link setup for iOS (Swift)
victoreronmosele Feb 22, 2026
5643ca8
docs(react-native) update deep linking iOS set-up instructions
victoreronmosele Feb 22, 2026
acd69a2
docs(react-native) update deep linking iOS set-up instructions for pr…
victoreronmosele Mar 8, 2026
6453371
docs(react-native) update instructions to move RCTLinkingManager to A…
victoreronmosele Mar 8, 2026
062b239
docs(react-native) add note clarifying that manual linking is not req…
victoreronmosele Mar 8, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
302 changes: 162 additions & 140 deletions src/content/docs/developer-tools/sdks/native/react-native-sdk.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -90,93 +90,21 @@ Fundamentally, both SDK versions have equivalent functionality, so there should

<PackageManagers pkg="@kinde-oss/react-native-sdk-0-7x" />

### **Android**

The SDK requires the `react-native-keychain` and `react-native-inappbrowser-reborn` packages. Sometimes, they may not be automatically linked correctly, resulting in errors when running your app, such as `"Cannot read properties of undefined (reading 'isAvailable')"`. In such cases, you will need to manually link them:

1. Edit `android/settings.gradle`
### **Required dependencies**

```java
include ':react-native-keychain'
project(':react-native-keychain').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-keychain/android')

include ':react-native-inappbrowser-reborn'
project(':react-native-inappbrowser-reborn').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-inappbrowser-reborn/android')
```
The SDK requires the `react-native-app-auth`, `react-native-keychain` and `react-native-get-random-values` packages to be installed.

Comment thread
dtoxvanilla1991 marked this conversation as resolved.
2. Edit `android/app/build.gradle`
<PackageManagers pkg="react-native-app-auth react-native-keychain react-native-get-random-values" />

```java
apply plugin: 'com.android.application'

android {
...
}

dependencies {
...
<Aside type="info" title="Note on linking">

implementation project(':react-native-keychain')
implementation project(':react-native-inappbrowser-reborn')
Because the Kinde SDK requires React Native 0.60 or higher, native dependencies are automatically linked. You do not need to run `react-native link` or manually add libraries to your Xcode workspace or Android build files.

...
}
```

3. Edit `MainApplication.java`

```java
import com.oblador.keychain.KeychainPackage;
import com.proyecto26.inappbrowser.RNInAppBrowserPackage;
...

public class MainApplication extends Application implements ReactApplication {
private final ReactNativeHost mReactNativeHost =
new ReactNativeHost(this) {
...
@Override
protected List<ReactPackage> getPackages() {
...
List<ReactPackage> packages = new PackageList(this).getPackages();
packages.add(new KeychainPackage());
packages.add(new RNInAppBrowserPackage());
...
return packages;
}
...
};

...
}
```

In React Native version 0.73 or above, the `MainApplication.java` file has been replaced with `MainApplication.kt`

```kotlin
import com.oblador.keychain.KeychainPackage;
import com.proyecto26.inappbrowser.RNInAppBrowserPackage;
...

class MainApplication : Application(), ReactApplication {
override val reactNativeHost: ReactNativeHost =
object : DefaultReactNativeHost(this) {
override fun getPackages(): List<ReactPackage> =
PackageList(this).packages.apply {
// Packages that cannot be autolinked yet can be added manually here, for example:
// add(MyReactNativePackage())
add(KeychainPackage());
add(RNInAppBrowserPackage());
}

...
}

...
}
```
</Aside>

### **iOS**

#### Update iOS native dependencies
To update iOS native dependencies, you can use **CocoaPods**. We recommend installing **CocoaPods** using [Homebrew](https://brew.sh/).

```shell
Expand All @@ -185,23 +113,6 @@ brew install cocoapods
cd ios && pod install
```

The SDK requires the `react-native-keychain` and `react-native-inappbrowser-reborn` packages. Sometimes, they may not be automatically linked correctly, resulting in errors when running your app, such as `"Cannot read properties of undefined (reading 'isAvailable')"`. In such cases, you will need to manually link them:

1. **Option: With CocoaPods (Highly recommended)**

Please add the following lines to your **Podfile**, and then run `pod update`:

```swift
pod 'RNKeychain', :path => '../node_modules/react-native-keychain'
pod 'RNInAppBrowser', :path => '../node_modules/react-native-inappbrowser-reborn'
```

2. **Option: Manually link the packages with Xcode**
- Go to the **Build Phases** tab and choose **Link Binary With Libraries.**
- Select **+**
- Add **Other** > **Add Files** > **node_modules/react-native-keychain/RNKeychain.xcodeproj** (similar with **RNInAppBrowser**)
- Add **libRNKeychain.a** (similar with **RNInAppBrowser**)
- Clean and rebuild.

If you encounter any errors during the SDK installation process, you can refer to the General Tips section at the end of this topic.

Expand Down Expand Up @@ -249,7 +160,7 @@ KINDE_POST_LOGOUT_REDIRECT_URL=myapp://myhost.kinde.com/kinde_callback
KINDE_CLIENT_ID=myclient@live
```

## Configuration deep link
## Configure deep linking

### **Android**

Expand All @@ -266,51 +177,162 @@ Open `AndroidManifest.xml` and update your scheme by adding a new block in activ

### **iOS**

You need to link `RCTLinking` to your project using the steps below.

1. If you also want to listen to incoming app links during your app's execution, add the following lines to your `AppDelegate.m`.

```swift
// iOS 9.x or newer
#import <React/RCTLinkingManager.h>
- (BOOL)application:(UIApplication *)application
openURL:(NSURL *)url
options:(NSDictionary<UIApplicationOpenURLOptionsKey,id> *)options
{
return [RCTLinkingManager application:application openURL:url options:options];
}
```

2. If you're targeting iOS 8.x or older, use the following code instead.

```swift
// iOS 8.x or older
#import <React/RCTLinkingManager.h>
- (BOOL)application:(UIApplication *)application openURL:(NSURL *)url
sourceApplication:(NSString *)sourceApplication annotation:(id)annotation
{
return [RCTLinkingManager application:application openURL:url
sourceApplication:sourceApplication annotation:annotation];
}
```
Follow the instructions for the language your `AppDelegate` is written in.
Comment thread
dtoxvanilla1991 marked this conversation as resolved.


<Tabs>
<TabItem label="Swift">

1. Create a new file, `AppDelegate+RNAppAuth.h`, in the **same folder as your `AppDelegate.swift`** and add the following code:

```objc title="AppDelegate+RNAppAuth.h"
#import "RNAppAuthAuthorizationFlowManager.h"
```

2. Configure the `Objective-C Bridging Header`.

How you do this depends on whether your project already has an `Objective-C Bridging Header` set.

Check your Xcode `Build Settings` for `Objective-C Bridging Header` to see if a path is already set.

<details>
<summary>Open for steps</summary>

- Open the project in Xcode.
- Select the project in the navigator, then the app target.
- Open the `Build Settings` tab.
- Search for `Bridging Header`.
- Check the value next to the setting name.
- If it is empty, you do not have an existing header.
- If there is a file path, you already have one configured.
</details>

<Tabs>
<TabItem label="No existing header">
Set `Objective-C Bridging Header` to the path of the newly created file: `$(SRCROOT)/$(TARGET_NAME)/AppDelegate+RNAppAuth.h`.
</TabItem>
<TabItem label="Has existing header">
Open the `Objective-C Bridging Header` file your project is already using (e.g., `YourApp-Bridging-Header.h`) and add the following import statement to it:

```diff lang="objc" title="YourApp-Bridging-Header.h"
+ #import "AppDelegate+RNAppAuth.h"
```
</TabItem>
</Tabs>
<br />

3. Update `AppDelegate.swift` file with the following code:



```diff lang="swift" title="AppDelegate.swift"
@main
- class AppDelegate: UIResponder, UIApplicationDelegate {
+ class AppDelegate: UIResponder, UIApplicationDelegate, RNAppAuthAuthorizationFlowManager {
+
+ public weak var authorizationFlowManagerDelegate: RNAppAuthAuthorizationFlowManagerDelegate?
```

**Custom scheme support:**

```diff lang="swift" title="AppDelegate.swift"
+ func application(
+ _ app: UIApplication,
+ open url: URL,
+ options: [UIApplication.OpenURLOptionsKey: Any] = [:]
+ ) -> Bool {
+ if let authorizationFlowManagerDelegate = self.authorizationFlowManagerDelegate {
+ if authorizationFlowManagerDelegate.resumeExternalUserAgentFlow(with: url) {
+ return true
+ }
+ }
+ return RCTLinkingManager.application(app, open: url, options: options)
+ }
```

**Universal link support:**

```diff lang="swift" title="AppDelegate.swift"
+ func application(
+ _ application: UIApplication,
+ continue userActivity: NSUserActivity,
+ restorationHandler: @escaping ([UIUserActivityRestoring]?) -> Void
+ ) -> Bool {
+ if userActivity.activityType == NSUserActivityTypeBrowsingWeb,
+ let url = userActivity.webpageURL,
+ let delegate = authorizationFlowManagerDelegate,
+ delegate.resumeExternalUserAgentFlow(with: url)
+ {
+ return true
+ }
+ return RCTLinkingManager.application(
+ application,
+ continue: userActivity,
+ restorationHandler: restorationHandler
+ )
+ }
```
Comment thread
coderabbitai[bot] marked this conversation as resolved.

</TabItem>

<TabItem label="Objective-C">
1. Update your ``AppDelegate.h`` file to include the following:

```diff lang="objc" title="AppDelegate.h"
+ #import "RNAppAuthAuthorizationFlowManager.h"
Comment thread
dtoxvanilla1991 marked this conversation as resolved.

- @interface AppDelegate : RCTAppDelegate
+ @interface AppDelegate : RCTAppDelegate <RNAppAuthAuthorizationFlowManager>
+
+ @property(nonatomic, weak) id<RNAppAuthAuthorizationFlowManagerDelegate> authorizationFlowManagerDelegate;
```

2. Update your ``AppDelegate.m`` (or ``AppDelegate.mm``) file to include the following:

**Add the Linking Manager import to the top of the file:**

```diff lang="objc" title="AppDelegate.m"
+ #import <React/RCTLinkingManager.h>
```

**Custom scheme support:**

```diff lang="objc" title="AppDelegate.m"
+ - (BOOL) application: (UIApplication *)application
+ openURL: (NSURL *)url
+ options: (NSDictionary<UIApplicationOpenURLOptionsKey, id> *) options
+ {
+ if ([self.authorizationFlowManagerDelegate resumeExternalUserAgentFlowWithURL:url]) {
+ return YES;
+ }
+ return [RCTLinkingManager application:application openURL:url options:options];
+ }
```

**Universal link support:**

```diff lang="objc" title="AppDelegate.m"
+ - (BOOL) application: (UIApplication *) application
+ continueUserActivity: (nonnull NSUserActivity *)userActivity
+ restorationHandler: (nonnull void (^)(NSArray<id<UIUserActivityRestoring>> * _Nullable))restorationHandler
+ {
+ if ([userActivity.activityType isEqualToString:NSUserActivityTypeBrowsingWeb]) {
+ if (self.authorizationFlowManagerDelegate) {
+ BOOL resumableAuth = [self.authorizationFlowManagerDelegate resumeExternalUserAgentFlowWithURL:userActivity.webpageURL];
+ if (resumableAuth) {
+ return YES;
+ }
+ }
+ }
+ return [RCTLinkingManager application:application continueUserActivity:userActivity restorationHandler:restorationHandler];
+ }
```


</TabItem>
</Tabs>

3. Make sure you have a configuration URL scheme in `Info.plist`, so the app can be opened by deep link.

```swift
<key>CFBundleURLTypes</key>
<array>
<dict>
<key>CFBundleTypeRole</key>
<string>Editor</string>
<key>CFBundleURLName</key>
<string>myapp</string> // you can change it
<key>CFBundleURLSchemes</key>
<array>
<string>myapp</string> // you can change it
</array>
</dict>
</arra
```

## Integrate with your app

Expand Down