diff --git a/src/app/models/auth.models.ts b/src/app/models/auth.models.ts
index ae3e30d..f6e25a9 100644
--- a/src/app/models/auth.models.ts
+++ b/src/app/models/auth.models.ts
@@ -12,8 +12,11 @@ export interface LoginRequest {
export interface LoginResponse {
success: boolean;
message?: string;
- user?: User;
- token?: string; // Optional: if you need the JWT on client side
+ user?: LoginUserResponse;
+}
+
+export interface LoginUserResponse {
+ id: number;
}
export interface RegisterRequest {
diff --git a/src/app/pages/home/home.component.css b/src/app/pages/home/home.component.css
index f19764e..b484f5a 100644
--- a/src/app/pages/home/home.component.css
+++ b/src/app/pages/home/home.component.css
@@ -62,7 +62,8 @@
}
.loading,
-.error-state {
+.error-state,
+.loading-state {
background: white;
padding: 30px 24px;
border-radius: 12px;
diff --git a/src/app/pages/home/home.component.html b/src/app/pages/home/home.component.html
index 0ed8829..ab44051 100644
--- a/src/app/pages/home/home.component.html
+++ b/src/app/pages/home/home.component.html
@@ -8,9 +8,9 @@
-
0; else noProjects">
+ 0; else noProjects">
diff --git a/src/app/pages/home/home.component.ts b/src/app/pages/home/home.component.ts
index f65ae80..7eeafea 100644
--- a/src/app/pages/home/home.component.ts
+++ b/src/app/pages/home/home.component.ts
@@ -1,4 +1,4 @@
-import { Component, inject } from '@angular/core';
+import { Component, inject, OnInit } from '@angular/core';
import { CommonModule } from '@angular/common';
import { Router } from '@angular/router';
import { AuthService } from '../../services/auth.service';
@@ -12,12 +12,14 @@ import { Project } from '../../models/projects.models';
templateUrl: './home.component.html',
styleUrl: './home.component.css',
})
-export class HomeComponent {
+export class HomeComponent implements OnInit {
protected authService = inject(AuthService);
private router = inject(Router);
- protected get projectList(): Project[] {
- return this.authService.currentUser()?.projects ?? [];
+ protected projects: Project[] = [];
+
+ ngOnInit(): void {
+ this.projects = this.authService.currentUser()?.projects ?? [];
}
onCreateProject() {
@@ -27,4 +29,5 @@ export class HomeComponent {
trackByProjectId(_index: number, project: Project): number {
return project.id;
}
+
}
diff --git a/src/app/pages/login/login.component.ts b/src/app/pages/login/login.component.ts
index 34af9df..eb4298e 100644
--- a/src/app/pages/login/login.component.ts
+++ b/src/app/pages/login/login.component.ts
@@ -67,7 +67,6 @@ export class LoginComponent implements OnInit {
next: (response) => {
this.isLoading.set(false);
if (response.success || response.user) {
- // Redirect to home/dashboard after successful login
this.router.navigate(['/']);
} else {
this.errorMessage.set(response.message || 'Login failed');
diff --git a/src/app/services/auth.service.ts b/src/app/services/auth.service.ts
index 765bc2c..a0d854b 100644
--- a/src/app/services/auth.service.ts
+++ b/src/app/services/auth.service.ts
@@ -10,7 +10,7 @@ import { environment } from '../config/environment';
* Uses signals for reactive state management
*/
@Injectable({
- providedIn: 'root'
+ providedIn: 'root',
})
export class AuthService {
private http = inject(HttpClient);
@@ -19,7 +19,7 @@ export class AuthService {
// Reactive auth state using signals
private authState = signal({
isAuthenticated: false,
- user: null
+ user: null,
});
// Public computed signals for components to consume
@@ -31,19 +31,21 @@ export class AuthService {
* The JWT will be set as an HTTP-only cookie by the backend
*/
login(credentials: LoginRequest): Observable {
- return this.http.post(
- `${environment.apiBaseUrl}/auth/login`,
- credentials
- ).pipe(
- tap(response => {
+ return this.http.post(`${environment.apiBaseUrl}/auth/login`, credentials).pipe(
+ tap((response) => {
if (response.success || response.user) {
- // Update auth state even if the backend only sets a cookie
- this.authState.set({
- isAuthenticated: true,
- user: response.user ?? null
- });
+ this.http.get(`${environment.apiBaseUrl}/me`).subscribe({
+ next: (user) => {
+ this.authState.set({ isAuthenticated: true, user });
+ // Redirect to home/dashboard after successful login
+ this.router.navigate(['/']);
+ },
+ error: () => {
+ this.authState.set({ isAuthenticated: false, user: null });
+ },
+ })
}
- })
+ }),
);
}
@@ -57,7 +59,7 @@ export class AuthService {
// Clear auth state
this.authState.set({
isAuthenticated: false,
- user: null
+ user: null,
});
// Redirect to login
this.router.navigate(['/login']);
@@ -66,7 +68,7 @@ export class AuthService {
// Even if logout fails on backend, clear local state
this.clearAuthState();
return throwError(() => error);
- })
+ }),
);
}
@@ -76,12 +78,12 @@ export class AuthService {
*/
checkSession(): Observable {
return this.http.get(`${environment.apiBaseUrl}/me`).pipe(
- tap(user => {
+ tap((user) => {
this.authState.set({
isAuthenticated: true,
- user: user
+ user: user,
});
- })
+ }),
);
}
@@ -91,7 +93,7 @@ export class AuthService {
clearAuthState(): void {
this.authState.set({
isAuthenticated: false,
- user: null
+ user: null,
});
this.router.navigate(['/login']);
}