feat(admin-ui): Expose providers to nav menu routerLink function

vendure-ecommerce · Sep 12, 2023 · 1bae40e · 1bae40e
1 parent fa683e7
commit 1bae40e
Show file tree

Hide file tree

Showing 4 changed files with 36 additions and 8 deletions.
diff --git a/packages/admin-ui/src/lib/core/src/components/base-nav/base-nav.component.ts b/packages/admin-ui/src/lib/core/src/components/base-nav/base-nav.component.ts
@@ -1,4 +1,4 @@
-import { Component, Directive, OnDestroy, OnInit } from '@angular/core';
+import { Directive, Injector, OnDestroy, OnInit } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker';
 import { Subscription } from 'rxjs';
@@ -8,8 +8,9 @@ import { Permission } from '../../common/generated-types';
 import { DataService } from '../../data/providers/data.service';
 import { HealthCheckService } from '../../providers/health-check/health-check.service';
 import { JobQueueService } from '../../providers/job-queue/job-queue.service';
-import { NavMenuBadge, NavMenuItem } from '../../providers/nav-builder/nav-builder-types';
+import { ActionBarContext, NavMenuBadge, NavMenuItem } from '../../providers/nav-builder/nav-builder-types';
 import { NavBuilderService } from '../../providers/nav-builder/nav-builder.service';
+import { NotificationService } from '../../providers/notification/notification.service';
 
 @Directive({
     selector: '[vdrBaseNav]',
@@ -23,6 +24,8 @@ export class BaseNavComponent implements OnInit, OnDestroy {
         protected healthCheckService: HealthCheckService,
         protected jobQueueService: JobQueueService,
         protected dataService: DataService,
+        protected notificationService: NotificationService,
+        protected injector: Injector,
     ) {}
 
     private userPermissions: string[];
@@ -60,7 +63,10 @@ export class BaseNavComponent implements OnInit, OnDestroy {
     }
 
     getRouterLink(item: NavMenuItem) {
-        return this.navBuilderService.getRouterLink(item, this.route);
+        return this.navBuilderService.getRouterLink(
+            { routerLink: item.routerLink, context: this.createContext() },
+            this.route,
+        );
     }
 
     private defineNavMenu() {
@@ -306,4 +312,13 @@ export class BaseNavComponent implements OnInit, OnDestroy {
             },
         ]);
     }
+
+    private createContext(): ActionBarContext {
+        return {
+            route: this.route,
+            injector: this.injector,
+            dataService: this.dataService,
+            notificationService: this.notificationService,
+        };
+    }
 }
diff --git a/packages/admin-ui/src/lib/core/src/providers/nav-builder/nav-builder-types.ts b/packages/admin-ui/src/lib/core/src/providers/nav-builder/nav-builder-types.ts
@@ -71,7 +71,7 @@ export interface NavMenuSection {
 
 /**
  * @description
- * Utilities available to the onClick handler of an ActionBarItem.
+ * Providers available to the onClick handler of an {@link ActionBarItem} or {@link NavMenuItem}.
  *
  * @docsCategory action-bar
  */
@@ -119,4 +119,10 @@ export interface ActionBarItem {
     requiresPermission?: string | string[];
 }
 
-export type RouterLinkDefinition = ((route: ActivatedRoute) => any[]) | any[];
+/**
+ * @description
+ * A function which returns the router link for an {@link ActionBarItem} or {@link NavMenuItem}.
+ *
+ * @docsCategory action-bar
+ */
+export type RouterLinkDefinition = ((route: ActivatedRoute, context: ActionBarContext) => any[]) | any[];
diff --git a/packages/admin-ui/src/lib/core/src/providers/nav-builder/nav-builder.service.ts b/packages/admin-ui/src/lib/core/src/providers/nav-builder/nav-builder.service.ts
@@ -7,6 +7,7 @@ import { map, shareReplay } from 'rxjs/operators';
 import { Permission } from '../../common/generated-types';
 
 import {
+    ActionBarContext,
     ActionBarItem,
     NavMenuBadgeType,
     NavMenuItem,
@@ -85,9 +86,12 @@ export class NavBuilderService {
         }
     }
 
-    getRouterLink(config: { routerLink?: RouterLinkDefinition }, route: ActivatedRoute): string[] | null {
+    getRouterLink(
+        config: { routerLink?: RouterLinkDefinition; context: ActionBarContext },
+        route: ActivatedRoute,
+    ): string[] | null {
         if (typeof config.routerLink === 'function') {
-            return config.routerLink(route);
+            return config.routerLink(route, config.context);
         }
         if (Array.isArray(config.routerLink)) {
             return config.routerLink;

diff --git a/...dmin-ui/src/lib/core/src/shared/components/action-bar-items/action-bar-items.component.ts b/...dmin-ui/src/lib/core/src/shared/components/action-bar-items/action-bar-items.component.ts
@@ -78,7 +78,10 @@ export class ActionBarItemsComponent implements OnInit, OnChanges {
     }
 
     getRouterLink(item: ActionBarItem): any[] | null {
-        return this.navBuilderService.getRouterLink(item, this.route);
+        return this.navBuilderService.getRouterLink(
+            { routerLink: item.routerLink, context: this.createContext() },
+            this.route,
+        );
     }
 
     getButtonStyles(item: ActionBarItem): string[] {