Merge branch 'develop' into mc-remove-modules

src/app/teacher/classroom-monitor.module.ts

@@ -47,7 +47,6 @@ import { SelectPeriodComponent } from '../../assets/wise5/classroomMonitor/class
     NotebookGradingComponent,
     NotebookWorkgroupGradingComponent,
     NotificationsMenuComponent,
-    PauseScreensMenuComponent,
     StepItemComponent,
     StudentGradingComponent,
     StudentGradingToolsComponent,
@@ -67,6 +66,7 @@ import { SelectPeriodComponent } from '../../assets/wise5/classroomMonitor/class
     ManageStudentsModule,
     MilestoneModule,
     NavItemScoreComponent,
+    PauseScreensMenuComponent,
     PeerGroupGradingModule,
     PreviewComponentComponent,
     ProjectProgressComponent,

src/assets/wise5/classroomMonitor/classroomMonitorComponents/pause-screens-menu/pause-screens-menu.component.html

@@ -21,17 +21,18 @@
     >
       All Periods
     </mat-slide-toggle>
-    <mat-divider></mat-divider>
-    <mat-slide-toggle
-      *ngFor="let period of periods"
-      class="mat-primary account-menu__control"
-      aria-label="Pause student screens (Period: {{ period.periodName }})"
-      i18n-aria-label
-      [(ngModel)]="period.paused"
-      (ngModelChange)="togglePeriod(period)"
-      i18n
-    >
-      Period: {{ period.periodName }}
-    </mat-slide-toggle>
+    <mat-divider />
+    @for (period of periods; track period.periodId) {
+      <mat-slide-toggle
+        class="mat-primary account-menu__control"
+        aria-label="Pause student screens (Period: {{ period.periodName }})"
+        i18n-aria-label
+        [(ngModel)]="period.paused"
+        (ngModelChange)="togglePeriod(period)"
+        i18n
+      >
+        Period: {{ period.periodName }}
+      </mat-slide-toggle>
+    }
   </div>
 </div>

src/assets/wise5/classroomMonitor/classroomMonitorComponents/pause-screens-menu/pause-screens-menu.component.ts

@@ -1,20 +1,38 @@
 import { Component } from '@angular/core';
 import { TeacherDataService } from '../../../services/teacherDataService';
 import { TeacherPauseScreenService } from '../../../services/teacherPauseScreenService';
