Merge branch 'develop' into refactor-NodeService-dec-2024

src/app/classroom-monitor/workgroup-select/workgroup-select-autocomplete/workgroup-select-autocomplete.component.html

@@ -13,8 +13,10 @@
     (optionSelected)="itemSelected($event.option.value)"
     (closed)="closed($event)"
   >
-    <mat-option *ngFor="let workgroup of filteredWorkgroups | async" [value]="workgroup">
-      {{ workgroup.displayNames }}
-    </mat-option>
+    @for (workgroup of filteredWorkgroups | async; track workgroup.displayNames) {
+      <mat-option [value]="workgroup">
+        {{ workgroup.displayNames }}
+      </mat-option>
+    }
   </mat-autocomplete>
 </mat-form-field>

src/app/classroom-monitor/workgroup-select/workgroup-select-autocomplete/workgroup-select-autocomplete.component.ts

@@ -1,29 +1,33 @@
-'use strict';
-
 import { Component, ViewEncapsulation } from '@angular/core';
+import { FormControl, ReactiveFormsModule } from '@angular/forms';
+import { MatAutocompleteModule } from '@angular/material/autocomplete';
+import { MatFormFieldModule } from '@angular/material/form-field';
+import { MatInputModule } from '@angular/material/input';
+import { CommonModule } from '@angular/common';
 import { WorkgroupSelectComponent } from '../workgroup-select.component';
-import { FormControl } from '@angular/forms';
 import { Observable } from 'rxjs';
 import { filter, map, startWith } from 'rxjs/operators';
