Skip to content

Commit

Permalink
feat: added input validation in registration form
Browse files Browse the repository at this point in the history
  • Loading branch information
MahendraDani committed Jan 5, 2024
1 parent 3819bd8 commit 7f7e6e5
Show file tree
Hide file tree
Showing 2 changed files with 43 additions and 8 deletions.
4 changes: 4 additions & 0 deletions public/locales/en.json
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,10 @@
"email": "Email",
"password": "Password",
"atleast_8_char_long": "Atleast 8 Character long",
"atleast_6_char_long": "Atleast 6 Character long",
"firstName_invalid": "First name should contain only lower and upper case letters",
"lastName_invalid": "First name should contain only lower and upper case letters",
"password_invalid": "Password should contain atleast one lowercase, one uppercase, one numeric value and one special character",
"Password_and_Confirm_password_mismatches.": "Password and Confirm password mismatches.",
"confirmPassword": "Confirm Password",
"forgotPassword": "Forgot Password ?",
Expand Down
47 changes: 39 additions & 8 deletions src/screens/LoginPage/LoginPage.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -129,12 +129,34 @@ function loginPage(): JSX.Element {
toast.error(t('Please_check_the_captcha'));
return;
}
const isValidatedString = (value: string): boolean =>
/^[a-zA-Z]+$/.test(value);

const validatePassword = (password: string): boolean => {
const lengthCheck = new RegExp('^.{7,}$');
const lowercaseCheck = new RegExp('[a-z]');
const uppercaseCheck = new RegExp('[A-Z]');
const numericalCheck = new RegExp('\\d');
const specialCharCheck = new RegExp(
'[!@#$%^&*()_+{}\\[\\]:;<>,.?~\\\\/-]'
);
return (
lengthCheck.test(password) &&
lowercaseCheck.test(password) &&
uppercaseCheck.test(password) &&
numericalCheck.test(password) &&
specialCharCheck.test(password)

Check warning on line 148 in src/screens/LoginPage/LoginPage.tsx

View check run for this annotation

Codecov / codecov/patch

src/screens/LoginPage/LoginPage.tsx#L147-L148

Added lines #L147 - L148 were not covered by tests
);
};

if (
isValidatedString(signfirstName) &&
isValidatedString(signlastName) &&
signfirstName.length > 1 &&
signlastName.length > 1 &&
signEmail.length >= 8 &&
signPassword.length > 1
signPassword.length > 1 &&
validatePassword(signPassword)
) {
if (cPassword == signPassword) {
try {
Expand All @@ -153,8 +175,6 @@ function loginPage(): JSX.Element {
'Successfully Registered. Please wait until you will be approved.'
);

setShowTab('LOGIN');

setSignFormState({
signfirstName: '',
signlastName: '',
Expand All @@ -171,7 +191,18 @@ function loginPage(): JSX.Element {
toast.warn(t('passwordMismatches'));
}
} else {
toast.warn(t('fillCorrectly'));
if (!isValidatedString(signfirstName)) {
toast.warn(t('firstName_invalid'));

Check warning on line 195 in src/screens/LoginPage/LoginPage.tsx

View check run for this annotation

Codecov / codecov/patch

src/screens/LoginPage/LoginPage.tsx#L195

Added line #L195 was not covered by tests
}
if (!isValidatedString(signlastName)) {
toast.warn(t('lastName_invalid'));

Check warning on line 198 in src/screens/LoginPage/LoginPage.tsx

View check run for this annotation

Codecov / codecov/patch

src/screens/LoginPage/LoginPage.tsx#L198

Added line #L198 was not covered by tests
}
if (!validatePassword(signPassword)) {
toast.warn(t('password_invalid'));
}
if (signEmail.length < 8) {
toast.warn(t('email_invalid'));

Check warning on line 204 in src/screens/LoginPage/LoginPage.tsx

View check run for this annotation

Codecov / codecov/patch

src/screens/LoginPage/LoginPage.tsx#L204

Added line #L204 was not covered by tests
}
}
};

Expand Down Expand Up @@ -520,22 +551,22 @@ function loginPage(): JSX.Element {
</Button>
</div>
{isInputFocused &&
signformState.signPassword.length < 8 && (
signformState.signPassword.length < 6 && (
<div
className="form-text text-danger"
data-testid="passwordCheck"
>
{t('atleast_8_char_long')}
{t('atleast_6_char_long')}
</div>
)}
{!isInputFocused &&
signformState.signPassword.length > 0 &&
signformState.signPassword.length < 8 && (
signformState.signPassword.length < 6 && (
<div
className="form-text text-danger"
data-testid="passwordCheck"
>
{t('atleast_8_char_long')}
{t('atleast_6_char_long')}
</div>
)}
</div>
Expand Down

0 comments on commit 7f7e6e5

Please sign in to comment.