Duplicate App prompted on Android

[MockAirplane700]

Checklist

• The issue can be reproduced in the react-native-auth0 sample app (or N/A).
• I have looked into the Readme, Examples, and FAQ and have not found a suitable solution or answer.
• I have looked into the API documentation and have not found a suitable solution or answer.
• I have searched the issues and have not found a suitable solution or answer.
• I have searched the Auth0 Community forums and have not found a suitable solution or answer.
• I agree to the terms within the Auth0 Code of Conduct.

Description

When users on Android for an application built on expo React Native, attempt to login or logout, they are prompted the same application twice, being asked which one to open. Please see the attached screenshots.

I attempted multiple solutions I found in different issues already posted and closed but the most I was able to do was preven the dupplication bug from occuring in Development mode but in production the application would crash on being opened with an error message about malformed intents.

I have been able to determine that the origin most likley comes from duplicate intents created in the android/app/src/main/AndroidManifest.xml where we have one from expo deep linking and or expo router and another from react-native-auth0 package hence when the user logs in or logs out because they are two duplicate intents, the OS prompts the user to pick between the two.

Here are the duplicate intents I identified in the AndroidManifest.xml

<activity android:name=".MainActivity" android:configChanges="keyboard|keyboardHidden|orientation|screenSize|screenLayout|uiMode" android:launchMode="singleTask" android:windowSoftInputMode="adjustResize" android:theme="@style/Theme.App.SplashScreen" android:exported="true" android:screenOrientation="portrait">
      <intent-filter>
        <action android:name="android.intent.action.MAIN"/>
        <category android:name="android.intent.category.LAUNCHER"/>
      </intent-filter>
      <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="zurigardens"/>
        <data android:scheme="exp+zuri-gardens"/>
      </intent-filter>
      <intent-filter android:autoVerify="true" data-generated="true">
        <action android:name="android.intent.action.VIEW"/>
        <data android:scheme="blackvalleycomicsplatform" android:pathPrefix="/android/dev.siziba.black_valley_comics/callback"/>
        <category android:name="android.intent.category.DEFAULT"/>
        <category android:name="android.intent.category.BROWSABLE"/>
      </intent-filter>
</activity>

 <activity android:name="com.auth0.android.provider.RedirectActivity" tools:node="replace" android:exported="true">
      <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="blackvalleycomicsplatform" android:pathPrefix="/android/dev.siziba.black_valley_comics/callback" android:host="dev-vttkdxzvui4y8a11.us.auth0.com"/>
      </intent-filter>
</activity>

The behaviour was duplicated in a seperated project as well, please see the screenshot below

Here is the android block from the relevent app.json

"android": {
      "edgeToEdgeEnabled": true,
      "predictiveBackGestureEnabled": false,
      "versionCode": 1,
      "package": "package_name",
      "intentFilters": [
        {
          "action": "VIEW",
          "autoVerify": true,
          "category": [
            "DEFAULT",
            "BROWSABLE"
          ],
          "data": {
            "scheme": "Auth0 scheme",
            "pathPrefix": "/path/prefix"
          }
        }
      ]
    },

Reproduction

1. Create an expo app, can use npx create-expo-app@latest
2. Follow the steps provided on Auth0 guide for Expo React Native app Expo Auth0 guide
3. Add the react-native-auth0 plugin with the needed relevant values adding the domain and a custom scheme
4. To the android block in app.json add the intent filters with a scheme and path prefix
5. Run development build on android and attempt to login

Additional context

No response

react-native-auth0 version

5.2.1

React Native version

0.81.5

Expo version

54.0.29

Platform

Android

Platform version(s)

Gradle 8.14.3 , Android SDK API level 36

[subhankarmaiti]

Hi @MockAirplane700,

It looks like you might have two versions of the app installed on your device. This can happen if the package name’s letter casing was changed, resulting in the system treating them as separate apps. We recommend using a fully lowercase package name, as the callback URL is generated internally in lowercase.

To resolve this, please uninstall both apps from your device and then reinstall the app using the current (lowercase) package name.

[MockAirplane700]

@subhankarmaiti

There is only one version of the app installed.

The package name for the app is already in lower case, it looks something like "com.package.package_name".

We had to use a custom schema because the package name was written with underscores. The use of the custom schema seems to trigger the creation of dual intents in the application, as we end up with two intents that route to the same application triggering the duplicate application prompt.

It seems for some reason duplicate intents are created somewhere in the app such with one version of the app installed, the same still occurs, hence there is only one application.

[subhankarmaiti]

Hi @MockAirplane700
Instead of creating a new intent-filter, you can take advantage of customScheme by updating app.json.

