Better Validations

This commit is contained in:
2023-08-02 00:08:58 -03:00
parent c60215d7d2
commit fea0b063b6
7 changed files with 44 additions and 6 deletions

View File

@@ -34,6 +34,7 @@
placeholder="Password">
</div>
<button class="btn"
[disabled]="loginForm.invalid"
type="submit">
Login
</button>

View File

@@ -10,6 +10,8 @@ import HttpErrorChecker from 'src/app/shared/model/httpError/httpErrorChecker';
import UserChecker from 'src/app/shared/model/user/user.checker';
import { User } from 'src/app/shared/model/user/user.model';
import {animate, animateChild, group, query, state, style, transition, trigger} from "@angular/animations";
import {ValidatePasswordValidator} from "../../../shared/validators/validate-password.validator";
import {ValidateNotEmptyValidator} from "../../../shared/validators/validate-not-empty.validator";
const GOOGLE_LOGO_SVG = "assets/img/providers/google.svg";
@@ -123,8 +125,8 @@ export class LoginComponent implements OnInit, AfterViewInit, OnDestroy {
ngOnInit(): void {
this.loginForm = new FormGroup({
'username': new FormControl(null, [Validators.required]),
'password': new FormControl(null, [Validators.required])
'username': new FormControl(null, [Validators.required, ValidateNotEmptyValidator]),
'password': new FormControl(null, [Validators.required, ValidatePasswordValidator])
});
this.errorMessage = null;
this.authSubject = this.authService.authSubject.subscribe(

View File

@@ -53,6 +53,7 @@
placeholder="Password">
</div>
<button class="btn"
[disabled]="!signupForm.valid"
type="submit">
SignUp
</button>

View File

@@ -10,6 +10,9 @@ import HttpErrorChecker from 'src/app/shared/model/httpError/httpErrorChecker';
import UserChecker from 'src/app/shared/model/user/user.checker';
import { User } from 'src/app/shared/model/user/user.model';
import {animate, animateChild, group, query, state, style, transition, trigger} from "@angular/animations";
import {ValidateEmailValidator} from "../../../shared/validators/validate-email.validator";
import {ValidatePasswordValidator} from "../../../shared/validators/validate-password.validator";
import {ValidateNotEmptyValidator} from "../../../shared/validators/validate-not-empty.validator";
const GOOGLE_LOGO_SVG = "assets/img/providers/google.svg";
@@ -125,12 +128,12 @@ export class SignupComponent implements OnInit {
ngOnInit(): void {
this.signupForm = new FormGroup({
'fullname': new FormControl(null, [Validators.required]),
'fullname': new FormControl(null, [Validators.required, ValidateNotEmptyValidator]),
// Create a Email Validator
'email': new FormControl(null, [Validators.required]),
'username': new FormControl(null, [Validators.required]),
'email': new FormControl(null, [Validators.required, ValidateEmailValidator]),
'username': new FormControl(null, [Validators.required, ValidateNotEmptyValidator]),
// Create a Password Validator
'password': new FormControl(null, [Validators.required])
'password': new FormControl(null, [Validators.required, ValidatePasswordValidator])
});
this.errorMessage = null;
this.authSubject = this.authService.authSubject.subscribe(

View File

@@ -0,0 +1,11 @@
import {AbstractControl} from "@angular/forms";
export function ValidateEmailValidator(control: AbstractControl) {
const email = control.value;
const emailRegex = /^[\w-\.]+@([\w-]+\.)+[\w-]{2,4}$/g;
const emailValid = emailRegex.test(email);
if (!emailValid) {
return { invalidEmail: true };
}
return null;
}

View File

@@ -0,0 +1,9 @@
import {AbstractControl} from "@angular/forms";
export function ValidateNotEmptyValidator(control: AbstractControl) {
const value = control.value;
if (!value || value.length === 0) {
return { invalidNotEmpty: true };
}
return null;
}

View File

@@ -0,0 +1,11 @@
import {AbstractControl} from "@angular/forms";
export function ValidatePasswordValidator(control: AbstractControl) {
var password = control.value;
var passwordRegex = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&])[A-Za-z\d@$!%*?&]{8,}$/g;
var passwordValid = passwordRegex.test(password);
if (!passwordValid) {
return { invalidPassword: true };
}
return null;
}