Email Authentication

import { useState } from 'react';
import { useOkto } from '@okto_web3/react-sdk';
 
function EmailAuthentication() {
    const oktoClient = useOkto(); 
 
    const [email, setEmail] = useState('');
    const [otp, setOtp] = useState('');
    const [token, setToken] = useState('');
 
    async function handleSendOTP() {
        try {
            const response = await oktoClient.sendOTP(email, "email"); 
            console.log('OTP Sent:', response);
            setToken(response.token);
        } catch (error) {
            console.error('Error sending OTP:', error);
        }
    }
 
    async function handleResendOTP() {
        try {
            const response = await oktoClient.resendOTP(email, token, "email"); 
            console.log('OTP Resent:', response);
            setToken(response.token);
        } catch (error) {
            console.error('Error resending OTP:', error);
        }
    }
 
    async function handleVerifyOTP() {
        try {
            const session = await oktoClient.loginUsingEmail(email, otp, token, (session: any) => { 
                localStorage.setItem("okto_session", JSON.stringify(session)); 
            }); 
            console.log('Login Successful:', session);
        } catch (error) {
            console.error('Error verifying OTP:', error);
        }
    }
 
    return (
        <div>
            <input type="email" placeholder="Enter email" value={email} onChange={(e) => setEmail(e.target.value)} />
            <input type="text" placeholder="Enter OTP" value={otp} onChange={(e) => setOtp(e.target.value)} />
 
            <button onClick={handleSendOTP}>Send OTP</button>
            <button onClick={handleResendOTP}>Resend OTP</button>
            <button onClick={handleVerifyOTP}>Verify OTP</button>
        </div>
    );
}