"plugins": [
      [
        "react-native-auth0",
        {
          "domain": "AUTH0-DOMAIN",
          "customScheme": "YOUR_CUSTOM_SCHEME"
        }
      ],

If you do so, our sdk will take care of converting the intent filter to the format

<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_CUSTOM_SCHEME" android:pathPrefix="/android/YOUR_APPLICATION_ID/callback" android:host="AUTH0-DOMAIN"/>
</intent-filter>

so your redirect url would be ${YOUR_CUSTOM_SCHEME}://${AUTH0-DOMAIN}/android/${YOUR_APPLICATION_ID}/callback

and you have to pass the same during authorize and clearSession call.

[MockAirplane700]

@subhankarmaiti that is how i first implemented the custom scheme mentioned prior, I still have the same problem of a duplicate application, seemingly coming from a duplicate intent.

[subhankarmaiti]

@MockAirplane700, I’m unable to reproduce the issue using the steps above. Could you please try deleting the android folder and regenerating it using expo prebuild? Alternatively, if possible, sharing a sample app would help us reproduce the issue and assist with a fix.

[MockAirplane700]

@subhankarmaiti I did delete the android folder and running another prebuild, I also deleted the node_modules folder.

In the post I made another app to replicate the issue zuri_gardens, but I will lay out the steps here and attempt to attach relevant screenshots

Step 1 : Create an expo project using
npx create-expo-app@latest

Step 2 : With the following guide, install the react-native-auth0 package
Auth0 Expo Intergration Guide

Making sure you add the needed domain and client id to the environment file

Step 3 : Set up the react-native-auth0 Expo plugin as per Step 3 in the mentioned guide from step 2
Auth0 Expo Intergration Guide

In the config plugin we add our domain and custom scheme hence it looks like the following

[
        "react-native-auth0",
        {
          "domain": "dev-FakEidForExamPle.us.auth0.com",
          "customScheme": "preferedCustomSchemeName"
        }
]

Step 4 : We go to /app/_layout.tsx and we add the Auth0 Provider as shown in the guide mentioned before
Auth0 Expo Intergration Guide

hence our _layout.tsx looks like

import { DarkTheme, DefaultTheme, ThemeProvider } from '@react-navigation/native';
import { Stack } from 'expo-router';
import { StatusBar } from 'expo-status-bar';
import 'react-native-reanimated';
import { Auth0Provider } from "react-native-auth0";
import { useColorScheme } from '@/hooks/use-color-scheme';

const auth0Domain = process.env.EXPO_PUBLIC_AUTH0_DOMAIN;
const auth0ClientId = process.env.EXPO_PUBLIC_AUTH0_CLIENT_ID;


export const unstable_settings = {
  anchor: '(tabs)',
};

export default function RootLayout() {
  const colorScheme = useColorScheme();

  return (
    <Auth0Provider domain={auth0Domain as string} clientId={auth0ClientId as string}>
      <ThemeProvider value={colorScheme === 'dark' ? DarkTheme : DefaultTheme}>
      <Stack>
        <Stack.Screen name="(tabs)" options={{ headerShown: false }} />
        <Stack.Screen name="modal" options={{ presentation: 'modal', title: 'Modal' }} />
      </Stack>
      <StatusBar style="auto" />
    </ThemeProvider>
    </Auth0Provider>
  );
}

Step 5 : We now attempt to login in our app/(tabs)/index.tsx hence it ends up looking like the following

import { Image } from 'expo-image';
import { Platform, StyleSheet, View, Text, Button } from 'react-native';
import { useAuth0 } from 'react-native-auth0';

const auth0Domain = process.env.EXPO_PUBLIC_AUTH0_DOMAIN;

export default function HomeScreen() {
  const { authorize, clearSession, user, error, isLoading } = useAuth0();
  const onLogin = async () => {
    try {
      const loginUrl = "preferedCustomSchemeName://" + auth0Domain + "/android/com.package_name.myapp/callback";
      if (Platform.OS === "android") {
        await authorize({
          redirectUrl : loginUrl
        });
      } else {
        await authorize();
      }
    } catch (e) {
      console.log(e);
    }
  };

  const onLogout = async () => {
    try {
      if (Platform.OS === "android") {
        await clearSession({}, { customScheme: "preferedCustomSchemeName" });
      } else {
        await clearSession();
      }
    } catch (e) {
      console.log('Log out cancelled');
    }
  };

  if (isLoading) {
    return <View style={styles.container}><Text>Loading</Text></View>;
  }

  const loggedIn = user !== undefined && user !== null;
  console.log(user)
  return (
    <View style={styles.container}>
      {loggedIn && <Text>You are logged in as {user.name}</Text>}
      {!loggedIn && <Text>You are not logged in</Text>}
      {error && <Text>{error.message}</Text>}

      <Button
        onPress={loggedIn ? onLogout : onLogin}
        title={loggedIn ? 'Log Out' : 'Log In'}
      />
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#F5FCFF',
  }
});

Step 6 : With the added android block, our app.json looks like the following

