created injection token for others group, model updated, created "groupedTree" getter to routes.service

npm/ng-packs/packages/core/src/lib/models/common.ts

@@ -2,6 +2,7 @@ import { EventEmitter, Type } from '@angular/core';
 import { Routes } from '@angular/router';
 import { Subject } from 'rxjs';
 import { eLayoutType } from '../enums/common';
+import { TreeNode } from '../utils';
 import { Environment } from './environment';
 
 export namespace ABP {
@@ -78,6 +79,11 @@ export namespace ABP {
     group?: Group<any>;
   }
 
+  export interface RouteGroup<TKey = string> {
+    group: Group<TKey>;
+    items: TreeNode<Route>[];
+  }
+
   export interface Tab extends Nav {
     component: Type<any>;
   }

npm/ng-packs/packages/core/src/lib/services/routes.service.ts

@@ -1,13 +1,14 @@
-import { Injectable, Injector, OnDestroy } from '@angular/core';
+import { Injectable, Injector, inject, OnDestroy } from '@angular/core';
 import { BehaviorSubject, Observable, Subscription } from 'rxjs';
 import { ABP } from '../models/common';
+import { OTHERS_GROUP } from '../tokens';
 import { pushValueTo } from '../utils/array-utils';
 import { BaseTreeNode, createTreeFromList, TreeNode } from '../utils/tree-utils';
 import { ConfigStateService } from './config-state.service';
 import { PermissionService } from './permission.service';
 
 // eslint-disable-next-line @typescript-eslint/ban-types
-export abstract class AbstractTreeService<T extends {[key: string | number | symbol]: any}> {
+export abstract class AbstractTreeService<T extends { [key: string | number | symbol]: any }> {
   abstract id: string;
   abstract parentId: string;
   abstract hide: (item: T) => boolean;
@@ -180,4 +181,32 @@ export abstract class AbstractNavTreeService<T extends ABP.Nav>
 }
 
 @Injectable({ providedIn: 'root' })
-export class RoutesService extends AbstractNavTreeService<ABP.Route> {}
+export class RoutesService extends AbstractNavTreeService<ABP.Route> {
+  private readonly othersGroup: ABP.Group<any> = inject(OTHERS_GROUP, {
+    optional: true,
+  });
+
+  get groupedTree(): ABP.RouteGroup[] {
+    const groupTree = this.visible.filter(node => node.group);
+    if (groupTree.length < 1) return;
+
+    const map = new Map<ABP.Group, TreeNode<ABP.Route>[]>(groupTree?.map(node => [node.group, []]));
+    const otherGroup = this.othersGroup || { key: 'others', text: '::Others' };
+    map.set(otherGroup, []);
+
+    for (const node of this.visible) {
+      const { path, children, group } = node;
+
+      if (!group && (children?.length > 0 || path)) {
+        map.get(otherGroup)?.push(node);
+      } else if (group) {
+        map.get(group)?.push(node);
+      }
+    }
+
+    return Array.from(map.entries()).map<ABP.RouteGroup>(([group, nodes]) => ({
+      group,
+      items: nodes,
+    }));
+  }
+}

npm/ng-packs/packages/core/src/lib/tokens/index.ts

@@ -12,3 +12,4 @@ export * from './pipe-to-login.token';
 export * from './set-token-response-to-storage.token';
 export * from './check-authentication-state';
 export * from './http-context.token';
+export * from './others-group.token'

npm/ng-packs/packages/core/src/lib/tokens/others-group.token.ts

@@ -0,0 +1,4 @@
+import { InjectionToken } from '@angular/core';
+import { ABP } from '../models';
+
+export const OTHERS_GROUP = new InjectionToken<ABP.Group>('OTHERS_GROUP');