feat: use token roles

Author: autowp

src/app/account/account.component.ts

@@ -37,10 +37,10 @@ export class AccountComponent {
   readonly #forumsClient = inject(ForumsClient);
 
   protected readonly items$: Observable<SidebarItem[]> = combineLatest([
-    this.#auth.getUser$(),
-    this.#auth.getUser$().pipe(
-      switchMap((user) => {
-        if (!user) {
+    this.#auth.user$,
+    this.#auth.authenticated$.pipe(
+      switchMap((authenticated) => {
+        if (!authenticated) {
           return of(null);
         }
         return this.#forumsClient.getUserSummary(new Empty());

src/app/account/contacts/contacts.component.ts

@@ -10,7 +10,7 @@ import {LanguageService} from '@services/language';
 import {PageEnvService} from '@services/page-env.service';
 import {TimeAgoPipe} from '@utils/time-ago.pipe';
 import Keycloak from 'keycloak-js';
-import {BehaviorSubject, EMPTY, Observable} from 'rxjs';
+import {BehaviorSubject, EMPTY, Observable, of} from 'rxjs';
 import {catchError, map, switchMap} from 'rxjs/operators';
 
 import {ToastsService} from '../../toasts/toasts.service';
@@ -32,16 +32,16 @@ export class AccountContactsComponent implements OnInit {
 
   readonly #reload$ = new BehaviorSubject<void>(void 0);
 
-  protected readonly items$: Observable<Contact[]> = this.#auth.getUser$().pipe(
-    map((user) => {
-      if (!user) {
+  protected readonly items$: Observable<Contact[]> = this.#auth.authenticated$.pipe(
+    switchMap((authenticated) => {
+      if (!authenticated) {
         this.#keycloak.login({
           locale: this.#languageService.language,
           redirectUri: window.location.href,
         });
         return EMPTY;
       }
-      return user;
+      return of(authenticated);
     }),
     switchMap(() => this.#reload$),
     switchMap(() => this.#contactsService.getContacts$()),

src/app/account/delete/delete.component.ts

@@ -36,8 +36,7 @@ export class AccountDeleteComponent implements OnInit {
   }
 
   protected submit() {
-    this.#auth
-      .getUser$()
+    this.#auth.user$
       .pipe(
         switchMap((user) =>
           user
@@ -59,7 +58,7 @@ export class AccountDeleteComponent implements OnInit {
           }
         },
         next: () => {
-          this.#auth.signOut$();
+          this.#auth.signOut$().subscribe();
           this.#router.navigate(['/account/delete/deleted']);
         },
       });

src/app/account/inbox-pictures/inbox-pictures.component.ts

@@ -32,7 +32,7 @@ export class AccountInboxPicturesComponent implements OnInit {
       distinctUntilChanged(),
       debounceTime(10),
     ),
-    this.#auth.getUser$(),
+    this.#auth.user$,
   ]).pipe(
     switchMap(([page, user]) =>
       user

src/app/account/profile/profile.component.ts

@@ -63,8 +63,7 @@ export class AccountProfileComponent implements OnDestroy, OnInit {
   ngOnInit(): void {
     setTimeout(() => this.#pageEnv.set({pageId: 129}), 0);
 
-    this.#sub = this.#auth
-      .getUser$()
+    this.#sub = this.#auth.user$
       .pipe(
         switchMap((user) => {
           if (!user) {

src/app/account/specs-conflicts/specs-conflicts.component.html

@@ -3,7 +3,7 @@ <h1 i18n id="header">Conflicts</h1>
 </div>
 
 @if (user$ | async; as user) {
-  @if (user.specsWeight !== null) {
+  @if (user.specsWeight !== 0) {
     <p class="float-end"><ng-container i18n>Weight</ng-container>: {{ user.specsWeight.toFixed(2) }}</p>
   }
 } @else {

src/app/account/specs-conflicts/specs-conflicts.component.ts

@@ -81,7 +81,7 @@ export class AccountSpecsConflictsComponent implements OnInit {
     map((filter) => mapFilter(filter)),
   );
 
-  protected readonly user$: Observable<APIUser | null> = this.auth.getUser$();
+  protected readonly user$: Observable<APIUser | null> = this.auth.user$;
 
   readonly #itemsCache = new Map<string, Observable<APIItem>>();
 

src/app/api/comments/comments.service.ts

@@ -1,34 +1,32 @@
 import {inject, Injectable} from '@angular/core';
 import {GetMessagesRequest, ModeratorAttention} from '@grpc/spec.pb';
 import {CommentsClient} from '@grpc/spec.pbsc';
-import {ACLService, Privilege, Resource} from '@services/acl.service';
+import {AuthService, Role} from '@services/auth.service';
 import {Observable, of} from 'rxjs';
 import {map, shareReplay, switchMap} from 'rxjs/operators';
 
 @Injectable({
   providedIn: 'root',
 })
 export class APICommentsService {
-  readonly #acl = inject(ACLService);
+  readonly #auth = inject(AuthService);
   readonly #commentsClient = inject(CommentsClient);
 
-  public readonly attentionCommentsCount$: Observable<null | number> = this.#acl
-    .isAllowed$(Resource.GLOBAL, Privilege.MODERATE)
-    .pipe(
-      switchMap((isModer) => {
-        if (!isModer) {
-          return of(null);
-        }
+  public readonly attentionCommentsCount$: Observable<null | number> = this.#auth.hasRole$(Role.MODER).pipe(
+    switchMap((isModer) => {
+      if (!isModer) {
+        return of(null);
+      }
 
-        return this.#commentsClient
-          .getMessages(
-            new GetMessagesRequest({
-              limit: 0,
-              moderatorAttention: ModeratorAttention.REQUIRED,
-            }),
-          )
-          .pipe(map((response) => (response.paginator ? response.paginator.totalItemCount : null)));
-      }),
-      shareReplay({bufferSize: 1, refCount: false}),
-    );
+      return this.#commentsClient
+        .getMessages(
+          new GetMessagesRequest({
+            limit: 0,
+            moderatorAttention: ModeratorAttention.REQUIRED,
+          }),
+        )
+        .pipe(map((response) => (response.paginator ? response.paginator.totalItemCount : null)));
+    }),
+    shareReplay({bufferSize: 1, refCount: false}),
+  );
 }

src/app/api/picture-moder-vote-template/picture-moder-vote-template.service.ts

@@ -21,7 +21,7 @@ export class APIPictureModerVoteTemplateService {
   readonly #change$ = new BehaviorSubject<void>(void 0);
 
   public getTemplates$(): Observable<ModerVoteTemplate[]> {
-    return combineLatest([this.#change$, this.#auth.getUser$()]).pipe(
+    return combineLatest([this.#change$, this.#auth.authenticated$]).pipe(
       switchMap(() => this.#pictures.getModerVoteTemplates(new Empty({}))),
       map((response) => (response.items ? response.items : [])),
       shareReplay({bufferSize: 1, refCount: false}),

src/app/app.component.html

@@ -77,7 +77,7 @@
           </form>
         }
         <ul class="nav navbar-nav navbar-right">
-          @if (user$ | async) {
+          @if (authenticated$ | async) {
             <li class="nav-item">
               <a class="nav-link" routerLink="/account/messages" routerLinkActive="active">
                 <i class="bi bi-chat-fill" aria-hidden="true"></i>
@@ -120,7 +120,7 @@
                 <i class="bi bi-people-fill" aria-hidden="true"></i>
                 <ng-container i18n>Who is online?</ng-container>
               </a>
-              @if (user$ | async) {
+              @if (authenticated$ | async) {
                 <a routerLink="/account/contacts" class="dropdown-item" routerLinkActive="active">
                   <i class="bi bi-people-fill" aria-hidden="true"></i>
                   <ng-container i18n>Contacts</ng-container>
@@ -134,7 +134,7 @@
                 <i class="bi bi-info" aria-hidden="true"></i>
                 <ng-container i18n>About us</ng-container>
               </a>
-              @if (user$ | async) {
+              @if (authenticated$ | async) {
                 <a href="#" (click)="signOut()" class="dropdown-item">
                   <i class="bi bi-box-arrow-right" aria-hidden="true"></i>
                   <ng-container i18n>Sign out</ng-container>