diff --git a/bun.lockb b/bun.lockb new file mode 100755 index 0000000..6c5df2a Binary files /dev/null and b/bun.lockb differ diff --git a/src/app/app.routes.ts b/src/app/app.routes.ts index dc084f2..874973d 100644 --- a/src/app/app.routes.ts +++ b/src/app/app.routes.ts @@ -32,4 +32,8 @@ export const routes: Routes = [ ], canActivate: [authGuard], }, + { + path: '**', + loadComponent: () => import('./component/not-found/not-found.component'), + }, ]; diff --git a/src/app/component/auth/login/login.component.ts b/src/app/component/auth/login/login.component.ts index d6df24b..2b92580 100644 --- a/src/app/component/auth/login/login.component.ts +++ b/src/app/component/auth/login/login.component.ts @@ -1,4 +1,4 @@ -import { Component, inject } from '@angular/core'; +import { Component, inject, OnInit } from '@angular/core'; import { FormBuilder, FormGroup, @@ -7,23 +7,30 @@ import { } from '@angular/forms'; import AuthService from '../../../service/auth.service'; import { AuthResponse, Token } from '../../../models'; -import { Router } from '@angular/router'; +import { ActivatedRoute, Router } from '@angular/router'; @Component({ selector: 'app-login', imports: [ReactiveFormsModule], templateUrl: './login.component.html', }) -export default class LoginComponent { +export default class LoginComponent implements OnInit { fb: FormBuilder = inject(FormBuilder); authService: AuthService = inject(AuthService); router: Router = inject(Router); + route: ActivatedRoute = inject(ActivatedRoute); form: FormGroup = this.fb.group({ username: [null, [Validators.required]], password: [null, [Validators.required]], }); + returnUrl: string | undefined; + + ngOnInit(): void { + this.returnUrl = this.route.snapshot.queryParams['returnUrl'] || '/dashboard'; + } + login() { if (this.form.invalid) { console.log(this.form.errors); @@ -34,7 +41,7 @@ export default class LoginComponent { localStorage.setItem('access_token', r.accessToken); localStorage.setItem('refresh_token', r.refreshToken); - this.router.navigate(['dashboard']); + this.router.navigate([this.returnUrl]); }); } } diff --git a/src/app/component/not-found/not-found.component.ts b/src/app/component/not-found/not-found.component.ts new file mode 100644 index 0000000..12b55ff --- /dev/null +++ b/src/app/component/not-found/not-found.component.ts @@ -0,0 +1,8 @@ +import { Component } from '@angular/core'; + +@Component({ + selector: 'app-not-found', + template: '

404 Not Found

', + standalone: true, +}) +export default class NotFoundComponent {} diff --git a/src/app/service/auth.guard.ts b/src/app/service/auth.guard.ts index d7ebe50..c0f4d0e 100644 --- a/src/app/service/auth.guard.ts +++ b/src/app/service/auth.guard.ts @@ -1,4 +1,4 @@ -import { CanActivateFn } from '@angular/router'; +import { CanActivateFn, Router } from '@angular/router'; import { inject } from '@angular/core'; import { HttpClient, @@ -8,7 +8,9 @@ import { import { catchError, map, of } from 'rxjs'; import { User } from '../models'; -export const authGuard: CanActivateFn = () => { +export const authGuard: CanActivateFn = (route, state) => { + const router = inject(Router); + return inject(HttpClient) .get('https://dummyjson.com/auth/me', { observe: 'response' }) .pipe( @@ -18,6 +20,9 @@ export const authGuard: CanActivateFn = () => { }), catchError((err: HttpErrorResponse) => { console.log(err); + router.navigate(['/auth/login'], { + queryParams: { returnUrl: state.url }, + }); return of(false); }), ); diff --git a/src/app/service/http.interceptor.ts b/src/app/service/http.interceptor.ts index 349afda..594b8ae 100644 --- a/src/app/service/http.interceptor.ts +++ b/src/app/service/http.interceptor.ts @@ -8,6 +8,10 @@ export const httpInterceptor: HttpInterceptorFn = ( req: HttpRequest, next: HttpHandlerFn, ) => { + if (req.url.includes('/auth/login') || req.url.includes('/auth/register')) { + return next(req); + } + return next( req.clone({ setHeaders: {