auth frontend

client/src/app/screens/screen-login/screen-login.html

@@ -12,7 +12,7 @@
             <form [formGroup]="loginForm" (ngSubmit)="onSubmit()" novalidate>
               <!-- Email -->
               <div class="mb-3">
-                <label for="email" class="form-label">Email</label>
+                <label for="email" class="form-label">Username</label>
                 <input
                   type="text"
                   id="username"
@@ -49,9 +49,7 @@
                 class="btn btn-primary w-100 mb-3"
               >
               @if (loading) {
-                <span class="spinner-border spinner-border-sm" role="status" aria-hidden="true">
-                  Signing In...
-                </span>
+                <span> Signing In... </span>
               }@else {
                 <span>Sign In</span>
               }

client/src/app/screens/screen-login/screen-login.ts

@@ -1,8 +1,9 @@
 import { CommonModule } from '@angular/common';
 import { Component } from '@angular/core';
-import { Validators, FormBuilder, FormGroup, FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { Validators, FormBuilder, FormGroup, FormsModule, ReactiveFormsModule, Form } from '@angular/forms';
 import { Router } from '@angular/router';
 import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
+import { APIService } from '../../services/api';
 
 @Component({
   selector: 'app-screen-login',
@@ -18,38 +19,30 @@ export class ScreenLogin {
   error: string | null = null;
 
   constructor(
+    private api: APIService,
+    private router: Router,
     private fb: FormBuilder,
-    private router: Router
   ) {
     this.loginForm = this.fb.group({
-      email: ['', [Validators.required, Validators.email]],
-      password: ['', [Validators.required, Validators.minLength(6)]],
-      rememberMe: [false]
+      username: ['', [Validators.required]],
+      password: ['', [Validators.required]],
     });
   }
 
   onSubmit() {
     this.submitted = true;
     this.error = null;
-
-    if (this.loginForm.invalid) {
-      return;
-    }
-
     this.loading = true;
-    const { email, password, rememberMe } = this.loginForm.value;
 
-    /*
-    this.authService.login(email, password, rememberMe).subscribe({
+    this.api.login(this.loginForm.value.username, this.loginForm.value.password).subscribe({
       next: () => {
-        this.router.navigate(['/dashboard']); // Redirect after login
+        //this.router.navigate(['']);
       },
       error: (err) => {
         this.error = err.error?.message || 'Login failed. Please try again.';
         this.loading = false;
       }
     });
-  */
   }
 }
 

client/src/app/services/api.ts

@@ -14,4 +14,7 @@ export class APIService {
   getTransactions(): Observable<Transaction[]>{
     return this.http.get<Transaction[]>(this.apiUrl + '/transactions');
   }
+  login(username: string, password: string): Observable<any>{
+    return this.http.post(this.apiUrl + '/auth/login',{ 'username': username, 'password': password});
+  }
 }