fix: allow admins to view units

thoth-tech · May 28, 2024 · a319562 · a319562
1 parent ea16363
commit a319562
Show file tree

Hide file tree

Showing 3 changed files with 94 additions and 49 deletions.
diff --git a/src/app/common/header/task-dropdown/task-dropdown.component.html b/src/app/common/header/task-dropdown/task-dropdown.component.html
@@ -113,55 +113,41 @@
             <mat-icon aria-label="Task Explorer Icon" fontIcon="pageview"></mat-icon> Explorer
           </button>
         }
-        @if (unitRole.role !== 'Admin') {
-          <button uiSref="units/tasks/viewer" [uiParams]="{unitId: unitRole.unit.id}" mat-menu-item>
-            <mat-icon aria-label="Task list icon" fontIcon="list_alt"></mat-icon> Tasks
-          </button>
-        }
-        @if (unitRole.role !== 'Admin') {
-          <mat-divider></mat-divider>
-        }
+        <button uiSref="units/tasks/viewer" [uiParams]="{unitId: unitRole.unit.id}" mat-menu-item>
+          <mat-icon aria-label="Task list icon" fontIcon="list_alt"></mat-icon> Tasks
+        </button>
+        <mat-divider></mat-divider>
         <!-- <p class="task-dropdown-heading">Students</p> -->
-        @if (unitRole.role !== 'Admin') {
-          <button
-            uiSref="units/students/list"
-            [uiParams]="{unitId: unitRole.unit.id}"
-            mat-menu-item
-          >
-            <mat-icon aria-label="Students list" fontIcon="group"></mat-icon> Students
-          </button>
-        }
-        @if (unitRole.role !== 'Admin') {
-          <button
-            uiSref="units/students/groups"
-            [uiParams]="{unitId: unitRole.unit.id}"
-            mat-menu-item
-          >
-            <mat-icon aria-label="Student Groups" fontIcon="groups"></mat-icon> Groups
-          </button>
-        }
-        @if (unitRole.role !== 'Admin') {
-          <button
-            uiSref="units/students/portfolios"
-            [uiParams]="{unitId: unitRole.unit.id}"
-            mat-menu-item
-          >
-            <mat-icon
-              aria-label="Student portfolios icon"
-              fontIcon="collections_bookmark"
-            ></mat-icon>
-            Portfolios
-          </button>
-        }
-        @if (unitRole.role !== 'Admin') {
-          <mat-divider></mat-divider>
-        }
+        <button
+          uiSref="units/students/list"
+          [uiParams]="{unitId: unitRole.unit.id}"
+          mat-menu-item
+        >
+          <mat-icon aria-label="Students list" fontIcon="group"></mat-icon> Students
+        </button>
+        <button
+          uiSref="units/students/groups"
+          [uiParams]="{unitId: unitRole.unit.id}"
+          mat-menu-item
+        >
+          <mat-icon aria-label="Student Groups" fontIcon="groups"></mat-icon> Groups
+        </button>
+        <button
+          uiSref="units/students/portfolios"
+          [uiParams]="{unitId: unitRole.unit.id}"
+          mat-menu-item
+        >
+          <mat-icon
+            aria-label="Student portfolios icon"
+            fontIcon="collections_bookmark"
+          ></mat-icon>
+          Portfolios
+        </button>
+        <mat-divider></mat-divider>
         <!-- <p class="task-dropdown-heading">Unit</p> -->
