react-native-msal bypass app continue screen during login

Question

utilizing the library react-native-msal, I'm attempting to login the user without having to ask them to continue. This has been setup to bypass this screen on azure, and seems to be an issue with the client ui code. Anyone know if there is a boolean flag inside the config I can use to bypass this screen?

import React, { useState } from 'react';
import { Platform, Pressable, Text, View } from 'react-native';
import PublicClientApplication from 'react-native-msal';
import type { MSALConfiguration, MSALInteractiveParams } from 'react-native-msal';

const config: MSALConfiguration = {
  auth: {
    redirectUri: Platform.select({
      android: '{authLink}', // ex: "msauth://com.package/Xo8WBi6jzSxKDVR4drqm84yr9iU%3D"
      ios: 'msauth.[BUNDLE_ID]://auth', // ToDo: setup bundle id -> https://github.com/stashenergy/react-native-msal/blob/master/docs/ios_setup.md
      default: undefined
    }),
    clientId: '{clientId}',
    authority: 'https://login.microsoftonline.com/{tenantId}/v2.0'
  }
};
const scopes = ['{scope}'];
const pca = new PublicClientApplication(config);

export default function Guest(): JSX.Element {
  const [isLoggingIn, setIsLoggingIn] = useState(false);

  const handleLogin = async () => {
    try {
      setIsLoggingIn(true);
      const response = await pca.init();
      console.log('response:', response);

      // Acquiring a token for the first time, you must call pca.acquireToken
      const acquireTokenParams: MSALInteractiveParams = { scopes };
      console.log('acquireTokenParams:', acquireTokenParams);
      const acquireTokenResult: any | undefined = await pca.acquireToken(acquireTokenParams);
      if (!acquireTokenResult) throw new Error('Login Failed');
      console.log('acquireTokenResult:', acquireTokenResult);
    } catch (error: any) {
      console.log('error:', error);
    } finally {
      setIsLoggingIn(false);
    }
  };

  return (
    <View>
      <Text>Guest Screen</Text>
      <Pressable onPress={handleLogin}>
        <Text>Login</Text>
      </Pressable>
      {isLoggingIn && <Text>Logging In...</Text>}
    </View>
  );
}

Answer 1

I have tried the below code and worked for me, I Set the prompt parameter to InteractionType.Silent this will bypass the "App Continue" screen. It will tell the library to automatically continue to the next screen of the app without displaying the "App Continue" screen.

This is because the InteractionType.Silent prompt will attempt to acquire a token without displaying any user interface. This means that the user will not be asked to continue after logging in, and they will be automatically taken to the next screen of the app.

This will also allow the application to attempt a silent login, and if a session already exists, it won't prompt the user for interaction.

    const  handleLogin  =  async () => {
    try {
    const  loginRequest  = {
    scopes: ["openid", "profile", "user.read"],
    prompt:  InteractionType.Silent,
    };
    
    const  loginResponse  =  await  publicClientApplication.acquireTokenPopup(loginRequest);
    console.log("Access token:", loginResponse.accessToken);
   
    // Authentication is successful, update the state
    setIsAuthenticated(true);
    } catch (error) {
    console.error("Authentication error:", error);
    }
    };

Result