feat(sign-in): add feedback on sign-in page (#79)

* feat(sign-in): add feedback on sign-in page

Signed-off-by: Matheus Cruz <matheuscruz.dev@gmail.com>

* refactor: apply suggestions from code review

* refactor: apply suggestions from code review

* fix: adjust toast from user-configs page

Signed-off-by: Matheus Cruz <matheuscruz.dev@gmail.com>

---------

Signed-off-by: Matheus Cruz <matheuscruz.dev@gmail.com>

Author: mcruzdev

timeless-api/src/main/webui/src/app/app.component.html

@@ -1,3 +1 @@
 <router-outlet />
-
-<p-toast position="bottom-right" key="toast"> </p-toast>

timeless-api/src/main/webui/src/app/app.component.ts

@@ -1,11 +1,10 @@
 import { Component } from '@angular/core';
 import { RouterOutlet } from '@angular/router';
 import { MessageService } from 'primeng/api';
-import { ToastModule } from 'primeng/toast';
 
 @Component({
   selector: 'app-root',
-  imports: [RouterOutlet, ToastModule],
+  imports: [RouterOutlet],
   templateUrl: './app.component.html',
   styleUrl: './app.component.scss',
   providers: [MessageService],

timeless-api/src/main/webui/src/app/pages/sign/sign-in/sign-in.component.html

@@ -42,3 +42,5 @@ <h1 class="text-xl font-thin my-2">
     <a [routerLink]="['sign-up']" class="primary-emphasis font-normal">aqui</a>.
   </p>
 </form>
+
+<p-toast position="bottom-right" key="toast"> </p-toast>

timeless-api/src/main/webui/src/app/pages/sign/sign-in/sign-in.component.ts

@@ -8,6 +8,8 @@ import { TimelessApiService } from '../../../timeless-api.service';
 import { FloatLabel } from 'primeng/floatlabel';
 import { MessageService } from 'primeng/api';
 import { timelessLocalStorageKey } from '../../../constants';
+import { catchError, throwError } from 'rxjs';
+import { Toast } from 'primeng/toast';
 
 @Component({
   selector: 'app-sign-in',
@@ -18,6 +20,7 @@ import { timelessLocalStorageKey } from '../../../constants';
     CardModule,
     RouterLink,
     FloatLabel,
+    Toast,
   ],
   templateUrl: './sign-in.component.html',
   styleUrl: './sign-in.component.scss',
@@ -48,11 +51,26 @@ export class SignInComponent {
       return;
     }
 
-    this.timelessApiService.signIn(this.form.value).subscribe((value) => {
-      localStorage.setItem(timelessLocalStorageKey, JSON.stringify(value));
-      this.router.navigate(['/home']).then((r) => {
-        console.log('logged in');
+    this.timelessApiService
+      .signIn(this.form.value)
+      .pipe(
+        catchError((error) => {
+          console.error('Login error:', error);
+          this.messageService.add({
+            key: 'toast',
+            severity: 'error',
+            summary: 'Erro ao fazer login',
+            detail:
+              'Não foi possível fazer login, verifique suas credenciais e tente novamente.',
+          });
+          return throwError(() => error);
+        }),
+      )
+      .subscribe((value) => {
+        localStorage.setItem(timelessLocalStorageKey, JSON.stringify(value));
+        this.router.navigate(['/home']).then((r) => {
+          console.log('logged in');
+        });
       });
-    });
   }
 }

timeless-api/src/main/webui/src/app/pages/user-config/user-config.component.html

@@ -76,3 +76,5 @@
     </ng-template>
   </p-card>
 </form>
+
+<p-toast position="bottom-right" key="toast"> </p-toast>

timeless-api/src/main/webui/src/app/pages/user-config/user-config.component.ts

@@ -11,6 +11,7 @@ import {
 } from '@angular/forms';
 import { TimelessApiService } from '../../timeless-api.service';
 import { MessageService } from 'primeng/api';
+import { Toast } from 'primeng/toast';
 
 @Component({
   selector: 'app-user-config',
@@ -21,6 +22,7 @@ import { MessageService } from 'primeng/api';
     InputMask,
     FormsModule,
     ReactiveFormsModule,
+    Toast,
   ],
   templateUrl: './user-config.component.html',
   styleUrl: './user-config.component.scss',