Auth UI localization
How do I access the localization.variable value?
function Login(){
const navigate = useNavigate();
const [email, setEmail] = useState("");
const [password, setPassword] = useState("");
const handleUserInput = (event) => {
// Capture user input changes
if (event.target.name === 'email') {
setEmail(event.target.value);
} else if (event.target.name === 'password') {
setPassword(event.target.value);
}
};
const handleSignIn = async () => {
try {
const { user, error } = await supabases.auth.signIn({
email,
password,
});
if (error) {
console.error('Login error:', error.message);
console.log(error);
navigate("/");
} else {
console.log('User logged in:', user);
console.log("Successfully IN");
navigate("/success");
}
} catch (error) {
console.error('Login error:', error.message);
}
};
return (
<div className="App">
<header className="App-header">
<Auth
supabaseClient={supabases}
appearance={{ theme : ThemeSupa }}
theme="dark"
providers={["google"]}
localization={{
variables: {
sign_in: {
email_input_placeholder: 'Your email address',
password_input_placeholder: 'Your strong password',
},
},
}}
/>
</header>
</div>
);
In my above code I am trying to access the email and password, so to perform check from existing user from my database in supabase.
But my question is how do I access them, as they are already defined in <Auth /> ?
function Login(){
const navigate = useNavigate();
const [email, setEmail] = useState("");
const [password, setPassword] = useState("");
const handleUserInput = (event) => {
// Capture user input changes
if (event.target.name === 'email') {
setEmail(event.target.value);
} else if (event.target.name === 'password') {
setPassword(event.target.value);
}
};
const handleSignIn = async () => {
try {
const { user, error } = await supabases.auth.signIn({
email,
password,
});
if (error) {
console.error('Login error:', error.message);
console.log(error);
navigate("/");
} else {
console.log('User logged in:', user);
console.log("Successfully IN");
navigate("/success");
}
} catch (error) {
console.error('Login error:', error.message);
}
};
return (
<div className="App">
<header className="App-header">
<Auth
supabaseClient={supabases}
appearance={{ theme : ThemeSupa }}
theme="dark"
providers={["google"]}
localization={{
variables: {
sign_in: {
email_input_placeholder: 'Your email address',
password_input_placeholder: 'Your strong password',
},
},
}}
/>
</header>
</div>
);
In my above code I am trying to access the email and password, so to perform check from existing user from my database in supabase.
But my question is how do I access them, as they are already defined in <Auth /> ?
