Improved way to load and show server in sidebar #131

kdb-web/src/app/services/sidebar/sidebar.service.spec.ts

@@ -0,0 +1,16 @@
+import { TestBed } from '@angular/core/testing';
+
+import { SidebarService } from './sidebar.service';
+
+describe('SidebarService', () => {
+  let service: SidebarService;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({});
+    service = TestBed.inject(SidebarService);
+  });
+
+  it('should be created', () => {
+    expect(service).toBeTruthy();
+  });
+});

kdb-web/src/app/services/sidebar/sidebar.service.ts

@@ -0,0 +1,73 @@
+import { Injectable } from "@angular/core";
+import { MenuItem } from "primeng/api";
+import { BehaviorSubject } from "rxjs";
+import { AuthRoles } from "../../models/auth/auth-roles.enum";
+import { AuthService } from "../auth/auth.service";
+import { TranslateService } from "@ngx-translate/core";
+import { ActivatedRoute, NavigationEnd, Router } from "@angular/router";
+import { ThemeService } from "../theme/theme.service";
+
+@Injectable({
+  providedIn: "root"
+})
+export class SidebarService {
+
+  isSidebarOpen: boolean = true;
+  menuItems$: BehaviorSubject<MenuItem[]> = new BehaviorSubject(new Array<MenuItem>());
+  serverName$: BehaviorSubject<string> = new BehaviorSubject("");
+
+  constructor(
+    private themeService: ThemeService,
+    private authService: AuthService,
+    private translateService: TranslateService,
+    private router: Router,
+  ) {
+    this.themeService.isSidebarOpen$.subscribe(value => {
+      this.isSidebarOpen = value;
+      this.setMenu();
+    });
+
+
+    this.serverName$.subscribe(value => {
+      this.setMenu();
+    });
+
+    this.router.events.subscribe(event => {
+      if (!(event instanceof NavigationEnd)) {
+        return;
+      }
+    });
+  }
+
+  setMenu() {
+    this.authService.hasUserPermission(AuthRoles.Admin).then(hasPermission => {
+      let menuItems: MenuItem[] = [
+        { label: this.isSidebarOpen ? this.translateService.instant("sidebar.dashboard") : "", icon: "pi pi-th-large", routerLink: "dashboard" }
+      ];
+
+      const serverMenu = {
+        label: this.isSidebarOpen ? this.serverName$.value : "", icon: "pi pi-server", items: [
+          { label: this.isSidebarOpen ? this.translateService.instant("sidebar.settings") : "", icon: "pi pi-cog", routerLink: "server/settings" },
+          { label: this.isSidebarOpen ? this.translateService.instant("sidebar.members") : "", icon: "pi pi-users", routerLink: "server/members" }
+        ]
+      };
+      if (this.serverName$.value != "") {
+        menuItems.push(serverMenu);
+      } else if (menuItems.find(x => x.icon == "pi pi-server")) {
+        menuItems.splice(menuItems.indexOf(serverMenu), 1);
+      }
+
+      if (hasPermission) {
+        menuItems.push(
+          {
+            label: this.isSidebarOpen ? this.translateService.instant("sidebar.administration") : "", icon: "pi pi-cog", items: [
+              { label: this.isSidebarOpen ? this.translateService.instant("sidebar.config") : "", icon: "pi pi-cog", routerLink: "/admin/settings" },
+              { label: this.isSidebarOpen ? this.translateService.instant("sidebar.auth_user_list") : "", icon: "pi pi-user-edit", routerLink: "/admin/users" }
+            ]
+          }
+        );
+      }
+      this.menuItems$.next(menuItems);
+    });
+  }
+}