-        @if (unitRole.role !== 'Admin') {
-          <button uiSref="units/analytics" [uiParams]="{unitId: unitRole.unit.id}" mat-menu-item>
-            <mat-icon aria-label="Unit Analytics icon" fontIcon="insights"></mat-icon>Analytics
-          </button>
-        }
+        <button uiSref="units/analytics" [uiParams]="{unitId: unitRole.unit.id}" mat-menu-item>
+          <mat-icon aria-label="Unit Analytics icon" fontIcon="insights"></mat-icon>Analytics
+        </button>
         @if (unitRole.role === 'Convenor' || unitRole.role === 'Admin') {
           <button uiSref="units/admin" [uiParams]="{unitId: unitRole.unit.id}" mat-menu-item>
             <mat-icon aria-label="Unit Administration" fontIcon="admin_panel_settings"></mat-icon>

diff --git a/src/app/home/states/home/home.component.html b/src/app/home/states/home/home.component.html
@@ -6,7 +6,7 @@ <h1>You are not enrolled in {{ externalName.value }}.</h1>
 
   <div
     class="text-center"
-    *ngIf="!notEnrolled && projects?.length === 0 && unitRoles?.length === 0"
+    *ngIf="!notEnrolled && projects?.length === 0 && unitRoles?.length === 0 && !ifAdmin"
   >
     <h1 class="mat-headline-5">You are not enrolled in any {{ externalName.value }} units.</h1>
     <p class="mat-lead">Contact your unit convenor or tutor to enrol you in a subject.</p>
@@ -78,6 +78,47 @@ <h2>Units you teach</h2>
       </a>
     </div>
   </div>
+  <div [hidden]="!ifAdmin">
+    <h2>Units</h2>
+    <div [hidden]="!loadingUnits" style="height: 185px">
+      <mat-spinner diameter="40" color="accent"></mat-spinner>
+    </div>
+    <div [hidden]="loadingUnits" class="flex flex-row flex-wrap items-center">
+      <div *ngFor="let unit of units">
+        <div uiSref="units/tasks/viewer" [uiParams]="{unitId: unit.id}" class="removeStyle">
+          <mat-card class="unit-card">
+            <mat-card-header>
+              <mat-card-title class="f-card-title">{{ unit.name }}</mat-card-title>
+              <mat-card-subtitle>{{ unit.code }}</mat-card-subtitle>
+            </mat-card-header>
+            <mat-card-content>
+              <mat-divider></mat-divider>
+            </mat-card-content>
+            <mat-card-actions>
+              <f-chip>
+                {{ unit.teachingPeriod?.name || showDate(unit.startDate) }}
+              </f-chip>
+              <f-chip>Admin</f-chip>
+            </mat-card-actions>
+            <mat-card-footer
+              matTooltip="{{ unit.teachingPeriodProgress }}% through the teaching period."
+            >
+              <mat-progress-bar
+                class="unit-progress-slider"
+                mode="determinate"
+                [value]="unit.teachingPeriodProgress"
+              ></mat-progress-bar>
+            </mat-card-footer>
+          </mat-card>
+        </div>
+      </div>
+      <mat-card appearance="outlined" class="unit-card" [hidden]="units.length > 0">
+        <mat-card-content>
+          <p>No available units</p>
+        </mat-card-content></mat-card
+      >
+    </div>
+  </div>
   <div [hidden]="notEnrolled">
     <div class="my-4" [hidden]="projects?.length === 0">
       <h2>Enrolled units</h2>

diff --git a/src/app/home/states/home/home.component.ts b/src/app/home/states/home/home.component.ts
@@ -3,7 +3,7 @@ import {DoubtfireConstants} from 'src/app/config/constants/doubtfire-constants';
 import {analyticsService, dateService} from 'src/app/ajs-upgraded-providers';
 import {UIRouter} from '@uirouter/angular';
 import {GlobalStateService, ViewType} from 'src/app/projects/states/index/global-state.service';
-import {Project, UnitRole, User, UserService} from 'src/app/api/models/doubtfire-model';
+import {Project, Unit, UnitRole, UnitService, User, UserService} from 'src/app/api/models/doubtfire-model';
 import {Subscription} from 'rxjs';
 
 @Component({
@@ -14,11 +14,13 @@ import {Subscription} from 'rxjs';
 export class HomeComponent implements OnInit, OnDestroy {
   projects: Project[];
   unitRoles: UnitRole[];
+  units: Unit[] = [];
   showSpinner: boolean;
   dataLoaded: boolean;
   notEnrolled: boolean;
   ifAdmin: boolean;
   ifConvenor: boolean;
+  loadingUnits: boolean;
   loadingUnitRoles: boolean;
   loadingProjects: boolean;
 
@@ -27,6 +29,7 @@ export class HomeComponent implements OnInit, OnDestroy {
     private constants: DoubtfireConstants,
     private globalState: GlobalStateService,
     private userService: UserService,
+    private unitService: UnitService,
     @Inject(analyticsService) private AnalyticsService: any,
     @Inject(dateService) private DateService: any,
     @Inject(UIRouter) private router: UIRouter,
@@ -77,12 +80,27 @@ export class HomeComponent implements OnInit, OnDestroy {
 
     this.ifAdmin = this.currentUser.role === 'Admin';
     this.ifConvenor = this.currentUser.role === 'Convenor';
+
+    if (this.ifAdmin) {
+      this.loadingUnits = true;
+      this.subscriptions.push(
+        this.unitService.query().subscribe({
+          next: (units) => this.unitsLoaded(units),
+          error: (err) => {},
+        }),
+      );
+    }
   }
 
   get currentUser(): User {
     return this.userService.currentUser;
   }
 
+  unitsLoaded(units: Unit[]): void {
+    this.units = units;
+    this.loadingUnits = false;
+  }
+
   unitRolesLoaded(unitRoles: UnitRole[]): void {
     this.unitRoles = unitRoles;
     this.loadingUnitRoles = false;