ng support lib enhancements (#1809)

Co-authored-by: JohannesDoberer <johannes.doberer@sap.com>

client-frameworks-support/client-support-angular/projects/client-support-angular/src/lib/component/luigi.preload.component.html

@@ -1,24 +1 @@
-<p>NG Luigi Library Demo Component</p>
-
-<p>
-  This is a demo component; in Luigi it is a
-  <a
-    href="https://docs.luigi-project.io/docs/navigation-parameters-reference/?section=virtualtree"
-    >virtual tree</a
-  >.
-  <br />
-  If you want to configure an Angular Component to be called in virtual tree,
-  you must use this route configuration:
-  <br />
-  <br />
-  <code>{{ routeExampleVirtual }}</code>
-</p>
-<br />
-
-<p>
-  If you want to configure an Angular Component to be just created once (like a
-  singleton( you can use this configuration:
-  <br />
-  <br />
-  <code>{{ routeExampleReuse }}</code>
-</p>
+<p luigipreload="luigipreload"></p>

client-frameworks-support/client-support-angular/projects/client-support-angular/src/lib/component/luigi.preload.component.ts

@@ -7,9 +7,5 @@ import { Component, OnInit } from '@angular/core';
 })
 export class LuigiPreloadComponent implements OnInit {
   constructor() {}
-  routeExampleVirtual: string =
-    "  {path: 'ng-luigi-demo', component: NgLuigiDemoComponent, data: {fromVirtualTreeRoot: true}}";
-  routeExampleReuse: string =
-    "  {path: 'ng-luigi-demo', component: NgLuigiDemoComponent, data: {reuse: true}}";
   ngOnInit(): void {}
 }

client-frameworks-support/client-support-angular/projects/client-support-angular/src/lib/luigi.angular.support.module.ts

@@ -4,8 +4,7 @@ import { LuigiPreloadComponent } from './component/luigi.preload.component';
 import { LuigiContextService } from './service/luigi-context-service';
 import { LuigiContextServiceImpl } from './service/luigi-context.service.impl';
 import { LuigiAutoRoutingService } from './service/luigi-auto-routing.service';
-import {LuigiReuseRouteStrategy} from "./route/luigi-reuse-route-strategy.ts";
-import {LuigiRouteStrategy} from "./route/luigi-route-strategy";
+import { LuigiRouteStrategy } from './route/luigi-route-strategy';
 
 export const staticRoutes: Routes = [
   /** here an example if you want to specify that this component is a virtualTree element in Luigi Core navigation*/

client-frameworks-support/client-support-angular/projects/client-support-angular/src/lib/route/luigi-route-strategy.ts

@@ -1,10 +1,13 @@
-import { ActivatedRouteSnapshot, DetachedRouteHandle, RouteReuseStrategy } from "@angular/router";
-import { LuigiActivatedRouteSnapshotHelper } from "./luigi-activated-route-snapshot-helper";
+import {
+  ActivatedRouteSnapshot,
+  DetachedRouteHandle,
+  RouteReuseStrategy
+} from '@angular/router';
+import { LuigiActivatedRouteSnapshotHelper } from './luigi-activated-route-snapshot-helper';
 
 export class LuigiRouteStrategy implements RouteReuseStrategy {
-
   shouldDetach(route: ActivatedRouteSnapshot): boolean {
-      return false;
+    return false;
   }
 
   store(route: ActivatedRouteSnapshot, handler: DetachedRouteHandle): void {}
@@ -18,8 +21,10 @@ export class LuigiRouteStrategy implements RouteReuseStrategy {
     return (null as unknown) as DetachedRouteHandle;
   }
 
-  shouldReuseRoute(future: ActivatedRouteSnapshot, current: ActivatedRouteSnapshot): boolean {
-    return future.routeConfig === current.routeConfig;
+  shouldReuseRoute(
+    future: ActivatedRouteSnapshot,
+    current: ActivatedRouteSnapshot
+  ): boolean {
+    return false;
   }
-
 }

client-frameworks-support/client-support-angular/projects/client-support-angular/src/lib/service/luigi-auto-routing.service.ts

@@ -1,21 +1,31 @@
 import { Injectable, OnDestroy } from '@angular/core';
 import { OperatorFunction, PartialObserver, Subscription } from 'rxjs';
-import { NavigationEnd, Router, RouterEvent } from '@angular/router';
+import {
+  convertToParamMap,
+  NavigationEnd,
+  ParamMap,
+  Router,
+  RouterEvent
+} from '@angular/router';
 import { linkManager } from '@luigi-project/client';
 import { filter } from 'rxjs/operators';
 import { LuigiActivatedRouteSnapshotHelper } from '../route/luigi-activated-route-snapshot-helper';
+import { LuigiContextService } from './luigi-context-service';
 
 @Injectable({
   providedIn: 'root'
 })
 export class LuigiAutoRoutingService implements OnDestroy {
   private subscription: Subscription = new Subscription();
 
-  constructor(private router: Router) {
+  constructor(
+    private router: Router,
+    private luigiContextService: LuigiContextService
+  ) {
     this.subscription.add(
       this.router.events
         .pipe(this.doFilter())
-        .subscribe(this.doSubscription as () => void)
+        .subscribe(this.doSubscription.bind(this) as () => void)
     );
   }
 
@@ -37,22 +47,48 @@ export class LuigiAutoRoutingService implements OnDestroy {
    * Another option is to specify the LuigiPath: if you add in route data luigiRoute:'/xxxx/xxx';
    * in the case we will update the path in LuigiCore navigation, here an example
    * {path: 'demo', component: DemoComponent, data:{luigiRoute: '/home/demo''}}
-   * @param event
+   * @param event the NavigationEnd event
    */
   doSubscription(event: NavigationEnd): void {
     const current = LuigiActivatedRouteSnapshotHelper.getCurrent();
-    if (current.data.luigiRoute) {
-      linkManager()
-        .withoutSync()
-        .navigate(current.data.luigiRoute);
-      return;
-    }
-    if (current.data.fromVirtualTreeRoot) {
-      console.debug('Calling fromVirtualTreeRoot for ulr ==> ' + event.url);
-      linkManager()
-        .fromVirtualTreeRoot()
-        .withoutSync()
-        .navigate(event.url);
+
+    if (current.data) {
+      if (current.data.luigiRoute) {
+        let route = current.data.luigiRoute;
+
+        if (current.params) {
+          const pmap: ParamMap = convertToParamMap(current.params);
+          pmap.keys.forEach(key => {
+            const val = pmap.getAll(key).forEach(param => {
+              route = route.replace(':' + key, param);
+            });
+          });
+        }
+        let lm = linkManager();
+        if (current.data.fromContext) {
+          if (!this.luigiContextService.getContext()) {
+            console.debug(
+              'Ignoring auto navigation request, luigi context not set'
+            );
+            return;
+          }
+          if (current.data.fromContext === true) {
+            lm = lm.fromClosestContext();
+          } else {
+            lm = lm.fromContext(current.data.fromContext);
+          }
+        }
+
+        lm.withoutSync().navigate(route);
+        return;
+      }
+      if (current.data.fromVirtualTreeRoot) {
+        console.debug('Calling fromVirtualTreeRoot for ulr ==> ' + event.url);
+        linkManager()
+          .fromVirtualTreeRoot()
+          .withoutSync()
+          .navigate(event.url);
+      }
     }
   }
 

client-frameworks-support/client-support-angular/projects/client-support-angular/src/lib/service/luigi-context-service.ts

@@ -9,9 +9,14 @@ export abstract class LuigiContextService {
   abstract contextObservable(): Observable<IContextMessage>;
 
   /**
-   * Get latest context object
+   * Get latest set context object (can be null/undefined, if not set yet)
    */
   abstract getContext(): Context;
+
+  /**
+   * Get a promise that resolves when context is set.
+   */
+  abstract getContextAsync(): Promise<Context>;
 }
 
 export enum ILuigiContextTypes {

client-frameworks-support/client-support-angular/projects/client-support-angular/src/lib/service/luigi-context.service.impl.ts

@@ -1,5 +1,6 @@
 import { Injectable } from '@angular/core';
 import { ReplaySubject, Observable } from 'rxjs';
+import { first } from 'rxjs/operators';
 import {
   Context,
   addInitListener,
@@ -40,6 +41,23 @@ export class LuigiContextServiceImpl implements LuigiContextService {
     return this.currentContext && this.currentContext.context;
   }
 
+  /**
+   * Get a promise that resolves when context is set.
+   */
+  public getContextAsync(): Promise<Context> {
+    return new Promise<Context>((resolve, reject) => {
+      if (this.getContext()) {
+        resolve(this.getContext());
+      } else {
+        this.contextObservable()
+          .pipe(first())
+          .subscribe(ctx => {
+            resolve(ctx.context);
+          });
+      }
+    });
+  }
+
   /**
    * Set current context
    */

client-frameworks-support/client-support-angular/projects/client-support-angular/src/public-api.ts

@@ -5,4 +5,5 @@
 export * from './lib/component/luigi.preload.component';
 export * from './lib/luigi.angular.support.module';
 export * from './lib/service/luigi-context-service';
+export * from './lib/service/luigi-context.service.impl';
 export * from './lib/service/luigi-auto-routing.service';