[Api+Web] Allow student-leads to register new students

Author: jordan-powers

attendance-api/database/seeders/RolesSeeder.php

@@ -69,9 +69,12 @@ public function run()
         Role::create(['name' => 'student-lead'])
             ->givePermissionTo([
                 'list students',
+                'add students',
+                'view student images',
+                'modify students',
+                'modify student images',
                 'list attendance events',
                 'student check in',
-                'view student images',
                 'undo attendance event',
                 'list users',
                 'list roles',

attendance-web/src/app/app-routing.module.ts

@@ -30,7 +30,7 @@ const routes: Routes = [
       {path: 'detail/:studentId', component: ShowStudentComponent},
       { path: 'edit/:studentId', component: UpdateOrCreateStudentComponent,
         canActivate: [MustHavePermissionGuard],
-        data: { permissions: ['modify students', 'modify student images', 'remove students'] }},
+        data: { permissions: ['modify students', 'modify student images'] }},
       {path: 'list', component: ListStudentsComponent},
       {path: 'add', component: UpdateOrCreateStudentComponent,
         canActivate: [MustHavePermissionGuard],

attendance-web/src/app/components/students/show-student/show-student.component.html

@@ -15,7 +15,7 @@ <h1 id="studentNotFound">404: Student not found</h1>
             <mat-icon id="deletedIndicator">delete</mat-icon>
           }
           <h1>{{ student.name }}</h1>
-          @if (canDelete()|async) {
+          @if (mayEditStudent()|async) {
             <div><a mat-raised-button color="primary" [routerLink]="['/', 'students', 'edit', student.id]">Edit</a></div>
           }
         </div>

attendance-web/src/app/components/students/show-student/show-student.component.ts

@@ -171,8 +171,8 @@ export class ShowStudentComponent implements OnInit, OnDestroy {
     return this.student.pipe(map(student => student.deleted_at != null));
   }
 
-  canDelete(): Observable<boolean> {
-    return this.permissionsService.checkPermissions(['modify students', 'modify student images', 'remove students']);
+  mayEditStudent(): Observable<boolean> {
+    return this.permissionsService.checkPermissions(['modify students', 'modify student images']);
   }
 
   getProfileImageSrc(student: Student): string {

attendance-web/src/app/components/students/students.component.ts

@@ -1,6 +1,6 @@
 import { Component } from '@angular/core';
-import { Observable, ReplaySubject, map } from 'rxjs';
-import { AuthService } from 'src/app/services/auth.service';
+import { ReplaySubject } from 'rxjs';
+import { PermissionsService } from 'src/app/services/permissions.service';
 
 interface Tab {
   path: string;
@@ -17,17 +17,18 @@ export class StudentsComponent {
   tabs = new ReplaySubject<Tab[]>(1);
 
   constructor(
-    authService: AuthService
+    permissionsService: PermissionsService
   ) {
-    authService.getUser().subscribe(user => {
+
+    permissionsService.checkPermissions(["add students"]).subscribe(userMayAddStudents => {
       let tabs: Tab[] = [
         {
           path: './list',
           name: 'List Students',
         }
       ];
 
-      if(user?.role_names.includes("mentor")) {
+      if(userMayAddStudents) {
         tabs.push({
           path: './add',
           name: 'Add Student'

attendance-web/src/app/components/students/update-or-create-student/update-or-create-student.component.html

@@ -9,21 +9,21 @@ <h1>Student not found!</h1>
     <ng-container *ngTemplateOutlet="student_details"></ng-container>
   }
   @case (stateType.LOADED) {
+    <ng-container *ngTemplateOutlet="student_details"></ng-container>
     <mat-card>
-      <mat-card-header>Student Actions</mat-card-header>
+      <mat-card-header>Actions</mat-card-header>
       <mat-card-content>
         @if (editStudent|async; as student) {
           <div class="actionRow">
             @if (this.isDeleted|async) {
-              <button  mat-raised-button color="primary" (click)="undoDelete(student)">Restore Student</button>
+              <button [disabled]="userMayNotDeleteStudents|async" mat-raised-button color="primary" (click)="undoDelete(student)">Restore Student</button>
             } @else {
-              <button mat-raised-button color="warn" (click)="doDelete(student)">Delete Student</button>
+              <button [disabled]="userMayNotDeleteStudents|async" mat-raised-button color="warn" (click)="doDelete(student)">Delete Student</button>
             }
           </div>
         }
       </mat-card-content>
     </mat-card>
-    <ng-container *ngTemplateOutlet="student_details"></ng-container>
   }
 }
 

attendance-web/src/app/components/students/update-or-create-student/update-or-create-student.component.ts

@@ -7,6 +7,7 @@ import { ActivatedRoute, Router } from '@angular/router';
 import { DateTime } from 'luxon';
 import { BehaviorSubject, concatMap, filter, forkJoin, map, Observable, ReplaySubject, Subject, Subscription, take, takeUntil } from 'rxjs';
 import { Student } from 'src/app/models/student.model';
+import { PermissionsService } from 'src/app/services/permissions.service';
 import { ProfileImagesService, UploadStatus } from 'src/app/services/profile-images.service';
 import { StudentsService } from 'src/app/services/students.service';
 import { environment } from 'src/environments/environment';
@@ -35,6 +36,8 @@ export class UpdateOrCreateStudentComponent implements OnInit, OnDestroy {
   protected state: BehaviorSubject<ComponentState>
   private students : Observable<Array<Student>>
 
+  protected userMayNotDeleteStudents: Observable<boolean>
+
   editStudent = new ReplaySubject<Student|null>(1)
   isDeleted: Observable<Boolean>
 
@@ -51,17 +54,22 @@ export class UpdateOrCreateStudentComponent implements OnInit, OnDestroy {
     private snackBar: MatSnackBar,
     private router: Router,
     private profilePhotosService: ProfileImagesService,
+    private permissionsService: PermissionsService,
     private dialog: MatDialog,
     route: ActivatedRoute) {
       let id = route.snapshot.paramMap.get('studentId');
       this.students = this.studentsService.getAllStudents(true);
+
+      this.userMayNotDeleteStudents = permissionsService.checkPermissions(["remove students"]).pipe(map(it => !it));
+
       if(route.snapshot.url[0].path == 'edit' && id != null) {
         let parsedId = parseInt(id);
         this.students.pipe(takeUntil(this.unsubscribe), map( (students: Array<Student>) => {
           return students.find(it => it.id == parsedId) ?? null;
         })).subscribe(this.editStudent);
 
         this.state = new BehaviorSubject<ComponentState>(ComponentState.LOADING_STUDENT);
+
         this.editStudent.pipe(map(student => {
           if(student != null) {
             return ComponentState.LOADED;