Improved server loading by route #216

kdb-web/package.json

@@ -1,6 +1,6 @@
 {
     "name": "kdb-web",
-    "version": "1.0.dev217",
+    "version": "1.0.0",
     "scripts": {
         "ng": "ng",
         "update-version": "ts-node-esm update-version.ts",

kdb-web/src/app/modules/view/server/auto-role/components/auto-roles-rules/auto-roles-rules.component.ts

@@ -84,36 +84,38 @@ export class AutoRolesRulesComponent implements OnInit {
   }
 
   public ngOnInit(): void {
-    this.data.getServerFromRoute(this.route);
-    this.spinner.showSpinner();
-    if (!this.route.snapshot.params["autoRoleId"]) {
-      this.spinner.hideSpinner();
-      this.router.navigate(["../"]);
-      return;
-    }
-    this.autoRoleId = +this.route.snapshot.params["autoRoleId"];
-
-    this.spinner.showSpinner();
-    this.data.query<SingleDiscordQuery>(Queries.guildsQuery, {
-        filter: {
-          id: this.sidebar.server$.value?.discordId
-        }
-      }
-    ).subscribe(data => {
-      this.guild = data.guilds[0];
-      this.emojis = this.guild.emojis
-        .map(x => {
-          return { label: x.name, value: x };
-        });
-      this.roles = this.guild.roles
-        .map(x => {
-          return { label: x.name, value: x };
-        });
-      this.spinner.hideSpinner();
-    });
 
     this.setFilterForm();
-    this.loadNextPage();
+    this.data.getServerFromRoute(this.route).then(server => {
+
+      this.spinner.showSpinner();
+      if (!this.route.snapshot.params["autoRoleId"]) {
+        this.spinner.hideSpinner();
+        this.router.navigate(["../"]);
+        return;
+      }
+      this.autoRoleId = +this.route.snapshot.params["autoRoleId"];
+
+      this.spinner.showSpinner();
+      this.data.query<SingleDiscordQuery>(Queries.guildsQuery, {
+          filter: {
+            id: server.discordId
+          }
+        }
+      ).subscribe(data => {
+        this.guild = data.guilds[0];
+        this.emojis = this.guild.emojis
+          .map(x => {
+            return { label: x.name, value: x };
+          });
+        this.roles = this.guild.roles
+          .map(x => {
+            return { label: x.name, value: x };
+          });
+        this.spinner.hideSpinner();
+      });
+      this.loadNextPage();
+    });
   }
 
   public loadNextPage(): void {

kdb-web/src/app/modules/view/server/auto-role/components/auto-roles/auto-roles.component.ts

@@ -76,26 +76,26 @@ export class AutoRolesComponent implements OnInit {
   }
 
   public ngOnInit(): void {
-    this.data.getServerFromRoute(this.route);
-
-    this.spinner.showSpinner();
-    this.data.query<SingleDiscordQuery>(Queries.guildsQuery, {
-        filter: {
-          id: this.sidebar.server$.value?.discordId
-        }
-      }
-    ).subscribe(data => {
-      this.guild = data.guilds[0];
-      this.channels = this.guild.channels
-        .filter(x => x.type === ChannelType.text)
-        .map(x => {
-          return { label: x.name, value: x };
-        });
-      this.spinner.hideSpinner();
-    });
 
     this.setFilterForm();
-    this.loadNextPage();
+    this.data.getServerFromRoute(this.route).then(server => {
+      this.spinner.showSpinner();
+      this.data.query<SingleDiscordQuery>(Queries.guildsQuery, {
+          filter: {
+            id: server?.discordId
+          }
+        }
+      ).subscribe(data => {
+        this.guild = data.guilds[0];
+        this.channels = this.guild.channels
+          .filter(x => x.type === ChannelType.text)
+          .map(x => {
+            return { label: x.name, value: x };
+          });
+        this.spinner.hideSpinner();
+      });
+      this.loadNextPage();
+    });
   }
 
   public loadNextPage(): void {

kdb-web/src/app/modules/view/server/members/members.component.ts

@@ -14,7 +14,6 @@ import { LevelListQuery, UserListQuery } from "../../../../models/graphql/query.
 import { DataService } from "../../../../services/data/data.service";
 import { Page } from "../../../../models/graphql/filter/page.model";
 import { Sort, SortDirection } from "../../../../models/graphql/filter/sort.model";
-import { SidebarService } from "../../../../services/sidebar/sidebar.service";
 import { Mutations } from "../../../../models/graphql/mutations.model";
 import { throwError } from "rxjs";
 import { UpdateUserMutationResult } from "../../../../models/graphql/result.model";
@@ -88,32 +87,31 @@ export class MembersComponent implements OnInit {
     private fb: FormBuilder,
     private translate: TranslateService,
     private data: DataService,
-    private sidebar: SidebarService,
     private route: ActivatedRoute
   ) {
   }
 
   ngOnInit(): void {
-    this.data.getServerFromRoute(this.route);
-
-    this.spinner.showSpinner();
-    this.data.query<LevelListQuery>(Queries.levelQuery, {
-        filter: {
-          server: { id: this.sidebar.server$.value?.id }
-        }
-      }
-    ).subscribe(data => {
-      this.levels = data.levels.map(level => {
-        return { label: level.name, value: level };
-      });
-      this.spinner.hideSpinner();
-    });
-
     this.setFilterForm();
-    this.loadNextPage();
+
+    this.data.getServerFromRoute(this.route).then(server => {
+      this.spinner.showSpinner();
+      this.data.query<LevelListQuery>(Queries.levelQuery, {
+          filter: {
+            server: { id: server.id }
+          }
+        }
+      ).subscribe(data => {
+        this.levels = data.levels.map(level => {
+          return { label: level.name, value: level };
+        });
+      });
+      this.loadNextPage();
+    });
   }
 
   loadNextPage() {
+    this.spinner.showSpinner();
     this.loading = true;
     this.data.query<UserListQuery>(Queries.usersQuery, {
         filter: this.filter, page: this.page, sort: this.sort

kdb-web/src/app/modules/view/server/profile/profile.component.ts

@@ -7,7 +7,6 @@ import { DataService } from "../../../../services/data/data.service";
 import { User } from "../../../../models/data/user.model";
 import { UserDTO } from "../../../../models/auth/auth-user.dto";
 import { AuthService } from "src/app/services/auth/auth.service";
-import { SidebarService } from "../../../../services/sidebar/sidebar.service";
 import { ToastService } from "src/app/services/toast/toast.service";
 import { TranslateService } from "@ngx-translate/core";
 
@@ -18,13 +17,12 @@ import { TranslateService } from "@ngx-translate/core";
 })
 export class ProfileComponent implements OnInit {
 
-  user!: User;
+  user: User = { createdAt: "", modifiedAt: "" };
 
   constructor(
     private route: ActivatedRoute,
     private router: Router,
     private spinner: SpinnerService,
-    private sidebar: SidebarService,
     private data: DataService,
     private auth: AuthService,
     private toast: ToastService,
@@ -32,35 +30,37 @@ export class ProfileComponent implements OnInit {
   ) {
   }
 
-  async ngOnInit() {
+  ngOnInit() {
-    this.data.getServerFromRoute(this.route);
+    this.data.getServerFromRoute(this.route).then(async (server) => {
-
+      if (!this.route.snapshot.params["memberId"] || this.route.snapshot.params["memberId"] == "undefined") {
-    if (!this.route.snapshot.params["memberId"]) {
+        this.router.navigate([`/server/${server.id}`]);
-      this.router.navigate(["/dashboard"]);
+        return;
-      return;
-    }
-
-    let authUser = await this.auth.getLoggedInUser();
-    this.spinner.showSpinner();
-    let user: UserDTO | null = authUser?.users?.find(u => u.server == this.sidebar.server$.value?.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", this.sidebar.server$.value?.id]);
-      return;
-    }
-
-    this.data.query<User>(Queries.singleUserQuery, {
-        filter: {
-          id: this.route.snapshot.params["memberId"]
-        }
-      },
-      function(data: UserListQuery) {
-        return data.users.length > 0 ? data.users[0] : null;
       }
-    ).subscribe(user => {
+
-      this.user = user;
+      let authUser = await this.auth.getLoggedInUser();
-      this.spinner.hideSpinner();
+      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;
+      }
+
+      this.data.query<User>(Queries.singleUserQuery, {
+          filter: {
+            id: this.route.snapshot.params["memberId"]
+          }
+        },
+        function(data: UserListQuery) {
+          return data.users.length > 0 ? data.users[0] : null;
+        }
+      ).subscribe(user => {
+        this.user = user;
+        this.spinner.hideSpinner();
+      });
     });
+
+
   }
 }

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

@@ -25,7 +25,9 @@ export class ServerDashboardComponent implements OnInit {
   }
 
   ngOnInit(): void {
-    this.data.getServerFromRoute(this.route);
+    this.data.getServerFromRoute(this.route).then(server => {
+      this.server = server;
+    });
 
     this.sidebar.server$.subscribe(server => {
       if (!server) {

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

@@ -25,24 +25,28 @@ export class DataService {
   ) {
   }
 
-  public getServerFromRoute(route: ActivatedRoute) {
+  public getServerFromRoute(route: ActivatedRoute): Promise<Server> {
-    this.spinner.showSpinner();
+    return new Promise((resolve, reject) => {
-    if (!route.snapshot.params["serverId"]) {
+      this.spinner.showSpinner();
-      this.spinner.hideSpinner();
+      if (!route.snapshot.params["serverId"]) {
-      this.router.navigate(["/dashboard"]);
+        this.spinner.hideSpinner();
-      return;
+        this.router.navigate(["/dashboard"]);
-    }
+        reject();
-
-    this.query<Server>(Queries.serversQuery, {
-        filter: { id: route.snapshot.params["serverId"] }
-      },
-      function(data: Query) {
-        return data.servers.length > 0 ? data.servers[0] : null;
       }
-    ).subscribe(server => {
+
-      this.sidebar.setServer(server);
+      this.query<Server>(Queries.serversQuery, {
-      this.spinner.hideSpinner();
+          filter: { id: route.snapshot.params["serverId"] }
+        },
+        function(data: Query) {
+          return data.servers.length > 0 ? data.servers[0] : null;
+        }
+      ).subscribe(server => {
+        this.sidebar.setServer(server);
+        this.spinner.hideSpinner();
+        resolve(server);
+      });
     });
+
   }
 
   public query<T>(query: string, variables?: Variables, f?: Function): Observable<T> {
@@ -53,7 +57,7 @@ export class DataService {
       })
       .pipe(map(d => {
         if (d.errors && d.errors.length > 0) {
-          throw new Error(d.errors.map((x: {message: String}) => x.message).toString());
+          throw new Error(d.errors.map((x: { message: String }) => x.message).toString());
         }
         return d.data;
       }))

kdb-web/src/assets/config.json

@@ -3,7 +3,7 @@
     "WebVersion": {
         "Major": "1",
         "Minor": "0",
-        "Micro": "dev217"
+        "Micro": "0"
     },
     "Themes": [
         {
@@ -23,4 +23,4 @@
             "Name": "sh-edraft-dark-theme"
         }
     ]
-}
+}