+import { CommonModule } from '@angular/common';
+import { FlexLayoutModule } from '@angular/flex-layout';
+import { MatSlideToggleModule } from '@angular/material/slide-toggle';
+import { MatIconModule } from '@angular/material/icon';
+import { MatToolbarModule } from '@angular/material/toolbar';
+import { MatDividerModule } from '@angular/material/divider';
+import { FormsModule } from '@angular/forms';
 
 class Period {
   paused: boolean;
   periodId: number;
+  periodName: string;
 }
 
 @Component({
+  imports: [
+    CommonModule,
+    FlexLayoutModule,
+    FormsModule,
+    MatDividerModule,
+    MatIconModule,
+    MatSlideToggleModule,
+    MatToolbarModule
+  ],
   selector: 'pause-screens-menu',
-  styleUrls: ['./pause-screens-menu.component.scss'],
+  standalone: true,
+  styleUrl: './pause-screens-menu.component.scss',
   templateUrl: './pause-screens-menu.component.html'
 })
 export class PauseScreensMenuComponent {
-  allPeriodsPaused: boolean;
-  periods: Period[];
+  protected allPeriodsPaused: boolean;
+  protected periods: Period[];
 
   constructor(
     private dataService: TeacherDataService,
@@ -23,11 +41,11 @@ export class PauseScreensMenuComponent {
     this.periods = this.dataService.getPeriods().filter((period) => period.periodId !== -1);
   }
 
-  togglePeriod(period: Period): void {
+  protected togglePeriod(period: Period): void {
     this.pauseScreenService.pauseScreensChanged(period.periodId, period.paused);
   }
 
-  toggleAllPeriods(): void {
+  protected toggleAllPeriods(): void {
     this.periods.forEach((period) => {
       this.pauseScreenService.pauseScreensChanged(period.periodId, this.allPeriodsPaused);
     });

src/assets/wise5/classroomMonitor/classroomMonitorComponents/peer-group/peer-group-dialog/peer-group-dialog.component.ts

@@ -7,38 +7,38 @@ import { TeacherProjectService } from '../../../../services/teacherProjectServic
 @Component({
   selector: 'peer-group-dialog',
   templateUrl: './peer-group-dialog.component.html',
-  styleUrls: ['./peer-group-dialog.component.scss']
+  styleUrl: './peer-group-dialog.component.scss'
 })
 export class PeerGroupDialogComponent implements OnInit {
-  currentPeriodChangedSubscription: Subscription;
-  peerGroupingName: string;
-  periods: any[];
+  private currentPeriodChangedSubscription: Subscription;
+  protected peerGroupingName: string;
+  protected periods: any[];
 
   constructor(
+    private dataService: TeacherDataService,
     @Inject(MAT_DIALOG_DATA) public peerGroupingTag: string,
-    private teacherDataService: TeacherDataService,
-    private teacherProjectService: TeacherProjectService
+    private projectService: TeacherProjectService
   ) {}
 
-  ngOnInit() {
-    this.setPeriods(this.teacherDataService.getCurrentPeriodId());
-    this.peerGroupingName = this.teacherProjectService.getPeerGrouping(this.peerGroupingTag).name;
-    this.subscribeToPeriodChanged();
-  }
-
-  subscribeToPeriodChanged(): void {
-    this.currentPeriodChangedSubscription = this.teacherDataService.currentPeriodChanged$.subscribe(
+  ngOnInit(): void {
+    this.setPeriods(this.dataService.getCurrentPeriodId());
+    this.peerGroupingName = this.projectService.getPeerGrouping(this.peerGroupingTag).name;
+    this.currentPeriodChangedSubscription = this.dataService.currentPeriodChanged$.subscribe(
       ({ currentPeriod }) => {
         this.setPeriods(currentPeriod.periodId);
       }
     );
   }
 
-  setPeriods(periodId: number): void {
-    this.periods = this.teacherDataService.getVisiblePeriodsById(periodId);
+  ngOnDestroy(): void {
+    this.currentPeriodChangedSubscription.unsubscribe();
   }
 
-  ngOnDestroy() {
-    this.currentPeriodChangedSubscription.unsubscribe();
+  private setPeriods(periodId: number): void {
+    const allPeriods = this.dataService.getPeriods();
+    this.periods =
+      periodId === -1
+        ? allPeriods.slice(1)
+        : [allPeriods.find((period) => period.periodId === periodId)];
   }
 }

src/assets/wise5/classroomMonitor/classroomMonitorComponents/shared/top-bar/top-bar.component.spec.ts

@@ -1,18 +1,14 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { FormsModule } from '@angular/forms';
-import { MatDividerModule } from '@angular/material/divider';
 import { MatIconModule } from '@angular/material/icon';
 import { MatListModule } from '@angular/material/list';
 import { MatMenuModule } from '@angular/material/menu';
-import { MatSlideToggleModule } from '@angular/material/slide-toggle';
 import { MatToolbarModule } from '@angular/material/toolbar';
 import { MatTooltipModule } from '@angular/material/tooltip';
 import { ConfigService } from '../../../../services/configService';
 import { NotificationService } from '../../../../services/notificationService';
 import { ClassroomMonitorTestingModule } from '../../../classroom-monitor-testing.module';
 import { PauseScreensMenuComponent } from '../../pause-screens-menu/pause-screens-menu.component';
 import { NotificationsMenuComponent } from '../notifications-menu/notifications-menu.component';
-
 import { TopBarComponent } from './top-bar.component';
 
 describe('TopBarComponent', () => {
@@ -21,15 +17,13 @@ describe('TopBarComponent', () => {
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({
-      declarations: [NotificationsMenuComponent, PauseScreensMenuComponent, TopBarComponent],
+      declarations: [NotificationsMenuComponent, TopBarComponent],
       imports: [
         ClassroomMonitorTestingModule,
-        FormsModule,
-        MatDividerModule,
+        PauseScreensMenuComponent,
         MatIconModule,
         MatListModule,
         MatMenuModule,
-        MatSlideToggleModule,
         MatToolbarModule,
         MatTooltipModule
       ]

src/assets/wise5/services/teacherDataService.ts

@@ -578,14 +578,6 @@ export class TeacherDataService extends DataService {
     this.periods = periods;
   }
 
-  getVisiblePeriodsById(currentPeriodId: number): any {
-    if (currentPeriodId === -1) {
-      return this.getPeriods().slice(1);
-    } else {
-      return [this.getPeriodById(currentPeriodId)];
-    }
-  }
-
   setCurrentWorkgroup(workgroup) {
     this.currentWorkgroup = workgroup;
     this.broadcastCurrentWorkgroupChanged({ currentWorkgroup: this.currentWorkgroup });
@@ -613,10 +605,6 @@ export class TeacherDataService extends DataService {
     );
   }
 
-  private getPeriodById(periodId: number): any {
-    return this.getPeriods().find((period) => period.periodId === periodId);
-  }
-
   isWorkgroupShown(workgroup): boolean {
     return (
       this.isWorkgroupInCurrentPeriod(workgroup) &&

src/messages.xlf

@@ -14404,7 +14404,7 @@ The branches will be removed but the steps will remain in the unit.</source>
           <context context-type="linenumber">28</context>
         </context-group>
       </trans-unit>
-      <trans-unit id="17fab40eb78ceec55d9a0884e132fc2dd9f70e51" datatype="html">
+      <trans-unit id="ae01e13f07e3e6c87e05fdcd39228e846ec19532" datatype="html">
         <source> Period: <x id="INTERPOLATION" equiv-text="{{ period.periodName }}"/> </source>
         <context-group purpose="location">
           <context context-type="sourcefile">src/assets/wise5/classroomMonitor/classroomMonitorComponents/pause-screens-menu/pause-screens-menu.component.html</context>