Email Authentication

import React, { useState } from 'react';
import { View, TextInput, Button, StyleSheet, Alert } from 'react-native';
import { useOkto } from '@okto_web3/react-native-sdk'; 
 
export default function EmailAuthentication() {
  const oktoClient = useOkto(); 
 
  const [email, setEmail] = useState('');
  const [otp, setOtp] = useState('');
  const [token, setToken] = useState('');
 
  const handleSendOTP = async () => {
    try {
      const response = await oktoClient.sendOTP(email, 'email'); 
      console.log('OTP Sent:', response);
      setToken(response.token);
    } catch (error) {
      console.error('Send OTP Error:', error);
      Alert.alert('Error', 'Failed to send OTP.');
    }
  };
 
  const handleResendOTP = async () => {
    try {
      const response = await oktoClient.resendOTP(email, token, 'email'); 
      console.log('OTP Resent:', response);
      setToken(response.token);
    } catch (error) {
      console.error('Resend OTP Error:', error);
      Alert.alert('Error', 'Failed to resend OTP.');
    }
  };
 
  const handleVerifyOTP = async () => {
    try {
      const session = await oktoClient.loginUsingEmail(email, otp, token, (session: any) => { 
        console.log('Session Callback:', session); 
      }); 
      console.log('Login Successful:', session);
    } catch (error) {
      console.error('Verify OTP Error:', error);
      Alert.alert('Login Failed', 'OTP verification failed.');
    }
  };
 
  return (
    <View>
      <TextInput
        placeholder="Enter email"
        value={email}
        onChangeText={setEmail}
        keyboardType="email-address"
        autoCapitalize="none"
      />
      <TextInput
        placeholder="Enter OTP"
        value={otp}
        onChangeText={setOtp}
        keyboardType="numeric"
      />
 
      <View>
        <Button title="Send OTP" onPress={handleSendOTP} />
      </View>
      <View>
        <Button title="Resend OTP" onPress={handleResendOTP} />
      </View>
      <View>
        <Button title="Verify OTP" onPress={handleVerifyOTP} />
      </View>
    </View>
  );
}