diff --git a/kdb-web/src/app/modules/view/server/profile/profile.component.ts b/kdb-web/src/app/modules/view/server/profile/profile.component.ts index 6e3e81a1..77531f2d 100644 --- a/kdb-web/src/app/modules/view/server/profile/profile.component.ts +++ b/kdb-web/src/app/modules/view/server/profile/profile.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit } from "@angular/core"; +import { Component, OnDestroy, OnInit } from "@angular/core"; import { ActivatedRoute, Router } from "@angular/router"; import { Queries } from "../../../../models/graphql/queries.model"; import { UserListQuery } from "../../../../models/graphql/query.model"; @@ -10,17 +10,21 @@ import { AuthService } from "src/app/services/auth/auth.service"; import { ToastService } from "src/app/services/toast/toast.service"; import { TranslateService } from "@ngx-translate/core"; import { Server } from "../../../../models/data/server.model"; +import { Subject } from "rxjs"; +import { takeUntil } from "rxjs/operators"; @Component({ selector: "app-profile", templateUrl: "./profile.component.html", styleUrls: ["./profile.component.scss"] }) -export class ProfileComponent implements OnInit { +export class ProfileComponent implements OnInit, OnDestroy { user: User = { createdAt: "", modifiedAt: "" }; private server: Server = {}; + private unsubscriber = new Subject(); + constructor( private route: ActivatedRoute, private router: Router, @@ -32,42 +36,47 @@ export class ProfileComponent implements OnInit { ) { } - ngOnInit() { - this.data.getServerFromRoute(this.route).then(async (server) => { - if (!this.route.snapshot.params["memberId"] || this.route.snapshot.params["memberId"] == "undefined") { - this.router.navigate([`/server/${server.id}`]); - return; - } - this.server = server; + public ngOnInit(): void { + this.route.params.pipe(takeUntil(this.unsubscriber)).subscribe(params => { + this.data.getServerFromRoute(this.route).then(async (server) => { + if (!params["memberId"] || params["memberId"] == "undefined") { + await this.router.navigate([`/server/${server.id}`]); + return; + } + this.server = server; - let authUser = await this.auth.getLoggedInUser(); - this.spinner.showSpinner(); - let user: UserDTO | null = authUser?.users?.find(u => u.server == server.id) ?? null; - if (!user || user?.id != this.route.snapshot.params["memberId"] && !user?.isModerator) { - this.toast.error(this.translate.instant("view.server.profile.permission_denied"), this.translate.instant("view.server.profile.permission_denied_d")); - this.spinner.hideSpinner(); - this.router.navigate(["/server", server.id]); - return; - } + let authUser = await this.auth.getLoggedInUser(); + this.spinner.showSpinner(); + let user: UserDTO | null = authUser?.users?.find(u => u.server == server.id) ?? null; + if (!user || user?.id != params["memberId"] && !user?.isModerator) { + this.toast.error(this.translate.instant("view.server.profile.permission_denied"), this.translate.instant("view.server.profile.permission_denied_d")); + this.spinner.hideSpinner(); + await this.router.navigate(["/server", server.id]); + return; + } - this.data.query(Queries.usersQuery, { - serverId: this.server.id, - filter: { - id: this.route.snapshot.params["memberId"] + this.data.query(Queries.usersQuery, { + serverId: this.server.id, + filter: { + id: params["memberId"] + } + }, + (x: { servers: Server[] }) => { + return x.servers[0]; } - }, - (x: { servers: Server[] }) => { - return x.servers[0]; - } - ).subscribe(users => { - if (!users.users[0]) { - this.router.navigate([`/server/${server.id}`]); - } - this.user = users.users[0]; - this.spinner.hideSpinner(); + ).subscribe(users => { + if (!users.users[0]) { + this.router.navigate([`/server/${server.id}`]); + } + this.user = users.users[0]; + this.spinner.hideSpinner(); + }); }); }); + } - + public ngOnDestroy(): void { + this.unsubscriber.next(); + this.unsubscriber.complete(); } }