{
  "expo": {
    "name": "my-app",
    "slug": "my-app",
    "version": "1.0.0",
    "orientation": "portrait",
    "icon": "./assets/images/icon.png",
    "scheme": "myapp",
    "userInterfaceStyle": "automatic",
    "newArchEnabled": true,
    "ios": {
      "supportsTablet": true
    },
   "android": {
      "adaptiveIcon": {
        "backgroundColor": "#E6F4FE",
        "foregroundImage": "./assets/images/android-icon-foreground.png",
        "backgroundImage": "./assets/images/android-icon-background.png",
        "monochromeImage": "./assets/images/android-icon-monochrome.png"
      },
      "edgeToEdgeEnabled": true,
      "predictiveBackGestureEnabled": false,
      "package": "com.package_name.myapp",
      "intentFilters": [
        {
          "action": "VIEW",
          "autoVerify": true,
          "category": [
            "DEFAULT",
            "BROWSABLE"
          ],
          "data": {
            "scheme": "preferedCustomSchemeName",
            "pathPrefix": "/android/com.package_name.myapp/callback"
          }
        }
      ]
    },
    "web": {
      "output": "static",
      "favicon": "./assets/images/favicon.png"
    },
    "plugins": [
      "expo-router",
      [
        "expo-splash-screen",
        {
          "image": "./assets/images/splash-icon.png",
          "imageWidth": 200,
          "resizeMode": "contain",
          "backgroundColor": "#ffffff",
          "dark": {
            "backgroundColor": "#000000"
          }
        }
      ],
      [
        "react-native-auth0",
        {
          "domain": "dev-FakEidForExamPle.us.auth0.com",
          "customScheme": "preferedCustomSchemeName"
        }
      ]
    ],
    "experiments": {
      "typedRoutes": true,
      "reactCompiler": true
    }
  }
}

The following is the package.json

{
  "name": "my-app",
  "main": "expo-router/entry",
  "version": "1.0.0",
  "scripts": {
    "start": "expo start",
    "reset-project": "node ./scripts/reset-project.js",
    "android": "expo run:android",
    "ios": "expo run:ios",
    "web": "expo start --web",
    "lint": "expo lint"
  },
  "dependencies": {
    "@expo/vector-icons": "^15.0.3",
    "@react-navigation/bottom-tabs": "^7.4.0",
    "@react-navigation/elements": "^2.6.3",
    "@react-navigation/native": "^7.1.8",
    "expo": "~54.0.31",
    "expo-constants": "~18.0.13",
    "expo-font": "~14.0.10",
    "expo-haptics": "~15.0.8",
    "expo-image": "~3.0.11",
    "expo-linking": "~8.0.11",
    "expo-router": "~6.0.21",
    "expo-splash-screen": "~31.0.13",
    "expo-status-bar": "~3.0.9",
    "expo-symbols": "~1.0.8",
    "expo-system-ui": "~6.0.9",
    "expo-web-browser": "~15.0.10",
    "react": "19.1.0",
    "react-dom": "19.1.0",
    "react-native": "0.81.5",
    "react-native-auth0": "^5.3.1",
    "react-native-gesture-handler": "~2.28.0",
    "react-native-reanimated": "~4.1.1",
    "react-native-safe-area-context": "~5.6.0",
    "react-native-screens": "~4.16.0",
    "react-native-web": "~0.21.0",
    "react-native-worklets": "0.5.1"
  },
  "devDependencies": {
    "@types/react": "~19.1.0",
    "eslint": "^9.25.0",
    "eslint-config-expo": "~10.0.0",
    "typescript": "~5.9.2"
  },
  "private": true
}

Step 7 : We run our prebuild
npx expo prebuild --platform android

Step 8 : We use the run command for android
npx expo run:android

The end result being the duplicate error i have pointed out before , below is a short clip of the error from the example myapp that I used to replicate the bug

screen-record-edit.mov

[subhankarmaiti]

Hi @MockAirplane700 ,

Apologies for the delayed response.

I can see that you are configuring the plugin correctly:

"plugins": [
     ...
      [
        "react-native-auth0",
        {
          "domain": "dev-FakEidForExamPle.us.auth0.com",
          "customScheme": "preferedCustomSchemeName"
        }
      ]
    ],

This configuration already takes care of creating the required intent filter for your app.

However, you are also manually adding an additional intent filter in your Android configuration:

"android": {
      ...
      "intentFilters": [
        {
          "action": "VIEW",
          "autoVerify": true,
          "category": [
            "DEFAULT",
            "BROWSABLE"
          ],
          "data": {
            "scheme": "preferedCustomSchemeName",
            "pathPrefix": "/android/com.package_name.myapp/callback"
          }
        }
      ]
    },

This results in duplicate intent filters being registered, which is why you are seeing the app selection prompt.

To resolve the issue, please remove the manually added intent filter. The plugin-generated configuration is sufficient, and removing the duplicate will prevent the app chooser prompt from appearing.

[subhankarmaiti]

Hi @MockAirplane700 closing this issue for now. Please let us know if you’re still facing any problems—we’d be happy to take another look and reopen it if needed.