Ionic React Android, unable to get access token after redirect

Question

I'm using @ to get access token from azure ad b2c but I'm facing issues in android. in android it's showing error that Unable to complete authorization as there is no interactive call in progress. This can be due to closing the app while the authorization was in process.

my code ...

import { Redirect, Route } from 'react-router-dom';
import { IonApp, IonButton, IonRouterOutlet, setupIonicReact } from '@ionic/react';
import { IonReactRouter } from '@ionic/react-router';
import Home from './pages/Home';
import {AuthenticatedTemplate, MsalProvider, UnauthenticatedTemplate } from '@azure/msal-react';
import {loginRequest, msalConfig } from "./msalConfig";
import { EventType, InteractionRequiredAuthError, PublicClientApplication} from '@azure/msal-browser';

/* Core CSS required for Ionic components to work properly */
import '@ionic/react/css/core.css';

/* Basic CSS for apps built with Ionic */
import '@ionic/react/css/normalize.css';
import '@ionic/react/css/structure.css';
import '@ionic/react/css/typography.css';

/* Optional CSS utils that can be commented out */
import '@ionic/react/css/padding.css';
import '@ionic/react/css/float-elements.css';
import '@ionic/react/css/text-alignment.css';
import '@ionic/react/css/text-transformation.css';
import '@ionic/react/css/flex-utils.css';
import '@ionic/react/css/display.css';

/* Theme variables */
import './theme/variables.css';
import ReactDOM from 'react-dom';
import React from 'react';


setupIonicReact();

const msalInstance = new PublicClientApplication(msalConfig);

const App: React.FC = () => {


async ()=>{
  await msalInstance.initialize();
  await msalInstance.handleRedirectPromise(); 
  
}

const handleLogin = async () => {
  await msalInstance.loginPopup(loginRequest);
}


  return(
    <MsalProvider instance={msalInstance}>
      <IonApp>

      <div>
        <IonButton onClick={() => handleLogin()}>
          Login
        </IonButton>
      </div>
      {/* <div>
    <AuthHandlerComponent />
    </div> */}
      <AuthenticatedTemplate>
        <h3>
          Successfully Logged In
        </h3>
      </AuthenticatedTemplate>
      <UnauthenticatedTemplate>
        <h3>
          Login Data not found
        </h3>
      </UnauthenticatedTemplate>
      </IonApp>
      </MsalProvider>
  )
}

export default App;

/**
 * Enter here the user flows and custom policies for your B2C application
 * To learn more about user flows, visit: https://docs.microsoft.com/en-us/azure/active-directory-b2c/user-flow-overview
 * To learn more about custom policies, visit: https://docs.microsoft.com/en-us/azure/active-directory-b2c/custom-policy-overview
 */
 export const b2cPolicies = {
    names: {
        signUpSignIn: "B2C_1_signup",
        editProfile: "B2C_1_signup"
    },
    authorities: {
        signUpSignIn: {
            authority: "https://rideorg.b2clogin.com/rideorg.onmicrosoft.com/B2C_1_signup"
        },
        editProfile: {
            authority: "https://rideorg.b2clogin.com/rideorg.onmicrosoft.com/B2C_1_signup"
        }
    }
}

// Config object to be passed to Msal on creation
 export const msalConfig = {
    auth: {
        clientId: "c1c594aa-cfb6-4a6d-ae3d-6930b0d9d3bf",
        authority: b2cPolicies.authorities.signUpSignIn.authority,
        redirectUri : "msalc1c594aa-cfb6-4a6d-ae3d-6930b0d9d3bf://auth",
        postLogoutRedirectUri: "/",
        //authorization_user_agent : "WEBVIEW"
    },
    cache: {
        cacheLocation: "localStorage"
    }
};

// Scopes you add here will be prompted for consent during login
export const loginRequest = {
    scopes: ["demo.read"]
};

no signin details got from popup

how to get the access token on to the android app after redirect?...any WORKING samples?...

IONIC REACT ANDROID