simple role management

src/app/services/user/role.directive.spec.ts

@@ -0,0 +1,8 @@
+import {RoleDirective} from './role.directive';
+
+describe('RoleDirective', () => {
+  it('should create an instance', () => {
+    const directive = new RoleDirective();
+    expect(directive).toBeTruthy();
+  });
+});

src/app/services/user/role.directive.ts

@@ -0,0 +1,55 @@
+import {Directive, ElementRef, Input, OnInit, TemplateRef, ViewContainerRef} from '@angular/core';
+import {roles} from './roles';
+import {UserService} from './user.service';
+import {User} from './user';
+
+@Directive({
+  selector: '[appRole]'
+})
+export class RoleDirective implements OnInit {
+  @Input() appRole: roles[] = [];
+  private currentUser: User;
+  private loggedIn: boolean;
+
+  constructor(
+    private element: ElementRef,
+    private templateRef: TemplateRef<any>,
+    private viewContainer: ViewContainerRef,
+    private userService: UserService
+  ) {
+
+  }
+
+  public ngOnInit(): void {
+    this.userService.user$.subscribe(user => {
+      this.currentUser = user;
+      this.updateView();
+    });
+    this.userService.loggedIn$().subscribe(_ => {
+      this.loggedIn = !!_;
+      this.updateView();
+    });
+    this.updateView();
+  }
+
+  private updateView() {
+    if (this.loggedIn && this.checkPermission()) {
+      this.viewContainer.createEmbeddedView(this.templateRef);
+    } else {
+      this.viewContainer.clear();
+    }
+  }
+
+  private checkPermission() {
+    if (this.currentUser && this.currentUser.role) {
+      if (this.currentUser.role === 'admin') return true;
+      for (const role of this.appRole) {
+        if (this.currentUser.role === role) return true;
+      }
+    }
+
+    return false;
+  }
+
+
+}

src/app/services/user/role.module.ts

@@ -0,0 +1,13 @@
+import {NgModule} from '@angular/core';
+import {CommonModule} from '@angular/common';
+import {RoleDirective} from './role.directive';
+
+@NgModule({
+  declarations: [RoleDirective],
+  exports: [RoleDirective],
+  imports: [
+    CommonModule
+  ]
+})
+export class RoleModule {
+}

src/app/services/user/roles.ts

@@ -0,0 +1,2 @@
+export type roles = 'none' | 'admin' | 'user' | 'leader' | 'presenter';
+export const ROLE_TYPES: roles[] = ['none', 'admin', 'user', 'leader', 'presenter'];

src/app/services/user/user.service.ts

@@ -3,7 +3,7 @@ import {AngularFireAuth} from '@angular/fire/auth';
 import {BehaviorSubject, Observable} from 'rxjs';
 import {filter, switchMap} from 'rxjs/operators';
 import {User} from './user';
-import {DbService} from './db.service';
+import {DbService} from '../db.service';
 
 @Injectable({
   providedIn: 'root'
@@ -22,6 +22,10 @@ export class UserService {
     return this._user$.pipe(filter(_ => !!_));
   }
 
+  public loggedIn$ = () => this.afAuth.authState;
+
+  public list$ = (): Observable<User[]> => this.db.col$('users');
+
   public getUserbyId$(userId: string): Observable<User> {
     return this.db.doc$<User>('users/' + userId);
   }

src/app/services/user/user.ts

@@ -1,4 +1,4 @@
-import {ChordMode} from '../widget-modules/components/song-text/song-text.component';
+import {ChordMode} from '../../widget-modules/components/song-text/song-text.component';
 
 export interface User {
   id: string;