-import { ConfigService } from '../../../../assets/wise5/services/configService';
-import { TeacherDataService } from '../../../../assets/wise5/services/teacherDataService';
 import { copy } from '../../../../assets/wise5/common/object/object';
 
 @Component({
+  encapsulation: ViewEncapsulation.None,
+  imports: [
+    CommonModule,
+    MatAutocompleteModule,
+    MatFormFieldModule,
+    MatInputModule,
+    ReactiveFormsModule
+  ],
   selector: 'workgroup-select-autocomplete',
-  styleUrls: ['workgroup-select-autocomplete.component.scss'],
-  templateUrl: 'workgroup-select-autocomplete.component.html',
-  encapsulation: ViewEncapsulation.None
+  standalone: true,
+  styleUrl: 'workgroup-select-autocomplete.component.scss',
+  templateUrl: 'workgroup-select-autocomplete.component.html'
 })
 export class WorkgroupSelectAutocompleteComponent extends WorkgroupSelectComponent {
-  filteredWorkgroups: Observable<any>;
-  myControl = new FormControl();
-
-  constructor(protected configService: ConfigService, protected dataService: TeacherDataService) {
-    super(configService, dataService);
-  }
+  protected filteredWorkgroups: Observable<any>;
+  protected myControl = new FormControl();
 
-  ngOnInit() {
+  ngOnInit(): void {
     super.ngOnInit();
     this.updateFilteredWorkgroups();
     const currentWorkgroup = this.dataService.getCurrentWorkgroup();
@@ -32,15 +36,15 @@ export class WorkgroupSelectAutocompleteComponent extends WorkgroupSelectCompone
     }
   }
 
-  private updateFilteredWorkgroups() {
+  private updateFilteredWorkgroups(): void {
     this.filteredWorkgroups = this.myControl.valueChanges.pipe(
       startWith(''),
       filter((value) => typeof value === 'string'),
       map((value) => this.filterByTypedKeyword(value))
     );
   }
 
-  displayWith(workgroup) {
+  protected displayWith(workgroup: any): string {
     return workgroup.displayNames;
   }
 
@@ -50,11 +54,11 @@ export class WorkgroupSelectAutocompleteComponent extends WorkgroupSelectCompone
     );
   }
 
-  currentPeriodChanged() {
+  protected currentPeriodChanged(): void {
     this.myControl.setValue('');
   }
 
-  setWorkgroups() {
+  protected setWorkgroups(): void {
     this.filterWorkgroupsBySelectedPeriod();
     const students = this.getStudentsFromWorkgroups();
     this.workgroups = this.canViewStudentNames
@@ -67,7 +71,7 @@ export class WorkgroupSelectAutocompleteComponent extends WorkgroupSelectCompone
     this.updateWorkgroupDisplay(workgroup);
   }
 
-  getStudentsFromWorkgroups() {
+  private getStudentsFromWorkgroups(): any[] {
     const students = [];
     for (const workgroup of this.workgroups) {
       const ids = workgroup.userIds;
@@ -86,25 +90,21 @@ export class WorkgroupSelectAutocompleteComponent extends WorkgroupSelectCompone
     return students;
   }
 
-  flipName(name: string) {
+  private flipName(name: string): string {
     const names = name.split(' ');
     return `${names[1]}, ${names[0]}`;
   }
 
-  itemSelected(workgroup: any) {
+  protected itemSelected(workgroup: any): void {
     this.setCurrentWorkgroup(workgroup);
     this.updateWorkgroupDisplay(workgroup);
   }
 
   private updateWorkgroupDisplay(workgroup: any): void {
-    if (workgroup) {
-      this.myControl.setValue(workgroup.displayNames);
-    } else {
-      this.myControl.setValue('');
-    }
+    this.myControl.setValue(workgroup ? workgroup.displayNames : '');
   }
 
-  closed(event: any) {
+  protected closed(event: any): void {
     if (this.myControl.value === '') {
       this.itemSelected(null);
     }

src/app/classroom-monitor/workgroup-select/workgroup-select.component.ts

@@ -1,5 +1,3 @@
-'use strict';
-
 import { Directive, Input } from '@angular/core';
 import { Subscription } from 'rxjs';
 import { ConfigService } from '../../../assets/wise5/services/configService';
@@ -8,15 +6,18 @@ import { TeacherDataService } from '../../../assets/wise5/services/teacherDataSe
 @Directive({ selector: 'workgroup-select' })
 export class WorkgroupSelectComponent {
   @Input() customClass: string;
-  canViewStudentNames: boolean;
-  periodId: number;
-  selectedItem: any;
-  subscriptions: Subscription = new Subscription();
-  workgroups: any;
+  protected canViewStudentNames: boolean;
+  protected periodId: number;
+  protected selectedItem: any;
+  protected subscriptions: Subscription = new Subscription();
+  protected workgroups: any;
 
-  constructor(protected configService: ConfigService, protected dataService: TeacherDataService) {}
+  constructor(
+    protected configService: ConfigService,
+    protected dataService: TeacherDataService
+  ) {}
 
-  ngOnInit() {
+  ngOnInit(): void {
     this.canViewStudentNames = this.configService.getPermissions().canViewStudentNames;
     this.periodId = this.dataService.getCurrentPeriod().periodId;
     this.setWorkgroups();
@@ -37,29 +38,29 @@ export class WorkgroupSelectComponent {
     );
   }
 
-  ngOnDestroy() {
+  ngOnDestroy(): void {
     this.subscriptions.unsubscribe();
   }
 
-  setWorkgroups() {}
+  protected setWorkgroups() {}
 
   protected setWorkgroup(workgroup: any): void {}
 
-  currentPeriodChanged() {}
+  protected currentPeriodChanged() {}
 
-  sortByField(arr: any[], field: string): any[] {
+  protected sortByField(arr: any[], field: string): any[] {
     return arr.sort((workgroup1, workgroup2) => {
       return workgroup1[field] - workgroup2[field];
     });
   }
 
-  sortByDisplayNames(arr: any[]): any[] {
+  protected sortByDisplayNames(arr: any[]): any[] {
     return arr.sort((workgroup1, workgroup2) => {
       return workgroup1.displayNames.localeCompare(workgroup2.displayNames);
     });
   }
 
-  filterWorkgroupsBySelectedPeriod() {
+  protected filterWorkgroupsBySelectedPeriod(): void {
     this.workgroups = this.configService.getClassmateUserInfos().filter((workgroup) => {
       return (
         (this.periodId === -1 || workgroup.periodId === this.periodId) &&
@@ -68,7 +69,7 @@ export class WorkgroupSelectComponent {
     });
   }
 
-  setCurrentWorkgroup(workgroup) {
+  protected setCurrentWorkgroup(workgroup): void {
     this.dataService.setCurrentWorkgroup(workgroup);
   }
 }

src/app/student-teacher-common.module.ts

@@ -39,6 +39,7 @@ import { MathModule } from './math/math.module';
 import { MatMenuModule } from '@angular/material/menu';
 import { MainMenuComponent } from '../assets/wise5/common/main-menu/main-menu.component';
 import { SideMenuComponent } from '../assets/wise5/common/side-menu/side-menu.component';
+import { ScrollingModule } from '@angular/cdk/scrolling';
 
 @NgModule({
   declarations: [
@@ -82,6 +83,7 @@ import { SideMenuComponent } from '../assets/wise5/common/side-menu/side-menu.co
     NodeStatusIconComponent,
     NotebookModule,
     ReactiveFormsModule,
+    ScrollingModule,
     StudentTeacherCommonServicesModule
   ],
   exports: [

src/app/teacher/authoring-routing.module.ts

@@ -9,7 +9,6 @@ import { ProjectAuthoringComponent } from '../../assets/wise5/authoringTool/proj
 import { NodeAuthoringComponent } from '../../assets/wise5/authoringTool/node/node-authoring/node-authoring.component';
 import { NodeAdvancedAuthoringComponent } from '../../assets/wise5/authoringTool/node/advanced/node-advanced-authoring/node-advanced-authoring.component';
 import { NodeAdvancedConstraintAuthoringComponent } from '../../assets/wise5/authoringTool/node/advanced/constraint/node-advanced-constraint-authoring.component';
-import { ChooseComponentLocationComponent } from '../../assets/wise5/authoringTool/node/chooseComponentLocation/choose-component-location.component';
 import { AddLessonConfigureComponent } from '../../assets/wise5/authoringTool/addLesson/add-lesson-configure/add-lesson-configure.component';
 import { ChooseNewNodeTemplateComponent } from '../../assets/wise5/authoringTool/addNode/choose-new-node-template/choose-new-node-template.component';
 import { AddYourOwnNodeComponent } from '../../assets/wise5/authoringTool/addNode/add-your-own-node/add-your-own-node.component';
@@ -153,10 +152,6 @@ const routes: Routes = [
                   { path: 'rubric', component: EditNodeRubricComponent }
                 ]
               },
-              {
-                path: 'choose-component-location',
-                component: ChooseComponentLocationComponent
-              },
               {
                 path: 'import-component',
                 children: [{ path: 'choose-component', component: ChooseImportComponentComponent }]

src/app/teacher/authoring-tool.module.ts

@@ -22,7 +22,6 @@ import { WiseTinymceEditorModule } from '../../assets/wise5/directives/wise-tiny
 import { NotebookAuthoringComponent } from '../../assets/wise5/authoringTool/notebook-authoring/notebook-authoring.component';
 import { StructureAuthoringModule } from '../../assets/wise5/authoringTool/structure/structure-authoring.module';
 import { MilestonesAuthoringComponent } from '../../assets/wise5/authoringTool/milestones-authoring/milestones-authoring.component';
-import { ChooseComponentLocationComponent } from '../../assets/wise5/authoringTool/node/chooseComponentLocation/choose-component-location.component';
 import { TopBarComponent } from '../../assets/wise5/authoringTool/components/top-bar/top-bar.component';
 import { ProjectAssetAuthoringModule } from '../../assets/wise5/authoringTool/project-asset-authoring/project-asset-authoring.module';
 import { ChooseSimulationComponent } from '../../assets/wise5/authoringTool/addNode/choose-simulation/choose-simulation.component';
@@ -57,7 +56,6 @@ import { TranslatableTextareaComponent } from '../../assets/wise5/authoringTool/
 import { TranslatableRichTextEditorComponent } from '../../assets/wise5/authoringTool/components/translatable-rich-text-editor/translatable-rich-text-editor.component';
 import { AddStepButtonComponent } from '../../assets/wise5/authoringTool/add-step-button/add-step-button.component';
 import { CreateBranchComponent } from '../../assets/wise5/authoringTool/create-branch/create-branch.component';
-import { PreviewComponentButtonComponent } from '../../assets/wise5/authoringTool/components/preview-component-button/preview-component-button.component';
 import { EditBranchComponent } from '../../assets/wise5/authoringTool/edit-branch/edit-branch.component';
 import { ComponentTypeButtonComponent } from '../../assets/wise5/authoringTool/components/component-type-button/component-type-button.component';
 import { MatExpansionModule } from '@angular/material/expansion';
@@ -92,7 +90,6 @@ import { MatExpansionModule } from '@angular/material/expansion';
     AddYourOwnNodeComponent,
     AuthoringToolBarComponent,
     ChooseAutomatedAssessmentComponent,
-    ChooseComponentLocationComponent,
     ChooseCopyNodeLocationComponent,
     ChooseImportStepComponent,
     ChooseImportUnitComponent,
@@ -116,7 +113,6 @@ import { MatExpansionModule } from '@angular/material/expansion';
     NodeAdvancedAuthoringModule,
     NodeIconAndTitleComponent,
     NodeWithMoveAfterButtonComponent,
-    PreviewComponentButtonComponent,
     ProjectAssetAuthoringModule,
     ProjectListComponent,
     RouterModule,

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

@@ -1,6 +1,5 @@
 import { NgModule } from '@angular/core';
 import { NavItemScoreComponent } from '../../assets/wise5/classroomMonitor/classroomMonitorComponents/nodeProgress/navItemScore/nav-item-score.component';
-import { ViewComponentRevisionsComponent } from '../../assets/wise5/classroomMonitor/classroomMonitorComponents/view-component-revisions/view-component-revisions.component';
 import { AlertStatusCornerComponent } from '../classroom-monitor/alert-status-corner/alert-status-corner.component';
 import { ComponentNewWorkBadgeComponent } from '../classroom-monitor/component-new-work-badge/component-new-work-badge.component';
 import { ComponentSelectComponent } from '../classroom-monitor/component-select/component-select.component';
@@ -33,9 +32,10 @@ import { DataExportModule } from '../../assets/wise5/classroomMonitor/dataExport
 import { RouterModule } from '@angular/router';
 import { SaveIndicatorComponent } from '../../assets/wise5/common/save-indicator/save-indicator.component';
 import { PreviewComponentComponent } from '../../assets/wise5/authoringTool/components/preview-component/preview-component.component';
-import { StepToolsComponent } from '../../assets/wise5/common/stepTools/step-tools.component';
 import { ComponentGradingComponent } from '../../assets/wise5/classroomMonitor/classroomMonitorComponents/component-grading.component';
 import { SelectPeriodComponent } from '../../assets/wise5/classroomMonitor/classroomMonitorComponents/select-period/select-period.component';
+import { GradingStepToolsComponent } from '../../assets/wise5/classroomMonitor/classroomMonitorComponents/grading-step-tools/grading-step-tools.component';
+import { GradingNodeService } from '../../assets/wise5/services/gradingNodeService';
 
 @NgModule({
   declarations: [
@@ -52,8 +52,7 @@ import { SelectPeriodComponent } from '../../assets/wise5/classroomMonitor/class
     StudentGradingToolsComponent,
     StudentProgressComponent,
     ToolBarComponent,
-    TopBarComponent,
-    ViewComponentRevisionsComponent
+    TopBarComponent
   ],
   imports: [
     ComponentGradingComponent,
@@ -62,6 +61,7 @@ import { SelectPeriodComponent } from '../../assets/wise5/classroomMonitor/class
     ComponentStudentModule,
     DataExportModule,
     GradingCommonModule,
+    GradingStepToolsComponent,
     HighchartsChartModule,
     ManageStudentsModule,
     MilestoneModule,
@@ -75,9 +75,9 @@ import { SelectPeriodComponent } from '../../assets/wise5/classroomMonitor/class
     SelectPeriodComponent,
     ShowNodeInfoDialogComponent,
     StepInfoComponent,
-    StepToolsComponent,
     StudentTeacherCommonModule,
     TeacherSummaryDisplayComponent
-  ]
+  ],
+  providers: [GradingNodeService]
 })
 export class ClassroomMonitorModule {}

src/app/teacher/grading-common.module.ts

@@ -23,11 +23,12 @@ import { ComponentStateInfoComponent } from '../../assets/wise5/common/component
     StatusIconComponent,
     StudentTeacherCommonModule,
     WorkgroupInfoComponent,
+    WorkgroupItemComponent,
     WorkgroupComponentGradingComponent,
     WorkgroupNodeScoreComponent,
-    WorkgroupNodeStatusComponent
+    WorkgroupNodeStatusComponent,
+    WorkgroupSelectAutocompleteComponent
   ],
-  declarations: [WorkgroupItemComponent, WorkgroupSelectAutocompleteComponent],
   exports: [
     ComponentGradingComponent,
     ComponentStateInfoComponent,

src/assets/wise5/authoringTool/authoring-tool.component.html

@@ -23,6 +23,7 @@
         class="l-main"
         [ngClass]="{ 'l-main--with-toolbar': showToolbar }"
         role="main"
+        cdkScrollable
       >
         <router-outlet></router-outlet>
       </content>