added skeletons

This commit is contained in:
Igor Hrenowitsch Propisnov 2024-06-26 18:53:53 +02:00
parent 8a1ab8b11e
commit a5f06ef940
2 changed files with 208 additions and 192 deletions

View File

@ -1,4 +1,5 @@
<div class="flex h-screen w-screen"> @if (!userSignupSuccess()) {
<div class="flex h-screen w-screen">
<div <div
[ngStyle]="leftBackgroundStyle" [ngStyle]="leftBackgroundStyle"
class="hidden md:flex md:flex-col md:w-1/2 bg-primary"> class="hidden md:flex md:flex-col md:w-1/2 bg-primary">
@ -72,7 +73,9 @@
<div <div
class="animate-fade-down animate-once animate-duration-1000 animate-ease-in-out flex-1 flex flex-col justify-center items-center px-12"> class="animate-fade-down animate-once animate-duration-1000 animate-ease-in-out flex-1 flex flex-col justify-center items-center px-12">
<h1 class="text-3xl font-semibold text-center">Create an Account</h1> <h1 class="text-3xl font-semibold text-center">Create an Account</h1>
<p class="text-center">Enter your email below to create your Account</p> <p class="text-center">
Enter your email below to create your Account
</p>
<form <form
[formGroup]="form" [formGroup]="form"
(ngSubmit)="onSubmit()" (ngSubmit)="onSubmit()"
@ -109,7 +112,8 @@
'w-full': true, 'w-full': true,
'border-error focus:border-error': 'border-error focus:border-error':
form.get('password')?.invalid && form.get('password')?.invalid &&
(form.get('password')?.dirty || form.get('password')?.touched) (form.get('password')?.dirty ||
form.get('password')?.touched)
}" }"
class="input input-bordered flex items-center gap-2"> class="input input-bordered flex items-center gap-2">
<svg <svg
@ -256,7 +260,12 @@
</footer> </footer>
</div> </div>
</div> </div>
</div> </div>
} @else {
<div class="flex h-screen w-screen bg-primary">
<div class="hidden md:flex md:flex-col md:w-1/1"></div>
</div>
}
<div class="modal modal-open" *ngIf="isDialogOpen()"> <div class="modal modal-open" *ngIf="isDialogOpen()">
<div <div

View File

@ -82,6 +82,7 @@ export class RegisterRootComponent implements OnInit {
public rememberMe: FormControl = new FormControl(false); public rememberMe: FormControl = new FormControl(false);
public isSigninSignal: WritableSignal<boolean> = signal(false); public isSigninSignal: WritableSignal<boolean> = signal(false);
public isSignupSignal: WritableSignal<boolean> = signal(true); public isSignupSignal: WritableSignal<boolean> = signal(true);
public isSignUpSuccess: WritableSignal<boolean> = signal(false);
public userSignupSuccess: WritableSignal<boolean> = signal(false); public userSignupSuccess: WritableSignal<boolean> = signal(false);
public isDialogOpen: WritableSignal<boolean> = signal(false); public isDialogOpen: WritableSignal<boolean> = signal(false);
public isLoading: WritableSignal<boolean> = signal(false); public isLoading: WritableSignal<boolean> = signal(false);
@ -108,16 +109,21 @@ export class RegisterRootComponent implements OnInit {
}); });
const rememberMe = this.localStorageService.getItem<boolean>('remember-me'); const rememberMe = this.localStorageService.getItem<boolean>('remember-me');
if (rememberMe === true) { if (rememberMe) {
this.authService this.authService
.status() .status()
.pipe(delay(1500)) .pipe(delay(1500))
.subscribe((response: SuccessDtoApiModel) => { .subscribe({
next: (response: SuccessDtoApiModel) => {
if (response.success) { if (response.success) {
this.router.navigate(['/dashboard']); this.router.navigate(['/dashboard']);
} else { } else {
this.displaySkeleton.set(false); this.displaySkeleton.set(false);
} }
},
error: () => {
this.displaySkeleton.set(false);
},
}); });
} }
} }
@ -380,6 +386,7 @@ export class RegisterRootComponent implements OnInit {
.subscribe((response: SuccessDtoApiModel) => { .subscribe((response: SuccessDtoApiModel) => {
if (response.success) { if (response.success) {
this.openModal(); this.openModal();
this.userSignupSuccess.set(true);
} }
}); });
} }