React Native's Touch ID functionality is not functioning as expected on an actual device

Having trouble enabling Biometric authentication in my project using react-native-touch-id on a real device. I've added the key and description in info.plist and followed all the steps mentioned in the official docs of the library. If anyone is familiar with this, your help would be greatly appreciated.

import React, {useEffect, useState} from 'react';
import {BackHandler, StatusBar, StyleSheet} from 'react-native';
import {SafeAreaView} from 'react-native-safe-area-context';
import TouchID from 'react-native-touch-id';
import {Provider} from 'react-redux';P
import RouteHome from './src/navigation';
import store from './src/redux/store';

export default function App() {
  const [isAuth, setIsAuth] = useState(false);

  const optionalConfigObject = {
    title: 'Authentication Required', 
    imageColor: '#e00606', 
    imageErrorColor: '#ff0000', 
    sensorDescription: 'Touch sensor', 
    sensorErrorDescription: 'Failed', 
    cancelText: 'Cancel', 
    fallbackLabel: 'Show Passcode', 
    unifiedErrors: false, 
    passcodeFallback: false,
  };

  useEffect(() => {
    handleBiometric();
  });
  const handleBiometric = () => {
    TouchID.isSupported(optionalConfigObject).then(biometryType => {
      if (biometryType === 'FaceID') {
        console.log('FaceID is supported.');
      } else {
        if(isAuth) {
          return null;
        }
        TouchID.authenticate('', optionalConfigObject).then((success) => {
          setIsAuth(success)
        }).catch((err) => {
          BackHandler.exitApp();
        })
      }
    });
  };
  return (
    <Provider store={store}>
      <SafeAreaView>
        <StatusBar barStyle="light-content" />
        <RouteHome />
      </SafeAreaView>
    </Provider>
  );
}

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

What is the best way to display a multi-state component that includes an API fetch?

Currently, my tech stack includes React and Node.js. Within my project, I have a component named ItemList. This particular component fetches data from an API in the componentDidMount() method to facilitate rendering a "loading state." My objective is to ...

Placement of image links

Wondering if there's a way to accomplish this. Can a hyperlink be placed on specific coordinates within an image? Example: _____________________________________ | | | xxx | | xxx ...

Tips for Incorporating xmlhttp.responseText in If Statements

This is the code snippet from my save_custLog_data.php file: <?php $a = $_GET['custEmail']; $b = $_GET['pswrd']; $file = '/home/students/accounts/s2090031/hit3324/www/data/customer.xml'; if(file_exists($fi ...

JavaScript fails to accurately arrange list items

Within my array of objects, I have a list of items that need to be sorted by the fieldName. While the sorting generally works fine, there are certain items where the sorting seems off and does not function properly. Here is the code snippet responsible fo ...

Navigating through a dropdown menu using Selenium in Javascript for Excel VBA - Tips and tricks

I need to access a web page using Excel VBA that is only compatible with Chrome or Firefox, not Internet Explorer. I have successfully accessed the website using Selenium, but I am having trouble navigating through the drop-down menu to reach the section w ...

Enhanced page flow with CSS and jQuery

I'm looking to improve the overall layout of my webpage, but I can't seem to pinpoint exactly what it is that I need! Imagine you have the following HTML structure: <section> <article> <h1>Article Header</h1> & ...

Angular Custom Chain Filtering: A Unique Approach

Hey everyone! I've encountered an issue: I am struggling to write a filter in Angular that is used in a filter chain. My knowledge of Angular is limited, so I'm hoping that the problem lies in a small mistake in my code. Here is a snippet from ...

ASP.NET Core - Populating views with data gradually

I'm currently working on a .Net Core application and I have reached a point in my code where I need to dynamically add data based on user interactions. Initially, I have a table displaying elements, and when a user clicks on any element, I need to ret ...

Utilizing Ionic to import and parse an Excel file for data processing

I need assistance in uploading an Excel file and reading it using Ionic-Angular. I tried the following code, but it only seems to work for browsers and not for the Ionic app on Android. Can someone please help me with this issue? I am trying to read the E ...

Creating an array of custom objects in Typescript involves declaring a class that represents the custom

module NamespaceX{ interface Serializable<T> { deserialize(input: Object): T; } export class CustomClass implements Serializable<CustomClass>{ private property1: number; private property2:string; con ...

Extracting the call from REST API in JSON format

Working with a third-party database using a REST API, I encountered an error response (as expected). Here is the code snippet: transaction.commit(function(err) { if (err){ var par = JSON.parse(err); \\ leading to error: SyntaxError: Unexpecte ...

Modify the line numbers in Notepad++ to exclude PHP code when counting

Is it possible to skip over code blocks in order for line numbers to adjust and exclude that specific section? For example, if I have a php code block from lines 1-88, I would like those lines to be ignored when counting lines in Notepad++. This way, line ...

Is it possible to specify the database connection to use in npm by setting an environment variable?

I have established a database connection in a JavaScript file. const dbCredentials = { user: 'something', host: 'localhost', database: 'something', password: 'something', port: 1111, }; export default d ...

The javascript file is unable to detect the presence of the other file

I am facing an issue with two JavaScript files I have. The first one contains Vue code, while the other one includes a data array where I created the 'Feed' array. However, when trying to output a simple string from that array, the console throws ...

Avoiding empty spaces within a JavaScript array

I'm currently using a loop array function to automatically populate values, but I've encountered an issue where the array assigns an "undefined" label to blank values. Is there a way to modify this function to skip over any empty cells in my file ...

Spacing between letters on a canvas element

This question is straightforward - I am struggling to find a way to adjust the letter spacing when drawing text on a canvas element. I want to achieve a similar effect as the CSS letter-spacing attribute, by increasing the space between each letter in the ...

The behavior of AJAX Search varies between the development and production environments

I recently integrated an instant search feature into my application. During testing on the local server, the functionality met my expectations: It filters the list as I type It is not case-sensitive It allows for resetting the search if I delete the inp ...

How to conceal the bottom bar in JQuery Colorbox iframe

I have implemented colorbox to showcase an Iframe of the registration page on my website. Here is how it looks... https://i.sstatic.net/z1RGK.png Upon closer inspection, I noticed a white bar at the bottom of the Iframe where the close 'X' butt ...

Troubleshooting Node.js project breakpoints not functioning in WebStorm

I've been attempting to set up debugging breakpoints in a React Native front end application within a Node project. Currently, I am utilizing WebStorm v2020.3 and Node v15.14.0 The settings for the Node.js run configuration of the project can be fou ...

"Encountered a reference error in Node.js Express due to an undefined

const _expressPackage = require("express"); const _bodyParserPackage = require("body-parser"); const _sqlPackage = require("mssql"); //Initializing the app with the express web framework ...