fix: Incomplete emails are being accepted at user registration (#29115)

* work in progress * add Error to input box * Remove console.logs * fix lint * fix emailInput and add useDebouncedValue * change useDebounced time and useForm validation * fix review * Create incomplete-emails.md * fix: simplified changeset --------- Co-authored-by: Hugo Costa <[email protected]> Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com> Co-authored-by: Gabriel Casals <[email protected]>
RocketChat · Jun 16, 2023 · ae39f91 · ae39f91
1 parent 916c0dc
commit ae39f91
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 1 deletion.
diff --git a/.changeset/incomplete-emails.md b/.changeset/incomplete-emails.md
@@ -0,0 +1,5 @@
+---
+"@rocket.chat/web-ui-registration": patch
+---
+
+✅ Added a new email validation in the Registration Form
diff --git a/packages/web-ui-registration/src/RegisterForm.tsx b/packages/web-ui-registration/src/RegisterForm.tsx
@@ -100,9 +100,13 @@ export const RegisterForm = ({ setLoginRoute }: { setLoginRoute: DispatchLoginRo
 							<TextInput
 								{...register('email', {
 									required: true,
+									pattern: {
+										value: /^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,}$/i,
+										message: t('registration.component.form.invalidEmail'),
+									},
 								})}
 								placeholder={usernameOrEmailPlaceholder || t('registration.component.form.emailPlaceholder')}
-								error={errors.email && t('registration.component.form.requiredField')}
+								error={errors.email && t('registration.component.form.invalidEmail')}
 								name='email'
 								aria-invalid={errors.email ? 'true' : undefined}
 								id='email'