TELYA
04/12/2022, 2:50 PMtypescript
let password = "";
SuperTokensReact.init({
config...,
signInAndUpFeature: {
signUpForm: {
formFields: [
{
id:"passwordConfirm",
validate: async(value:string) => {
if (value !== password) {
return "error msg";
}
return undefined;
}
},
{
id: "password",
validate: async(value:string) => {
password = value;
return undefined;
}
}
]
}
}
})
My question to this. Is it any better way to accomplish this ?
My second problem with this newly created input field is the input type. I got text but i would like to changed this to password, so i did this:
typescript
EmailPasswordReact.init({
override:{
components:{
EmailPasswordSignUpForm_Override:({DefaultComponent}) => {
useEffect(() => {
const passwordConfirm = document.querySelector<HTMLInputElement>('.supertokens-input[name="passwordConfirm"]');
if (passwordConfirm && passwordConfirm.type === "text") {
passwordConfirm.setAttribute("type", "password");
}
}, []);
return <DefaultComponent {...props} />;
}
}
}
})
It worked, but i feel this is not the right way to do it. So is it any better way to do this ?
Thanks for the answers in advance 🙂
Btw i really like the stuff that you guys created 🤘rp_st
04/12/2022, 3:25 PMDefaultComponent
at all. We will be working on a more fine grained way of overriding components soon..
Checking for password match, I would suggest that in the passwordConfirm
validate function, you should read the password from the other input box via `jquery`selectors. Like: document.querySelector("#supertokens-root").shadowRoot.querySelector(...)
instead of using a password
global variable.TELYA
04/12/2022, 3:30 PMSuperTokens is an open source authentication solution offering features like: Different types of login: Email / password, Passwordless (OTP or Magic link based).
Powered by