Auth.js (1446B)
1 import { useState } from 'react' 2 import { supabase } from './supabaseClient' 3 4 function Auth() { 5 const [loading, setLoading] = useState(false) 6 const [email, setEmail] = useState('') 7 8 const handleLogin = async (e) => { 9 e.preventDefault() 10 11 try { 12 setLoading(true) 13 const { error } = await supabase.auth.signInWithOtp({ 14 email: email, 15 options: { 16 shouldCreateUser: false, 17 // emailRedirectTo: 'http://127.0.0.1:3000' 18 }}) 19 if (error) throw error 20 alert('Check your email for the login link!') 21 } catch (error) { 22 alert(error.error_description || error.message) 23 } finally { 24 setLoading(false) 25 } 26 } 27 28 return ( 29 <div className="Auth"> 30 <div> 31 <h1>Login</h1> 32 <p>Sign in via magic link with your email below</p> 33 {loading ? ( 34 'Sending magic link...' 35 ) : ( 36 <form onSubmit={handleLogin}> 37 <label htmlFor="email">Email</label> 38 <input 39 id="email" 40 type="email" 41 placeholder="Your email" 42 value={email} 43 onChange={(e) => setEmail(e.target.value)} 44 /> 45 <button> 46 Send magic link 47 </button> 48 </form> 49 )} 50 <h1>Registration</h1> 51 <p>No account yet? Contact event administrator to sign up.</p> 52 </div> 53 </div> 54 ) 55 } 56 57 export default Auth;