update can redirect back to what they came from after login
This commit is contained in:
parent
1f4f5b6ad2
commit
a12b30998d
3 changed files with 57 additions and 14 deletions
|
|
@ -1,9 +1,20 @@
|
||||||
import { NgModule, inject } from '@angular/core';
|
import { NgModule, inject } from '@angular/core';
|
||||||
import { CanActivateFn, Router, RouterModule, Routes } from '@angular/router';
|
import {
|
||||||
|
ActivatedRoute,
|
||||||
|
ActivatedRouteSnapshot,
|
||||||
|
CanActivateFn,
|
||||||
|
Router,
|
||||||
|
RouterModule,
|
||||||
|
RouterStateSnapshot,
|
||||||
|
Routes,
|
||||||
|
} from '@angular/router';
|
||||||
import { UserService } from './core/services/user.service';
|
import { UserService } from './core/services/user.service';
|
||||||
import { lastValueFrom, map } from 'rxjs';
|
import { lastValueFrom, map } from 'rxjs';
|
||||||
|
|
||||||
const authGuard: CanActivateFn = () => {
|
const authGuard: CanActivateFn = (
|
||||||
|
route: ActivatedRouteSnapshot,
|
||||||
|
state: RouterStateSnapshot
|
||||||
|
) => {
|
||||||
const userService: UserService = inject(UserService);
|
const userService: UserService = inject(UserService);
|
||||||
const router: Router = inject(Router);
|
const router: Router = inject(Router);
|
||||||
|
|
||||||
|
|
@ -12,25 +23,35 @@ const authGuard: CanActivateFn = () => {
|
||||||
if (isAuth) {
|
if (isAuth) {
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
return router.parseUrl('/login');
|
return router.createUrlTree(['/login'], {
|
||||||
|
queryParams: {
|
||||||
|
redirectUrl: state.url,
|
||||||
|
},
|
||||||
|
});
|
||||||
})
|
})
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
const loginGuard: CanActivateFn = () => {
|
const loginGuard: CanActivateFn = (
|
||||||
|
route: ActivatedRouteSnapshot,
|
||||||
|
state: RouterStateSnapshot
|
||||||
|
) => {
|
||||||
const userService: UserService = inject(UserService);
|
const userService: UserService = inject(UserService);
|
||||||
const router: Router = inject(Router);
|
const router: Router = inject(Router);
|
||||||
|
|
||||||
return lastValueFrom(userService.getCurrentUser())
|
return userService.isAuthenticated.pipe(
|
||||||
.then(({ user }) => {
|
map((isAuth) => {
|
||||||
if (user) {
|
if (!isAuth) {
|
||||||
return router.parseUrl('/dashboard');
|
return true;
|
||||||
}
|
}
|
||||||
return true;
|
// redirect to redirectUrl query param
|
||||||
|
console.log(route.queryParams['redirectUrl']);
|
||||||
|
return router.createUrlTree([
|
||||||
|
router.parseUrl(route.queryParams['redirectUrl'] ?? '/dashboard'),
|
||||||
|
]);
|
||||||
|
// return false;
|
||||||
})
|
})
|
||||||
.catch(() => {
|
);
|
||||||
return true;
|
|
||||||
});
|
|
||||||
};
|
};
|
||||||
|
|
||||||
const routes: Routes = [
|
const routes: Routes = [
|
||||||
|
|
@ -65,6 +86,14 @@ const routes: Routes = [
|
||||||
),
|
),
|
||||||
canActivate: [authGuard],
|
canActivate: [authGuard],
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
path: 'recipe',
|
||||||
|
loadComponent: () =>
|
||||||
|
import(
|
||||||
|
'./features/dashboard/recipe-details/recipe-details.component'
|
||||||
|
).then((m) => m.RecipeDetailsComponent),
|
||||||
|
canActivate: [authGuard],
|
||||||
|
},
|
||||||
{
|
{
|
||||||
path: 'log',
|
path: 'log',
|
||||||
loadComponent: () =>
|
loadComponent: () =>
|
||||||
|
|
@ -72,6 +101,10 @@ const routes: Routes = [
|
||||||
(m) => m.ChangelogComponent
|
(m) => m.ChangelogComponent
|
||||||
),
|
),
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
path: '**',
|
||||||
|
redirectTo: 'dashboard',
|
||||||
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
|
|
||||||
|
|
@ -19,7 +19,12 @@ export class UserService {
|
||||||
.asObservable()
|
.asObservable()
|
||||||
.pipe(distinctUntilChanged());
|
.pipe(distinctUntilChanged());
|
||||||
|
|
||||||
public isAuthenticated = this.currentUser.pipe(map((user) => !!user));
|
public isAuthenticated = this.currentUser.pipe(
|
||||||
|
map((user) => !!user),
|
||||||
|
tap((isAuth) => {
|
||||||
|
console.log('Change auth', isAuth);
|
||||||
|
})
|
||||||
|
);
|
||||||
|
|
||||||
constructor(
|
constructor(
|
||||||
private readonly http: HttpClient,
|
private readonly http: HttpClient,
|
||||||
|
|
|
||||||
|
|
@ -1,4 +1,5 @@
|
||||||
import { Component } from '@angular/core';
|
import { Component } from '@angular/core';
|
||||||
|
import { ActivatedRoute } from '@angular/router';
|
||||||
import { environment } from 'src/environments/environment';
|
import { environment } from 'src/environments/environment';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
|
|
@ -20,8 +21,12 @@ import { environment } from 'src/environments/environment';
|
||||||
standalone: true,
|
standalone: true,
|
||||||
})
|
})
|
||||||
export class GoogleButtonComponent {
|
export class GoogleButtonComponent {
|
||||||
|
constructor(private route: ActivatedRoute) {}
|
||||||
|
|
||||||
loginWithGoogle(): void {
|
loginWithGoogle(): void {
|
||||||
|
const returnUrl = this.route.snapshot.queryParams['redirectUrl'] || '/';
|
||||||
// redirect to google login in server
|
// redirect to google login in server
|
||||||
window.location.href = environment.api + '/auth/google';
|
window.location.href =
|
||||||
|
environment.api + '/auth/google' + '?redirect_to=' + returnUrl;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue