sh-edraft.de/sh_discord_bot
4
1
Fork 1
Code Issues 21 Pull Requests Actions Packages Projects 3 Releases 27 Wiki Activity

Update menu when server is selected #72

Browse Source
This commit is contained in:
Sven Heidemann 2022-10-18 16:23:40 +02:00
parent 1055d5c2e1
commit 7760ee5725
6 changed files with 100 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

64
kdb-web/src/app/components/sidebar/sidebar.component.ts
View File

@ -1,8 +1,10 @@
import { Component, Input, OnChanges, OnInit, SimpleChanges } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { LangChangeEvent, TranslateService } from '@ngx-translate/core';
import { MenuItem } from 'primeng/api';
import { AuthRoles } from 'src/app/models/auth/auth-roles.enum';
import { AuthService } from 'src/app/services/auth/auth.service';
import { ServerService } from 'src/app/services/data/server.service';
import { ThemeService } from 'src/app/services/theme/theme.service';
@Component({
@ -13,13 +15,16 @@ import { ThemeService } from 'src/app/services/theme/theme.service';
export class SidebarComponent implements OnInit {
isSidebarOpen: boolean = true;
menuItems!: MenuItem[];
private serverId!: number;
constructor(
private authService: AuthService,
private translateService: TranslateService,
private themeService: ThemeService
private themeService: ThemeService,
private route: ActivatedRoute,
private serverService: ServerService
) {
this.themeService.isSidebarOpen$.subscribe(value => {
this.isSidebarOpen = value;
@ -29,6 +34,15 @@ export class SidebarComponent implements OnInit {
this.translateService.onLangChange.subscribe((event: LangChangeEvent) => {
this.setMenu();
});
this.serverService.server$.subscribe(server => {
if (!server) {
return;
}
this.serverId = server.serverId;
this.setMenu();
});
}
ngOnInit(): void {
@ -39,30 +53,40 @@ export class SidebarComponent implements OnInit {
this.authService.hasUserPermission(AuthRoles.Admin).then(hasPermission => {
this.menuItems = [];
this.menuItems = [
{ label: this.isSidebarOpen ? this.translateService.instant('sidebar.dashboard') : '', icon: 'pi pi-th-large', routerLink: 'dashboard' },
{
label: this.isSidebarOpen ? this.translateService.instant('sidebar.server') : '', icon: 'pi pi-server', items: [
{ label: this.isSidebarOpen ? this.translateService.instant('sidebar.settings') : '', icon: 'pi pi-cog', routerLink: 'server/id/settings' },
{ label: this.isSidebarOpen ? this.translateService.instant('sidebar.members') : '', icon: 'pi pi-user-edit', routerLink: 'server/id/members' },
]
},
{ label: this.isSidebarOpen ? this.translateService.instant('sidebar.dashboard') : '', icon: 'pi pi-th-large', routerLink: 'dashboard' }
];
if (!hasPermission) {
return;
if (this.serverId) {
this.addServerMenu();
}
this.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' },
]
},
);
if (hasPermission) {
this.addAdminMenu();
}
this.menuItems = this.menuItems.slice();
});
}
addServerMenu() {
this.menuItems.push(
{
label: this.isSidebarOpen ? this.translateService.instant('sidebar.server') : '', 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' },
]
}
);
}
addAdminMenu() {
this.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' },
]
},
);
}
}

7
kdb-web/src/app/modules/view/dashboard/components/dashboard/dashboard.component.ts
View File

@ -8,6 +8,7 @@ import { ServerDTO } from 'src/app/models/discord/server.dto';
import { ServerSelectCriterion } from 'src/app/models/selection/server/server-select-criterion.dto';
import { ConfirmationDialogService } from 'src/app/services/confirmation-dialog/confirmation-dialog.service';
import { DataService } from 'src/app/services/data/data.service';
import { ServerService } from 'src/app/services/data/server.service';
import { SpinnerService } from 'src/app/services/spinner/spinner.service';
import { ToastService } from 'src/app/services/toast/toast.service';
@ -41,7 +42,8 @@ export class DashboardComponent implements OnInit {
private confirmDialog: ConfirmationDialogService,
private fb: FormBuilder,
private translate: TranslateService,
private router: Router
private router: Router,
private serverService: ServerService
) { }
ngOnInit(): void {
@ -106,7 +108,8 @@ export class DashboardComponent implements OnInit {
}
selectServer(server: ServerDTO) {
this.router.navigate(['/server', server.serverId]);
this.serverService.server$.next(server);
this.router.navigate(['/server']);
}
}

29
kdb-web/src/app/modules/view/server/server-dashboard/server-dashboard.component.ts
View File

@ -1,8 +1,8 @@
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
import { catchError, throwError } from 'rxjs';
import { ServerDTO } from 'src/app/models/discord/server.dto';
import { DataService } from 'src/app/services/data/data.service';
import { ServerService } from 'src/app/services/data/server.service';
import { SpinnerService } from 'src/app/services/spinner/spinner.service';
@Component({
@ -19,27 +19,20 @@ export class ServerDashboardComponent implements OnInit {
private route: ActivatedRoute,
private router: Router,
private data: DataService,
private spinner: SpinnerService
private spinner: SpinnerService,
private serverService: ServerService
) { }
ngOnInit(): void {
this.route.params.subscribe(params => {
this.id = +params['id'];
this.spinner.showSpinner();
if (!this.serverService.server$.value) {
this.spinner.hideSpinner();
this.router.navigate(['/dashboard']);
return;
}
if (!this.id) {
this.router.navigate(['/dashboard']);
return;
}
this.spinner.showSpinner();
this.data.getServerByID(this.id).pipe(catchError(err => {
this.spinner.hideSpinner();
return throwError(() => err);
})).subscribe(server => {
this.server = server;
this.spinner.hideSpinner();
});
});
this.server = this.serverService.server$.value;
this.spinner.hideSpinner();
}
}

3
kdb-web/src/app/modules/view/server/server-routing.module.ts
View File

@ -3,8 +3,7 @@ import { RouterModule, Routes } from '@angular/router';
import { ServerDashboardComponent } from './server-dashboard/server-dashboard.component';
const routes: Routes = [
{ path: '', component: ServerDashboardComponent },
{ path: ':id', component: ServerDashboardComponent }
{ path: '', component: ServerDashboardComponent }
];
@NgModule({

16
kdb-web/src/app/services/data/server.service.spec.ts Normal file
View File

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

23
kdb-web/src/app/services/data/server.service.ts Normal file
View File

@ -0,0 +1,23 @@
import { Injectable } from '@angular/core';
import { BehaviorSubject, Subject } from 'rxjs';
import { ServerDTO } from 'src/app/models/discord/server.dto';
@Injectable({
providedIn: 'root'
})
export class ServerService {
private server!: ServerDTO;
server$ = new BehaviorSubject<ServerDTO | null>(null);
constructor() {
this.server$.subscribe(server => {
if (!server) {
return;
}
this.server = server;
});
}
}