Merge pull request #1711 from damienbod/added-docs-for-functional-rou…

…te-guard

Added docs to use functional route guard

docs/site/angular-auth-oidc-client/docs/documentation/guards.md

@@ -5,6 +5,8 @@ sidebar_position: 8
 
 # Using Route Guards
 
+## Class based
+
 > Guards should only be applied to protected URLs. There should be no guard active on the default route where the authorization request is processed.
 
 Please refer to the auto-login guard in this repo as a reference. It is important that the callback logic can be run on a route without the guard running or run before the guard logic.
@@ -51,3 +53,40 @@ const appRoutes: Routes = [
 ```
 
 All other guard types like `canLoad` or `canActivateChild` work in a similar way. However, the guard class has to implement the respective interfaces and methods accordingly.
+
+## Functional
+
+```ts
+import { inject } from '@angular/core';
+import { Router } from '@angular/router';
+import { OidcSecurityService } from 'angular-auth-oidc-client';
+import { map, take } from 'rxjs/operators';
+
+export const isAuthenticated = () => {
+  const oidcSecurityService = inject(OidcSecurityService);
+  const router = inject(Router);
+
+  return oidcSecurityService.isAuthenticated$.pipe(
+    take(1),
+    map(({ isAuthenticated }) => {
+      if (!isAuthenticated) {
+        router.navigate(['']);
+
+        return false;
+      }
+      return true;
+    })
+  );
+};
+```
+
+```ts
+const appRoutes: Routes = [
+  {
+    path: 'protected',
+    component: <yourComponent>,
+    canActivate: [isAuthenticated]
+  },
+  // ...
+];
+```