import React, { useEffect, useState } from 'react';
import { Text, View } from 'react-native';
import { useStytch } from '@stytch/react-native';

export const CheckSensor = () => {
  const stytch = useStytch();
  const [sensorAvailable, setSensorAvailable] = useState(false);

  useEffect(() => {
    const checkSensor = async () => {
      if (stytch) {
        try {
          const available = await stytch.biometrics.getSensor({
            allowDeviceCredentials: true,
          });
          setSensorAvailable(available);
        } catch {
          setSensorAvailable(false);
        }
      }
    };

    checkSensor();
  }, [stytch]);

  return (
    <View>
      <Text>
        {sensorAvailable
          ? 'Biometric sensor is available'
          : 'Biometric sensor is not available'}
      </Text>
    </View>
  );
};