From 2805027b327dddc00f3fedb7178b2fef094973ec Mon Sep 17 00:00:00 2001 From: Hiroki Terashima Date: Fri, 14 Nov 2025 13:59:13 -0800 Subject: [PATCH 01/28] Use inject() for LibraryComponent --- src/app/modules/library/library/library.component.ts | 8 +++----- .../personal-library/personal-library.component.ts | 12 ++---------- src/messages.xlf | 2 +- 3 files changed, 6 insertions(+), 16 deletions(-) diff --git a/src/app/modules/library/library/library.component.ts b/src/app/modules/library/library/library.component.ts index 3c367b3ee24..fcff7451286 100644 --- a/src/app/modules/library/library/library.component.ts +++ b/src/app/modules/library/library/library.component.ts @@ -1,4 +1,4 @@ -import { OnInit, QueryList, ViewChildren, Directive } from '@angular/core'; +import { OnInit, QueryList, ViewChildren, Directive, inject } from '@angular/core'; import { LibraryService } from '../../../services/library.service'; import { LibraryProject } from '../libraryProject'; import { PageEvent, MatPaginator } from '@angular/material/paginator'; @@ -18,10 +18,8 @@ export abstract class LibraryComponent implements OnInit { protected showFilters: boolean = false; protected subscriptions: Subscription = new Subscription(); - constructor( - protected filterValues: ProjectFilterValues, - protected libraryService: LibraryService - ) {} + protected filterValues = inject(ProjectFilterValues); + protected libraryService = inject(LibraryService); ngOnInit(): void { this.subscriptions.add(this.filterValues.updated$.subscribe(() => this.filterUpdated())); diff --git a/src/app/modules/library/personal-library/personal-library.component.ts b/src/app/modules/library/personal-library/personal-library.component.ts index 914edbee2e8..b8caa9324aa 100644 --- a/src/app/modules/library/personal-library/personal-library.component.ts +++ b/src/app/modules/library/personal-library/personal-library.component.ts @@ -2,12 +2,11 @@ import { ApplyTagsButtonComponent } from '../../../teacher/apply-tags-button/app import { ArchiveProjectsButtonComponent } from '../../../teacher/archive-projects-button/archive-projects-button.component'; import { ArchiveProjectService } from '../../../services/archive-project.service'; import { BehaviorSubject } from 'rxjs'; -import { Component, Signal, WritableSignal, computed, signal } from '@angular/core'; +import { Component, Signal, WritableSignal, computed, inject, signal } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { LibraryComponent } from '../library/library.component'; import { LibraryProject } from '../libraryProject'; import { LibraryProjectComponent } from '../library-project/library-project.component'; -import { LibraryService } from '../../../services/library.service'; import { MatDividerModule } from '@angular/material/divider'; import { MatFormFieldModule } from '@angular/material/form-field'; import { MatPaginatorModule, PageEvent } from '@angular/material/paginator'; @@ -17,7 +16,6 @@ import { ProjectSelectionEvent } from '../../../domain/projectSelectionEvent'; import { SelectAllItemsCheckboxComponent } from '../select-all-items-checkbox/select-all-items-checkbox.component'; import { SelectTagsComponent } from '../../../teacher/select-tags/select-tags.component'; import { Tag } from '../../../domain/tag'; -import { ProjectFilterValues } from '../../../domain/projectFilterValues'; @Component({ imports: [ @@ -54,13 +52,7 @@ export class PersonalLibraryComponent extends LibraryComponent { protected sharedProjects: LibraryProject[] = []; protected showArchivedView: boolean = false; - constructor( - private archiveProjectService: ArchiveProjectService, - protected filterValues: ProjectFilterValues, - protected libraryService: LibraryService - ) { - super(filterValues, libraryService); - } + private archiveProjectService = inject(ArchiveProjectService); ngOnInit(): void { super.ngOnInit(); diff --git a/src/messages.xlf b/src/messages.xlf index 72179c2f295..c4d4aa490de 100644 --- a/src/messages.xlf +++ b/src/messages.xlf @@ -6352,7 +6352,7 @@ Click "Cancel" to keep the invalid JSON open so you can fix it.Select all units src/app/modules/library/personal-library/personal-library.component.ts - 51 + 49 From 8208d7e571e21a3d6f32f1f5d7af05af04e4a016 Mon Sep 17 00:00:00 2001 From: Hiroki Terashima Date: Mon, 17 Nov 2025 17:43:40 -0800 Subject: [PATCH 02/28] Use inject() for constraint authoring --- .../constraints-authoring.component.ts | 4 ++-- .../node-advanced-constraint-authoring.component.ts | 10 ++-------- 2 files changed, 4 insertions(+), 10 deletions(-) diff --git a/src/assets/wise5/authoringTool/constraint/constraints-authoring/constraints-authoring.component.ts b/src/assets/wise5/authoringTool/constraint/constraints-authoring/constraints-authoring.component.ts index c71293b4ac9..51a41f24adc 100644 --- a/src/assets/wise5/authoringTool/constraint/constraints-authoring/constraints-authoring.component.ts +++ b/src/assets/wise5/authoringTool/constraint/constraints-authoring/constraints-authoring.component.ts @@ -1,4 +1,4 @@ -import { Directive } from '@angular/core'; +import { Directive, inject } from '@angular/core'; import { Constraint } from '../../../../../app/domain/constraint'; import { TeacherProjectService } from '../../../services/teacherProjectService'; @@ -6,7 +6,7 @@ import { TeacherProjectService } from '../../../services/teacherProjectService'; export class ConstraintsAuthoringComponent { content: any; - constructor(protected projectService: TeacherProjectService) {} + protected projectService = inject(TeacherProjectService); protected addConstraint(): Constraint { const newNodeConstraintId = this.getNewNodeConstraintId(); diff --git a/src/assets/wise5/authoringTool/node/advanced/constraint/node-advanced-constraint-authoring.component.ts b/src/assets/wise5/authoringTool/node/advanced/constraint/node-advanced-constraint-authoring.component.ts index 81632cccdf5..c21e4e233ce 100644 --- a/src/assets/wise5/authoringTool/node/advanced/constraint/node-advanced-constraint-authoring.component.ts +++ b/src/assets/wise5/authoringTool/node/advanced/constraint/node-advanced-constraint-authoring.component.ts @@ -1,5 +1,4 @@ -import { Component } from '@angular/core'; -import { TeacherProjectService } from '../../../../services/teacherProjectService'; +import { Component, inject } from '@angular/core'; import { scrollToElement, temporarilyHighlightElement } from '../../../../common/dom/dom'; import { ConstraintsAuthoringComponent } from '../../../constraint/constraints-authoring/constraints-authoring.component'; import { ActivatedRoute } from '@angular/router'; @@ -26,12 +25,7 @@ import { NodeConstraintAuthoringComponent } from '../../../constraint/node-const templateUrl: 'node-advanced-constraint-authoring.component.html' }) export class NodeAdvancedConstraintAuthoringComponent extends ConstraintsAuthoringComponent { - constructor( - protected projectService: TeacherProjectService, - private route: ActivatedRoute - ) { - super(projectService); - } + private route = inject(ActivatedRoute); ngOnInit(): void { this.route.parent.parent.parent.params.subscribe((params) => { From fee8158a8fdd3bad6d7b5a528ad100f47cce952a Mon Sep 17 00:00:00 2001 From: Hiroki Terashima Date: Tue, 18 Nov 2025 14:33:25 -0800 Subject: [PATCH 03/28] Use inject() for ComponentStudent and all its children components --- .../ai-chat-student.component.ts | 40 +------- .../animation-student.component.ts | 34 +------ .../audio-oscillator-student.component.ts | 34 +------ .../components/component-student.component.ts | 20 ++-- .../concept-map-student.component.ts | 38 +------- .../dialog-guidance-student.component.ts | 46 ++-------- .../discussion-student.component.ts | 57 +++--------- .../draw-student/draw-student.component.ts | 36 +------- .../embedded-student.component.ts | 38 +------- .../graph-student/graph-student.component.ts | 45 +++------ .../html-student/html-student.component.ts | 34 +------ .../label-student/label-student.component.ts | 36 +------- .../match-student-default.component.ts | 62 ++++--------- .../multiple-choice-student.component.ts | 38 +------- .../open-response-student.component.ts | 47 +++------- .../outside-url-student.component.ts | 40 +------- .../peer-chat-student.component.ts | 43 ++------- .../show-my-work-student.component.ts | 34 +------ .../summary-student.component.ts | 36 +------- .../table-student/table-student.component.ts | 39 +------- src/messages.xlf | 92 +++++++++---------- 21 files changed, 169 insertions(+), 720 deletions(-) diff --git a/src/assets/wise5/components/aiChat/ai-chat-student/ai-chat-student.component.ts b/src/assets/wise5/components/aiChat/ai-chat-student/ai-chat-student.component.ts index a80a8a12527..c4e041c3e15 100644 --- a/src/assets/wise5/components/aiChat/ai-chat-student/ai-chat-student.component.ts +++ b/src/assets/wise5/components/aiChat/ai-chat-student/ai-chat-student.component.ts @@ -1,13 +1,5 @@ -import { Component, ElementRef, ViewChild } from '@angular/core'; +import { Component, ElementRef, inject, ViewChild } from '@angular/core'; import { ComponentStudent } from '../../component-student.component'; -import { ConfigService } from '../../../services/configService'; -import { AnnotationService } from '../../../services/annotationService'; -import { ComponentService } from '../../componentService'; -import { MatDialog } from '@angular/material/dialog'; -import { NodeService } from '../../../services/nodeService'; -import { NotebookService } from '../../../services/notebookService'; -import { StudentAssetService } from '../../../services/studentAssetService'; -import { StudentDataService } from '../../../services/studentDataService'; import { AiChatMessage } from '../AiChatMessage'; import { AiChatService } from '../aiChatService'; import { MatSnackBar } from '@angular/material/snack-bar'; @@ -35,42 +27,20 @@ import { AiChatMessagesComponent } from '../ai-chat-messages/ai-chat-messages.co templateUrl: './ai-chat-student.component.html' }) export class AiChatStudentComponent extends ComponentStudent { + private aiChatService = inject(AiChatService); component: AiChatComponent; protected computerAvatar: ComputerAvatar; protected computerAvatarSelectorVisible: boolean = false; + protected computerAvatarService = inject(ComputerAvatarService); private connectedComponentResponse: string; protected messages: AiChatMessage[] = []; @ViewChild('messagesContainer') private messagesContainer: ElementRef; + private snackBar = inject(MatSnackBar); protected studentResponse: string = ''; + protected studentStatusService = inject(StudentStatusService); protected submitEnabled: boolean = false; protected waitingForComputerResponse: boolean = false; - constructor( - private aiChatService: AiChatService, - protected annotationService: AnnotationService, - protected computerAvatarService: ComputerAvatarService, - protected componentService: ComponentService, - protected configService: ConfigService, - protected dataService: StudentDataService, - protected dialog: MatDialog, - protected nodeService: NodeService, - protected notebookService: NotebookService, - private snackBar: MatSnackBar, - protected studentAssetService: StudentAssetService, - protected studentStatusService: StudentStatusService - ) { - super( - annotationService, - componentService, - configService, - dialog, - nodeService, - notebookService, - studentAssetService, - dataService - ); - } - ngOnInit(): void { super.ngOnInit(); this.initializeComputerAvatar(); diff --git a/src/assets/wise5/components/animation/animation-student/animation-student.component.ts b/src/assets/wise5/components/animation/animation-student/animation-student.component.ts index e936bbec63c..da0b32cb5d8 100644 --- a/src/assets/wise5/components/animation/animation-student/animation-student.component.ts +++ b/src/assets/wise5/components/animation/animation-student/animation-student.component.ts @@ -1,14 +1,6 @@ import SVG from 'svg.js'; -import { Component } from '@angular/core'; -import { MatDialog } from '@angular/material/dialog'; -import { AnnotationService } from '../../../services/annotationService'; -import { ConfigService } from '../../../services/configService'; -import { NodeService } from '../../../services/nodeService'; -import { NotebookService } from '../../../services/notebookService'; -import { StudentAssetService } from '../../../services/studentAssetService'; -import { StudentDataService } from '../../../services/studentDataService'; +import { Component, inject } from '@angular/core'; import { ComponentStudent } from '../../component-student.component'; -import { ComponentService } from '../../componentService'; import { AnimationService } from '../animationService'; import { hasConnectedComponent } from '../../../common/ComponentContent'; import { ComponentHeaderComponent } from '../../../directives/component-header/component-header.component'; @@ -38,6 +30,7 @@ import { ComponentAnnotationsComponent } from '../../../directives/componentAnno templateUrl: 'animation-student.component.html' }) export class AnimationStudent extends ComponentStudent { + private animationService = inject(AnimationService); animationState: any = 'stopped'; coordinateSystem: string = 'screen'; draw: any; @@ -62,29 +55,6 @@ export class AnimationStudent extends ComponentStudent { timerText: any; width: number = 800; - constructor( - private animationService: AnimationService, - protected annotationService: AnnotationService, - protected componentService: ComponentService, - protected configService: ConfigService, - protected dialog: MatDialog, - protected nodeService: NodeService, - protected notebookService: NotebookService, - protected studentAssetService: StudentAssetService, - protected studentDataService: StudentDataService - ) { - super( - annotationService, - componentService, - configService, - dialog, - nodeService, - notebookService, - studentAssetService, - studentDataService - ); - } - ngOnInit(): void { super.ngOnInit(); const domIdEnding = this.animationService.getDomIdEnding( diff --git a/src/assets/wise5/components/audioOscillator/audio-oscillator-student/audio-oscillator-student.component.ts b/src/assets/wise5/components/audioOscillator/audio-oscillator-student/audio-oscillator-student.component.ts index 9f7e050d810..50237675b4d 100644 --- a/src/assets/wise5/components/audioOscillator/audio-oscillator-student/audio-oscillator-student.component.ts +++ b/src/assets/wise5/components/audioOscillator/audio-oscillator-student/audio-oscillator-student.component.ts @@ -1,14 +1,6 @@ -import { Component } from '@angular/core'; -import { MatDialog } from '@angular/material/dialog'; +import { Component, inject } from '@angular/core'; import { copy } from '../../../common/object/object'; -import { AnnotationService } from '../../../services/annotationService'; -import { ConfigService } from '../../../services/configService'; -import { NodeService } from '../../../services/nodeService'; -import { NotebookService } from '../../../services/notebookService'; -import { StudentAssetService } from '../../../services/studentAssetService'; -import { StudentDataService } from '../../../services/studentDataService'; import { ComponentStudent } from '../../component-student.component'; -import { ComponentService } from '../../componentService'; import { AudioOscillatorService } from '../audioOscillatorService'; import { hasConnectedComponent } from '../../../common/ComponentContent'; import { ComponentHeaderComponent } from '../../../directives/component-header/component-header.component'; @@ -47,6 +39,7 @@ export class AudioOscillatorStudent extends ComponentStudent { amplitudesPlayedSorted: number[] = []; analyser: any; audioContext: any; + private audioOscillatorService = inject(AudioOscillatorService); canStudentEditAmplitude: boolean = true; canStudentEditFrequency: boolean = true; canStudentViewAmplitudeInput: boolean = true; @@ -86,29 +79,6 @@ export class AudioOscillatorStudent extends ComponentStudent { playStopButtonText: string; stopAfterGoodDraw: boolean = true; - constructor( - protected annotationService: AnnotationService, - private audioOscillatorService: AudioOscillatorService, - protected componentService: ComponentService, - protected configService: ConfigService, - protected dialog: MatDialog, - protected nodeService: NodeService, - protected notebookService: NotebookService, - protected studentAssetService: StudentAssetService, - protected studentDataService: StudentDataService - ) { - super( - annotationService, - componentService, - configService, - dialog, - nodeService, - notebookService, - studentAssetService, - studentDataService - ); - } - ngOnInit(): void { super.ngOnInit(); const domIdEnding = this.audioOscillatorService.getDomIdEnding( diff --git a/src/assets/wise5/components/component-student.component.ts b/src/assets/wise5/components/component-student.component.ts index f7a70c741d2..697c51403a6 100644 --- a/src/assets/wise5/components/component-student.component.ts +++ b/src/assets/wise5/components/component-student.component.ts @@ -1,4 +1,4 @@ -import { Directive, EventEmitter, Input, Output } from '@angular/core'; +import { Directive, EventEmitter, inject, Input, Output } from '@angular/core'; import { MatDialog } from '@angular/material/dialog'; import { SafeHtml } from '@angular/platform-browser'; import { Subscription } from 'rxjs'; @@ -55,16 +55,14 @@ export abstract class ComponentStudent { protected studentWorkSavedToServerSubscription: Subscription; protected subscriptions: Subscription = new Subscription(); - constructor( - protected annotationService: AnnotationService, - protected componentService: ComponentService, - protected configService: ConfigService, - protected dialog: MatDialog, - protected nodeService: NodeService, - protected notebookService: NotebookService, - protected studentAssetService: StudentAssetService, - protected studentDataService: StudentDataService - ) {} + protected annotationService = inject(AnnotationService); + protected componentService = inject(ComponentService); + protected configService = inject(ConfigService); + protected dialog = inject(MatDialog); + protected nodeService = inject(NodeService); + protected notebookService = inject(NotebookService); + protected studentAssetService = inject(StudentAssetService); + protected studentDataService = inject(StudentDataService); ngOnInit(): void { this.nodeId = this.component.nodeId; diff --git a/src/assets/wise5/components/conceptMap/concept-map-student/concept-map-student.component.ts b/src/assets/wise5/components/conceptMap/concept-map-student/concept-map-student.component.ts index 131ebafcbb9..31e09c90158 100644 --- a/src/assets/wise5/components/conceptMap/concept-map-student/concept-map-student.component.ts +++ b/src/assets/wise5/components/conceptMap/concept-map-student/concept-map-student.component.ts @@ -1,16 +1,8 @@ import SVG from 'svg.js'; import 'svg.draggable.js'; -import { ChangeDetectorRef, Component } from '@angular/core'; -import { MatDialog } from '@angular/material/dialog'; -import { AnnotationService } from '../../../services/annotationService'; -import { ConfigService } from '../../../services/configService'; -import { NodeService } from '../../../services/nodeService'; -import { NotebookService } from '../../../services/notebookService'; +import { ChangeDetectorRef, Component, inject } from '@angular/core'; import { ProjectService } from '../../../services/projectService'; -import { StudentAssetService } from '../../../services/studentAssetService'; -import { StudentDataService } from '../../../services/studentDataService'; import { ComponentStudent } from '../../component-student.component'; -import { ComponentService } from '../../componentService'; import { ConceptMapService } from '../conceptMapService'; import { DialogWithCloseComponent } from '../../../directives/dialog-with-close/dialog-with-close.component'; import { copy } from '../../../common/object/object'; @@ -56,9 +48,11 @@ export class ConceptMapStudent extends ComponentStudent { background: any; backgroundSize: string; backgroundUrl: string = ''; + private changeDetector = inject(ChangeDetectorRef); componentStateId: number; componentTypesCanImportAsBackground: string[] = ['Draw', 'Embedded', 'Graph', 'Label', 'Table']; conceptMapContainerId: string; + private conceptMapService = inject(ConceptMapService); displayLinkTypeChooser: boolean = false; domIdEnding: string; dragOverListenerFunction: any; @@ -76,6 +70,7 @@ export class ConceptMapStudent extends ComponentStudent { modalWidth: number = 800; newlyCreatedLink: any; nodes: any[] = []; + private projectService = inject(ProjectService); selectedLinkType: string; selectedNode: any; selectNodeBarId: string; @@ -85,31 +80,6 @@ export class ConceptMapStudent extends ComponentStudent { tempOffsetY: number = 0; width: number = 800; - constructor( - protected annotationService: AnnotationService, - private changeDetector: ChangeDetectorRef, - protected componentService: ComponentService, - protected configService: ConfigService, - private conceptMapService: ConceptMapService, - protected dialog: MatDialog, - protected nodeService: NodeService, - protected notebookService: NotebookService, - private projectService: ProjectService, - protected studentAssetService: StudentAssetService, - protected studentDataService: StudentDataService - ) { - super( - annotationService, - componentService, - configService, - dialog, - nodeService, - notebookService, - studentAssetService, - studentDataService - ); - } - ngOnInit(): void { super.ngOnInit(); this.initialize(); diff --git a/src/assets/wise5/components/dialogGuidance/dialog-guidance-student/dialog-guidance-student.component.ts b/src/assets/wise5/components/dialogGuidance/dialog-guidance-student/dialog-guidance-student.component.ts index 83308561608..a9472efc036 100644 --- a/src/assets/wise5/components/dialogGuidance/dialog-guidance-student/dialog-guidance-student.component.ts +++ b/src/assets/wise5/components/dialogGuidance/dialog-guidance-student/dialog-guidance-student.component.ts @@ -1,11 +1,4 @@ -import { Component } from '@angular/core'; -import { AnnotationService } from '../../../services/annotationService'; -import { ConfigService } from '../../../services/configService'; -import { NodeService } from '../../../services/nodeService'; -import { NotebookService } from '../../../services/notebookService'; -import { StudentAssetService } from '../../../services/studentAssetService'; -import { StudentDataService } from '../../../services/studentDataService'; -import { ComponentService } from '../../componentService'; +import { Component, inject } from '@angular/core'; import { DialogResponse } from '../DialogResponse'; import { StudentDialogResponse } from '../StudentDialogResponse'; import { CRaterService } from '../../../services/cRaterService'; @@ -16,7 +9,6 @@ import { FeedbackRule } from '../../common/feedbackRule/FeedbackRule'; import { FeedbackRuleEvaluator } from '../../common/feedbackRule/FeedbackRuleEvaluator'; import { ComputerDialogResponseMultipleScores } from '../ComputerDialogResponseMultipleScores'; import { ComputerDialogResponseSingleScore } from '../ComputerDialogResponseSingleScore'; -import { MatDialog } from '@angular/material/dialog'; import { ComputerAvatar } from '../../../common/computer-avatar/ComputerAvatar'; import { ComputerAvatarService } from '../../../services/computerAvatarService'; import { StudentStatusService } from '../../../services/studentStatusService'; @@ -53,41 +45,19 @@ export class DialogGuidanceStudentComponent extends ComponentStudent { component: DialogGuidanceComponent; protected computerAvatar: ComputerAvatar; protected computerAvatarSelectorVisible: boolean = false; + protected computerAvatarService = inject(ComputerAvatarService); + protected constraintService = inject(ConstraintService); + private cRaterPingService = inject(CRaterPingService); + protected cRaterService = inject(CRaterService); private cRaterTimeout: number = 40000; + protected dialogGuidanceFeedbackService = inject(DialogGuidanceFeedbackService); private feedbackRuleEvaluator: FeedbackRuleEvaluator; protected isWaitingForComputerResponse: boolean = false; protected responses: DialogResponse[] = []; protected studentCanRespond: boolean = true; + protected studentStatusService = inject(StudentStatusService); workgroupId: number; - constructor( - protected annotationService: AnnotationService, - protected componentService: ComponentService, - protected computerAvatarService: ComputerAvatarService, - protected configService: ConfigService, - private constraintService: ConstraintService, - protected cRaterService: CRaterService, - protected dialog: MatDialog, - protected dialogGuidanceFeedbackService: DialogGuidanceFeedbackService, - protected nodeService: NodeService, - protected notebookService: NotebookService, - protected studentAssetService: StudentAssetService, - protected dataService: StudentDataService, - protected studentStatusService: StudentStatusService, - private cRaterPingService: CRaterPingService - ) { - super( - annotationService, - componentService, - configService, - dialog, - nodeService, - notebookService, - studentAssetService, - dataService - ); - } - ngOnInit(): void { super.ngOnInit(); if (this.componentState != null) { @@ -212,7 +182,7 @@ export class DialogGuidanceStudentComponent extends ComponentStudent { private getCRaterResponses(): CRaterResponse[] { let submitCounter = 1; return ( - this.dataService + this.studentDataService .getLatestComponentStateByNodeIdAndComponentId(this.nodeId, this.componentId) ?.studentData.responses.filter( (response: DialogResponse) => diff --git a/src/assets/wise5/components/discussion/discussion-student/discussion-student.component.ts b/src/assets/wise5/components/discussion/discussion-student/discussion-student.component.ts index cda9e856d14..e0b14736431 100644 --- a/src/assets/wise5/components/discussion/discussion-student/discussion-student.component.ts +++ b/src/assets/wise5/components/discussion/discussion-student/discussion-student.component.ts @@ -1,16 +1,8 @@ -import { Component, ViewEncapsulation } from '@angular/core'; -import { MatDialog } from '@angular/material/dialog'; +import { Component, inject, ViewEncapsulation } from '@angular/core'; import { generateRandomKey } from '../../../common/string/string'; -import { AnnotationService } from '../../../services/annotationService'; -import { ConfigService } from '../../../services/configService'; -import { NodeService } from '../../../services/nodeService'; -import { NotebookService } from '../../../services/notebookService'; import { NotificationService } from '../../../services/notificationService'; -import { StudentAssetService } from '../../../services/studentAssetService'; -import { StudentDataService } from '../../../services/studentDataService'; import { StudentAssetRequest } from '../../../vle/studentAsset/StudentAssetRequest'; import { ComponentStudent } from '../../component-student.component'; -import { ComponentService } from '../../componentService'; import { ComponentStateRequest } from '../../ComponentStateRequest'; import { DiscussionService } from '../discussionService'; import { ComponentHeaderComponent } from '../../../directives/component-header/component-header.component'; @@ -47,36 +39,14 @@ import { ClassResponse } from '../class-response/class-response.component'; export class DiscussionStudent extends ComponentStudent { classResponses: any[] = []; componentStateIdReplyingTo: number; + private discussionService = inject(DiscussionService); newResponse: string = ''; + private notificationService = inject(NotificationService); responsesMap: any = {}; retrievedClassmateResponses: boolean = false; studentResponse: string = ''; topLevelResponses: any = {}; - constructor( - protected annotationService: AnnotationService, - protected componentService: ComponentService, - protected configService: ConfigService, - protected dialog: MatDialog, - private discussionService: DiscussionService, - protected nodeService: NodeService, - protected notebookService: NotebookService, - private notificationService: NotificationService, - protected studentAssetService: StudentAssetService, - protected dataService: StudentDataService - ) { - super( - annotationService, - componentService, - configService, - dialog, - nodeService, - notebookService, - studentAssetService, - dataService - ); - } - ngOnInit(): void { super.ngOnInit(); @@ -85,7 +55,7 @@ export class DiscussionStudent extends ComponentStudent { if (this.component.hasConnectedComponent()) { for (const connectedComponent of this.componentContent.connectedComponents) { componentStates = componentStates.concat( - this.dataService.getComponentStatesByNodeIdAndComponentId( + this.studentDataService.getComponentStatesByNodeIdAndComponentId( connectedComponent.nodeId, connectedComponent.componentId ) @@ -93,11 +63,14 @@ export class DiscussionStudent extends ComponentStudent { } if (this.isConnectedComponentImportWorkMode()) { componentStates = componentStates.concat( - this.dataService.getComponentStatesByNodeIdAndComponentId(this.nodeId, this.componentId) + this.studentDataService.getComponentStatesByNodeIdAndComponentId( + this.nodeId, + this.componentId + ) ); } } else { - componentStates = this.dataService.getComponentStatesByNodeIdAndComponentId( + componentStates = this.studentDataService.getComponentStatesByNodeIdAndComponentId( this.nodeId, this.componentId ); @@ -181,7 +154,7 @@ export class DiscussionStudent extends ComponentStudent { this.studentResponse = this.newResponse; this.isSubmit = true; } - this.dataService.broadcastComponentSubmitTriggered({ + this.studentDataService.broadcastComponentSubmitTriggered({ nodeId: this.nodeId, componentId: this.componentId }); @@ -316,7 +289,7 @@ export class DiscussionStudent extends ComponentStudent { registerStudentWorkReceivedListener() { this.subscriptions.add( - this.dataService.studentWorkReceived$.subscribe((componentState) => { + this.studentDataService.studentWorkReceived$.subscribe((componentState) => { if ( (this.isWorkFromThisComponent(componentState) || this.isFromConnectedComponent(componentState)) && @@ -394,15 +367,15 @@ export class DiscussionStudent extends ComponentStudent { componentState.studentData.isSubmit = this.isSubmit; this.isSubmit = false; if (this.mode === 'authoring') { - if (this.dataService.studentData == null) { - this.dataService.studentData = { + if (this.studentDataService.studentData == null) { + this.studentDataService.studentData = { componentStates: [], events: [], annotations: [] }; } - this.dataService.studentData.componentStates.push(componentState); - const componentStates = this.dataService.getComponentStatesByNodeIdAndComponentId( + this.studentDataService.studentData.componentStates.push(componentState); + const componentStates = this.studentDataService.getComponentStatesByNodeIdAndComponentId( this.nodeId, this.componentId ); diff --git a/src/assets/wise5/components/draw/draw-student/draw-student.component.ts b/src/assets/wise5/components/draw/draw-student/draw-student.component.ts index fbf2ec9683d..66fe98a7c4c 100644 --- a/src/assets/wise5/components/draw/draw-student/draw-student.component.ts +++ b/src/assets/wise5/components/draw/draw-student/draw-student.component.ts @@ -1,16 +1,8 @@ import { fabric } from 'fabric'; -import { Component, ViewEncapsulation } from '@angular/core'; -import { AnnotationService } from '../../../services/annotationService'; -import { ConfigService } from '../../../services/configService'; -import { NodeService } from '../../../services/nodeService'; -import { NotebookService } from '../../../services/notebookService'; +import { Component, inject, ViewEncapsulation } from '@angular/core'; import { ProjectService } from '../../../services/projectService'; -import { StudentAssetService } from '../../../services/studentAssetService'; -import { StudentDataService } from '../../../services/studentDataService'; import { ComponentStudent } from '../../component-student.component'; -import { ComponentService } from '../../componentService'; import { DrawService } from '../drawService'; -import { MatDialog } from '@angular/material/dialog'; import { copy } from '../../../common/object/object'; import { convertToPNGFile } from '../../../common/canvas/canvas'; import { hasConnectedComponent } from '../../../common/ComponentContent'; @@ -35,39 +27,17 @@ import { ComponentAnnotationsComponent } from '../../../directives/componentAnno templateUrl: 'draw-student.component.html' }) export class DrawStudent extends ComponentStudent { + private drawService = inject(DrawService); drawingTool: any; drawingToolId: string; height: number = 600; latestConnectedComponentState: any; parentStudentWorkIds: number[] = null; + private projectService = inject(ProjectService); isResetButtonVisible: boolean = true; showCopyPublicNotebookItemButton: boolean = false; width: number = 800; - constructor( - protected annotationService: AnnotationService, - protected componentService: ComponentService, - protected configService: ConfigService, - protected dialog: MatDialog, - private drawService: DrawService, - protected nodeService: NodeService, - protected notebookService: NotebookService, - private projectService: ProjectService, - protected studentAssetService: StudentAssetService, - protected studentDataService: StudentDataService - ) { - super( - annotationService, - componentService, - configService, - dialog, - nodeService, - notebookService, - studentAssetService, - studentDataService - ); - } - ngOnInit(): void { super.ngOnInit(); const domIdEnding = this.drawService.getDomIdEnding( diff --git a/src/assets/wise5/components/embedded/embedded-student/embedded-student.component.ts b/src/assets/wise5/components/embedded/embedded-student/embedded-student.component.ts index 5f69f465b0a..b75d4ece07e 100644 --- a/src/assets/wise5/components/embedded/embedded-student/embedded-student.component.ts +++ b/src/assets/wise5/components/embedded/embedded-student/embedded-student.component.ts @@ -1,16 +1,8 @@ import html2canvas from 'html2canvas'; -import { ChangeDetectorRef, Component } from '@angular/core'; -import { AnnotationService } from '../../../services/annotationService'; -import { ConfigService } from '../../../services/configService'; -import { NodeService } from '../../../services/nodeService'; -import { NotebookService } from '../../../services/notebookService'; -import { StudentAssetService } from '../../../services/studentAssetService'; -import { StudentDataService } from '../../../services/studentDataService'; +import { ChangeDetectorRef, Component, inject } from '@angular/core'; import { ComponentStudent } from '../../component-student.component'; -import { ComponentService } from '../../componentService'; import { EmbeddedService } from '../embeddedService'; import { DomSanitizer, SafeUrl } from '@angular/platform-browser'; -import { MatDialog } from '@angular/material/dialog'; import { copy } from '../../../common/object/object'; import { convertToPNGFile } from '../../../common/canvas/canvas'; import { AddToNotebookButtonComponent } from '../../../directives/add-to-notebook-button/add-to-notebook-button.component'; @@ -29,9 +21,11 @@ import { ComponentAnnotationsComponent } from '../../../directives/componentAnno }) export class EmbeddedStudent extends ComponentStudent { annotationsToSave: any[] = []; + private changeDetectorRef = inject(ChangeDetectorRef); componentStateId: number; componentType: string; embeddedApplicationIFrameId: string; + private embeddedService = inject(EmbeddedService); height: string = '600px'; maxWidth: number; maxHeight: number; @@ -72,35 +66,11 @@ export class EmbeddedStudent extends ComponentStudent { } }; notebookConfig: any; + private sanitizer = inject(DomSanitizer); studentData: any; url: SafeUrl; width: string = '100%'; - constructor( - protected annotationService: AnnotationService, - private changeDetectorRef: ChangeDetectorRef, - protected componentService: ComponentService, - protected configService: ConfigService, - protected dialog: MatDialog, - private embeddedService: EmbeddedService, - protected nodeService: NodeService, - protected notebookService: NotebookService, - private sanitizer: DomSanitizer, - protected studentAssetService: StudentAssetService, - protected studentDataService: StudentDataService - ) { - super( - annotationService, - componentService, - configService, - dialog, - nodeService, - notebookService, - studentAssetService, - studentDataService - ); - } - ngOnInit(): void { super.ngOnInit(); this.setWidthAndHeight(this.componentContent.width, this.componentContent.height); diff --git a/src/assets/wise5/components/graph/graph-student/graph-student.component.ts b/src/assets/wise5/components/graph/graph-student/graph-student.component.ts index b580ce6ab85..c7008fc9102 100644 --- a/src/assets/wise5/components/graph/graph-student/graph-student.component.ts +++ b/src/assets/wise5/components/graph/graph-student/graph-student.component.ts @@ -1,18 +1,17 @@ -import { ChangeDetectorRef, Component, ElementRef, HostListener, ViewChild } from '@angular/core'; -import { AnnotationService } from '../../../services/annotationService'; -import { ConfigService } from '../../../services/configService'; -import { NodeService } from '../../../services/nodeService'; -import { NotebookService } from '../../../services/notebookService'; +import { + ChangeDetectorRef, + Component, + ElementRef, + HostListener, + inject, + ViewChild +} from '@angular/core'; import { ProjectService } from '../../../services/projectService'; -import { StudentAssetService } from '../../../services/studentAssetService'; -import { StudentDataService } from '../../../services/studentDataService'; import { ComponentStudent } from '../../component-student.component'; -import { ComponentService } from '../../componentService'; import { GraphService } from '../graphService'; import * as Highcharts from 'highcharts'; import HC_exporting from 'highcharts/modules/exporting'; import { Canvg } from 'canvg'; -import { MatDialog } from '@angular/material/dialog'; import { GraphContent } from '../GraphContent'; import { copy } from '../../../common/object/object'; import { convertToPNGFile } from '../../../common/canvas/canvas'; @@ -66,11 +65,13 @@ export class GraphStudent extends ComponentStudent { backgroundImage: string = null; canCreateNewTrials: boolean = false; canDeleteTrials: boolean = false; + private changeDetectorRef = inject(ChangeDetectorRef); chartCallback: any; chartConfig: any; chartId: string = 'chart1'; fileName: string; graphConnectedComponentManager: GraphConnectedComponentManager; + private graphService = inject(GraphService); graphType: string; hasCustomLegendBeenSet: boolean = false; height: number = null; @@ -91,6 +92,7 @@ export class GraphStudent extends ComponentStudent { plotLineManager: PlotLineManager; previousComponentState: any; previousTrialIdsToShow: string[]; + private projectService = inject(ProjectService); rectangle: any; series: any[] = []; seriesMarkers: string[] = ['circle', 'square', 'diamond', 'triangle', 'triangle-down', 'circle']; @@ -111,31 +113,6 @@ export class GraphStudent extends ComponentStudent { yAxis: any; yAxisLocked: boolean; - constructor( - protected annotationService: AnnotationService, - private changeDetectorRef: ChangeDetectorRef, - protected componentService: ComponentService, - protected configService: ConfigService, - protected dialog: MatDialog, - private graphService: GraphService, - protected nodeService: NodeService, - protected notebookService: NotebookService, - private projectService: ProjectService, - protected studentAssetService: StudentAssetService, - protected studentDataService: StudentDataService - ) { - super( - annotationService, - componentService, - configService, - dialog, - nodeService, - notebookService, - studentAssetService, - studentDataService - ); - } - ngOnInit(): void { super.ngOnInit(); this.chartId = 'chart_' + this.componentId; diff --git a/src/assets/wise5/components/html/html-student/html-student.component.ts b/src/assets/wise5/components/html/html-student/html-student.component.ts index f07f8fdd315..98b6610e027 100644 --- a/src/assets/wise5/components/html/html-student/html-student.component.ts +++ b/src/assets/wise5/components/html/html-student/html-student.component.ts @@ -1,15 +1,7 @@ -import { Component } from '@angular/core'; -import { MatDialog } from '@angular/material/dialog'; +import { Component, inject } from '@angular/core'; import { SafeHtml } from '@angular/platform-browser'; import { WiseLinkService } from '../../../../../app/services/wiseLinkService'; -import { AnnotationService } from '../../../services/annotationService'; -import { ConfigService } from '../../../services/configService'; -import { NodeService } from '../../../services/nodeService'; -import { NotebookService } from '../../../services/notebookService'; -import { StudentAssetService } from '../../../services/studentAssetService'; -import { StudentDataService } from '../../../services/studentDataService'; import { ComponentStudent } from '../../component-student.component'; -import { ComponentService } from '../../componentService'; @Component({ selector: 'html-student', @@ -18,29 +10,7 @@ import { ComponentService } from '../../componentService'; }) export class HtmlStudentComponent extends ComponentStudent { protected html: SafeHtml = ''; - - constructor( - protected annotationService: AnnotationService, - protected componentService: ComponentService, - protected configService: ConfigService, - protected dialog: MatDialog, - protected nodeService: NodeService, - protected notebookService: NotebookService, - protected studentAssetService: StudentAssetService, - protected studentDataService: StudentDataService, - private wiseLinkService: WiseLinkService - ) { - super( - annotationService, - componentService, - configService, - dialog, - nodeService, - notebookService, - studentAssetService, - studentDataService - ); - } + private wiseLinkService = inject(WiseLinkService); ngOnInit(): void { super.ngOnInit(); diff --git a/src/assets/wise5/components/label/label-student/label-student.component.ts b/src/assets/wise5/components/label/label-student/label-student.component.ts index d61e884d8a7..4401a1d32fe 100644 --- a/src/assets/wise5/components/label/label-student/label-student.component.ts +++ b/src/assets/wise5/components/label/label-student/label-student.component.ts @@ -1,21 +1,14 @@ import { fabric } from 'fabric'; -import { ChangeDetectorRef, Component } from '@angular/core'; +import { ChangeDetectorRef, Component, inject } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { MatButtonModule } from '@angular/material/button'; import { MatIconModule } from '@angular/material/icon'; import { MatFormFieldModule } from '@angular/material/form-field'; import { MatInputModule } from '@angular/material/input'; import { MatTooltipModule } from '@angular/material/tooltip'; -import { MatDialog, MatDialogModule } from '@angular/material/dialog'; -import { AnnotationService } from '../../../services/annotationService'; -import { ConfigService } from '../../../services/configService'; -import { NodeService } from '../../../services/nodeService'; -import { NotebookService } from '../../../services/notebookService'; -import { StudentDataService } from '../../../services/studentDataService'; +import { MatDialogModule } from '@angular/material/dialog'; import { ComponentStudent } from '../../component-student.component'; -import { ComponentService } from '../../componentService'; import { LabelService } from '../labelService'; -import { StudentAssetService } from '../../../services/studentAssetService'; import { convertToPNGFile } from '../../../common/canvas/canvas'; import { wordWrap } from '../../../common/string/string'; import { hasConnectedComponent } from '../../../common/ComponentContent'; @@ -69,29 +62,8 @@ export class LabelStudentComponent extends ComponentStudent { studentDataVersion: number = 2; textZIndex: number = 1; - constructor( - protected annotationService: AnnotationService, - private changeDetector: ChangeDetectorRef, - protected componentService: ComponentService, - protected configService: ConfigService, - protected dialog: MatDialog, - private labelService: LabelService, - protected nodeService: NodeService, - protected notebookService: NotebookService, - protected studentAssetService: StudentAssetService, - protected studentDataService: StudentDataService - ) { - super( - annotationService, - componentService, - configService, - dialog, - nodeService, - notebookService, - studentAssetService, - studentDataService - ); - } + private changeDetector = inject(ChangeDetectorRef); + private labelService = inject(LabelService); ngOnInit(): void { super.ngOnInit(); diff --git a/src/assets/wise5/components/match/match-student/match-student-default/match-student-default.component.ts b/src/assets/wise5/components/match/match-student/match-student-default/match-student-default.component.ts index 23edef54b1e..a4d04ad808a 100644 --- a/src/assets/wise5/components/match/match-student/match-student-default/match-student-default.component.ts +++ b/src/assets/wise5/components/match/match-student/match-student-default/match-student-default.component.ts @@ -1,6 +1,5 @@ import { AddChoiceButtonComponent } from '../add-choice-button/add-choice-button.component'; import { AddMatchChoiceDialogComponent } from '../add-match-choice-dialog/add-match-choice-dialog'; -import { AnnotationService } from '../../../../services/annotationService'; import { Bucket, mergeBucket } from '../../bucket'; import { CdkDragEnter, @@ -10,13 +9,11 @@ import { } from '@angular/cdk/drag-drop'; import { Choice, createChoiceFromNotebookItem } from '../../choice'; import { CommonModule } from '@angular/common'; -import { Component } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { ComponentAnnotationsComponent } from '../../../../directives/componentAnnotations/component-annotations.component'; import { ComponentHeaderComponent } from '../../../../directives/component-header/component-header.component'; import { ComponentSaveSubmitButtonsComponent } from '../../../../directives/component-save-submit-buttons/component-save-submit-buttons.component'; -import { ComponentService } from '../../../componentService'; import { ComponentStudent } from '../../../component-student.component'; -import { ConfigService } from '../../../../services/configService'; import { Container } from '../container'; import { copy } from '../../../../common/object/object'; import { CRaterService } from '../../../../services/cRaterService'; @@ -30,13 +27,8 @@ import { MatchCdkDragDrop } from '../MatchCdkDragDrop'; import { MatchChoiceItemComponent } from '../../match-choice-item/match-choice-item.component'; import { MatchFeedbackSectionComponent } from '../match-feedback-section/match-feedback-section.component'; import { MatchService } from '../../matchService'; -import { MatDialog } from '@angular/material/dialog'; -import { NodeService } from '../../../../services/nodeService'; import { NotebookItem } from '../../../../common/notebook/notebookItem'; -import { NotebookService } from '../../../../services/notebookService'; import { ProjectService } from '../../../../services/projectService'; -import { StudentAssetService } from '../../../../services/studentAssetService'; -import { StudentDataService } from '../../../../services/studentDataService'; import { CRaterIdea } from '../../../common/cRater/CRaterIdea'; @Component({ @@ -56,37 +48,15 @@ import { CRaterIdea } from '../../../common/cRater/CRaterIdea'; export class MatchStudentDefaultComponent extends ComponentStudent { protected buckets: any[] = []; protected choices: Choice[] = []; + private cRaterService = inject(CRaterService); protected hasCorrectAnswer: boolean = false; protected isCorrect: boolean = false; protected isLatestComponentStateSubmit: boolean = false; + protected matchService = inject(MatchService); + private projectService = inject(ProjectService); private sourceBucket: any; protected sourceBucketId: string = '0'; - constructor( - protected annotationService: AnnotationService, - protected assetService: StudentAssetService, - protected componentService: ComponentService, - protected configService: ConfigService, - private craterService: CRaterService, - protected dataService: StudentDataService, - protected dialog: MatDialog, - protected matchService: MatchService, - protected nodeService: NodeService, - protected notebookService: NotebookService, - private projectService: ProjectService - ) { - super( - annotationService, - componentService, - configService, - dialog, - nodeService, - notebookService, - assetService, - dataService - ); - } - ngOnInit(): void { super.ngOnInit(); this.hasCorrectAnswer = this.matchService.componentHasCorrectAnswer(this.componentContent); @@ -228,10 +198,11 @@ export class MatchStudentDefaultComponent extends ComponentStudent { * since. This will also determine if submit is dirty. */ private processPreviousStudentWork(): void { - const latestComponentState = this.dataService.getLatestComponentStateByNodeIdAndComponentId( - this.nodeId, - this.componentId - ); + const latestComponentState = + this.studentDataService.getLatestComponentStateByNodeIdAndComponentId( + this.nodeId, + this.componentId + ); if (latestComponentState == null) { return; } @@ -240,7 +211,7 @@ export class MatchStudentDefaultComponent extends ComponentStudent { this.setGeneralComponentStatus(latestComponentState.isCorrect, false); this.checkAnswer(); } else { - const latestSubmitComponentState = this.dataService.getLatestSubmitComponentState( + const latestSubmitComponentState = this.studentDataService.getLatestSubmitComponentState( this.nodeId, this.componentId ); @@ -258,17 +229,18 @@ export class MatchStudentDefaultComponent extends ComponentStudent { } private processDirtyStudentWork(): void { - const latestSubmitComponentState = this.dataService.getLatestSubmitComponentState( + const latestSubmitComponentState = this.studentDataService.getLatestSubmitComponentState( this.nodeId, this.componentId ); if (latestSubmitComponentState != null) { this.showFeedbackOnUnchangedChoices(latestSubmitComponentState); } else { - const latestComponentState = this.dataService.getLatestComponentStateByNodeIdAndComponentId( - this.nodeId, - this.componentId - ); + const latestComponentState = + this.studentDataService.getLatestComponentStateByNodeIdAndComponentId( + this.nodeId, + this.componentId + ); if (latestComponentState != null) { this.isCorrect = null; this.setIsSubmitDirty(true); @@ -600,7 +572,7 @@ export class MatchStudentDefaultComponent extends ComponentStudent { } else if (componentState.componentType === 'DialogGuidance') { this.addIdeasToSourceBucket( componentState.studentData.responses, - this.craterService.getCRaterRubric(componentState.nodeId, componentState.componentId) + this.cRaterService.getCRaterRubric(componentState.nodeId, componentState.componentId) ); } }); diff --git a/src/assets/wise5/components/multipleChoice/multiple-choice-student/multiple-choice-student.component.ts b/src/assets/wise5/components/multipleChoice/multiple-choice-student/multiple-choice-student.component.ts index ef3dab2fe3d..e0d8b444dd2 100644 --- a/src/assets/wise5/components/multipleChoice/multiple-choice-student/multiple-choice-student.component.ts +++ b/src/assets/wise5/components/multipleChoice/multiple-choice-student/multiple-choice-student.component.ts @@ -1,13 +1,5 @@ -import { Component } from '@angular/core'; -import { MatDialog } from '@angular/material/dialog'; -import { AnnotationService } from '../../../services/annotationService'; -import { ConfigService } from '../../../services/configService'; -import { NodeService } from '../../../services/nodeService'; -import { NotebookService } from '../../../services/notebookService'; -import { StudentAssetService } from '../../../services/studentAssetService'; -import { StudentDataService } from '../../../services/studentDataService'; +import { Component, inject } from '@angular/core'; import { ComponentStudent } from '../../component-student.component'; -import { ComponentService } from '../../componentService'; import { MultipleChoiceComponent } from '../MultipleChoiceComponent'; import { MultipleChoiceService } from '../multipleChoiceService'; import { MultipleChoiceContent } from '../MultipleChoiceContent'; @@ -38,33 +30,11 @@ export class MultipleChoiceStudentComponent extends ComponentStudent { protected componentHasCorrectAnswer: boolean; isCorrect: boolean; protected isLatestComponentStateSubmit: boolean; + private multipleChoiceService = inject(MultipleChoiceService); private originalComponentContent: MultipleChoiceContent; protected showFeedback: boolean; studentChoices: string | string[]; - constructor( - protected annotationService: AnnotationService, - protected componentService: ComponentService, - protected configService: ConfigService, - protected dataService: StudentDataService, - protected dialog: MatDialog, - private multipleChoiceService: MultipleChoiceService, - protected nodeService: NodeService, - protected notebookService: NotebookService, - protected studentAssetService: StudentAssetService - ) { - super( - annotationService, - componentService, - configService, - dialog, - nodeService, - notebookService, - studentAssetService, - dataService - ); - } - ngOnInit(): void { super.ngOnInit(); this.originalComponentContent = copy(this.component.content); @@ -103,7 +73,7 @@ export class MultipleChoiceStudentComponent extends ComponentStudent { handleConnectedComponents(): void { for (const connectedComponent of this.componentContent.connectedComponents) { - const componentState = this.dataService.getLatestComponentStateByNodeIdAndComponentId( + const componentState = this.studentDataService.getLatestComponentStateByNodeIdAndComponentId( connectedComponent.nodeId, connectedComponent.componentId ); @@ -225,7 +195,7 @@ export class MultipleChoiceStudentComponent extends ComponentStudent { } if (submitTriggeredBy == null || submitTriggeredBy === 'componentSubmitButton') { - this.dataService.broadcastComponentSubmitTriggered({ + this.studentDataService.broadcastComponentSubmitTriggered({ nodeId: this.component.nodeId, componentId: this.component.id }); diff --git a/src/assets/wise5/components/openResponse/open-response-student/open-response-student.component.ts b/src/assets/wise5/components/openResponse/open-response-student/open-response-student.component.ts index 4ad4fa63d51..c6cf92a42a0 100644 --- a/src/assets/wise5/components/openResponse/open-response-student/open-response-student.component.ts +++ b/src/assets/wise5/components/openResponse/open-response-student/open-response-student.component.ts @@ -1,18 +1,10 @@ -import { ChangeDetectorRef, Component } from '@angular/core'; -import { MatDialog } from '@angular/material/dialog'; +import { ChangeDetectorRef, Component, inject } from '@angular/core'; import { timeout } from 'rxjs/operators'; import { DialogWithoutCloseComponent } from '../../../directives/dialog-without-close/dialog-without-close.component'; -import { AnnotationService } from '../../../services/annotationService'; -import { ConfigService } from '../../../services/configService'; import { CRaterService } from '../../../services/cRaterService'; -import { NodeService } from '../../../services/nodeService'; -import { NotebookService } from '../../../services/notebookService'; import { NotificationService } from '../../../services/notificationService'; import { ProjectService } from '../../../services/projectService'; -import { StudentAssetService } from '../../../services/studentAssetService'; -import { StudentDataService } from '../../../services/studentDataService'; import { ComponentStudent } from '../../component-student.component'; -import { ComponentService } from '../../componentService'; import { CRaterResponse } from '../../common/cRater/CRaterResponse'; import { FeedbackRuleEvaluator } from '../../common/feedbackRule/FeedbackRuleEvaluator'; import { FeedbackRule } from '../../common/feedbackRule/FeedbackRule'; @@ -62,33 +54,16 @@ export class OpenResponseStudent extends ComponentStudent { protected speechToTextEnabled: boolean; studentResponse: string = ''; - constructor( - protected annotationService: AnnotationService, - private changeDetector: ChangeDetectorRef, - protected componentService: ComponentService, - private constraintService: ConstraintService, - protected configService: ConfigService, - private cRaterPingService: CRaterPingService, - private cRaterService: CRaterService, - protected dialog: MatDialog, - private openResponseService: OpenResponseService, - protected nodeService: NodeService, - protected notebookService: NotebookService, - private notificationService: NotificationService, - private projectService: ProjectService, - protected studentAssetService: StudentAssetService, - protected studentDataService: StudentDataService - ) { - super( - annotationService, - componentService, - configService, - dialog, - nodeService, - notebookService, - studentAssetService, - studentDataService - ); + private changeDetector = inject(ChangeDetectorRef); + private constraintService = inject(ConstraintService); + private cRaterPingService = inject(CRaterPingService); + private cRaterService = inject(CRaterService); + private notificationService = inject(NotificationService); + protected openResponseService = inject(OpenResponseService); + private projectService = inject(ProjectService); + + constructor() { + super(); this.speechToTextEnabled = this.projectService.getSpeechToTextSettings()?.enabled; } diff --git a/src/assets/wise5/components/outsideURL/outside-url-student/outside-url-student.component.ts b/src/assets/wise5/components/outsideURL/outside-url-student/outside-url-student.component.ts index 11591ac99df..45e2a86a975 100644 --- a/src/assets/wise5/components/outsideURL/outside-url-student/outside-url-student.component.ts +++ b/src/assets/wise5/components/outsideURL/outside-url-student/outside-url-student.component.ts @@ -1,48 +1,18 @@ -import { Component } from '@angular/core'; -import { MatDialog } from '@angular/material/dialog'; +import { Component, inject } from '@angular/core'; import { DomSanitizer, SafeUrl } from '@angular/platform-browser'; -import { AnnotationService } from '../../../services/annotationService'; -import { ConfigService } from '../../../services/configService'; -import { NodeService } from '../../../services/nodeService'; -import { NotebookService } from '../../../services/notebookService'; -import { StudentAssetService } from '../../../services/studentAssetService'; -import { StudentDataService } from '../../../services/studentDataService'; import { ComponentStudent } from '../../component-student.component'; -import { ComponentService } from '../../componentService'; @Component({ selector: 'outside-url-student', templateUrl: 'outside-url-student.component.html' }) export class OutsideUrlStudent extends ComponentStudent { - url: SafeUrl; - infoUrl: SafeUrl; + height: string; infoString: string; + infoUrl: SafeUrl; + protected sanitizer = inject(DomSanitizer); + url: SafeUrl; width: string; - height: string; - - constructor( - protected annotationService: AnnotationService, - protected componentService: ComponentService, - protected configService: ConfigService, - protected dialog: MatDialog, - protected nodeService: NodeService, - protected notebookService: NotebookService, - protected sanitizer: DomSanitizer, - protected studentAssetService: StudentAssetService, - protected studentDataService: StudentDataService - ) { - super( - annotationService, - componentService, - configService, - dialog, - nodeService, - notebookService, - studentAssetService, - studentDataService - ); - } ngOnInit(): void { super.ngOnInit(); diff --git a/src/assets/wise5/components/peerChat/peer-chat-student/peer-chat-student.component.ts b/src/assets/wise5/components/peerChat/peer-chat-student/peer-chat-student.component.ts index 4559e05d6fd..ee5b6dc7beb 100644 --- a/src/assets/wise5/components/peerChat/peer-chat-student/peer-chat-student.component.ts +++ b/src/assets/wise5/components/peerChat/peer-chat-student/peer-chat-student.component.ts @@ -1,19 +1,11 @@ -import { ChangeDetectorRef, Component } from '@angular/core'; -import { MatDialog } from '@angular/material/dialog'; +import { ChangeDetectorRef, Component, inject } from '@angular/core'; import { forkJoin, Observable } from 'rxjs'; import { timeout } from 'rxjs/operators'; -import { AnnotationService } from '../../../services/annotationService'; -import { ConfigService } from '../../../services/configService'; -import { NodeService } from '../../../services/nodeService'; -import { NotebookService } from '../../../services/notebookService'; import { NotificationService } from '../../../services/notificationService'; import { PeerGroupService } from '../../../services/peerGroupService'; -import { StudentAssetService } from '../../../services/studentAssetService'; -import { StudentDataService } from '../../../services/studentDataService'; import { StudentWebSocketService } from '../../../services/studentWebSocketService'; import { FeedbackRule } from '../../common/feedbackRule/FeedbackRule'; import { ComponentStudent } from '../../component-student.component'; -import { ComponentService } from '../../componentService'; import { QuestionBankContent } from '../peer-chat-question-bank/QuestionBankContent'; import { QuestionBankRule } from '../peer-chat-question-bank/QuestionBankRule'; import { PeerChatComponent } from '../PeerChatComponent'; @@ -57,33 +49,12 @@ export class PeerChatStudentComponent extends ComponentStudent { requestTimeout: number = 10000; response: string = ''; - constructor( - protected annotationService: AnnotationService, - private changeDetectorRef: ChangeDetectorRef, - protected componentService: ComponentService, - protected configService: ConfigService, - protected dialog: MatDialog, - protected nodeService: NodeService, - protected notebookService: NotebookService, - private notificationService: NotificationService, - private peerChatService: PeerChatService, - private peerGroupService: PeerGroupService, - private questionBankService: QuestionBankService, - protected studentAssetService: StudentAssetService, - protected studentDataService: StudentDataService, - private studentWebSocketService: StudentWebSocketService - ) { - super( - annotationService, - componentService, - configService, - dialog, - nodeService, - notebookService, - studentAssetService, - studentDataService - ); - } + private changeDetectorRef = inject(ChangeDetectorRef); + private notificationService = inject(NotificationService); + private peerChatService = inject(PeerChatService); + private peerGroupService = inject(PeerGroupService); + private questionBankService = inject(QuestionBankService); + private studentWebSocketService = inject(StudentWebSocketService); ngOnInit(): void { super.ngOnInit(); diff --git a/src/assets/wise5/components/showMyWork/show-my-work-student/show-my-work-student.component.ts b/src/assets/wise5/components/showMyWork/show-my-work-student/show-my-work-student.component.ts index b662ef0bc9a..5faefa69d0b 100644 --- a/src/assets/wise5/components/showMyWork/show-my-work-student/show-my-work-student.component.ts +++ b/src/assets/wise5/components/showMyWork/show-my-work-student/show-my-work-student.component.ts @@ -1,14 +1,6 @@ -import { Component } from '@angular/core'; -import { MatDialog } from '@angular/material/dialog'; -import { AnnotationService } from '../../../services/annotationService'; -import { ConfigService } from '../../../services/configService'; -import { NodeService } from '../../../services/nodeService'; -import { NotebookService } from '../../../services/notebookService'; +import { Component, inject } from '@angular/core'; import { ProjectService } from '../../../services/projectService'; -import { StudentAssetService } from '../../../services/studentAssetService'; -import { StudentDataService } from '../../../services/studentDataService'; import { ComponentStudent } from '../../component-student.component'; -import { ComponentService } from '../../componentService'; import { ComponentHeaderComponent } from '../../../directives/component-header/component-header.component'; import { MatCard, MatCardContent } from '@angular/material/card'; import { ShowWorkStudentComponent } from '../../showWork/show-work-student/show-work-student.component'; @@ -19,34 +11,12 @@ import { ShowWorkStudentComponent } from '../../showWork/show-work-student/show- templateUrl: './show-my-work-student.component.html' }) export class ShowMyWorkStudentComponent extends ComponentStudent { + protected projectService = inject(ProjectService); showWorkComponentContent: any; showWorkComponentId: string; showWorkNodeId: string; studentWork: any; - constructor( - protected annotationService: AnnotationService, - protected componentService: ComponentService, - protected configService: ConfigService, - protected dialog: MatDialog, - protected nodeService: NodeService, - protected notebookService: NotebookService, - protected projectService: ProjectService, - protected studentAssetService: StudentAssetService, - protected studentDataService: StudentDataService - ) { - super( - annotationService, - componentService, - configService, - dialog, - nodeService, - notebookService, - studentAssetService, - studentDataService - ); - } - ngOnInit(): void { super.ngOnInit(); this.showWorkComponentContent = this.projectService.getComponent( diff --git a/src/assets/wise5/components/summary/summary-student/summary-student.component.ts b/src/assets/wise5/components/summary/summary-student/summary-student.component.ts index feb0415947d..d7282a2e665 100644 --- a/src/assets/wise5/components/summary/summary-student/summary-student.component.ts +++ b/src/assets/wise5/components/summary/summary-student/summary-student.component.ts @@ -1,14 +1,6 @@ -import { Component, Input } from '@angular/core'; -import { MatDialog } from '@angular/material/dialog'; -import { AnnotationService } from '../../../services/annotationService'; -import { ConfigService } from '../../../services/configService'; -import { NodeService } from '../../../services/nodeService'; -import { NotebookService } from '../../../services/notebookService'; +import { Component, inject, Input } from '@angular/core'; import { ProjectService } from '../../../services/projectService'; -import { StudentAssetService } from '../../../services/studentAssetService'; -import { StudentDataService } from '../../../services/studentDataService'; import { ComponentStudent } from '../../component-student.component'; -import { ComponentService } from '../../componentService'; import { CompletionService } from '../../../services/completionService'; import { StudentSummaryDisplay } from '../../../directives/student-summary-display/student-summary-display.component'; @@ -19,6 +11,7 @@ import { StudentSummaryDisplay } from '../../../directives/student-summary-displ }) export class SummaryStudent extends ComponentStudent { chartType: string; + private completionService = inject(CompletionService); customLabelColors: any[]; highlightCorrectAnswer: boolean; isShowDisplay: boolean; @@ -26,6 +19,7 @@ export class SummaryStudent extends ComponentStudent { otherPrompt: string; otherStepTitle: string; @Input() periodId: number; + private projectService = inject(ProjectService); prompt: string; source: string; studentDataType: string; @@ -33,30 +27,6 @@ export class SummaryStudent extends ComponentStudent { summaryComponentId: string; warningMessage: string = ''; - constructor( - protected annotationService: AnnotationService, - private completionService: CompletionService, - protected componentService: ComponentService, - protected configService: ConfigService, - protected dialog: MatDialog, - protected nodeService: NodeService, - protected notebookService: NotebookService, - private projectService: ProjectService, - protected studentAssetService: StudentAssetService, - protected studentDataService: StudentDataService - ) { - super( - annotationService, - componentService, - configService, - dialog, - nodeService, - notebookService, - studentAssetService, - studentDataService - ); - } - ngOnInit(): void { super.ngOnInit(); this.summaryNodeId = this.componentContent.summaryNodeId; diff --git a/src/assets/wise5/components/table/table-student/table-student.component.ts b/src/assets/wise5/components/table/table-student/table-student.component.ts index 4fb57320eb2..fdc46d3ed76 100644 --- a/src/assets/wise5/components/table/table-student/table-student.component.ts +++ b/src/assets/wise5/components/table/table-student/table-student.component.ts @@ -1,17 +1,9 @@ import html2canvas from 'html2canvas'; -import { ChangeDetectorRef, Component, ViewEncapsulation } from '@angular/core'; +import { ChangeDetectorRef, Component, inject, ViewEncapsulation } from '@angular/core'; import { Tabulator } from 'tabulator-tables'; -import { AnnotationService } from '../../../services/annotationService'; -import { ConfigService } from '../../../services/configService'; -import { NodeService } from '../../../services/nodeService'; -import { NotebookService } from '../../../services/notebookService'; import { ProjectService } from '../../../services/projectService'; -import { StudentAssetService } from '../../../services/studentAssetService'; -import { StudentDataService } from '../../../services/studentDataService'; import { ComponentStudent } from '../../component-student.component'; -import { ComponentService } from '../../componentService'; import { TableService } from '../tableService'; -import { MatDialog } from '@angular/material/dialog'; import { TabulatorData } from '../TabulatorData'; import { TabulatorDataService } from '../tabulatorDataService'; import { copy } from '../../../common/object/object'; @@ -75,31 +67,10 @@ export class TableStudentComponent extends ComponentStudent { tabulatorData: TabulatorData; tabulatorSorters: any[] = []; - constructor( - protected annotationService: AnnotationService, - private changeDetectorRef: ChangeDetectorRef, - protected componentService: ComponentService, - protected configService: ConfigService, - protected dialog: MatDialog, - protected nodeService: NodeService, - protected notebookService: NotebookService, - private projectService: ProjectService, - protected studentAssetService: StudentAssetService, - protected studentDataService: StudentDataService, - private tableService: TableService, - private tabulatorDataService: TabulatorDataService - ) { - super( - annotationService, - componentService, - configService, - dialog, - nodeService, - notebookService, - studentAssetService, - studentDataService - ); - } + private changeDetectorRef = inject(ChangeDetectorRef); + private projectService = inject(ProjectService); + private tableService = inject(TableService); + private tabulatorDataService = inject(TabulatorDataService); ngOnInit(): void { super.ngOnInit(); diff --git a/src/messages.xlf b/src/messages.xlf index c4d4aa490de..fd33605ecad 100644 --- a/src/messages.xlf +++ b/src/messages.xlf @@ -2457,7 +2457,7 @@ Click "Cancel" to keep the invalid JSON open so you can fix it. src/assets/wise5/components/conceptMap/concept-map-student/concept-map-student.component.ts - 416 + 386 src/assets/wise5/components/openResponse/edit-open-response-advanced/edit-open-response-advanced.component.html @@ -10320,11 +10320,11 @@ Click "Cancel" to keep the invalid JSON open so you can fix it. src/assets/wise5/components/conceptMap/concept-map-student/concept-map-student.component.ts - 425 + 395 src/assets/wise5/components/conceptMap/concept-map-student/concept-map-student.component.ts - 434 + 404 src/assets/wise5/components/match/match-authoring/match-authoring.component.html @@ -11105,7 +11105,7 @@ Click "Cancel" to keep the invalid JSON open so you can fix it. src/assets/wise5/components/match/match-student/match-student-default/match-student-default.component.ts - 124 + 94 src/assets/wise5/components/multipleChoice/multiple-choice-authoring/multiple-choice-authoring.component.html @@ -16035,7 +16035,7 @@ Are you sure you want to proceed? An error occurred. src/assets/wise5/components/aiChat/ai-chat-student/ai-chat-student.component.ts - 114 + 84 @@ -16491,7 +16491,7 @@ Are you sure you want to proceed? src/assets/wise5/components/audioOscillator/audio-oscillator-student/audio-oscillator-student.component.ts - 304 + 274 @@ -16552,15 +16552,15 @@ Are you sure you want to proceed? You do not have any more chances to receive feedback on your answer. src/assets/wise5/components/animation/animation-student/animation-student.component.ts - 926 + 896 src/assets/wise5/components/openResponse/open-response-student/open-response-student.component.ts - 203 + 178 src/assets/wise5/components/openResponse/open-response-student/open-response-student.component.ts - 219 + 194 @@ -16569,7 +16569,7 @@ Are you sure you want to proceed? Are you ready to receive feedback on this answer? src/assets/wise5/components/animation/animation-student/animation-student.component.ts - 929 + 899 @@ -16578,11 +16578,11 @@ Are you ready to receive feedback on this answer? Are you ready to receive feedback on this answer? src/assets/wise5/components/animation/animation-student/animation-student.component.ts - 933 + 903 src/assets/wise5/components/conceptMap/concept-map-student/concept-map-student.component.ts - 350 + 320 @@ -16849,7 +16849,7 @@ Are you ready to receive feedback on this answer? Stop src/assets/wise5/components/audioOscillator/audio-oscillator-student/audio-oscillator-student.component.ts - 308 + 278 @@ -17484,7 +17484,7 @@ Label: You have no more chances to receive feedback on your answer. src/assets/wise5/components/conceptMap/concept-map-student/concept-map-student.component.ts - 344 + 314 @@ -17493,18 +17493,18 @@ Label: Are you ready to receive feedback on this answer? src/assets/wise5/components/conceptMap/concept-map-student/concept-map-student.component.ts - 347 + 317 src/assets/wise5/components/openResponse/open-response-student/open-response-student.component.ts - 206 + 181 Are you sure you want to reset your work? src/assets/wise5/components/conceptMap/concept-map-student/concept-map-student.component.ts - 1433 + 1403 @@ -18040,7 +18040,7 @@ Category Name: replied to a discussion you were in! src/assets/wise5/components/discussion/discussion-student/discussion-student.component.ts - 224 + 197 @@ -18268,14 +18268,14 @@ Category Name: Are you sure you want to clear your drawing? src/assets/wise5/components/draw/draw-student/draw-student.component.ts - 212 + 182 Do you want to update the connected drawing? src/assets/wise5/components/draw/draw-student/draw-student.component.ts - 299 + 269 @@ -19192,46 +19192,46 @@ Category Name: Are you sure you want to overwrite the current line data? src/assets/wise5/components/graph/graph-student/graph-student.component.ts - 263 + 240 The series you are trying to add a point to is currently hidden. Please show the series by clicking the series name in the legend and try adding the point again. src/assets/wise5/components/graph/graph-student/graph-student.component.ts - 886 + 863 You can not edit this series. Please choose a series that can be edited. src/assets/wise5/components/graph/graph-student/graph-student.component.ts - 900 + 877 Are you sure you want to reset the series? src/assets/wise5/components/graph/graph-student/graph-student.component.ts - 1133 + 1110 Are you sure you want to reset the "" series? src/assets/wise5/components/graph/graph-student/graph-student.component.ts - 1135 + 1112 Trial src/assets/wise5/components/graph/graph-student/graph-student.component.ts - 1552 + 1529 src/assets/wise5/components/graph/graph-student/graph-student.component.ts - 2384 + 2361 @@ -19503,7 +19503,7 @@ Category Name: src/assets/wise5/components/label/label-student/label-student.component.ts - 662 + 634 @@ -19517,21 +19517,21 @@ Category Name: A New Label src/assets/wise5/components/label/label-student/label-student.component.ts - 367 + 339 Are you sure you want to reset to the initial state? src/assets/wise5/components/label/label-student/label-student.component.ts - 766 + 738 Are you sure you want to delete the background image? src/assets/wise5/components/label/label-student/label-student.component.ts - 813 + 785 @@ -19765,7 +19765,7 @@ Warning: This will delete all existing choices and buckets in this component. src/assets/wise5/components/match/match-student/match-student-default/match-student-default.component.ts - 469 + 441 src/assets/wise5/components/multipleChoice/multiple-choice-show-work/multiple-choice-show-work.component.html @@ -19796,7 +19796,7 @@ Warning: This will delete all existing choices and buckets in this component. src/assets/wise5/components/match/match-student/match-student-default/match-student-default.component.ts - 469 + 441 src/assets/wise5/components/multipleChoice/multiple-choice-show-work/multiple-choice-show-work.component.html @@ -19861,7 +19861,7 @@ Warning: This will delete all existing choices and buckets in this component.Correct bucket but wrong position src/assets/wise5/components/match/match-student/match-student-default/match-student-default.component.ts - 462 + 434 @@ -20445,7 +20445,7 @@ Current Score: Are you ready to receive feedback on this answer? src/assets/wise5/components/openResponse/open-response-student/open-response-student.component.ts - 210 + 185 @@ -20454,7 +20454,7 @@ Are you ready to receive feedback on this answer? Are you ready to receive feedback on this answer? src/assets/wise5/components/openResponse/open-response-student/open-response-student.component.ts - 222 + 197 @@ -20463,21 +20463,21 @@ Are you ready to receive feedback on this answer? Are you ready to submit this answer? src/assets/wise5/components/openResponse/open-response-student/open-response-student.component.ts - 226 + 201 We are scoring your work... src/assets/wise5/components/openResponse/open-response-student/open-response-student.component.ts - 345 + 320 Please Wait src/assets/wise5/components/openResponse/open-response-student/open-response-student.component.ts - 346 + 321 @@ -20485,7 +20485,7 @@ Are you ready to submit this answer? If this problem continues, let your teacher know and move on to the next activity. Your work will still be saved. src/assets/wise5/components/openResponse/open-response-student/open-response-student.component.ts - 369 + 344 @@ -20737,14 +20737,14 @@ If this problem continues, let your teacher know and move on to the next activit You have new chat messages src/assets/wise5/components/peerChat/peer-chat-student/peer-chat-student.component.ts - 252 + 223 Are you sure you want to replace the current text in your response input box with this text? src/assets/wise5/components/peerChat/peer-chat-student/peer-chat-student.component.ts - 302 + 273 @@ -21054,28 +21054,28 @@ If this problem continues, let your teacher know and move on to the next activit You must submit work on "" to view the summary. src/assets/wise5/components/summary/summary-student/summary-student.component.ts - 138 + 108 You must complete "" to view the summary. src/assets/wise5/components/summary/summary-student/summary-student.component.ts - 140 + 110 You must submit work on "" to view the class summary. src/assets/wise5/components/summary/summary-student/summary-student.component.ts - 146 + 116 You must complete "" to view the class summary. src/assets/wise5/components/summary/summary-student/summary-student.component.ts - 148 + 118 From c610e8c60bdbccfbc8aa7310dd80ed72e6ad24ed Mon Sep 17 00:00:00 2001 From: Hiroki Terashima Date: Thu, 4 Dec 2025 13:56:04 -0800 Subject: [PATCH 04/28] Use inject() for EditConnectedComponents and all its children components --- ...dit-connected-components-with-background.component.ts | 9 +-------- .../edit-connected-components.component.ts | 5 ++--- .../edit-discussion-connected-components.component.ts | 1 + .../edit-match-connected-components.component.ts | 4 ---- ...dit-multiple-choice-connected-components.component.ts | 4 ---- src/messages.xlf | 6 +++--- 6 files changed, 7 insertions(+), 22 deletions(-) diff --git a/src/app/authoring-tool/edit-connected-components-with-background/edit-connected-components-with-background.component.ts b/src/app/authoring-tool/edit-connected-components-with-background/edit-connected-components-with-background.component.ts index 3dd56d4fd7e..491d8568cd3 100644 --- a/src/app/authoring-tool/edit-connected-components-with-background/edit-connected-components-with-background.component.ts +++ b/src/app/authoring-tool/edit-connected-components-with-background/edit-connected-components-with-background.component.ts @@ -1,17 +1,10 @@ import { Component } from '@angular/core'; -import { ProjectService } from '../../../assets/wise5/services/projectService'; import { EditConnectedComponentsComponent } from '../edit-connected-components/edit-connected-components.component'; -@Component({ - template: '' -}) +@Component({ template: ''}) // this class needs to be a component to extends parent class and be used as a base class export class EditConnectedComponentsWithBackgroundComponent extends EditConnectedComponentsComponent { componentTypesThatCanImportWorkAsBackground: string[] = []; - constructor(protected projectService: ProjectService) { - super(projectService); - } - canConnectedComponentTypeImportWorkAsBackground(connectedComponent: any): boolean { return this.componentTypesThatCanImportWorkAsBackground.includes( this.getConnectedComponentType(connectedComponent) diff --git a/src/app/authoring-tool/edit-connected-components/edit-connected-components.component.ts b/src/app/authoring-tool/edit-connected-components/edit-connected-components.component.ts index 87aa82c6b45..6a66280963d 100644 --- a/src/app/authoring-tool/edit-connected-components/edit-connected-components.component.ts +++ b/src/app/authoring-tool/edit-connected-components/edit-connected-components.component.ts @@ -1,4 +1,4 @@ -import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'; +import { Component, EventEmitter, inject, Input, OnInit, Output } from '@angular/core'; import { ProjectService } from '../../../assets/wise5/services/projectService'; import { EditConnectedComponentsAddButtonComponent } from '../edit-connected-components-add-button/edit-connected-components-add-button.component'; import { EditConnectedComponentDefaultSelectsComponent } from '../edit-connected-component-default-selects/edit-connected-component-default-selects.component'; @@ -22,8 +22,7 @@ export class EditConnectedComponentsComponent implements OnInit { @Input() connectedComponents: any[] = []; @Output() connectedComponentsChanged: EventEmitter = new EventEmitter(); nodeIds: string[]; - - constructor(protected projectService: ProjectService) {} + protected projectService: ProjectService = inject(ProjectService); ngOnInit(): void { if (this.connectedComponents == null) { diff --git a/src/assets/wise5/components/discussion/edit-discussion-connected-components/edit-discussion-connected-components.component.ts b/src/assets/wise5/components/discussion/edit-discussion-connected-components/edit-discussion-connected-components.component.ts index a9d6373185e..0235d09e55d 100644 --- a/src/assets/wise5/components/discussion/edit-discussion-connected-components/edit-discussion-connected-components.component.ts +++ b/src/assets/wise5/components/discussion/edit-discussion-connected-components/edit-discussion-connected-components.component.ts @@ -17,6 +17,7 @@ import { EditConnectedComponentDeleteButtonComponent } from '../../../../../app/ ] }) export class EditDiscussionConnectedComponentsComponent extends EditConnectedComponentsComponent { + connectedComponentTypeChanged(connectedComponent: any) { this.changeAllDiscussionConnectedComponentTypesToMatch(connectedComponent.type); super.connectedComponentTypeChanged(connectedComponent); diff --git a/src/assets/wise5/components/match/edit-match-connected-components/edit-match-connected-components.component.ts b/src/assets/wise5/components/match/edit-match-connected-components/edit-match-connected-components.component.ts index b8eb9c75549..11b95b3a32e 100644 --- a/src/assets/wise5/components/match/edit-match-connected-components/edit-match-connected-components.component.ts +++ b/src/assets/wise5/components/match/edit-match-connected-components/edit-match-connected-components.component.ts @@ -1,7 +1,6 @@ import { Component } from '@angular/core'; import { EditConnectedComponentsComponent } from '../../../../../app/authoring-tool/edit-connected-components/edit-connected-components.component'; import { copy } from '../../../common/object/object'; -import { ProjectService } from '../../../services/projectService'; import { EditConnectedComponentsAddButtonComponent } from '../../../../../app/authoring-tool/edit-connected-components-add-button/edit-connected-components-add-button.component'; import { EditConnectedComponentDefaultSelectsComponent } from '../../../../../app/authoring-tool/edit-connected-component-default-selects/edit-connected-component-default-selects.component'; import { EditConnectedComponentDeleteButtonComponent } from '../../../../../app/authoring-tool/edit-connected-component-delete-button/edit-connected-component-delete-button.component'; @@ -19,9 +18,6 @@ import { EditConnectedComponentDeleteButtonComponent } from '../../../../../app/ ] }) export class EditMatchConnectedComponentsComponent extends EditConnectedComponentsComponent { - constructor(protected projectService: ProjectService) { - super(projectService); - } afterComponentIdChanged(connectedComponent: any): void { if (this.connectedComponentTypeIsSpecificType(connectedComponent, 'Match')) { diff --git a/src/assets/wise5/components/multipleChoice/edit-multiple-choice-connected-components/edit-multiple-choice-connected-components.component.ts b/src/assets/wise5/components/multipleChoice/edit-multiple-choice-connected-components/edit-multiple-choice-connected-components.component.ts index c99e3db1d75..a6444e458f9 100644 --- a/src/assets/wise5/components/multipleChoice/edit-multiple-choice-connected-components/edit-multiple-choice-connected-components.component.ts +++ b/src/assets/wise5/components/multipleChoice/edit-multiple-choice-connected-components/edit-multiple-choice-connected-components.component.ts @@ -1,7 +1,6 @@ import { Component } from '@angular/core'; import { EditConnectedComponentsComponent } from '../../../../../app/authoring-tool/edit-connected-components/edit-connected-components.component'; import { copy } from '../../../common/object/object'; -import { ProjectService } from '../../../services/projectService'; import { MultipleChoiceContent } from '../MultipleChoiceContent'; import { EditConnectedComponentsAddButtonComponent } from '../../../../../app/authoring-tool/edit-connected-components-add-button/edit-connected-components-add-button.component'; import { EditConnectedComponentDefaultSelectsComponent } from '../../../../../app/authoring-tool/edit-connected-component-default-selects/edit-connected-component-default-selects.component'; @@ -20,9 +19,6 @@ import { EditConnectedComponentDeleteButtonComponent } from '../../../../../app/ ] }) export class EditMultipleChoiceConnectedComponentsComponent extends EditConnectedComponentsComponent { - constructor(protected projectService: ProjectService) { - super(projectService); - } afterComponentIdChanged(connectedComponent: any): void { if (this.connectedComponentTypeIsSpecificType(connectedComponent, 'MultipleChoice')) { diff --git a/src/messages.xlf b/src/messages.xlf index 5752f23bba1..15278bc1711 100644 --- a/src/messages.xlf +++ b/src/messages.xlf @@ -1113,7 +1113,7 @@ Click "Cancel" to keep the invalid JSON open so you can fix it.Are you sure you want to delete this connected component? src/app/authoring-tool/edit-connected-components/edit-connected-components.component.ts - 77 + 76 @@ -19584,7 +19584,7 @@ Category Name: Warning: This will delete all existing choices and buckets in this component. src/assets/wise5/components/match/edit-match-connected-components/edit-match-connected-components.component.ts - 35 + 31 @@ -19921,7 +19921,7 @@ Warning: This will delete all existing choices and buckets in this component. src/assets/wise5/components/multipleChoice/edit-multiple-choice-connected-components/edit-multiple-choice-connected-components.component.ts - 36 + 32 From addc093bfb7946cff1032df7be96e1ce81f6a577 Mon Sep 17 00:00:00 2001 From: Hiroki Terashima Date: Thu, 4 Dec 2025 16:22:37 -0800 Subject: [PATCH 05/28] Use inject() for AbstractComponentAuthoring and all its children components --- .../components/AbstractComponentAuthoring.ts | 14 ++- .../animation-authoring.component.ts | 18 +--- .../audio-oscillator-authoring.component.ts | 17 +--- .../concept-map-authoring.component.ts | 17 +--- .../dialog-guidance-authoring.component.ts | 17 +--- .../draw-authoring.component.ts | 22 ++--- .../embedded-authoring.component.ts | 18 +--- .../graph-authoring.component.ts | 17 +--- .../outside-url-authoring.component.ts | 17 +--- .../show-group-work-authoring.component.ts | 15 +--- .../summary-authoring.component.ts | 23 ++--- src/messages.xlf | 86 +++++++++---------- 12 files changed, 82 insertions(+), 199 deletions(-) diff --git a/src/assets/wise5/authoringTool/components/AbstractComponentAuthoring.ts b/src/assets/wise5/authoringTool/components/AbstractComponentAuthoring.ts index 3b69a2567b9..463c108791e 100644 --- a/src/assets/wise5/authoringTool/components/AbstractComponentAuthoring.ts +++ b/src/assets/wise5/authoringTool/components/AbstractComponentAuthoring.ts @@ -1,4 +1,4 @@ -import { Directive } from '@angular/core'; +import { Directive, inject } from '@angular/core'; import { Subject, Subscription } from 'rxjs'; import { debounceTime, distinctUntilChanged } from 'rxjs/operators'; import { ProjectAssetService } from '../../../../app/services/projectAssetService'; @@ -9,6 +9,11 @@ import { moveObjectDown, moveObjectUp } from '../../common/array/array'; @Directive() export abstract class AbstractComponentAuthoring { + protected configService = inject(ConfigService); + protected nodeService = inject(TeacherNodeService); + protected projectAssetService = inject(ProjectAssetService); + protected projectService = inject(TeacherProjectService); + allowedConnectedComponentTypes: string[]; componentContent: any; componentId: string; @@ -18,13 +23,6 @@ export abstract class AbstractComponentAuthoring { promptChange: Subject = new Subject(); subscriptions: Subscription = new Subscription(); - constructor( - protected configService: ConfigService, - protected nodeService: TeacherNodeService, - protected projectAssetService: ProjectAssetService, - protected projectService: TeacherProjectService - ) {} - ngOnInit(): void { this.componentId = this.componentContent.id; this.idToOrder = this.projectService.idToOrder; diff --git a/src/assets/wise5/components/animation/animation-authoring/animation-authoring.component.ts b/src/assets/wise5/components/animation/animation-authoring/animation-authoring.component.ts index bd154f1fc1b..e7ca3d0def1 100644 --- a/src/assets/wise5/components/animation/animation-authoring/animation-authoring.component.ts +++ b/src/assets/wise5/components/animation/animation-authoring/animation-authoring.component.ts @@ -1,4 +1,4 @@ -import { Component } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { MatButton } from '@angular/material/button'; import { MatFormFieldModule } from '@angular/material/form-field'; @@ -10,14 +10,10 @@ import { MatTooltip } from '@angular/material/tooltip'; import { Subject, Subscription } from 'rxjs'; import { debounceTime, distinctUntilChanged } from 'rxjs/operators'; import { EditComponentPrompt } from '../../../../../app/authoring-tool/edit-component-prompt/edit-component-prompt.component'; -import { ProjectAssetService } from '../../../../../app/services/projectAssetService'; import { AbstractComponentAuthoring } from '../../../authoringTool/components/AbstractComponentAuthoring'; import { TranslatableAssetChooserComponent } from '../../../authoringTool/components/translatable-asset-chooser/translatable-asset-chooser.component'; import { TranslatableInputComponent } from '../../../authoringTool/components/translatable-input/translatable-input.component'; import { generateRandomKey } from '../../../common/string/string'; -import { ConfigService } from '../../../services/configService'; -import { TeacherNodeService } from '../../../services/teacherNodeService'; -import { TeacherProjectService } from '../../../services/teacherProjectService'; @Component({ templateUrl: 'animation-authoring.component.html', @@ -37,19 +33,13 @@ import { TeacherProjectService } from '../../../services/teacherProjectService'; ] }) export class AnimationAuthoring extends AbstractComponentAuthoring { - stepNodesDetails: string[]; + stepNodesDetails: string[] = this.projectService.getStepNodesDetailsInOrder(); availableDataSourceComponentTypes = ['Graph']; inputChange: Subject = new Subject(); inputChangeSubscription: Subscription; - constructor( - protected configService: ConfigService, - protected nodeService: TeacherNodeService, - protected projectAssetService: ProjectAssetService, - protected projectService: TeacherProjectService - ) { - super(configService, nodeService, projectAssetService, projectService); - this.stepNodesDetails = this.projectService.getStepNodesDetailsInOrder(); + ngOnInit(): void { + super.ngOnInit(); this.inputChangeSubscription = this.inputChange .pipe(debounceTime(1000), distinctUntilChanged()) .subscribe(() => { diff --git a/src/assets/wise5/components/audioOscillator/audio-oscillator-authoring/audio-oscillator-authoring.component.ts b/src/assets/wise5/components/audioOscillator/audio-oscillator-authoring/audio-oscillator-authoring.component.ts index f96f9e6cdac..998acf2ba3f 100644 --- a/src/assets/wise5/components/audioOscillator/audio-oscillator-authoring/audio-oscillator-authoring.component.ts +++ b/src/assets/wise5/components/audioOscillator/audio-oscillator-authoring/audio-oscillator-authoring.component.ts @@ -1,14 +1,10 @@ -import { Component } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { MatCheckbox } from '@angular/material/checkbox'; import { MatFormFieldModule } from '@angular/material/form-field'; import { MatInput } from '@angular/material/input'; import { EditComponentPrompt } from '../../../../../app/authoring-tool/edit-component-prompt/edit-component-prompt.component'; -import { ProjectAssetService } from '../../../../../app/services/projectAssetService'; import { AbstractComponentAuthoring } from '../../../authoringTool/components/AbstractComponentAuthoring'; -import { ConfigService } from '../../../services/configService'; -import { TeacherNodeService } from '../../../services/teacherNodeService'; -import { TeacherProjectService } from '../../../services/teacherProjectService'; import { AudioOscillatorService } from '../audioOscillatorService'; @Component({ @@ -17,21 +13,14 @@ import { AudioOscillatorService } from '../audioOscillatorService'; imports: [EditComponentPrompt, MatCheckbox, FormsModule, MatFormFieldModule, MatInput] }) export class AudioOscillatorAuthoring extends AbstractComponentAuthoring { + private audioOscillatorService = inject(AudioOscillatorService); + maxAmplitude: number = this.audioOscillatorService.maxAmplitude; sawtoothChecked: boolean; sineChecked: boolean; squareChecked: boolean; triangleChecked: boolean; - constructor( - protected audioOscillatorService: AudioOscillatorService, - protected configService: ConfigService, - protected nodeService: TeacherNodeService, - protected projectAssetService: ProjectAssetService, - protected projectService: TeacherProjectService - ) { - super(configService, nodeService, projectAssetService, projectService); - } ngOnInit(): void { super.ngOnInit(); diff --git a/src/assets/wise5/components/conceptMap/concept-map-authoring/concept-map-authoring.component.ts b/src/assets/wise5/components/conceptMap/concept-map-authoring/concept-map-authoring.component.ts index 37a8b7f7a7e..6a10f16434a 100644 --- a/src/assets/wise5/components/conceptMap/concept-map-authoring/concept-map-authoring.component.ts +++ b/src/assets/wise5/components/conceptMap/concept-map-authoring/concept-map-authoring.component.ts @@ -1,4 +1,4 @@ -import { Component } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { MatButton } from '@angular/material/button'; import { MatCheckbox } from '@angular/material/checkbox'; @@ -7,13 +7,9 @@ import { MatIcon } from '@angular/material/icon'; import { MatInput } from '@angular/material/input'; import { MatTooltip } from '@angular/material/tooltip'; import { EditComponentPrompt } from '../../../../../app/authoring-tool/edit-component-prompt/edit-component-prompt.component'; -import { ProjectAssetService } from '../../../../../app/services/projectAssetService'; import { AbstractComponentAuthoring } from '../../../authoringTool/components/AbstractComponentAuthoring'; import { TranslatableAssetChooserComponent } from '../../../authoringTool/components/translatable-asset-chooser/translatable-asset-chooser.component'; import { TranslatableInputComponent } from '../../../authoringTool/components/translatable-input/translatable-input.component'; -import { ConfigService } from '../../../services/configService'; -import { TeacherNodeService } from '../../../services/teacherNodeService'; -import { TeacherProjectService } from '../../../services/teacherProjectService'; import { ConceptMapService } from '../conceptMapService'; @Component({ @@ -34,18 +30,11 @@ import { ConceptMapService } from '../conceptMapService'; ] }) export class ConceptMapAuthoring extends AbstractComponentAuthoring { + private conceptMapService = inject(ConceptMapService); + availableNodes: any[]; availableLinks: any[]; - constructor( - private conceptMapService: ConceptMapService, - protected configService: ConfigService, - protected nodeService: TeacherNodeService, - protected projectAssetService: ProjectAssetService, - protected projectService: TeacherProjectService - ) { - super(configService, nodeService, projectAssetService, projectService); - } ngOnInit() { super.ngOnInit(); diff --git a/src/assets/wise5/components/dialogGuidance/dialog-guidance-authoring/dialog-guidance-authoring.component.ts b/src/assets/wise5/components/dialogGuidance/dialog-guidance-authoring/dialog-guidance-authoring.component.ts index 23989707b7e..3619798104a 100644 --- a/src/assets/wise5/components/dialogGuidance/dialog-guidance-authoring/dialog-guidance-authoring.component.ts +++ b/src/assets/wise5/components/dialogGuidance/dialog-guidance-authoring/dialog-guidance-authoring.component.ts @@ -1,15 +1,11 @@ -import { Component } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { MatCheckbox } from '@angular/material/checkbox'; import { MatFormFieldModule } from '@angular/material/form-field'; import { EditComponentMaxSubmitComponent } from '../../../../../app/authoring-tool/edit-component-max-submit/edit-component-max-submit.component'; import { EditComponentPrompt } from '../../../../../app/authoring-tool/edit-component-prompt/edit-component-prompt.component'; -import { ProjectAssetService } from '../../../../../app/services/projectAssetService'; import { AbstractComponentAuthoring } from '../../../authoringTool/components/AbstractComponentAuthoring'; import { ComputerAvatarService } from '../../../services/computerAvatarService'; -import { ConfigService } from '../../../services/configService'; -import { TeacherNodeService } from '../../../services/teacherNodeService'; -import { TeacherProjectService } from '../../../services/teacherProjectService'; import { CRaterRubric } from '../../common/cRater/CRaterRubric'; import { EditFeedbackRulesComponent } from '../../common/feedbackRule/edit-feedback-rules/edit-feedback-rules.component'; import { EditDialogGuidanceComputerAvatarComponent } from '../edit-dialog-guidance-computer-avatar/edit-dialog-guidance-computer-avatar.component'; @@ -32,15 +28,8 @@ import { EditCRaterInfoComponent } from '../../common/cRater/edit-crater-info/ed templateUrl: './dialog-guidance-authoring.component.html' }) export class DialogGuidanceAuthoringComponent extends AbstractComponentAuthoring { - constructor( - private computerAvatarService: ComputerAvatarService, - protected configService: ConfigService, - protected nodeService: TeacherNodeService, - protected projectAssetService: ProjectAssetService, - protected projectService: TeacherProjectService - ) { - super(configService, nodeService, projectAssetService, projectService); - } + private computerAvatarService = inject(ComputerAvatarService); + ngOnInit(): void { super.ngOnInit(); diff --git a/src/assets/wise5/components/draw/draw-authoring/draw-authoring.component.ts b/src/assets/wise5/components/draw/draw-authoring/draw-authoring.component.ts index 7cad90183a2..4d160604160 100644 --- a/src/assets/wise5/components/draw/draw-authoring/draw-authoring.component.ts +++ b/src/assets/wise5/components/draw/draw-authoring/draw-authoring.component.ts @@ -1,4 +1,4 @@ -import { Component } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { MatButton } from '@angular/material/button'; import { MatCheckbox } from '@angular/material/checkbox'; @@ -10,14 +10,10 @@ import { MatTooltip } from '@angular/material/tooltip'; import { Subject } from 'rxjs'; import { debounceTime, distinctUntilChanged, filter } from 'rxjs/operators'; import { EditComponentPrompt } from '../../../../../app/authoring-tool/edit-component-prompt/edit-component-prompt.component'; -import { ProjectAssetService } from '../../../../../app/services/projectAssetService'; import { AbstractComponentAuthoring } from '../../../authoringTool/components/AbstractComponentAuthoring'; import { TranslatableAssetChooserComponent } from '../../../authoringTool/components/translatable-asset-chooser/translatable-asset-chooser.component'; import { TranslatableInputComponent } from '../../../authoringTool/components/translatable-input/translatable-input.component'; import { AssetChooser } from '../../../authoringTool/project-asset-authoring/asset-chooser'; -import { ConfigService } from '../../../services/configService'; -import { TeacherNodeService } from '../../../services/teacherNodeService'; -import { TeacherProjectService } from '../../../services/teacherProjectService'; @Component({ selector: 'draw-authoring', @@ -37,6 +33,8 @@ import { TeacherProjectService } from '../../../services/teacherProjectService'; ] }) export class DrawAuthoring extends AbstractComponentAuthoring { + private dialog = inject(MatDialog); + allToolNames: string[] = [ 'select', 'line', @@ -65,14 +63,8 @@ export class DrawAuthoring extends AbstractComponentAuthoring { canvasHeightChange: Subject = new Subject(); stampImageChange: Subject = new Subject(); - constructor( - protected configService: ConfigService, - private dialog: MatDialog, - protected nodeService: TeacherNodeService, - protected projectAssetService: ProjectAssetService, - protected projectService: TeacherProjectService - ) { - super(configService, nodeService, projectAssetService, projectService); + ngOnInit() { + super.ngOnInit(); this.subscriptions.add( this.backgroundImageChange.pipe(debounceTime(1000), distinctUntilChanged()).subscribe(() => { this.updateStarterDrawDataBackgroundAndSave(); @@ -93,10 +85,6 @@ export class DrawAuthoring extends AbstractComponentAuthoring { this.updateAuthoringComponentContentStampsAndSave(); }) ); - } - - ngOnInit() { - super.ngOnInit(); this.stamps = this.convertStampStringsToStampObjects(this.componentContent.stamps.Stamps); } diff --git a/src/assets/wise5/components/embedded/embedded-authoring/embedded-authoring.component.ts b/src/assets/wise5/components/embedded/embedded-authoring/embedded-authoring.component.ts index 29881d7cc04..5773c54e9f6 100644 --- a/src/assets/wise5/components/embedded/embedded-authoring/embedded-authoring.component.ts +++ b/src/assets/wise5/components/embedded/embedded-authoring/embedded-authoring.component.ts @@ -1,4 +1,4 @@ -import { Component } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { MatCheckbox } from '@angular/material/checkbox'; import { MatFormFieldModule } from '@angular/material/form-field'; @@ -6,13 +6,9 @@ import { MatIcon } from '@angular/material/icon'; import { MatInput } from '@angular/material/input'; import { MatTooltip } from '@angular/material/tooltip'; import { AuthorUrlParametersComponent } from '../../../../../app/authoring-tool/author-url-parameters/author-url-parameters.component'; -import { ProjectAssetService } from '../../../../../app/services/projectAssetService'; import { AbstractComponentAuthoring } from '../../../authoringTool/components/AbstractComponentAuthoring'; import { TranslatableAssetChooserComponent } from '../../../authoringTool/components/translatable-asset-chooser/translatable-asset-chooser.component'; import { TranslatableTextareaComponent } from '../../../authoringTool/components/translatable-textarea/translatable-textarea.component'; -import { ConfigService } from '../../../services/configService'; -import { TeacherNodeService } from '../../../services/teacherNodeService'; -import { TeacherProjectService } from '../../../services/teacherProjectService'; import { EmbeddedService } from '../embeddedService'; @Component({ @@ -32,17 +28,9 @@ import { EmbeddedService } from '../embeddedService'; ] }) export class EmbeddedAuthoring extends AbstractComponentAuthoring { - embeddedApplicationIFrameId: string; + private embeddedService = inject(EmbeddedService); - constructor( - protected configService: ConfigService, - private embeddedService: EmbeddedService, - protected nodeService: TeacherNodeService, - protected projectAssetService: ProjectAssetService, - protected projectService: TeacherProjectService - ) { - super(configService, nodeService, projectAssetService, projectService); - } + embeddedApplicationIFrameId: string; ngOnInit(): void { super.ngOnInit(); diff --git a/src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.ts b/src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.ts index c828beaa438..f85a1cb8fe2 100644 --- a/src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.ts +++ b/src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.ts @@ -1,4 +1,4 @@ -import { Component } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { MatButton } from '@angular/material/button'; import { MatCheckbox } from '@angular/material/checkbox'; @@ -10,13 +10,9 @@ import { MatSelectModule } from '@angular/material/select'; import { MatSlideToggle } from '@angular/material/slide-toggle'; import { MatTooltip } from '@angular/material/tooltip'; import { EditComponentPrompt } from '../../../../../app/authoring-tool/edit-component-prompt/edit-component-prompt.component'; -import { ProjectAssetService } from '../../../../../app/services/projectAssetService'; import { AbstractComponentAuthoring } from '../../../authoringTool/components/AbstractComponentAuthoring'; import { TranslatableAssetChooserComponent } from '../../../authoringTool/components/translatable-asset-chooser/translatable-asset-chooser.component'; import { TranslatableInputComponent } from '../../../authoringTool/components/translatable-input/translatable-input.component'; -import { ConfigService } from '../../../services/configService'; -import { TeacherNodeService } from '../../../services/teacherNodeService'; -import { TeacherProjectService } from '../../../services/teacherProjectService'; import { GraphService } from '../graphService'; import { isMultipleYAxes } from '../util'; @@ -153,15 +149,8 @@ export class GraphAuthoring extends AbstractComponentAuthoring { enableMultipleYAxes: boolean = false; numYAxes: number = 0; - constructor( - protected configService: ConfigService, - private graphService: GraphService, - protected nodeService: TeacherNodeService, - protected projectAssetService: ProjectAssetService, - protected projectService: TeacherProjectService - ) { - super(configService, nodeService, projectAssetService, projectService); - } + private graphService = inject(GraphService); + ngOnInit(): void { super.ngOnInit(); diff --git a/src/assets/wise5/components/outsideURL/outside-url-authoring/outside-url-authoring.component.ts b/src/assets/wise5/components/outsideURL/outside-url-authoring/outside-url-authoring.component.ts index 472d241f24d..1c491016f4c 100644 --- a/src/assets/wise5/components/outsideURL/outside-url-authoring/outside-url-authoring.component.ts +++ b/src/assets/wise5/components/outsideURL/outside-url-authoring/outside-url-authoring.component.ts @@ -1,5 +1,5 @@ import { CommonModule, NgStyle } from '@angular/common'; -import { Component, ViewEncapsulation } from '@angular/core'; +import { Component, inject, ViewEncapsulation } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { MatButtonModule } from '@angular/material/button'; import { MatCard, MatCardActions, MatCardTitle } from '@angular/material/card'; @@ -11,12 +11,8 @@ import { MatSlideToggle } from '@angular/material/slide-toggle'; import { MatTooltip } from '@angular/material/tooltip'; import { Subject } from 'rxjs'; import { debounceTime, distinctUntilChanged } from 'rxjs/operators'; -import { ProjectAssetService } from '../../../../../app/services/projectAssetService'; import { AbstractComponentAuthoring } from '../../../authoringTool/components/AbstractComponentAuthoring'; import { TranslatableInputComponent } from '../../../authoringTool/components/translatable-input/translatable-input.component'; -import { ConfigService } from '../../../services/configService'; -import { TeacherNodeService } from '../../../services/teacherNodeService'; -import { TeacherProjectService } from '../../../services/teacherProjectService'; import { OutsideURLService } from '../outsideURLService'; @Component({ @@ -69,15 +65,8 @@ export class OutsideUrlAuthoring extends AbstractComponentAuthoring { widthChange: Subject = new Subject(); heightChange: Subject = new Subject(); - constructor( - protected configService: ConfigService, - protected nodeService: TeacherNodeService, - protected outsideURLService: OutsideURLService, - protected projectAssetService: ProjectAssetService, - protected projectService: TeacherProjectService - ) { - super(configService, nodeService, projectAssetService, projectService); - } + private outsideURLService = inject(OutsideURLService); + ngOnInit() { super.ngOnInit(); diff --git a/src/assets/wise5/components/showGroupWork/show-group-work-authoring/show-group-work-authoring.component.ts b/src/assets/wise5/components/showGroupWork/show-group-work-authoring/show-group-work-authoring.component.ts index 6d51ccdd042..cbac3702bf7 100644 --- a/src/assets/wise5/components/showGroupWork/show-group-work-authoring/show-group-work-authoring.component.ts +++ b/src/assets/wise5/components/showGroupWork/show-group-work-authoring/show-group-work-authoring.component.ts @@ -7,10 +7,6 @@ import { MatRadioModule } from '@angular/material/radio'; import { MatSelectModule } from '@angular/material/select'; import { EditComponentPeerGroupingTagComponent } from '../../../../../app/authoring-tool/edit-component-peer-grouping-tag/edit-component-peer-grouping-tag.component'; import { EditComponentPrompt } from '../../../../../app/authoring-tool/edit-component-prompt/edit-component-prompt.component'; -import { ProjectAssetService } from '../../../../../app/services/projectAssetService'; -import { ConfigService } from '../../../services/configService'; -import { TeacherNodeService } from '../../../services/teacherNodeService'; -import { TeacherProjectService } from '../../../services/teacherProjectService'; import { ShowMyWorkAuthoringComponent } from '../../showMyWork/show-my-work-authoring/show-my-work-authoring.component'; @Component({ @@ -28,13 +24,4 @@ import { ShowMyWorkAuthoringComponent } from '../../showMyWork/show-my-work-auth styles: ['.layout-select { margin: 8px 0 16px; } .bottom-spacing { margin-bottom: 10px; }'], templateUrl: './show-group-work-authoring.component.html' }) -export class ShowGroupWorkAuthoringComponent extends ShowMyWorkAuthoringComponent { - constructor( - protected configService: ConfigService, - protected nodeService: TeacherNodeService, - protected projectAssetService: ProjectAssetService, - protected projectService: TeacherProjectService - ) { - super(configService, nodeService, projectAssetService, projectService); - } -} +export class ShowGroupWorkAuthoringComponent extends ShowMyWorkAuthoringComponent {} diff --git a/src/assets/wise5/components/summary/summary-authoring/summary-authoring.component.ts b/src/assets/wise5/components/summary/summary-authoring/summary-authoring.component.ts index 71acec86d51..f0023799056 100644 --- a/src/assets/wise5/components/summary/summary-authoring/summary-authoring.component.ts +++ b/src/assets/wise5/components/summary/summary-authoring/summary-authoring.component.ts @@ -1,4 +1,4 @@ -import { Component } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { MatButton } from '@angular/material/button'; import { MatCheckbox } from '@angular/material/checkbox'; @@ -8,13 +8,9 @@ import { MatInput } from '@angular/material/input'; import { MatSelectModule } from '@angular/material/select'; import { MatTooltip } from '@angular/material/tooltip'; import { EditComponentPrompt } from '../../../../../app/authoring-tool/edit-component-prompt/edit-component-prompt.component'; -import { ProjectAssetService } from '../../../../../app/services/projectAssetService'; import { AbstractComponentAuthoring } from '../../../authoringTool/components/AbstractComponentAuthoring'; import { TranslatableInputComponent } from '../../../authoringTool/components/translatable-input/translatable-input.component'; import { ComponentServiceLookupService } from '../../../services/componentServiceLookupService'; -import { ConfigService } from '../../../services/configService'; -import { TeacherNodeService } from '../../../services/teacherNodeService'; -import { TeacherProjectService } from '../../../services/teacherProjectService'; import { MultipleChoiceContent } from '../../multipleChoice/MultipleChoiceContent'; import { SummaryService } from '../summaryService'; @@ -36,22 +32,13 @@ import { SummaryService } from '../summaryService'; templateUrl: 'summary-authoring.component.html' }) export class SummaryAuthoring extends AbstractComponentAuthoring { + private componentServiceLookupService = inject(ComponentServiceLookupService); + private summaryService = inject(SummaryService); + isResponsesOptionAvailable: boolean = false; isHighlightCorrectAnswerAvailable: boolean = false; isPieChartAllowed: boolean = true; - stepNodesDetails: string[]; - - constructor( - private componentServiceLookupService: ComponentServiceLookupService, - protected configService: ConfigService, - protected nodeService: TeacherNodeService, - protected projectAssetService: ProjectAssetService, - protected projectService: TeacherProjectService, - private summaryService: SummaryService - ) { - super(configService, nodeService, projectAssetService, projectService); - this.stepNodesDetails = this.projectService.getStepNodesDetailsInOrder(); - } + stepNodesDetails: string[] = this.projectService.getStepNodesDetailsInOrder(); ngOnInit(): void { super.ngOnInit(); diff --git a/src/messages.xlf b/src/messages.xlf index 15278bc1711..543ac888eb1 100644 --- a/src/messages.xlf +++ b/src/messages.xlf @@ -16445,35 +16445,35 @@ Are you sure you want to proceed? You can only have Data Points or a Data Source. If you add a Data Point, the Data Source will be deleted. Are you sure you want to add a Data Point? src/assets/wise5/components/animation/animation-authoring/animation-authoring.component.ts - 90 + 80 Are you sure you want to delete this data point? src/assets/wise5/components/animation/animation-authoring/animation-authoring.component.ts - 107 + 97 Are you sure you want to delete this object? src/assets/wise5/components/animation/animation-authoring/animation-authoring.component.ts - 164 + 154 You can only have Data Points or a Data Source. If you add a Data Source, the Data Points will be deleted. Are you sure you want to add a Data Source? src/assets/wise5/components/animation/animation-authoring/animation-authoring.component.ts - 178 + 168 Are you sure you want to delete the Data Source? src/assets/wise5/components/animation/animation-authoring/animation-authoring.component.ts - 207 + 197 @@ -17435,7 +17435,7 @@ File Name: Label: src/assets/wise5/components/conceptMap/concept-map-authoring/concept-map-authoring.component.ts - 67 + 56 @@ -17444,7 +17444,7 @@ Label: Label: src/assets/wise5/components/conceptMap/concept-map-authoring/concept-map-authoring.component.ts - 79 + 68 @@ -18254,7 +18254,7 @@ Category Name: src/assets/wise5/components/draw/draw-authoring/draw-authoring.component.ts - 260 + 248 @@ -18717,7 +18717,7 @@ Category Name: src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.ts - 142 + 138 @@ -18901,203 +18901,203 @@ Category Name: Line Plot src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.ts - 47 + 43 Column Plot src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.ts - 51 + 47 Scatter Plot src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.ts - 55 + 51 No Rounding src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.ts - 62 + 58 Integer (example 1) src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.ts - 66 + 62 Tenth (exapmle 0.1) src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.ts - 70 + 66 Hundredth (example 0.01) src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.ts - 74 + 70 Circle src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.ts - 81 + 77 Square src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.ts - 85 + 81 Triangle src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.ts - 89 + 85 Triangle Down src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.ts - 93 + 89 Diamond src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.ts - 97 + 93 Line src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.ts - 104 + 100 Point src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.ts - 108 + 104 Solid src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.ts - 115 + 111 Dash src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.ts - 119 + 115 Dot src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.ts - 123 + 119 Short Dash src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.ts - 127 + 123 Short Dot src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.ts - 131 + 127 Limits src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.ts - 138 + 134 Are you sure you want to delete the series? src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.ts - 212 + 201 Are you sure you want to delete the "" series? src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.ts - 214 + 203 Are you sure you want to delete the category? src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.ts - 246 + 235 Are you sure you want to delete the "" category? src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.ts - 248 + 237 Are you sure you want to delete the data point? src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.ts - 272 + 261 Category One src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.ts - 311 + 300 Category Two src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.ts - 311 + 300 Are you sure you want to remove multiple Y axes? src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.ts - 355 + 344 Are you sure you want to decrease the number of Y Axes? src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.ts - 448 + 437 @@ -20585,28 +20585,28 @@ If this problem continues, let your teacher know and move on to the next activit Earth and Space Sciences src/assets/wise5/components/outsideURL/outside-url-authoring/outside-url-authoring.component.ts - 51 + 47 Life Sciences src/assets/wise5/components/outsideURL/outside-url-authoring/outside-url-authoring.component.ts - 55 + 51 Physical Sciences src/assets/wise5/components/outsideURL/outside-url-authoring/outside-url-authoring.component.ts - 59 + 55 Engineering, Technology, and Applications of Science src/assets/wise5/components/outsideURL/outside-url-authoring/outside-url-authoring.component.ts - 63 + 59 @@ -21047,7 +21047,7 @@ If this problem continues, let your teacher know and move on to the next activit Are you sure you want to delete this custom label color? src/assets/wise5/components/summary/summary-authoring/summary-authoring.component.ts - 194 + 181 From 00f92fdd4d7faa16a2b83bf0b844051b3bd1fa77 Mon Sep 17 00:00:00 2001 From: Hiroki Terashima Date: Thu, 4 Dec 2025 16:34:22 -0800 Subject: [PATCH 06/28] Use inject() for ChooseNodeLocation and all its children components --- .../choose-copy-node-location.component.ts | 16 ++++------------ .../choose-move-node-location.component.ts | 15 +++------------ .../choose-node-location.component.ts | 11 ++++------- 3 files changed, 11 insertions(+), 31 deletions(-) diff --git a/src/assets/wise5/authoringTool/choose-node-location/choose-copy-node-location/choose-copy-node-location.component.ts b/src/assets/wise5/authoringTool/choose-node-location/choose-copy-node-location/choose-copy-node-location.component.ts index d586a243a17..6234b1e63e3 100644 --- a/src/assets/wise5/authoringTool/choose-node-location/choose-copy-node-location/choose-copy-node-location.component.ts +++ b/src/assets/wise5/authoringTool/choose-node-location/choose-copy-node-location/choose-copy-node-location.component.ts @@ -1,7 +1,6 @@ -import { Component } from '@angular/core'; -import { ActivatedRoute, Router, RouterLink } from '@angular/router'; +import { Component, inject } from '@angular/core'; +import { RouterLink } from '@angular/router'; import { MatButtonModule } from '@angular/material/button'; -import { TeacherProjectService } from '../../../services/teacherProjectService'; import { CopyNodesService } from '../../../services/copyNodesService'; import { ChooseNodeLocationComponent } from '../choose-node-location.component'; import { CopyTranslationsService } from '../../../services/copyTranslationsService'; @@ -25,15 +24,8 @@ import { NodeWithMoveAfterButtonComponent } from '../node-with-move-after-button templateUrl: 'choose-copy-node-location.component.html' }) export class ChooseCopyNodeLocationComponent extends ChooseNodeLocationComponent { - constructor( - private copyNodesService: CopyNodesService, - private copyTranslationsService: CopyTranslationsService, - protected projectService: TeacherProjectService, - protected route: ActivatedRoute, - protected router: Router - ) { - super(projectService, route, router); - } + private copyNodesService = inject(CopyNodesService); + private copyTranslationsService = inject(CopyTranslationsService); protected insertAfter(nodeId: string): any[] { const newNodes = this.copyNodesService.copyNodesAfter(this.selectedNodeIds, nodeId); diff --git a/src/assets/wise5/authoringTool/choose-node-location/choose-move-node-location/choose-move-node-location.component.ts b/src/assets/wise5/authoringTool/choose-node-location/choose-move-node-location/choose-move-node-location.component.ts index 4cc0c43eceb..8b781f627ae 100644 --- a/src/assets/wise5/authoringTool/choose-node-location/choose-move-node-location/choose-move-node-location.component.ts +++ b/src/assets/wise5/authoringTool/choose-node-location/choose-move-node-location/choose-move-node-location.component.ts @@ -1,7 +1,6 @@ -import { Component } from '@angular/core'; -import { ActivatedRoute, Router, RouterModule } from '@angular/router'; +import { Component, inject } from '@angular/core'; +import { RouterModule } from '@angular/router'; import { MoveNodesService } from '../../../services/moveNodesService'; -import { TeacherProjectService } from '../../../services/teacherProjectService'; import { ChooseNodeLocationComponent } from '../choose-node-location.component'; import { CommonModule } from '@angular/common'; import { MatButtonModule } from '@angular/material/button'; @@ -25,15 +24,7 @@ import { NodeWithMoveAfterButtonComponent } from '../node-with-move-after-button }) export class ChooseMoveNodeLocationComponent extends ChooseNodeLocationComponent { protected moveGroup: boolean; - - constructor( - private moveNodesService: MoveNodesService, - protected projectService: TeacherProjectService, - protected route: ActivatedRoute, - protected router: Router - ) { - super(projectService, route, router); - } + private moveNodesService = inject(MoveNodesService); ngOnInit(): void { super.ngOnInit(); diff --git a/src/assets/wise5/authoringTool/choose-node-location/choose-node-location.component.ts b/src/assets/wise5/authoringTool/choose-node-location/choose-node-location.component.ts index 22579481e2d..67860f98cff 100644 --- a/src/assets/wise5/authoringTool/choose-node-location/choose-node-location.component.ts +++ b/src/assets/wise5/authoringTool/choose-node-location/choose-node-location.component.ts @@ -1,20 +1,17 @@ +import { Directive, inject } from '@angular/core'; import { ActivatedRoute, Router } from '@angular/router'; import { TeacherProjectService } from '../../services/teacherProjectService'; -import { Directive } from '@angular/core'; @Directive() export abstract class ChooseNodeLocationComponent { protected inactiveGroupNodes: any[]; protected inactiveStepNodes: any[]; protected nodeIds: string[]; + protected projectService = inject(TeacherProjectService); + protected route = inject(ActivatedRoute); + protected router = inject(Router); protected selectedNodeIds: string[]; - constructor( - protected projectService: TeacherProjectService, - protected route: ActivatedRoute, - protected router: Router - ) {} - ngOnInit(): void { this.inactiveGroupNodes = this.projectService.getInactiveGroupNodes(); this.inactiveStepNodes = this.projectService.getInactiveStepNodes(); From fc98fb13b6bf50af430f1d5cc06ffb49db334057 Mon Sep 17 00:00:00 2001 From: Hiroki Terashima Date: Thu, 4 Dec 2025 17:00:26 -0800 Subject: [PATCH 07/28] Use inject() for ComponentService and all its children classes --- .../wise5/components/aiChat/aiChatService.ts | 6 +- .../components/animation/animationService.ts | 2 - .../conceptMap/conceptMapService.ts | 22 +++----- .../dialogGuidance/dialogGuidanceService.ts | 6 +- .../discussion/discussionService.ts | 14 ++--- .../discussion/teacherDiscussionService.ts | 12 +--- .../wise5/components/draw/drawService.ts | 12 ++-- .../components/embedded/embeddedService.ts | 19 ++----- .../wise5/components/graph/graphService.ts | 19 ++----- .../wise5/components/label/labelService.ts | 8 +-- .../openResponse/openResponseService.ts | 8 +-- .../outsideURL/outsideURLService.ts | 10 +--- .../components/peerChat/peerChatService.ts | 7 +-- .../components/summary/summaryService.ts | 56 +++++++++---------- .../wise5/components/table/tableService.ts | 10 +--- src/messages.xlf | 40 ++++++------- 16 files changed, 94 insertions(+), 157 deletions(-) diff --git a/src/assets/wise5/components/aiChat/aiChatService.ts b/src/assets/wise5/components/aiChat/aiChatService.ts index 6c36db0cc3c..6129e80c991 100644 --- a/src/assets/wise5/components/aiChat/aiChatService.ts +++ b/src/assets/wise5/components/aiChat/aiChatService.ts @@ -1,4 +1,4 @@ -import { Injectable } from '@angular/core'; +import { inject, Injectable } from '@angular/core'; import { ComponentService } from '../componentService'; import { AiChatMessage } from './AiChatMessage'; import { AiChatMessageReponse } from './AiChatMessageResponse'; @@ -6,9 +6,7 @@ import { ComputerAvatarService } from '../../services/computerAvatarService'; @Injectable() export class AiChatService extends ComponentService { - constructor(protected computerAvatarService: ComputerAvatarService) { - super(); - } + protected computerAvatarService = inject(ComputerAvatarService); getComponentTypeLabel() { return $localize`AI Chat`; diff --git a/src/assets/wise5/components/animation/animationService.ts b/src/assets/wise5/components/animation/animationService.ts index 404507bd8d9..260933d5f20 100644 --- a/src/assets/wise5/components/animation/animationService.ts +++ b/src/assets/wise5/components/animation/animationService.ts @@ -1,5 +1,3 @@ -'use strict'; - import { ComponentService } from '../componentService'; import { Injectable } from '@angular/core'; diff --git a/src/assets/wise5/components/conceptMap/conceptMapService.ts b/src/assets/wise5/components/conceptMap/conceptMapService.ts index eb7233f6b5a..e89aed7f87f 100644 --- a/src/assets/wise5/components/conceptMap/conceptMapService.ts +++ b/src/assets/wise5/components/conceptMap/conceptMapService.ts @@ -1,22 +1,16 @@ -'use strict'; - import SVG from 'svg.js'; +import { inject, Injectable } from '@angular/core'; import { ComponentService } from '../componentService'; import { ConfigService } from '../../services/configService'; import { StudentAssetService } from '../../services/studentAssetService'; import ConceptMapNode from './conceptMapNode'; import ConceptMapLink from './conceptMapLink'; -import { Injectable } from '@angular/core'; import { convertToPNGFile } from '../../common/canvas/canvas'; @Injectable() export class ConceptMapService extends ComponentService { - constructor( - private ConfigService: ConfigService, - private StudentAssetService: StudentAssetService - ) { - super(); - } + private configService = inject(ConfigService); + private assetService = inject(StudentAssetService); getComponentTypeLabel(): string { return $localize`Concept Map`; @@ -808,12 +802,12 @@ export class ConceptMapService extends ComponentService { ctx.drawImage(image, 0, 0); const pngFile = convertToPNGFile(myCanvas); - this.StudentAssetService.uploadAsset(pngFile).then((unreferencedAsset) => { + this.assetService.uploadAsset(pngFile).then((unreferencedAsset) => { /* * make a copy of the unreferenced asset so that we * get a referenced asset */ - this.StudentAssetService.copyAssetForReference(unreferencedAsset).then( + this.assetService.copyAssetForReference(unreferencedAsset).then( (referencedAsset) => { if (referencedAsset != null) { /* @@ -824,7 +818,7 @@ export class ConceptMapService extends ComponentService { const referencedAssetUrl = referencedAsset.url; // remove the unreferenced asset - this.StudentAssetService.deleteAsset(unreferencedAsset); + this.assetService.deleteAsset(unreferencedAsset); // resolve the promise with the image url resolve(referencedAssetUrl); @@ -868,7 +862,7 @@ export class ConceptMapService extends ComponentService { */ // prepend the project asset directory path - imageHref = this.ConfigService.getProjectAssetsDirectoryPath(true) + '/' + imageHref; + imageHref = this.configService.getProjectAssetsDirectoryPath(true) + '/' + imageHref; } // get the Base64 of the image @@ -1158,7 +1152,7 @@ export class ConceptMapService extends ComponentService { ctx.drawImage(image, 0, 0); const pngFile = convertToPNGFile(myCanvas); - this.StudentAssetService.uploadAsset(pngFile).then((asset) => { + this.assetService.uploadAsset(pngFile).then((asset) => { resolve(asset); }); }; diff --git a/src/assets/wise5/components/dialogGuidance/dialogGuidanceService.ts b/src/assets/wise5/components/dialogGuidance/dialogGuidanceService.ts index bb83903e162..49914e45d96 100644 --- a/src/assets/wise5/components/dialogGuidance/dialogGuidanceService.ts +++ b/src/assets/wise5/components/dialogGuidance/dialogGuidanceService.ts @@ -1,12 +1,10 @@ -import { Injectable } from '@angular/core'; +import { inject, Injectable } from '@angular/core'; import { ComputerAvatarService } from '../../services/computerAvatarService'; import { ComponentService } from '../componentService'; @Injectable() export class DialogGuidanceService extends ComponentService { - constructor(protected computerAvatarService: ComputerAvatarService) { - super(); - } + protected computerAvatarService = inject(ComputerAvatarService); getComponentTypeLabel(): string { return $localize`Dialog Guidance`; diff --git a/src/assets/wise5/components/discussion/discussionService.ts b/src/assets/wise5/components/discussion/discussionService.ts index 726ffc9f103..db345de8e40 100644 --- a/src/assets/wise5/components/discussion/discussionService.ts +++ b/src/assets/wise5/components/discussion/discussionService.ts @@ -1,19 +1,15 @@ -import { ComponentService } from '../componentService'; -import { ConfigService } from '../../services/configService'; -import { Injectable } from '@angular/core'; +import { inject, Injectable } from '@angular/core'; import { HttpClient } from '@angular/common/http'; import { forkJoin, Observable } from 'rxjs'; import { map } from 'rxjs/operators'; +import { ComponentService } from '../componentService'; +import { ConfigService } from '../../services/configService'; import { serverSaveTimeComparator } from '../../common/object/object'; @Injectable() export class DiscussionService extends ComponentService { - constructor( - protected configService: ConfigService, - protected http: HttpClient - ) { - super(); - } + protected configService = inject(ConfigService); + protected http = inject(HttpClient); getComponentTypeLabel(): string { return $localize`Discussion`; diff --git a/src/assets/wise5/components/discussion/teacherDiscussionService.ts b/src/assets/wise5/components/discussion/teacherDiscussionService.ts index 1005076dcc6..96540881f88 100644 --- a/src/assets/wise5/components/discussion/teacherDiscussionService.ts +++ b/src/assets/wise5/components/discussion/teacherDiscussionService.ts @@ -1,19 +1,11 @@ -import { HttpClient } from '@angular/common/http'; -import { Injectable } from '@angular/core'; -import { ConfigService } from '../../services/configService'; +import { inject, Injectable } from '@angular/core'; import { TeacherDataService } from '../../services/teacherDataService'; import { DiscussionService } from './discussionService'; import { getIntersectOfArrays } from '../../common/array/array'; @Injectable() export class TeacherDiscussionService extends DiscussionService { - constructor( - protected http: HttpClient, - protected configService: ConfigService, - protected dataService: TeacherDataService - ) { - super(configService, http); - } + protected dataService = inject(TeacherDataService); getPostsAssociatedWithComponentIdsAndWorkgroupId(componentIds: string[], workgroupId: number) { let allPosts = []; diff --git a/src/assets/wise5/components/draw/drawService.ts b/src/assets/wise5/components/draw/drawService.ts index 8d1d99ed0cb..9613ed14e2b 100644 --- a/src/assets/wise5/components/draw/drawService.ts +++ b/src/assets/wise5/components/draw/drawService.ts @@ -1,18 +1,18 @@ -'use strict'; - import $ from 'jquery'; import * as fabric from 'fabric'; window['fabric'] = fabric.fabric; import * as EventEmitter2 from 'eventemitter2'; window['EventEmitter2'] = EventEmitter2; import DrawingTool from '@wise-community/drawing-tool/dist/drawing-tool'; +import { inject, Injectable } from '@angular/core'; import { ComponentService } from '../componentService'; import { StudentAssetService } from '../../services/studentAssetService'; -import { Injectable } from '@angular/core'; import { convertToPNGFile } from '../../common/canvas/canvas'; @Injectable() export class DrawService extends ComponentService { + private assetService = inject(StudentAssetService); + toolFieldToLabel: any = { select: 'Select tool', line: 'Line tool (click and hold to show available line types)', @@ -31,10 +31,6 @@ export class DrawService extends ComponentService { delete: 'Delete selected objects' }; - constructor(private StudentAssetService: StudentAssetService) { - super(); - } - getComponentTypeLabel(): string { return $localize`Draw`; } @@ -157,7 +153,7 @@ export class DrawService extends ComponentService { ); const canvas = this.getDrawingToolCanvas(this.getDrawingToolId(domIdEnding)); const pngFile = convertToPNGFile(canvas); - this.StudentAssetService.uploadAsset(pngFile).then((asset) => { + this.assetService.uploadAsset(pngFile).then((asset) => { resolve(asset); }); }); diff --git a/src/assets/wise5/components/embedded/embeddedService.ts b/src/assets/wise5/components/embedded/embeddedService.ts index 8ecdc8c1c29..2b06e808f76 100644 --- a/src/assets/wise5/components/embedded/embeddedService.ts +++ b/src/assets/wise5/components/embedded/embeddedService.ts @@ -1,27 +1,20 @@ -'use strict'; - import $ from 'jquery'; import html2canvas from 'html2canvas'; +import { inject, Injectable } from '@angular/core'; import { ComponentService } from '../componentService'; import { StudentAssetService } from '../../services/studentAssetService'; -import { Injectable } from '@angular/core'; import { ConfigService } from '../../services/configService'; import { copy } from '../../common/object/object'; import { convertToPNGFile } from '../../common/canvas/canvas'; @Injectable() export class EmbeddedService extends ComponentService { + protected assetService = inject(StudentAssetService); + protected configService = inject(ConfigService); defaultWidth: string = '100%'; defaultHeight: string = '600px'; iframePrefix: string = 'embedded-application-iframe-'; - constructor( - protected ConfigService: ConfigService, - protected StudentAssetService: StudentAssetService - ) { - super(); - } - getEmbeddedApplicationIframeId(componentId: string): string { return `${this.iframePrefix}-${componentId}`; } @@ -89,7 +82,7 @@ export class EmbeddedService extends ComponentService { return new Promise((resolve, reject) => { html2canvas(modelElement as HTMLElement).then((canvas) => { const pngFile = convertToPNGFile(canvas); - this.StudentAssetService.uploadAsset(pngFile).then((asset) => { + this.assetService.uploadAsset(pngFile).then((asset) => { resolve(asset); }); }); @@ -144,8 +137,8 @@ export class EmbeddedService extends ComponentService { createProjectPathMessage(): any { return { messageType: 'projectPath', - projectPath: this.ConfigService.getConfigParam('projectBaseURL'), - projectAssetsPath: this.ConfigService.getConfigParam('projectBaseURL') + 'assets' + projectPath: this.configService.getConfigParam('projectBaseURL'), + projectAssetsPath: this.configService.getConfigParam('projectBaseURL') + 'assets' }; } } diff --git a/src/assets/wise5/components/graph/graphService.ts b/src/assets/wise5/components/graph/graphService.ts index cb690ff10ce..070f70cbb5e 100644 --- a/src/assets/wise5/components/graph/graphService.ts +++ b/src/assets/wise5/components/graph/graphService.ts @@ -1,26 +1,19 @@ -'use strict'; - import html2canvas from 'html2canvas'; -import { Injectable } from '@angular/core'; +import { inject, Injectable } from '@angular/core'; +import { HttpClient } from '@angular/common/http'; import { ComponentService } from '../componentService'; import { StudentAssetService } from '../../services/studentAssetService'; import { ConfigService } from '../../services/configService'; -import { HttpClient } from '@angular/common/http'; import { convertToPNGFile } from '../../common/canvas/canvas'; import { hasConnectedComponent } from '../../common/ComponentContent'; @Injectable() export class GraphService extends ComponentService { + private assetService = inject(StudentAssetService); + private configService = inject(ConfigService); + private http = inject(HttpClient); seriesColors: string[] = ['blue', 'red', 'green', 'orange', 'purple', 'black']; - constructor( - private configService: ConfigService, - private http: HttpClient, - private StudentAssetService: StudentAssetService - ) { - super(); - } - getComponentTypeLabel(): string { return $localize`Graph`; } @@ -304,7 +297,7 @@ export class GraphService extends ComponentService { const highchartsDiv = this.getHighchartsDiv(componentState.componentId); html2canvas(highchartsDiv as HTMLElement).then((canvas) => { const pngFile = convertToPNGFile(canvas); - this.StudentAssetService.uploadAsset(pngFile).then((asset) => { + this.assetService.uploadAsset(pngFile).then((asset) => { resolve(asset); }); }); diff --git a/src/assets/wise5/components/label/labelService.ts b/src/assets/wise5/components/label/labelService.ts index c78e46c4f7f..b2e8396b25e 100644 --- a/src/assets/wise5/components/label/labelService.ts +++ b/src/assets/wise5/components/label/labelService.ts @@ -1,8 +1,8 @@ import { fabric } from 'fabric'; import SVG from 'svg.js'; +import { inject, Injectable } from '@angular/core'; import { ComponentService } from '../componentService'; import { StudentAssetService } from '../../services/studentAssetService'; -import { Injectable } from '@angular/core'; import { convertToPNGFile } from '../../common/canvas/canvas'; import { wordWrap } from '../../common/string/string'; import { hasConnectedComponent } from '../../common/ComponentContent'; @@ -10,15 +10,13 @@ import { labelArraysAreTheSame, makeSureValueIsWithinLimit } from './label'; @Injectable() export class LabelService extends ComponentService { + private assetService = inject(StudentAssetService); + lineZIndex: number = 0; textZIndex: number = 1; circleZIndex: number = 2; defaultTextBackgroundColor: string = 'blue'; - constructor(private assetService: StudentAssetService) { - super(); - } - getComponentTypeLabel(): string { return $localize`Label`; } diff --git a/src/assets/wise5/components/openResponse/openResponseService.ts b/src/assets/wise5/components/openResponse/openResponseService.ts index f44f0a37ca9..c368aa0c762 100644 --- a/src/assets/wise5/components/openResponse/openResponseService.ts +++ b/src/assets/wise5/components/openResponse/openResponseService.ts @@ -1,14 +1,10 @@ -'use strict'; - -import { Injectable } from '@angular/core'; +import { inject, Injectable } from '@angular/core'; import { ComponentService } from '../componentService'; import { OpenResponseCompletionCriteriaService } from './openResponseCompletionCriteriaService'; @Injectable() export class OpenResponseService extends ComponentService { - constructor(private completionCriteriaService: OpenResponseCompletionCriteriaService) { - super(); - } + private completionCriteriaService = inject(OpenResponseCompletionCriteriaService); getComponentTypeLabel(): string { return $localize`Open Response`; diff --git a/src/assets/wise5/components/outsideURL/outsideURLService.ts b/src/assets/wise5/components/outsideURL/outsideURLService.ts index 61cd3d2e563..512ac2d82a9 100644 --- a/src/assets/wise5/components/outsideURL/outsideURLService.ts +++ b/src/assets/wise5/components/outsideURL/outsideURLService.ts @@ -1,14 +1,10 @@ -'use strict'; - -import { ComponentService } from '../componentService'; -import { Injectable } from '@angular/core'; +import { inject, Injectable } from '@angular/core'; import { HttpClient } from '@angular/common/http'; +import { ComponentService } from '../componentService'; @Injectable() export class OutsideURLService extends ComponentService { - constructor(private http: HttpClient) { - super(); - } + private http = inject(HttpClient); getComponentTypeLabel(): string { return $localize`Outside Resource`; diff --git a/src/assets/wise5/components/peerChat/peerChatService.ts b/src/assets/wise5/components/peerChat/peerChatService.ts index 82547b04a76..9552e30b032 100644 --- a/src/assets/wise5/components/peerChat/peerChatService.ts +++ b/src/assets/wise5/components/peerChat/peerChatService.ts @@ -1,5 +1,5 @@ import { HttpClient } from '@angular/common/http'; -import { Injectable } from '@angular/core'; +import { inject, Injectable } from '@angular/core'; import { Observable } from 'rxjs'; import { ConfigService } from '../../services/configService'; import { ComponentService } from '../componentService'; @@ -8,9 +8,8 @@ import { getAvatarColorForWorkgroupId } from '../../common/workgroup/workgroup'; @Injectable() export class PeerChatService extends ComponentService { - constructor(private configService: ConfigService, private http: HttpClient) { - super(); - } + private configService = inject(ConfigService); + private http = inject(HttpClient); getComponentTypeLabel() { return $localize`Peer Chat`; diff --git a/src/assets/wise5/components/summary/summaryService.ts b/src/assets/wise5/components/summary/summaryService.ts index f28d143fc7c..9a432c369b7 100644 --- a/src/assets/wise5/components/summary/summaryService.ts +++ b/src/assets/wise5/components/summary/summaryService.ts @@ -1,40 +1,34 @@ -'use strict'; - -import { ComponentService } from '../componentService'; +import { inject, Injectable } from '@angular/core'; import { HttpClient } from '@angular/common/http'; -import { Injectable } from '@angular/core'; import { Observable } from 'rxjs'; +import { ComponentService } from '../componentService'; @Injectable() export class SummaryService extends ComponentService { - componentsWithScoresSummary: string[]; - componentsWithResponsesSummary: string[]; + private http = inject(HttpClient); - constructor(private http: HttpClient) { - super(); - this.componentsWithScoresSummary = [ - 'Animation', - 'AudioOscillator', - 'ConceptMap', - 'DialogGuidance', - 'Discussion', - 'Draw', - 'Embedded', - 'Graph', - 'Label', - 'Match', - 'MultipleChoice', - 'OpenResponse', - 'Table' - ]; - this.componentsWithResponsesSummary = [ - 'DialogGuidance', - 'Match', - 'MultipleChoice', - 'OpenResponse', - 'Table' - ]; - } + componentsWithScoresSummary: string[] = [ + 'Animation', + 'AudioOscillator', + 'ConceptMap', + 'DialogGuidance', + 'Discussion', + 'Draw', + 'Embedded', + 'Graph', + 'Label', + 'Match', + 'MultipleChoice', + 'OpenResponse', + 'Table' + ]; + componentsWithResponsesSummary: string[] = [ + 'DialogGuidance', + 'Match', + 'MultipleChoice', + 'OpenResponse', + 'Table' + ]; getComponentTypeLabel(): string { return $localize`Summary`; diff --git a/src/assets/wise5/components/table/tableService.ts b/src/assets/wise5/components/table/tableService.ts index 1a84570d09a..04f0ebd2fae 100644 --- a/src/assets/wise5/components/table/tableService.ts +++ b/src/assets/wise5/components/table/tableService.ts @@ -1,16 +1,12 @@ -'use strict'; - import html2canvas from 'html2canvas'; +import { inject, Injectable } from '@angular/core'; import { ComponentService } from '../componentService'; import { StudentAssetService } from '../../services/studentAssetService'; -import { Injectable } from '@angular/core'; import { convertToPNGFile } from '../../common/canvas/canvas'; @Injectable() export class TableService extends ComponentService { - constructor(private StudentAssetService: StudentAssetService) { - super(); - } + private assetService = inject(StudentAssetService); getComponentTypeLabel(): string { return $localize`Table`; @@ -221,7 +217,7 @@ export class TableService extends ComponentService { // convert the table element to a canvas element html2canvas(tableElement as HTMLElement).then((canvas) => { const pngFile = convertToPNGFile(canvas); - this.StudentAssetService.uploadAsset(pngFile).then((asset) => { + this.assetService.uploadAsset(pngFile).then((asset) => { resolve(asset); }); }); diff --git a/src/messages.xlf b/src/messages.xlf index 543ac888eb1..e75466f4f78 100644 --- a/src/messages.xlf +++ b/src/messages.xlf @@ -2069,7 +2069,7 @@ Click "Cancel" to keep the invalid JSON open so you can fix it. src/assets/wise5/components/peerChat/peerChatService.ts - 65 + 64 @@ -2116,7 +2116,7 @@ Click "Cancel" to keep the invalid JSON open so you can fix it. src/assets/wise5/components/summary/summaryService.ts - 40 + 34 @@ -15935,7 +15935,7 @@ Are you sure you want to proceed? src/assets/wise5/components/aiChat/aiChatService.ts - 14 + 12 @@ -16064,7 +16064,7 @@ Are you sure you want to proceed? src/assets/wise5/components/animation/animationService.ts - 9 + 7 @@ -17278,7 +17278,7 @@ Are you ready to receive feedback on this answer? src/assets/wise5/components/conceptMap/conceptMapService.ts - 22 + 16 @@ -17736,7 +17736,7 @@ Category Name: src/assets/wise5/components/dialogGuidance/dialogGuidanceService.ts - 12 + 10 @@ -17896,7 +17896,7 @@ Category Name: src/assets/wise5/components/discussion/discussionService.ts - 19 + 15 @@ -18062,7 +18062,7 @@ Category Name: src/assets/wise5/components/draw/drawService.ts - 39 + 35 @@ -18315,7 +18315,7 @@ Category Name: src/assets/wise5/components/embedded/embeddedService.ts - 30 + 23 @@ -18408,7 +18408,7 @@ Category Name: src/assets/wise5/components/graph/graphService.ts - 25 + 18 @@ -19238,35 +19238,35 @@ Category Name: Time (seconds) src/assets/wise5/components/graph/graphService.ts - 47 + 40 s src/assets/wise5/components/graph/graphService.ts - 52 + 45 Position (meters) src/assets/wise5/components/graph/graphService.ts - 59 + 52 m src/assets/wise5/components/graph/graphService.ts - 72 + 65 Prediction src/assets/wise5/components/graph/graphService.ts - 78 + 71 @@ -19317,7 +19317,7 @@ Category Name: src/assets/wise5/components/label/labelService.ts - 23 + 21 src/assets/wise5/components/summary/summary-authoring/summary-authoring.component.html @@ -20006,7 +20006,7 @@ Warning: This will delete all existing choices in this component. src/assets/wise5/components/openResponse/openResponseService.ts - 14 + 10 @@ -20528,7 +20528,7 @@ If this problem continues, let your teacher know and move on to the next activit src/assets/wise5/components/outsideURL/outsideURLService.ts - 14 + 10 @@ -20635,7 +20635,7 @@ If this problem continues, let your teacher know and move on to the next activit src/assets/wise5/components/peerChat/peerChatService.ts - 16 + 15 @@ -21097,7 +21097,7 @@ If this problem continues, let your teacher know and move on to the next activit src/assets/wise5/components/table/tableService.ts - 16 + 12 From b28a5cafb51a004a56917330cceadf16c7e943a3 Mon Sep 17 00:00:00 2001 From: Hiroki Terashima Date: Thu, 4 Dec 2025 17:28:09 -0800 Subject: [PATCH 08/28] Use inject() for ShareItemDialogComponent and all its children classes --- .../share-item-dialog.component.ts | 16 +++++------- .../share-project-dialog.component.ts | 25 +++++-------------- .../share-run-dialog.component.ts | 25 +++++-------------- src/messages.xlf | 8 +++--- 4 files changed, 22 insertions(+), 52 deletions(-) diff --git a/src/app/modules/library/share-item-dialog/share-item-dialog.component.ts b/src/app/modules/library/share-item-dialog/share-item-dialog.component.ts index 2a697b316da..126152bef5a 100644 --- a/src/app/modules/library/share-item-dialog/share-item-dialog.component.ts +++ b/src/app/modules/library/share-item-dialog/share-item-dialog.component.ts @@ -1,4 +1,4 @@ -import { OnInit, Inject, Directive } from '@angular/core'; +import { OnInit, Directive, inject } from '@angular/core'; import { FormControl } from '@angular/forms'; import { BehaviorSubject, Observable } from 'rxjs'; import { TeacherService } from '../../../teacher/teacher.service'; @@ -10,6 +10,8 @@ import { copy } from '../../../../assets/wise5/common/object/object'; @Directive() export abstract class ShareItemDialogComponent implements OnInit { + public data = inject(MAT_DIALOG_DATA); + public dialogRef = inject(MatDialogRef); project: Project; projectId: number; runId: number; @@ -19,19 +21,13 @@ export abstract class ShareItemDialogComponent implements OnInit { owner: any; sharedOwners: any[] = []; private sharedOwners$: BehaviorSubject = new BehaviorSubject(this.sharedOwners); + public snackBar = inject(MatSnackBar); + public teacherService = inject(TeacherService); - constructor( - public dialogRef: MatDialogRef, - @Inject(MAT_DIALOG_DATA) public data: any, - public teacherService: TeacherService, - public snackBar: MatSnackBar - ) { + ngOnInit(): void { this.teacherService.retrieveAllTeacherUsernames().subscribe((teacherUsernames) => { this.allTeacherUsernames = teacherUsernames; }); - } - - ngOnInit() { this.filteredTeacherUsernames = this.teacherSearchControl.valueChanges.pipe( debounceTime(1000), map((value) => this._filter(value)) diff --git a/src/app/modules/library/share-project-dialog/share-project-dialog.component.ts b/src/app/modules/library/share-project-dialog/share-project-dialog.component.ts index 74ebb46c2b8..bdf0693f1b0 100644 --- a/src/app/modules/library/share-project-dialog/share-project-dialog.component.ts +++ b/src/app/modules/library/share-project-dialog/share-project-dialog.component.ts @@ -1,13 +1,10 @@ -import { Component, Inject } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { - MAT_DIALOG_DATA, - MatDialogRef, MatDialogTitle, MatDialogContent, MatDialogActions, MatDialogClose } from '@angular/material/dialog'; -import { MatSnackBar } from '@angular/material/snack-bar'; import { MatTableDataSource, MatTable, @@ -21,7 +18,6 @@ import { MatRowDef, MatRow } from '@angular/material/table'; -import { TeacherService } from '../../../teacher/teacher.service'; import { LibraryService } from '../../../services/library.service'; import { ShareItemDialogComponent } from '../share-item-dialog/share-item-dialog.component'; import { Project } from '../../../domain/project'; @@ -88,25 +84,16 @@ export class ShareProjectDialogComponent extends ShareItemDialogComponent { dataSource: MatTableDataSource = new MatTableDataSource(); displayedColumns: string[] = ['name', 'permissions']; duplicate: boolean = false; + public libraryService = inject(LibraryService); - constructor( - public dialogRef: MatDialogRef, - @Inject(MAT_DIALOG_DATA) public data: any, - public libraryService: LibraryService, - public teacherService: TeacherService, - public snackBar: MatSnackBar - ) { - super(dialogRef, data, teacherService, snackBar); - this.project = data.project; - this.projectId = data.project.id; + ngOnInit(): void { + super.ngOnInit(); + this.project = this.data.project; + this.projectId = this.data.project.id; this.libraryService.getProjectInfo(this.projectId).subscribe((project: Project) => { this.project = project; this.populateSharedOwners(project.sharedOwners); }); - } - - ngOnInit() { - super.ngOnInit(); this.getSharedOwners().subscribe((sharedOwners) => { let owners = [...sharedOwners]; owners.reverse(); diff --git a/src/app/teacher/share-run-dialog/share-run-dialog.component.ts b/src/app/teacher/share-run-dialog/share-run-dialog.component.ts index 31b93fc5486..a8dea05836e 100644 --- a/src/app/teacher/share-run-dialog/share-run-dialog.component.ts +++ b/src/app/teacher/share-run-dialog/share-run-dialog.component.ts @@ -1,10 +1,8 @@ -import { Component, Inject } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormsModule, ReactiveFormsModule } from '@angular/forms'; import { MatDialogModule, - MAT_DIALOG_DATA, - MatDialogRef, MatDialog } from '@angular/material/dialog'; import { MatSnackBarModule } from '@angular/material/snack-bar'; @@ -18,8 +16,6 @@ import { MatAutocompleteModule } from '@angular/material/autocomplete'; import { MatOptionModule } from '@angular/material/core'; import { MatDividerModule } from '@angular/material/divider'; import { RouterModule } from '@angular/router'; -import { TeacherService } from '../teacher.service'; -import { MatSnackBar } from '@angular/material/snack-bar'; import { MatTableDataSource } from '@angular/material/table'; import { ShareItemDialogComponent } from '../../modules/library/share-item-dialog/share-item-dialog.component'; import { UserService } from '../../services/user.service'; @@ -57,22 +53,17 @@ import { CopyProjectDialogComponent } from '../../modules/library/copy-project-d export class ShareRunDialogComponent extends ShareItemDialogComponent { run: TeacherRun; dataSource: MatTableDataSource = new MatTableDataSource(); + public dialog = inject(MatDialog); displayedColumns: string[] = ['name', 'permissions']; isDuplicateSharedTeacher: boolean = false; isOwner: boolean = false; isTransfer: boolean = false; transferRunWarning: boolean = false; + private userService = inject(UserService); + private utilService = inject(UtilService); - constructor( - public dialogRef: MatDialogRef, - @Inject(MAT_DIALOG_DATA) public data: any, - public teacherService: TeacherService, - private userService: UserService, - private utilService: UtilService, - public snackBar: MatSnackBar, - public dialog: MatDialog - ) { - super(dialogRef, data, teacherService, snackBar); + ngOnInit(): void { + super.ngOnInit(); this.teacherService.getRun(this.data.run.id).subscribe((run: TeacherRun) => { this.run = new TeacherRun(run); this.runId = this.run.id; @@ -87,10 +78,6 @@ export class ShareRunDialogComponent extends ShareItemDialogComponent { }); } - ngOnInit() { - super.ngOnInit(); - } - updateAllOwners() { let allOwners = []; allOwners.push({ diff --git a/src/messages.xlf b/src/messages.xlf index e75466f4f78..b67993bc794 100644 --- a/src/messages.xlf +++ b/src/messages.xlf @@ -6433,21 +6433,21 @@ Click "Cancel" to keep the invalid JSON open so you can fix it.Sharing permissions updated for . src/app/modules/library/share-item-dialog/share-item-dialog.component.ts - 126 + 122 Added shared teacher: . src/app/modules/library/share-item-dialog/share-item-dialog.component.ts - 143 + 139 Removed shared teacher: . src/app/modules/library/share-item-dialog/share-item-dialog.component.ts - 153 + 149 @@ -9693,7 +9693,7 @@ Click "Cancel" to keep the invalid JSON open so you can fix it.Transferred classroom unit ownership to . src/app/teacher/share-run-dialog/share-run-dialog.component.ts - 213 + 200 From b08950ec5827c401dd54f44e6044b9c71b9029f1 Mon Sep 17 00:00:00 2001 From: Hiroki Terashima Date: Thu, 4 Dec 2025 17:36:49 -0800 Subject: [PATCH 09/28] Use inject() for AbstractTagsMenu and all its children classes --- .../abstract-tags-menu.component.ts | 9 +++------ .../apply-tags-button.component.ts | 13 ++----------- src/messages.xlf | 4 ++-- 3 files changed, 7 insertions(+), 19 deletions(-) diff --git a/src/app/teacher/abstract-tags-menu/abstract-tags-menu.component.ts b/src/app/teacher/abstract-tags-menu/abstract-tags-menu.component.ts index 4e00b6ed069..83a29890699 100644 --- a/src/app/teacher/abstract-tags-menu/abstract-tags-menu.component.ts +++ b/src/app/teacher/abstract-tags-menu/abstract-tags-menu.component.ts @@ -1,4 +1,4 @@ -import { Directive } from '@angular/core'; +import { Directive, inject } from '@angular/core'; import { Tag } from '../../domain/tag'; import { Subscription } from 'rxjs'; import { MatDialog } from '@angular/material/dialog'; @@ -7,16 +7,13 @@ import { ManageTagsDialogComponent } from '../manage-tags-dialog/manage-tags-dia @Directive() export class AbstractTagsMenuComponent { + private dialog = inject(MatDialog); protected filteredTags: Tag[] = []; + protected projectTagService = inject(ProjectTagService); protected searchText: string = ''; private subscriptions: Subscription = new Subscription(); protected tags: Tag[] = []; - constructor( - private dialog: MatDialog, - protected projectTagService: ProjectTagService - ) {} - ngOnInit(): void { this.retrieveUserTags(); this.subscribeToTagUpdated(); diff --git a/src/app/teacher/apply-tags-button/apply-tags-button.component.ts b/src/app/teacher/apply-tags-button/apply-tags-button.component.ts index bb481bb77b8..2a4a5392df7 100644 --- a/src/app/teacher/apply-tags-button/apply-tags-button.component.ts +++ b/src/app/teacher/apply-tags-button/apply-tags-button.component.ts @@ -1,4 +1,4 @@ -import { Component, Input } from '@angular/core'; +import { Component, Input, inject } from '@angular/core'; import { Project } from '../../domain/project'; import { Tag } from '../../domain/tag'; import { MAT_CHECKBOX_DEFAULT_OPTIONS } from '@angular/material/checkbox'; @@ -11,8 +11,6 @@ import { MatTooltipModule } from '@angular/material/tooltip'; import { AbstractTagsMenuComponent } from '../abstract-tags-menu/abstract-tags-menu.component'; import { SearchBarComponent } from '../../modules/shared/search-bar/search-bar.component'; import { TagComponent } from '../tag/tag.component'; -import { MatDialog } from '@angular/material/dialog'; -import { ProjectTagService } from '../../../assets/wise5/services/projectTagService'; import { MatSnackBar } from '@angular/material/snack-bar'; @Component({ @@ -33,14 +31,7 @@ import { MatSnackBar } from '@angular/material/snack-bar'; }) export class ApplyTagsButtonComponent extends AbstractTagsMenuComponent { @Input() selectedProjects: Project[] = []; - - constructor( - dialog: MatDialog, - protected projectTagService: ProjectTagService, - private snackBar: MatSnackBar - ) { - super(dialog, projectTagService); - } + private snackBar = inject(MatSnackBar); ngOnChanges(): void { this.updateAllTagsCheckedValues(); diff --git a/src/messages.xlf b/src/messages.xlf index b67993bc794..bf20d18cb09 100644 --- a/src/messages.xlf +++ b/src/messages.xlf @@ -8570,14 +8570,14 @@ Click "Cancel" to keep the invalid JSON open so you can fix it.Successfully applied tag src/app/teacher/apply-tags-button/apply-tags-button.component.ts - 75 + 66 Successfully removed tag src/app/teacher/apply-tags-button/apply-tags-button.component.ts - 85 + 76 From 026995377348ea2712f0712715a9e189cb31603d Mon Sep 17 00:00:00 2001 From: Hiroki Terashima Date: Fri, 5 Dec 2025 08:35:59 -0800 Subject: [PATCH 10/28] Use inject() for ComponentShowWorkDirective and all its children classes --- .../ai-chat-show-work.component.ts | 13 ++-------- .../component-show-work.directive.ts | 14 ++++------ .../concept-map-show-work.component.ts | 13 ++-------- .../dialog-guidance-show-work.component.ts | 17 +++--------- .../discussion-show-work.component.ts | 17 +++--------- .../draw-show-work.component.ts | 13 ++-------- .../embedded-show-work.component.ts | 19 ++++---------- .../graph-show-work.component.ts | 13 ++-------- .../label-show-work.component.ts | 13 ++-------- .../match-show-work.component.ts | 13 ++-------- .../peer-chat-grading.component.ts | 26 +++++-------------- .../peer-chat-show-work.component.ts | 18 +++---------- .../table-show-work.component.ts | 15 +++-------- src/messages.xlf | 2 +- 14 files changed, 44 insertions(+), 162 deletions(-) diff --git a/src/assets/wise5/components/aiChat/ai-chat-show-work/ai-chat-show-work.component.ts b/src/assets/wise5/components/aiChat/ai-chat-show-work/ai-chat-show-work.component.ts index 541fc26f537..a8165d214e1 100644 --- a/src/assets/wise5/components/aiChat/ai-chat-show-work/ai-chat-show-work.component.ts +++ b/src/assets/wise5/components/aiChat/ai-chat-show-work/ai-chat-show-work.component.ts @@ -1,8 +1,6 @@ -import { Component } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { ComponentShowWorkDirective } from '../../component-show-work.directive'; import { ComputerAvatarService } from '../../../services/computerAvatarService'; -import { NodeService } from '../../../services/nodeService'; -import { ProjectService } from '../../../services/projectService'; import { ComputerAvatar } from '../../../common/computer-avatar/ComputerAvatar'; import { AiChatMessagesComponent } from '../ai-chat-messages/ai-chat-messages.component'; @@ -13,17 +11,10 @@ import { AiChatMessagesComponent } from '../ai-chat-messages/ai-chat-messages.co }) export class AiChatShowWorkComponent extends ComponentShowWorkDirective { protected computerAvatar: ComputerAvatar; + private computerAvatarService = inject(ComputerAvatarService); protected messages: any[] = []; protected workgroupId: number; - constructor( - private computerAvatarService: ComputerAvatarService, - protected nodeService: NodeService, - protected projectService: ProjectService - ) { - super(nodeService, projectService); - } - ngOnInit(): void { super.ngOnInit(); this.computerAvatar = this.computerAvatarService.getAvatar( diff --git a/src/assets/wise5/components/component-show-work.directive.ts b/src/assets/wise5/components/component-show-work.directive.ts index c7f6c8ce754..02915331fbc 100644 --- a/src/assets/wise5/components/component-show-work.directive.ts +++ b/src/assets/wise5/components/component-show-work.directive.ts @@ -1,20 +1,16 @@ -import { Directive, Input } from '@angular/core'; +import { Directive, Input, inject } from '@angular/core'; import { ProjectService } from '../services/projectService'; import { NodeService } from '../services/nodeService'; @Directive() export abstract class ComponentShowWorkDirective { - @Input() nodeId: string; + componentContent: any; @Input() componentId: string; @Input() componentState: any; @Input() isRevision: boolean = false; - - componentContent: any; - - constructor( - protected nodeService: NodeService, - protected projectService: ProjectService - ) {} + @Input() nodeId: string; + protected nodeService = inject(NodeService); + protected projectService = inject(ProjectService); ngOnInit(): void { this.componentContent = this.projectService.injectAssetPaths( diff --git a/src/assets/wise5/components/conceptMap/concept-map-show-work/concept-map-show-work.component.ts b/src/assets/wise5/components/conceptMap/concept-map-show-work/concept-map-show-work.component.ts index b60ec946b8a..edebbd964c9 100644 --- a/src/assets/wise5/components/conceptMap/concept-map-show-work/concept-map-show-work.component.ts +++ b/src/assets/wise5/components/conceptMap/concept-map-show-work/concept-map-show-work.component.ts @@ -1,9 +1,7 @@ import SVG from 'svg.js'; -import { Component } from '@angular/core'; -import { ProjectService } from '../../../services/projectService'; +import { Component, inject } from '@angular/core'; import { ConceptMapService } from '../conceptMapService'; import { ComponentShowWorkDirective } from '../../component-show-work.directive'; -import { NodeService } from '../../../services/nodeService'; @Component({ selector: 'concept-map-show-work', @@ -11,6 +9,7 @@ import { NodeService } from '../../../services/nodeService'; templateUrl: 'concept-map-show-work.component.html' }) export class ConceptMapShowWorkComponent extends ComponentShowWorkDirective { + private conceptMapService = inject(ConceptMapService); svgId: string; draw: any; defaultWidth: number = 800; @@ -21,14 +20,6 @@ export class ConceptMapShowWorkComponent extends ComponentShowWorkDirective { nodes: any[] = []; links: any[] = []; - constructor( - private conceptMapService: ConceptMapService, - protected nodeService: NodeService, - protected projectService: ProjectService - ) { - super(nodeService, projectService); - } - ngOnInit(): void { super.ngOnInit(); this.svgId = this.getConceptMapId(); diff --git a/src/assets/wise5/components/dialogGuidance/dialog-guidance-show-work/dialog-guidance-show-work.component.ts b/src/assets/wise5/components/dialogGuidance/dialog-guidance-show-work/dialog-guidance-show-work.component.ts index 51b46569a8b..52a143d0b23 100644 --- a/src/assets/wise5/components/dialogGuidance/dialog-guidance-show-work/dialog-guidance-show-work.component.ts +++ b/src/assets/wise5/components/dialogGuidance/dialog-guidance-show-work/dialog-guidance-show-work.component.ts @@ -1,8 +1,6 @@ -import { Component } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { ComputerAvatar } from '../../../common/computer-avatar/ComputerAvatar'; import { ComputerAvatarService } from '../../../services/computerAvatarService'; -import { NodeService } from '../../../services/nodeService'; -import { ProjectService } from '../../../services/projectService'; import { ComponentShowWorkDirective } from '../../component-show-work.directive'; import { MatCardModule } from '@angular/material/card'; import { DialogResponsesComponent } from '../dialog-responses/dialog-responses.component'; @@ -30,18 +28,11 @@ import { UserService } from '../../../../../app/services/user.service'; }) export class DialogGuidanceShowWorkComponent extends ComponentShowWorkDirective { protected computerAvatar: ComputerAvatar; + private computerAvatarService = inject(ComputerAvatarService); + private cRaterService = inject(CRaterService); protected cRaterRubric: CRaterRubric; protected isTeacher: boolean = false; - - constructor( - private computerAvatarService: ComputerAvatarService, - private cRaterService: CRaterService, - protected nodeService: NodeService, - protected projectService: ProjectService, - protected userService: UserService - ) { - super(nodeService, projectService); - } + protected userService = inject(UserService); ngOnInit(): void { this.isTeacher = this.userService.isTeacher(); diff --git a/src/assets/wise5/components/discussion/discussion-show-work/discussion-show-work.component.ts b/src/assets/wise5/components/discussion/discussion-show-work/discussion-show-work.component.ts index 0bdf1f23b15..3eebd1f2328 100644 --- a/src/assets/wise5/components/discussion/discussion-show-work/discussion-show-work.component.ts +++ b/src/assets/wise5/components/discussion/discussion-show-work/discussion-show-work.component.ts @@ -1,8 +1,6 @@ -import { Component, Input } from '@angular/core'; +import { Component, Input, inject } from '@angular/core'; import { AnnotationService } from '../../../services/annotationService'; import { ConfigService } from '../../../services/configService'; -import { NodeService } from '../../../services/nodeService'; -import { ProjectService } from '../../../services/projectService'; import { ComponentShowWorkDirective } from '../../component-show-work.directive'; import { TeacherDiscussionService } from '../teacherDiscussionService'; import { ClassResponse } from '../class-response/class-response.component'; @@ -15,19 +13,12 @@ import { CommonModule } from '@angular/common'; templateUrl: 'discussion-show-work.component.html' }) export class DiscussionShowWorkComponent extends ComponentShowWorkDirective { + private annotationService = inject(AnnotationService); + private configService = inject(ConfigService); + private discussionService = inject(TeacherDiscussionService); protected topLevelResponses: any = {}; @Input() workgroupId: any; - constructor( - private annotationService: AnnotationService, - private configService: ConfigService, - private discussionService: TeacherDiscussionService, - protected nodeService: NodeService, - protected projectService: ProjectService - ) { - super(nodeService, projectService); - } - ngOnInit(): void { super.ngOnInit(); this.workgroupId = parseInt(this.workgroupId); diff --git a/src/assets/wise5/components/draw/draw-show-work/draw-show-work.component.ts b/src/assets/wise5/components/draw/draw-show-work/draw-show-work.component.ts index a88b772edcf..5b1161b04d4 100644 --- a/src/assets/wise5/components/draw/draw-show-work/draw-show-work.component.ts +++ b/src/assets/wise5/components/draw/draw-show-work/draw-show-work.component.ts @@ -1,6 +1,4 @@ -import { Component, ViewEncapsulation } from '@angular/core'; -import { NodeService } from '../../../services/nodeService'; -import { ProjectService } from '../../../services/projectService'; +import { Component, ViewEncapsulation, inject } from '@angular/core'; import { ComponentShowWorkDirective } from '../../component-show-work.directive'; import { DrawService } from '../drawService'; @@ -13,17 +11,10 @@ import { DrawService } from '../drawService'; ` }) export class DrawShowWorkComponent extends ComponentShowWorkDirective { + private drawService = inject(DrawService); private drawingTool: any; protected drawingToolId: string; - constructor( - private drawService: DrawService, - protected nodeService: NodeService, - protected projectService: ProjectService - ) { - super(nodeService, projectService); - } - ngOnInit(): void { super.ngOnInit(); this.drawingToolId = this.getDrawingToolId(); diff --git a/src/assets/wise5/components/embedded/embedded-show-work/embedded-show-work.component.ts b/src/assets/wise5/components/embedded/embedded-show-work/embedded-show-work.component.ts index cc0e035c182..78b01cc5297 100644 --- a/src/assets/wise5/components/embedded/embedded-show-work/embedded-show-work.component.ts +++ b/src/assets/wise5/components/embedded/embedded-show-work/embedded-show-work.component.ts @@ -1,9 +1,7 @@ -import { Component } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { DomSanitizer } from '@angular/platform-browser'; import { AnnotationService } from '../../../services/annotationService'; import { ConfigService } from '../../../services/configService'; -import { NodeService } from '../../../services/nodeService'; -import { ProjectService } from '../../../services/projectService'; import { ComponentShowWorkDirective } from '../../component-show-work.directive'; import { EmbeddedService } from '../embeddedService'; @@ -18,22 +16,15 @@ import { EmbeddedService } from '../embeddedService'; >` }) export class EmbeddedShowWorkComponent extends ComponentShowWorkDirective { + private annotationService = inject(AnnotationService); + private configService = inject(ConfigService); protected embeddedApplicationIFrameId: string; + private embeddedService = inject(EmbeddedService); protected height: string = this.embeddedService.defaultHeight; private messageEventListener: any; + private sanitizer = inject(DomSanitizer); protected url: any; - constructor( - private annotationService: AnnotationService, - private configService: ConfigService, - private embeddedService: EmbeddedService, - protected nodeService: NodeService, - protected projectService: ProjectService, - private sanitizer: DomSanitizer - ) { - super(nodeService, projectService); - } - ngOnInit(): void { super.ngOnInit(); this.embeddedApplicationIFrameId = this.getIframeId(); diff --git a/src/assets/wise5/components/graph/graph-show-work/graph-show-work.component.ts b/src/assets/wise5/components/graph/graph-show-work/graph-show-work.component.ts index 4335dd52bd6..c0d632fd5b8 100644 --- a/src/assets/wise5/components/graph/graph-show-work/graph-show-work.component.ts +++ b/src/assets/wise5/components/graph/graph-show-work/graph-show-work.component.ts @@ -1,9 +1,7 @@ import * as Highcharts from 'highcharts'; -import { Component } from '@angular/core'; -import { ProjectService } from '../../../services/projectService'; +import { Component, inject } from '@angular/core'; import { GraphService } from '../graphService'; import { ComponentShowWorkDirective } from '../../component-show-work.directive'; -import { NodeService } from '../../../services/nodeService'; import { HighchartsChartModule } from 'highcharts-angular'; @Component({ @@ -17,6 +15,7 @@ import { HighchartsChartModule } from 'highcharts-angular'; ` }) export class GraphShowWorkComponent extends ComponentShowWorkDirective { + private graphService = inject(GraphService); Highcharts: typeof Highcharts = Highcharts; options: any; graphType: string; @@ -30,14 +29,6 @@ export class GraphShowWorkComponent extends ComponentShowWorkDirective { xAxis: any; yAxis: any; - constructor( - private graphService: GraphService, - protected nodeService: NodeService, - protected projectService: ProjectService - ) { - super(nodeService, projectService); - } - ngOnInit(): void { super.ngOnInit(); this.graphType = this.componentContent.graphType; diff --git a/src/assets/wise5/components/label/label-show-work/label-show-work.component.ts b/src/assets/wise5/components/label/label-show-work/label-show-work.component.ts index 2d780ab5270..2be5da87e27 100644 --- a/src/assets/wise5/components/label/label-show-work/label-show-work.component.ts +++ b/src/assets/wise5/components/label/label-show-work/label-show-work.component.ts @@ -1,7 +1,5 @@ import { fabric } from 'fabric'; -import { Component } from '@angular/core'; -import { NodeService } from '../../../services/nodeService'; -import { ProjectService } from '../../../services/projectService'; +import { Component, inject } from '@angular/core'; import { LabelService } from '../labelService'; import { ComponentShowWorkDirective } from '../../component-show-work.directive'; @@ -19,14 +17,7 @@ import { ComponentShowWorkDirective } from '../../component-show-work.directive' export class LabelShowWorkComponent extends ComponentShowWorkDirective { protected canvasId: string; private canvas: any; - - constructor( - private labelService: LabelService, - protected nodeService: NodeService, - protected projectService: ProjectService - ) { - super(nodeService, projectService); - } + private labelService = inject(LabelService); ngOnInit(): void { super.ngOnInit(); diff --git a/src/assets/wise5/components/match/match-show-work/match-show-work.component.ts b/src/assets/wise5/components/match/match-show-work/match-show-work.component.ts index 561fa97eb2d..d6067f729c2 100644 --- a/src/assets/wise5/components/match/match-show-work/match-show-work.component.ts +++ b/src/assets/wise5/components/match/match-show-work/match-show-work.component.ts @@ -1,6 +1,4 @@ -import { Component } from '@angular/core'; -import { NodeService } from '../../../services/nodeService'; -import { ProjectService } from '../../../services/projectService'; +import { Component, inject } from '@angular/core'; import { ComponentShowWorkDirective } from '../../component-show-work.directive'; import { MatchService } from '../matchService'; import { MatchFeedbackSectionComponent } from '../match-student/match-feedback-section/match-feedback-section.component'; @@ -18,18 +16,11 @@ import { MatchChoiceItemComponent } from '../match-choice-item/match-choice-item }) export class MatchShowWorkComponent extends ComponentShowWorkDirective { protected hasCorrectAnswer: boolean; + protected matchService = inject(MatchService); protected sourceBucket: any; private sourceBucketId = '0'; protected targetBuckets: any[] = []; - constructor( - protected matchService: MatchService, - protected nodeService: NodeService, - protected projectService: ProjectService - ) { - super(nodeService, projectService); - } - ngOnInit(): void { super.ngOnInit(); this.hasCorrectAnswer = this.matchService.componentHasCorrectAnswer(this.componentContent); diff --git a/src/assets/wise5/components/peerChat/peer-chat-grading/peer-chat-grading.component.ts b/src/assets/wise5/components/peerChat/peer-chat-grading/peer-chat-grading.component.ts index 0caf7e0e7ad..0232ef0a331 100644 --- a/src/assets/wise5/components/peerChat/peer-chat-grading/peer-chat-grading.component.ts +++ b/src/assets/wise5/components/peerChat/peer-chat-grading/peer-chat-grading.component.ts @@ -1,17 +1,12 @@ -import { Component } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { ComponentState } from '../../../../../app/domain/componentState'; import { AnnotationService } from '../../../services/annotationService'; -import { ConfigService } from '../../../services/configService'; -import { NodeService } from '../../../services/nodeService'; import { NotificationService } from '../../../services/notificationService'; -import { PeerGroupService } from '../../../services/peerGroupService'; -import { ProjectService } from '../../../services/projectService'; import { TeacherDataService } from '../../../services/teacherDataService'; import { TeacherWebSocketService } from '../../../services/teacherWebSocketService'; import { TeacherWorkService } from '../../../services/teacherWorkService'; import { PeerChatShowWorkComponent } from '../peer-chat-show-work/peer-chat-show-work.component'; import { PeerChatMessage } from '../PeerChatMessage'; -import { PeerChatService } from '../peerChatService'; import { PeerGroup } from '../PeerGroup'; import { QuestionBankService } from '../peer-chat-question-bank/questionBank.service'; import { PeerChatChatBoxComponent } from '../peer-chat-chat-box/peer-chat-chat-box.component'; @@ -24,20 +19,11 @@ import { PeerChatQuestionBankComponent } from '../peer-chat-question-bank/peer-c templateUrl: './peer-chat-grading.component.html' }) export class PeerChatGradingComponent extends PeerChatShowWorkComponent { - constructor( - protected annotationService: AnnotationService, - protected configService: ConfigService, - protected dataService: TeacherDataService, - protected nodeService: NodeService, - protected notificationService: NotificationService, - protected peerChatService: PeerChatService, - protected peerGroupService: PeerGroupService, - protected projectService: ProjectService, - protected teacherWebSocketService: TeacherWebSocketService, - protected teacherWorkService: TeacherWorkService - ) { - super(configService, nodeService, peerChatService, peerGroupService, projectService); - } + protected annotationService = inject(AnnotationService); + protected dataService = inject(TeacherDataService); + protected notificationService = inject(NotificationService); + protected teacherWebSocketService = inject(TeacherWebSocketService); + protected teacherWorkService = inject(TeacherWorkService); submitTeacherResponse(response: string): void { this.sendNotificationsToGroupMembers(this.peerGroup); diff --git a/src/assets/wise5/components/peerChat/peer-chat-show-work/peer-chat-show-work.component.ts b/src/assets/wise5/components/peerChat/peer-chat-show-work/peer-chat-show-work.component.ts index 36c07c175b0..126625d16ab 100644 --- a/src/assets/wise5/components/peerChat/peer-chat-show-work/peer-chat-show-work.component.ts +++ b/src/assets/wise5/components/peerChat/peer-chat-show-work/peer-chat-show-work.component.ts @@ -1,14 +1,12 @@ -import { Component, Input } from '@angular/core'; +import { Component, Input, inject } from '@angular/core'; import { timeout } from 'rxjs/operators'; import { ComponentShowWorkDirective } from '../../component-show-work.directive'; import { ConfigService } from '../../../services/configService'; -import { ProjectService } from '../../../services/projectService'; import { PeerChatMessage } from '../PeerChatMessage'; import { PeerChatService } from '../peerChatService'; import { PeerGroupService } from '../../../services/peerGroupService'; import { PeerGroup } from '../PeerGroup'; import { PeerGroupMember } from '../PeerGroupMember'; -import { NodeService } from '../../../services/nodeService'; import { FeedbackRule } from '../../common/feedbackRule/FeedbackRule'; import { QuestionBankRule } from '../peer-chat-question-bank/QuestionBankRule'; import { forkJoin, Observable } from 'rxjs'; @@ -16,28 +14,20 @@ import { getQuestionIdsUsed } from '../peer-chat-question-bank/question-bank-hel @Component({ template: '' }) export class PeerChatShowWorkComponent extends ComponentShowWorkDirective { + protected configService = inject(ConfigService); dynamicPrompt: FeedbackRule; isPeerChatWorkgroupsAvailable: boolean = false; peerChatMessages: PeerChatMessage[] = []; + protected peerChatService = inject(PeerChatService); + protected peerGroupService = inject(PeerGroupService); peerChatWorkgroupIds: Set = new Set(); peerChatWorkgroupInfos: any = {}; peerGroup: PeerGroup; questionBankRules: QuestionBankRule[]; questionIdsUsed: string[] = []; requestTimeout: number = 10000; - @Input() workgroupId: number; - constructor( - protected configService: ConfigService, - protected nodeService: NodeService, - protected peerChatService: PeerChatService, - protected peerGroupService: PeerGroupService, - protected projectService: ProjectService - ) { - super(nodeService, projectService); - } - ngOnInit(): void { super.ngOnInit(); this.requestChatWorkgroups(); diff --git a/src/assets/wise5/components/table/table-show-work/table-show-work.component.ts b/src/assets/wise5/components/table/table-show-work/table-show-work.component.ts index a5698ee08fa..695f10269be 100644 --- a/src/assets/wise5/components/table/table-show-work/table-show-work.component.ts +++ b/src/assets/wise5/components/table/table-show-work/table-show-work.component.ts @@ -1,6 +1,4 @@ -import { Component } from '@angular/core'; -import { NodeService } from '../../../services/nodeService'; -import { ProjectService } from '../../../services/projectService'; +import { Component, inject } from '@angular/core'; import { ComponentShowWorkDirective } from '../../component-show-work.directive'; import { TabulatorDataService } from '../tabulatorDataService'; import { TabulatorData } from '../TabulatorData'; @@ -27,7 +25,6 @@ import { TabulatorTableComponent } from '../tabulator-table/tabulator-table.comp templateUrl: 'table-show-work.component.html' }) export class TableShowWorkComponent extends ComponentShowWorkDirective { - tableData: any[] = []; dataExplorerGraphType: string; dataExplorerSeries: any[]; dataExplorerXAxisLabel: string; @@ -37,17 +34,11 @@ export class TableShowWorkComponent extends ComponentShowWorkDirective { xColumnIndex: number; columnNames: string[] = []; noneText: string = $localize`(None)`; + tableData: any[] = []; tabulatorData: TabulatorData; + private tabulatorDataService = inject(TabulatorDataService); tabulatorSorters: any[]; - constructor( - protected nodeService: NodeService, - protected projectService: ProjectService, - private tabulatorDataService: TabulatorDataService - ) { - super(nodeService, projectService); - } - ngOnInit(): void { super.ngOnInit(); const studentData = this.componentState.studentData; diff --git a/src/messages.xlf b/src/messages.xlf index bf20d18cb09..8ae06b2b261 100644 --- a/src/messages.xlf +++ b/src/messages.xlf @@ -20800,7 +20800,7 @@ If this problem continues, let your teacher know and move on to the next activit src/assets/wise5/components/table/table-show-work/table-show-work.component.ts - 39 + 36 src/assets/wise5/components/table/table-student/table-student.component.html From 06b42fa3e7051edc6544394873e3005ef82df553 Mon Sep 17 00:00:00 2001 From: Hiroki Terashima Date: Fri, 5 Dec 2025 08:58:01 -0800 Subject: [PATCH 11/28] Use inject() for AuthorBranchService and all its children classes --- src/assets/wise5/services/authorBranchService.ts | 4 ++-- src/assets/wise5/services/createBranchService.ts | 5 ----- src/assets/wise5/services/editBranchService.ts | 10 ++-------- src/messages.xlf | 2 +- 4 files changed, 5 insertions(+), 16 deletions(-) diff --git a/src/assets/wise5/services/authorBranchService.ts b/src/assets/wise5/services/authorBranchService.ts index 6b6405e6833..da302ad3359 100644 --- a/src/assets/wise5/services/authorBranchService.ts +++ b/src/assets/wise5/services/authorBranchService.ts @@ -1,3 +1,4 @@ +import { inject, Injectable } from '@angular/core'; import { AuthorBranchParams } from '../common/AuthorBranchParams'; import { TeacherProjectService } from './teacherProjectService'; import { @@ -8,11 +9,10 @@ import { import { Transition } from '../common/Transition'; import { TransitionCriteria } from '../common/TransitionCriteria'; import { TransitionCriteriaParams } from '../common/TransitionCriteriaParams'; -import { Injectable } from '@angular/core'; @Injectable() export abstract class AuthorBranchService { - constructor(protected projectService: TeacherProjectService) {} + protected projectService = inject(TeacherProjectService); protected createPathStep( params: AuthorBranchParams, diff --git a/src/assets/wise5/services/createBranchService.ts b/src/assets/wise5/services/createBranchService.ts index e9122094086..8a3a7ba561c 100644 --- a/src/assets/wise5/services/createBranchService.ts +++ b/src/assets/wise5/services/createBranchService.ts @@ -1,15 +1,10 @@ import { Injectable } from '@angular/core'; -import { TeacherProjectService } from './teacherProjectService'; import { AuthorBranchParams } from '../common/AuthorBranchParams'; import { Transition } from '../common/Transition'; import { AuthorBranchService } from './authorBranchService'; @Injectable() export class CreateBranchService extends AuthorBranchService { - constructor(protected projectService: TeacherProjectService) { - super(projectService); - } - createBranch(params: AuthorBranchParams): Promise { const branchNode = this.projectService.getNode(params.branchStepId); const nodeIdBranchNodeTransitionsTo = diff --git a/src/assets/wise5/services/editBranchService.ts b/src/assets/wise5/services/editBranchService.ts index 6cb5b253b82..bb08a8d4837 100644 --- a/src/assets/wise5/services/editBranchService.ts +++ b/src/assets/wise5/services/editBranchService.ts @@ -1,7 +1,6 @@ -import { Injectable } from '@angular/core'; +import { inject, Injectable } from '@angular/core'; import { AuthorBranchService } from './authorBranchService'; import { AuthorBranchParams } from '../common/AuthorBranchParams'; -import { TeacherProjectService } from './teacherProjectService'; import { DeleteBranchService } from './deleteBranchService'; import { CHOICE_CHOSEN_VALUE, @@ -12,12 +11,7 @@ import { @Injectable() export class EditBranchService extends AuthorBranchService { - constructor( - private deleteBranchService: DeleteBranchService, - protected projectService: TeacherProjectService - ) { - super(projectService); - } + private deleteBranchService = inject(DeleteBranchService); editBranch(node: any, branchPaths: any[], params: AuthorBranchParams): Promise { this.projectService.parseProject(); diff --git a/src/messages.xlf b/src/messages.xlf index 8ae06b2b261..662bffe624d 100644 --- a/src/messages.xlf +++ b/src/messages.xlf @@ -13394,7 +13394,7 @@ The branches will be removed but the steps will remain in the unit. src/assets/wise5/services/createBranchService.ts - 50 + 45 From 1390e0d9aad11161d1c10a4d2eaa10e8862e1929 Mon Sep 17 00:00:00 2001 From: Hiroki Terashima Date: Sat, 6 Dec 2025 19:37:49 -0800 Subject: [PATCH 12/28] Use inject() for WiseTinymceEditorComponent and its child classes --- .../wise-authoring-tinymce-editor.component.ts | 17 +++++------------ .../wise-tinymce-editor.component.ts | 8 +++----- src/messages.xlf | 12 ++++++------ 3 files changed, 14 insertions(+), 23 deletions(-) diff --git a/src/assets/wise5/directives/wise-tinymce-editor/wise-authoring-tinymce-editor.component.ts b/src/assets/wise5/directives/wise-tinymce-editor/wise-authoring-tinymce-editor.component.ts index ad676fc1c6b..3e5c9e12316 100644 --- a/src/assets/wise5/directives/wise-tinymce-editor/wise-authoring-tinymce-editor.component.ts +++ b/src/assets/wise5/directives/wise-tinymce-editor/wise-authoring-tinymce-editor.component.ts @@ -1,6 +1,5 @@ -import { Component } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { ConfigService } from '../../services/configService'; -import { NotebookService } from '../../services/notebookService'; import 'tinymce'; import { MatDialog } from '@angular/material/dialog'; import { ProjectAssetAuthoringComponent } from '../../authoringTool/project-asset-authoring/project-asset-authoring.component'; @@ -30,6 +29,8 @@ declare let tinymce: any; />` }) export class WiseAuthoringTinymceEditorComponent extends WiseTinymceEditorComponent { + private configService = inject(ConfigService); + private dialog = inject(MatDialog); protected toolbar: string = `undo redo | fontselect | formatselect | fontsizeselect | bold italic underline | image media link wiselink | forecolor backcolor | alignment numlist bullist | emoticons removeformat fullscreen`; @@ -41,18 +42,10 @@ export class WiseAuthoringTinymceEditorComponent extends WiseTinymceEditorCompon } }; - constructor( - private ConfigService: ConfigService, - private dialog: MatDialog, - NotebookService: NotebookService - ) { - super(NotebookService); - } - ngOnInit(): void { + super.ngOnInit(); this.addPluginName('wiselink'); this.initializeInsertWISELinkPlugin(); - this.initializeTinyMCE(); } private initializeInsertWISELinkPlugin(): void { @@ -113,7 +106,7 @@ export class WiseAuthoringTinymceEditorComponent extends WiseTinymceEditorCompon .subscribe((result: any) => { const fileName = result.assetItem.fileName; const fileNameNoExt = fileName.substr(0, fileName.lastIndexOf('.')) || fileName; - const fullFilePath = `${this.ConfigService.getProjectAssetsDirectoryPath()}/${fileName}`; + const fullFilePath = `${this.configService.getProjectAssetsDirectoryPath()}/${fileName}`; callback(fullFilePath, { alt: fileNameNoExt, text: fileNameNoExt }); }); } diff --git a/src/assets/wise5/directives/wise-tinymce-editor/wise-tinymce-editor.component.ts b/src/assets/wise5/directives/wise-tinymce-editor/wise-tinymce-editor.component.ts index 16b548be131..a56b49deecb 100644 --- a/src/assets/wise5/directives/wise-tinymce-editor/wise-tinymce-editor.component.ts +++ b/src/assets/wise5/directives/wise-tinymce-editor/wise-tinymce-editor.component.ts @@ -1,4 +1,4 @@ -import { Component, EventEmitter, Input, Output, SimpleChanges, ViewChild } from '@angular/core'; +import { Component, EventEmitter, inject, Input, Output, SimpleChanges, ViewChild } from '@angular/core'; import { debounceTime } from 'rxjs/operators'; import { Subject, Subscription } from 'rxjs'; import { NotebookService } from '../../services/notebookService'; @@ -25,6 +25,7 @@ export class WiseTinymceEditorComponent { @Input() language: Language; @Input() model: any; @Output() modelChange: EventEmitter = new EventEmitter(); + protected notebookService = inject(NotebookService); @Output() openNotebook: EventEmitter = new EventEmitter(); private previousContent: string; private subscriptions: Subscription = new Subscription(); @@ -78,15 +79,12 @@ export class WiseTinymceEditorComponent { 'wordcount' ]; - constructor(private notebookService: NotebookService) { + ngOnInit(): void { this.subscriptions.add( this.debouncer.pipe(debounceTime(1000)).subscribe((value) => { this.modelChange.emit(value); }) ); - } - - ngOnInit(): void { if (this.isAddNoteButtonAvailable) { this.subscriptions.add( this.notebookService.notebookItemChosen$.subscribe(({ requester, notebookItem }) => { diff --git a/src/messages.xlf b/src/messages.xlf index 662bffe624d..6672b5ba861 100644 --- a/src/messages.xlf +++ b/src/messages.xlf @@ -21778,42 +21778,42 @@ If this problem continues, let your teacher know and move on to the next activit Alignment src/assets/wise5/directives/wise-tinymce-editor/wise-authoring-tinymce-editor.component.ts - 39 + 40 Insert WISE Link src/assets/wise5/directives/wise-tinymce-editor/wise-authoring-tinymce-editor.component.ts - 70 + 63 File src/assets/wise5/directives/wise-tinymce-editor/wise-tinymce-editor.component.ts - 164 + 162 Insert from Notebook src/assets/wise5/directives/wise-tinymce-editor/wise-tinymce-editor.component.ts - 178 + 176 Insert note + src/assets/wise5/directives/wise-tinymce-editor/wise-tinymce-editor.component.ts - 179 + 177 Image from notebook src/assets/wise5/directives/wise-tinymce-editor/wise-tinymce-editor.component.ts - 205 + 203 From 145939f481788bb64b47b04e68a788d7aba7e499 Mon Sep 17 00:00:00 2001 From: Hiroki Terashima Date: Sat, 6 Dec 2025 19:53:09 -0800 Subject: [PATCH 13/28] Use inject() for RegisterUserForm and its child classes --- .../register-student-form.component.ts | 37 +++++------------ .../register-teacher-form.component.ts | 31 ++++---------- .../register-user-form.component.ts | 16 +++++++- src/messages.xlf | 40 +++++++++---------- 4 files changed, 52 insertions(+), 72 deletions(-) diff --git a/src/app/register/register-student-form/register-student-form.component.ts b/src/app/register/register-student-form/register-student-form.component.ts index 9977e0cfd95..ac26c221111 100644 --- a/src/app/register/register-student-form/register-student-form.component.ts +++ b/src/app/register/register-student-form/register-student-form.component.ts @@ -1,20 +1,17 @@ -import { ActivatedRoute, Router } from '@angular/router'; -import { ChangeDetectorRef, Component, OnInit } from '@angular/core'; + +import { Component, inject, OnInit } from '@angular/core'; import { Student } from '../../domain/student'; import { StudentService } from '../../student/student.service'; -import { FormControl, FormGroup, Validators, FormBuilder } from '@angular/forms'; -import { UtilService } from '../../services/util.service'; -import { MatSnackBar } from '@angular/material/snack-bar'; +import { FormControl, FormGroup, Validators } from '@angular/forms'; import { RegisterUserFormComponent } from '../register-user-form/register-user-form.component'; import { HttpErrorResponse } from '@angular/common/http'; -import { ReCaptchaV3Service } from 'ng-recaptcha-2'; import { NewPasswordAndConfirmComponent } from '../../password/new-password-and-confirm/new-password-and-confirm.component'; -import { ConfigService } from '../../services/config.service'; + @Component({ - selector: 'register-student-form', - templateUrl: './register-student-form.component.html', - styleUrls: ['./register-student-form.component.scss'], - standalone: false + selector: 'register-student-form', + templateUrl: './register-student-form.component.html', + styleUrls: ['./register-student-form.component.scss'], + standalone: false }) export class RegisterStudentFormComponent extends RegisterUserFormComponent implements OnInit { createStudentAccountFormGroup: FormGroup = this.fb.group({ @@ -48,24 +45,12 @@ export class RegisterStudentFormComponent extends RegisterUserFormComponent impl securityQuestions: object; user: Student = new Student(); - constructor( - private changeDetectorRef: ChangeDetectorRef, - private configService: ConfigService, - protected fb: FormBuilder, - private recaptchaV3Service: ReCaptchaV3Service, - private router: Router, - private route: ActivatedRoute, - protected snackBar: MatSnackBar, - private studentService: StudentService, - private utilService: UtilService - ) { - super(fb, snackBar); + private studentService = inject(StudentService); + + ngOnInit() { this.studentService.retrieveSecurityQuestions().subscribe((response) => { this.securityQuestions = response; }); - } - - ngOnInit() { this.route.params.subscribe((params) => { this.user.googleUserId = params['gID']; this.user.microsoftUserId = params['mID']; diff --git a/src/app/register/register-teacher-form/register-teacher-form.component.ts b/src/app/register/register-teacher-form/register-teacher-form.component.ts index c73720d5d47..ad1280e3bf6 100644 --- a/src/app/register/register-teacher-form/register-teacher-form.component.ts +++ b/src/app/register/register-teacher-form/register-teacher-form.component.ts @@ -1,22 +1,17 @@ -import { ChangeDetectorRef, Component, OnInit } from '@angular/core'; -import { ActivatedRoute, Router } from '@angular/router'; +import { Component, inject, OnInit } from '@angular/core'; import { Teacher } from '../../domain/teacher'; import { TeacherService } from '../../teacher/teacher.service'; -import { FormControl, FormGroup, Validators, FormBuilder } from '@angular/forms'; -import { UtilService } from '../../services/util.service'; -import { MatSnackBar } from '@angular/material/snack-bar'; +import { FormControl, FormGroup, Validators } from '@angular/forms'; import { RegisterUserFormComponent } from '../register-user-form/register-user-form.component'; import { HttpErrorResponse } from '@angular/common/http'; -import { ReCaptchaV3Service } from 'ng-recaptcha-2'; import { NewPasswordAndConfirmComponent } from '../../password/new-password-and-confirm/new-password-and-confirm.component'; -import { ConfigService } from '../../services/config.service'; import { SchoolLevel, schoolLevels } from '../../domain/profile.constants'; @Component({ - selector: 'register-teacher-form', - templateUrl: './register-teacher-form.component.html', - styleUrls: ['./register-teacher-form.component.scss'], - standalone: false + selector: 'register-teacher-form', + templateUrl: './register-teacher-form.component.html', + styleUrls: ['./register-teacher-form.component.scss'], + standalone: false }) export class RegisterTeacherFormComponent extends RegisterUserFormComponent implements OnInit { createTeacherAccountFormGroup: FormGroup = this.fb.group( @@ -41,19 +36,7 @@ export class RegisterTeacherFormComponent extends RegisterUserFormComponent impl schoolLevels: SchoolLevel[] = schoolLevels; user: Teacher = new Teacher(); - constructor( - private changeDetectorRef: ChangeDetectorRef, - private configService: ConfigService, - protected fb: FormBuilder, - private recaptchaV3Service: ReCaptchaV3Service, - private router: Router, - private route: ActivatedRoute, - protected snackBar: MatSnackBar, - private teacherService: TeacherService, - private utilService: UtilService - ) { - super(fb, snackBar); - } + private teacherService = inject(TeacherService); ngOnInit(): void { this.route.params.subscribe((params) => { diff --git a/src/app/register/register-user-form/register-user-form.component.ts b/src/app/register/register-user-form/register-user-form.component.ts index 0f75d5e51b3..1561d65dbf3 100644 --- a/src/app/register/register-user-form/register-user-form.component.ts +++ b/src/app/register/register-user-form/register-user-form.component.ts @@ -1,9 +1,23 @@ +import { ChangeDetectorRef, inject } from '@angular/core'; import { FormBuilder, FormGroup } from '@angular/forms'; +import { ActivatedRoute, Router } from '@angular/router'; import { User } from '../../domain/user'; import { injectPasswordErrors } from '../../common/password-helper'; import { MatSnackBar } from '@angular/material/snack-bar'; +import { ReCaptchaV3Service } from 'ng-recaptcha-2'; +import { ConfigService } from '../../services/config.service'; +import { UtilService } from '../../services/util.service'; export class RegisterUserFormComponent { + protected fb = inject(FormBuilder); + protected snackBar = inject(MatSnackBar); + protected changeDetectorRef = inject(ChangeDetectorRef); + protected configService = inject(ConfigService); + protected recaptchaV3Service = inject(ReCaptchaV3Service); + protected router = inject(Router); + protected route = inject(ActivatedRoute); + protected utilService = inject(UtilService); + protected NAME_REGEX = '^[a-zA-Z]+([ -]?[a-zA-Z]+)*$'; protected confirmPasswordLabel: string = $localize`Confirm Password`; @@ -12,8 +26,6 @@ export class RegisterUserFormComponent { protected processing: boolean = false; user: User; - constructor(protected fb: FormBuilder, protected snackBar: MatSnackBar) {} - handleCreateAccountError(error: any, userObject: User): void { switch (error.messageCode) { case 'invalidPassword': diff --git a/src/messages.xlf b/src/messages.xlf index 6672b5ba861..12af2b97d39 100644 --- a/src/messages.xlf +++ b/src/messages.xlf @@ -3351,7 +3351,7 @@ Click "Cancel" to keep the invalid JSON open so you can fix it. src/app/register/register-student-form/register-student-form.component.ts - 35 + 32 @@ -3362,7 +3362,7 @@ Click "Cancel" to keep the invalid JSON open so you can fix it. src/app/register/register-student-form/register-student-form.component.ts - 36 + 33 @@ -3373,7 +3373,7 @@ Click "Cancel" to keep the invalid JSON open so you can fix it. src/app/register/register-student-form/register-student-form.component.ts - 37 + 34 @@ -3384,7 +3384,7 @@ Click "Cancel" to keep the invalid JSON open so you can fix it. src/app/register/register-student-form/register-student-form.component.ts - 38 + 35 @@ -3395,7 +3395,7 @@ Click "Cancel" to keep the invalid JSON open so you can fix it. src/app/register/register-student-form/register-student-form.component.ts - 39 + 36 @@ -3406,7 +3406,7 @@ Click "Cancel" to keep the invalid JSON open so you can fix it. src/app/register/register-student-form/register-student-form.component.ts - 40 + 37 @@ -3417,7 +3417,7 @@ Click "Cancel" to keep the invalid JSON open so you can fix it. src/app/register/register-student-form/register-student-form.component.ts - 41 + 38 @@ -3428,7 +3428,7 @@ Click "Cancel" to keep the invalid JSON open so you can fix it. src/app/register/register-student-form/register-student-form.component.ts - 42 + 39 @@ -3439,7 +3439,7 @@ Click "Cancel" to keep the invalid JSON open so you can fix it. src/app/register/register-student-form/register-student-form.component.ts - 43 + 40 @@ -3450,7 +3450,7 @@ Click "Cancel" to keep the invalid JSON open so you can fix it. src/app/register/register-student-form/register-student-form.component.ts - 44 + 41 @@ -3461,7 +3461,7 @@ Click "Cancel" to keep the invalid JSON open so you can fix it. src/app/register/register-student-form/register-student-form.component.ts - 45 + 42 @@ -3472,7 +3472,7 @@ Click "Cancel" to keep the invalid JSON open so you can fix it. src/app/register/register-student-form/register-student-form.component.ts - 46 + 43 @@ -3530,7 +3530,7 @@ Click "Cancel" to keep the invalid JSON open so you can fix it. src/app/register/register-user-form/register-user-form.component.ts - 10 + 24 src/app/student/account/edit/edit.component.html @@ -7694,21 +7694,21 @@ Click "Cancel" to keep the invalid JSON open so you can fix it.Female src/app/register/register-student-form/register-student-form.component.ts - 29 + 26 Male src/app/register/register-student-form/register-student-form.component.ts - 30 + 27 No Answer/Other src/app/register/register-student-form/register-student-form.component.ts - 31 + 28 @@ -7885,28 +7885,28 @@ Click "Cancel" to keep the invalid JSON open so you can fix it.Confirm Password src/app/register/register-user-form/register-user-form.component.ts - 9 + 23 Error: First Name and Last Name must only contain characters A-Z, a-z, spaces, or dashes and can not start or end with a space or dash src/app/register/register-user-form/register-user-form.component.ts - 34 + 46 Error: First Name must only contain characters A-Z, a-z, spaces, or dashes and can not start or end with a space or dash src/app/register/register-user-form/register-user-form.component.ts - 36 + 48 Error: Last Name must only contain characters A-Z, a-z, spaces, or dashes and can not start or end with a space or dash src/app/register/register-user-form/register-user-form.component.ts - 38 + 50 From 8cbfd769b30204a128fea8b59e3c431a7dab1348 Mon Sep 17 00:00:00 2001 From: Hiroki Terashima Date: Sat, 6 Dec 2025 20:05:22 -0800 Subject: [PATCH 14/28] Use inject() for Notebook classes --- .../notebook-item/notebook-item.component.ts | 14 +++---- .../notebook-launcher.component.ts | 10 ++--- .../notebook-notes.component.ts | 34 ++++++--------- .../notebook-parent.component.ts | 26 ++++++------ .../notebook-report.component.ts | 42 ++++++++----------- src/messages.xlf | 10 ++--- 6 files changed, 57 insertions(+), 79 deletions(-) diff --git a/src/app/notebook/notebook-item/notebook-item.component.ts b/src/app/notebook/notebook-item/notebook-item.component.ts index 0ef1d626e41..4f0fbb58e54 100644 --- a/src/app/notebook/notebook-item/notebook-item.component.ts +++ b/src/app/notebook/notebook-item/notebook-item.component.ts @@ -1,4 +1,4 @@ -import { Component, EventEmitter, Input, Output } from '@angular/core'; +import { Component, EventEmitter, Input, Output, inject } from '@angular/core'; import { MatDialog, MatDialogModule } from '@angular/material/dialog'; import { Subscription } from 'rxjs'; import { DialogWithConfirmComponent } from '../../../assets/wise5/directives/dialog-with-confirm/dialog-with-confirm.component'; @@ -25,6 +25,11 @@ import { MatButtonModule } from '@angular/material/button'; templateUrl: 'notebook-item.component.html' }) export class NotebookItemComponent { + private configService = inject(ConfigService); + private dialog = inject(MatDialog); + private notebookService = inject(NotebookService); + private projectService = inject(ProjectService); + protected canDelete: boolean; protected canRevive: boolean; protected color: string; @@ -39,13 +44,6 @@ export class NotebookItemComponent { @Output() onSelect: EventEmitter = new EventEmitter(); private type: string; - constructor( - private configService: ConfigService, - private dialog: MatDialog, - private notebookService: NotebookService, - private projectService: ProjectService - ) {} - ngOnInit(): void { this.item = this.note; this.type = this.item ? this.item.type : null; diff --git a/src/app/notebook/notebook-launcher/notebook-launcher.component.ts b/src/app/notebook/notebook-launcher/notebook-launcher.component.ts index 8bea999e762..1af785a0ee3 100644 --- a/src/app/notebook/notebook-launcher/notebook-launcher.component.ts +++ b/src/app/notebook/notebook-launcher/notebook-launcher.component.ts @@ -1,4 +1,4 @@ -import { Component, Input } from '@angular/core'; +import { Component, Input, inject } from '@angular/core'; import { NotebookService } from '../../../assets/wise5/services/notebookService'; import { ProjectService } from '../../../assets/wise5/services/projectService'; import { Subscription } from 'rxjs'; @@ -12,15 +12,13 @@ import { MatTooltipModule } from '@angular/material/tooltip'; templateUrl: 'notebook-launcher.component.html' }) export class NotebookLauncherComponent { + private notebookService = inject(NotebookService); + private projectService = inject(ProjectService); + protected label: string = ''; @Input() notebookConfig: any; private subscription: Subscription = new Subscription(); - constructor( - private notebookService: NotebookService, - private projectService: ProjectService - ) {} - ngOnInit(): void { this.setLabel(); this.subscription.add(this.projectService.projectParsed$.subscribe(() => this.setLabel())); diff --git a/src/app/notebook/notebook-notes/notebook-notes.component.ts b/src/app/notebook/notebook-notes/notebook-notes.component.ts index ef964c2d18b..f6dfb6cb2b4 100644 --- a/src/app/notebook/notebook-notes/notebook-notes.component.ts +++ b/src/app/notebook/notebook-notes/notebook-notes.component.ts @@ -1,7 +1,5 @@ -import { Component, Input, ViewEncapsulation } from '@angular/core'; +import { Component, Input, ViewEncapsulation, inject } from '@angular/core'; import { Subscription } from 'rxjs'; -import { ConfigService } from '../../../assets/wise5/services/configService'; -import { NotebookService } from '../../../assets/wise5/services/notebookService'; import { ProjectService } from '../../../assets/wise5/services/projectService'; import { StudentDataService } from '../../../assets/wise5/services/studentDataService'; import { NotebookParentComponent } from '../notebook-parent/notebook-parent.component'; @@ -31,6 +29,9 @@ import { MatIconModule } from '@angular/material/icon'; encapsulation: ViewEncapsulation.None }) export class NotebookNotesComponent extends NotebookParentComponent { + private dataService = inject(StudentDataService); + private projectService = inject(ProjectService); + protected groups = []; private groupNameToGroup = {}; protected hasPrivateNotes: boolean = false; @@ -42,15 +43,6 @@ export class NotebookNotesComponent extends NotebookParentComponent { private subscriptions: Subscription = new Subscription(); @Input() viewOnly: boolean; - constructor( - configService: ConfigService, - private dataService: StudentDataService, - NotebookService: NotebookService, - private projectService: ProjectService - ) { - super(configService, NotebookService); - } - ngOnInit(): void { super.ngOnInit(); this.setLabel(); @@ -59,7 +51,7 @@ export class NotebookNotesComponent extends NotebookParentComponent { this.hasPrivateNotes = this.isHasPrivateNotes(); this.subscriptions.add( - this.NotebookService.notebookUpdated$.subscribe(({ notebookItem }) => { + this.notebookService.notebookUpdated$.subscribe(({ notebookItem }) => { if ( (notebookItem.groups == null || notebookItem.groups.length === 0) && notebookItem.type === 'note' @@ -74,7 +66,7 @@ export class NotebookNotesComponent extends NotebookParentComponent { ); this.subscriptions.add( - this.NotebookService.insertMode$.subscribe((args) => { + this.notebookService.insertMode$.subscribe((args) => { this.insertArgs = args; if (args.visibleSpace) { this.selectedTabIndex = args.visibleSpace === 'public' ? 1 : 0; @@ -83,10 +75,10 @@ export class NotebookNotesComponent extends NotebookParentComponent { ); this.subscriptions.add( - this.NotebookService.publicNotebookItemsRetrieved$.subscribe(() => { + this.notebookService.publicNotebookItemsRetrieved$.subscribe(() => { for (const group of this.groups) { if (group.name !== 'private') { - group.items = this.NotebookService.publicNotebookItems[group.name]; + group.items = this.notebookService.publicNotebookItems[group.name]; } } }) @@ -99,7 +91,7 @@ export class NotebookNotesComponent extends NotebookParentComponent { }) ); - this.NotebookService.retrievePublicNotebookItems('public'); + this.notebookService.retrievePublicNotebookItems('public'); } ngOnDestroy(): void { @@ -209,20 +201,20 @@ export class NotebookNotesComponent extends NotebookParentComponent { } protected addNote(): void { - this.NotebookService.addNote(this.dataService.getCurrentNodeId()); + this.notebookService.addNote(this.dataService.getCurrentNodeId()); } protected select({ event, note }: any): void { if (this.insertArgs.insertMode) { this.insertArgs.notebookItem = note; - this.NotebookService.broadcastNotebookItemChosen(this.insertArgs); + this.notebookService.broadcastNotebookItemChosen(this.insertArgs); } else { const isEditMode = !this.viewOnly; - this.NotebookService.editNote(this.dataService.getCurrentNodeId(), note, isEditMode); + this.notebookService.editNote(this.dataService.getCurrentNodeId(), note, isEditMode); } } protected close(): void { - this.NotebookService.closeNotes(); + this.notebookService.closeNotes(); } } diff --git a/src/app/notebook/notebook-parent/notebook-parent.component.ts b/src/app/notebook/notebook-parent/notebook-parent.component.ts index 6bac762a01a..09b9638d560 100644 --- a/src/app/notebook/notebook-parent/notebook-parent.component.ts +++ b/src/app/notebook/notebook-parent/notebook-parent.component.ts @@ -1,44 +1,42 @@ -import { Directive, Input } from '@angular/core'; +import { Directive, Input, inject } from '@angular/core'; import { copy } from '../../../assets/wise5/common/object/object'; import { ConfigService } from '../../../assets/wise5/services/configService'; import { NotebookService } from '../../../assets/wise5/services/notebookService'; @Directive() export class NotebookParentComponent { + configService = inject(ConfigService); + notebookService = inject(NotebookService); + @Input() config: any; @Input() mode: string; @Input() workgroupId: number; notebook: any; - constructor( - public ConfigService: ConfigService, - public NotebookService: NotebookService - ) {} - ngOnInit(): void { if (this.workgroupId == null) { - this.workgroupId = this.ConfigService.getWorkgroupId(); + this.workgroupId = this.configService.getWorkgroupId(); } if (this.config == null) { this.setConfig(); } - this.notebook = this.NotebookService.getNotebookByWorkgroup(this.workgroupId); + this.notebook = this.notebookService.getNotebookByWorkgroup(this.workgroupId); } setConfig(): void { if (this.isStudentNotebook()) { - this.config = copy(this.NotebookService.getStudentNotebookConfig()); + this.config = copy(this.notebookService.getStudentNotebookConfig()); } else { - this.config = copy(this.NotebookService.getTeacherNotebookConfig()); + this.config = copy(this.notebookService.getTeacherNotebookConfig()); } } isStudentNotebook(): boolean { return ( - this.ConfigService.getMode() === 'studentRun' || - this.ConfigService.getMode() === 'preview' || - ((this.ConfigService.isRunOwner() || this.ConfigService.isRunSharedTeacher()) && - this.ConfigService.getWorkgroupId() !== this.workgroupId) + this.configService.getMode() === 'studentRun' || + this.configService.getMode() === 'preview' || + ((this.configService.isRunOwner() || this.configService.isRunSharedTeacher()) && + this.configService.getWorkgroupId() !== this.workgroupId) ); } } diff --git a/src/app/notebook/notebook-report/notebook-report.component.ts b/src/app/notebook/notebook-report/notebook-report.component.ts index 25d67d2c76f..1ef718ddc43 100644 --- a/src/app/notebook/notebook-report/notebook-report.component.ts +++ b/src/app/notebook/notebook-report/notebook-report.component.ts @@ -1,5 +1,5 @@ import { CommonModule } from '@angular/common'; -import { Component } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { MatButtonModule } from '@angular/material/button'; import { MatCardModule } from '@angular/material/card'; import { MatIconModule } from '@angular/material/icon'; @@ -11,8 +11,6 @@ import { replaceWiseLinks } from '../../../assets/wise5/common/wise-link/wise-link'; import { WiseTinymceEditorComponent } from '../../../assets/wise5/directives/wise-tinymce-editor/wise-tinymce-editor.component'; -import { ConfigService } from '../../../assets/wise5/services/configService'; -import { NotebookService } from '../../../assets/wise5/services/notebookService'; import { ProjectService } from '../../../assets/wise5/services/projectService'; import { NotebookParentComponent } from '../notebook-parent/notebook-parent.component'; import { BreakpointObserver } from '@angular/cdk/layout'; @@ -32,6 +30,9 @@ import { BreakpointObserver } from '@angular/cdk/layout'; templateUrl: 'notebook-report.component.html' }) export class NotebookReportComponent extends NotebookParentComponent { + private breakpointObserver = inject(BreakpointObserver); + private projectService = inject(ProjectService); + private autoSaveIntervalMS: number = 30000; private autoSaveIntervalId: any; protected collapsed: boolean = true; @@ -45,23 +46,14 @@ export class NotebookReportComponent extends NotebookParentComponent { protected saveTime: number = null; private subscriptions: Subscription = new Subscription(); - constructor( - private breakpointObserver: BreakpointObserver, - configService: ConfigService, - notebookService: NotebookService, - private projectService: ProjectService - ) { - super(configService, notebookService); + ngOnInit(): void { + super.ngOnInit(); this.breakpointObserver.observe(['(max-width: 40rem)']).subscribe((result) => { if (!this.collapsed) { this.collapsed = true; this.fullscreen(); } }); - } - - ngOnInit(): void { - super.ngOnInit(); this.reportId = this.config.itemTypes.report.notes[0].reportId; this.setReportItem(); if (this.reportItem == null) { @@ -74,7 +66,7 @@ export class NotebookReportComponent extends NotebookParentComponent { this.isAddNoteButtonAvailable = this.config.itemTypes.note.enabled; this.subscriptions.add( - this.NotebookService.showReportAnnotations$.subscribe(() => { + this.notebookService.showReportAnnotations$.subscribe(() => { if (this.collapsed) { this.toggleCollapse(); } @@ -105,18 +97,18 @@ export class NotebookReportComponent extends NotebookParentComponent { } private setReportItem(): void { - this.reportItem = this.NotebookService.getLatestNotebookReportItemByReportId( + this.reportItem = this.notebookService.getLatestNotebookReportItemByReportId( this.reportId, this.workgroupId ); if (this.reportItem) { this.hasReport = true; - const clientSaveTime = this.ConfigService.convertToClientTimestamp( + const clientSaveTime = this.configService.convertToClientTimestamp( this.reportItem.serverSaveTime ); this.saveTime = clientSaveTime; } else { - this.reportItem = this.NotebookService.getTemplateReportItemByReportId(this.reportId); + this.reportItem = this.notebookService.getTemplateReportItemByReportId(this.reportId); } if (this.reportItem != null) { this.reportItemContent = this.projectService.injectAssetPaths( @@ -132,7 +124,7 @@ export class NotebookReportComponent extends NotebookParentComponent { } if (this.full) { this.full = false; - this.NotebookService.setReportFullScreen(false); + this.notebookService.setReportFullScreen(false); } this.collapsed = !this.collapsed; } @@ -144,17 +136,17 @@ export class NotebookReportComponent extends NotebookParentComponent { } else { this.full = !this.full; } - this.NotebookService.setReportFullScreen(this.full); + this.notebookService.setReportFullScreen(this.full); } protected addNotebookItemContent($event: any): void { - this.NotebookService.setInsertMode({ insertMode: true, requester: 'report' }); - this.NotebookService.setNotesVisible(true); + this.notebookService.setInsertMode({ insertMode: true, requester: 'report' }); + this.notebookService.setNotesVisible(true); } protected changed(value: string): void { this.dirty = true; - this.reportItem.content.content = this.ConfigService.removeAbsoluteAssetPaths( + this.reportItem.content.content = this.configService.removeAbsoluteAssetPaths( insertWiseLinks(value) ); this.saveTime = null; @@ -170,7 +162,7 @@ export class NotebookReportComponent extends NotebookParentComponent { } protected saveNotebookReportItem(): void { - this.NotebookService.saveNotebookItem( + this.notebookService.saveNotebookItem( this.reportItem.id, this.reportItem.nodeId, this.reportItem.localNotebookItemId, @@ -185,7 +177,7 @@ export class NotebookReportComponent extends NotebookParentComponent { // set the reportNotebookItemId to the newly-incremented id so that future saves during this // visit will be an update instead of an insert. this.reportItem.id = result.id; - this.saveTime = this.ConfigService.convertToClientTimestamp(result.serverSaveTime); + this.saveTime = this.configService.convertToClientTimestamp(result.serverSaveTime); } }); } diff --git a/src/messages.xlf b/src/messages.xlf index 12af2b97d39..91d122eaeb0 100644 --- a/src/messages.xlf +++ b/src/messages.xlf @@ -6811,28 +6811,28 @@ Click "Cancel" to keep the invalid JSON open so you can fix it.Are you sure you want to delete this ? src/app/notebook/notebook-item/notebook-item.component.ts - 88 + 86 Delete src/app/notebook/notebook-item/notebook-item.component.ts - 89 + 87 Are you sure you want to revive this ? src/app/notebook/notebook-item/notebook-item.component.ts - 105 + 103 Revive src/app/notebook/notebook-item/notebook-item.component.ts - 106 + 104 @@ -6867,7 +6867,7 @@ Click "Cancel" to keep the invalid JSON open so you can fix it.Personal src/app/notebook/notebook-notes/notebook-notes.component.ts - 119 + 111 From 9cbd095d042aa26c47ffbb7af29dc6ef9a5b8b79 Mon Sep 17 00:00:00 2001 From: Hiroki Terashima Date: Sat, 6 Dec 2025 20:13:59 -0800 Subject: [PATCH 15/28] Use inject() for AbstractBranchAuthoring class and its child classes --- .../abstract-branch-authoring.component.ts | 14 ++++++------- .../create-branch/create-branch.component.ts | 19 +++++------------ .../edit-branch/edit-branch.component.ts | 21 ++++++------------- src/messages.xlf | 4 ++-- 4 files changed, 19 insertions(+), 39 deletions(-) diff --git a/src/assets/wise5/authoringTool/abstract-branch-authoring/abstract-branch-authoring.component.ts b/src/assets/wise5/authoringTool/abstract-branch-authoring/abstract-branch-authoring.component.ts index 21413991616..92663ea08ee 100644 --- a/src/assets/wise5/authoringTool/abstract-branch-authoring/abstract-branch-authoring.component.ts +++ b/src/assets/wise5/authoringTool/abstract-branch-authoring/abstract-branch-authoring.component.ts @@ -1,4 +1,4 @@ -import { Directive } from '@angular/core'; +import { Directive, inject } from '@angular/core'; import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms'; import { TeacherProjectService } from '../../services/teacherProjectService'; import { ActivatedRoute, Router } from '@angular/router'; @@ -12,6 +12,11 @@ import { AuthorBranchParams } from '../../common/AuthorBranchParams'; @Directive() export abstract class AbstractBranchAuthoringComponent { + protected fb = inject(FormBuilder); + protected projectService = inject(TeacherProjectService); + protected route = inject(ActivatedRoute); + protected router = inject(Router); + protected readonly CHOICE_CHOSEN_VALUE: string = CHOICE_CHOSEN_VALUE; protected readonly RANDOM_VALUE: string = RANDOM_VALUE; protected readonly SCORE_VALUE: string = SCORE_VALUE; @@ -30,13 +35,6 @@ export abstract class AbstractBranchAuthoringComponent { mergeStep: new FormControl('') }); - constructor( - protected fb: FormBuilder, - protected projectService: TeacherProjectService, - protected route: ActivatedRoute, - protected router: Router - ) {} - ngOnInit(): void { this.targetId = history.state.targetId; this.targetTitle = this.projectService.getNodePositionAndTitle(this.targetId); diff --git a/src/assets/wise5/authoringTool/create-branch/create-branch.component.ts b/src/assets/wise5/authoringTool/create-branch/create-branch.component.ts index 673c9f36ab8..1a663ebaaf3 100644 --- a/src/assets/wise5/authoringTool/create-branch/create-branch.component.ts +++ b/src/assets/wise5/authoringTool/create-branch/create-branch.component.ts @@ -1,6 +1,5 @@ -import { Component } from '@angular/core'; -import { TeacherProjectService } from '../../services/teacherProjectService'; -import { FormBuilder, ReactiveFormsModule } from '@angular/forms'; +import { Component, inject } from '@angular/core'; +import { ReactiveFormsModule } from '@angular/forms'; import { MatFormFieldModule } from '@angular/material/form-field'; import { MatSelectModule } from '@angular/material/select'; import { MatInputModule } from '@angular/material/input'; @@ -8,7 +7,7 @@ import { MatButtonModule } from '@angular/material/button'; import { SelectStepComponent } from '../../../../app/authoring-tool/select-step/select-step.component'; import { SelectComponentComponent } from '../../../../app/authoring-tool/select-component/select-component.component'; import { CreateBranchPathsComponent } from '../create-branch-paths/create-branch-paths.component'; -import { ActivatedRoute, Router, RouterModule } from '@angular/router'; +import { RouterModule } from '@angular/router'; import { SelectMergeStepComponent } from '../select-merge-step/select-merge-step.component'; import { CreateBranchService } from '../../services/createBranchService'; import { SelectPathCountComponent } from '../select-path-count/select-path-count.component'; @@ -39,16 +38,8 @@ import { MatDividerModule } from '@angular/material/divider'; templateUrl: './create-branch.component.html' }) export class CreateBranchComponent extends AbstractBranchAuthoringComponent { - constructor( - private createBranchService: CreateBranchService, - private dialog: MatDialog, - protected fb: FormBuilder, - protected projectService: TeacherProjectService, - protected route: ActivatedRoute, - protected router: Router - ) { - super(fb, projectService, route, router); - } + private createBranchService = inject(CreateBranchService); + private dialog = inject(MatDialog); ngOnInit(): void { super.ngOnInit(); diff --git a/src/assets/wise5/authoringTool/edit-branch/edit-branch.component.ts b/src/assets/wise5/authoringTool/edit-branch/edit-branch.component.ts index bf16b958093..edf99c121b0 100644 --- a/src/assets/wise5/authoringTool/edit-branch/edit-branch.component.ts +++ b/src/assets/wise5/authoringTool/edit-branch/edit-branch.component.ts @@ -1,15 +1,14 @@ -import { ChangeDetectorRef, Component } from '@angular/core'; -import { FormBuilder, ReactiveFormsModule } from '@angular/forms'; +import { ChangeDetectorRef, Component, inject } from '@angular/core'; +import { ReactiveFormsModule } from '@angular/forms'; import { MatButtonModule } from '@angular/material/button'; import { MatDividerModule } from '@angular/material/divider'; import { MatProgressBarModule } from '@angular/material/progress-bar'; -import { ActivatedRoute, Router, RouterModule } from '@angular/router'; +import { RouterModule } from '@angular/router'; import { SelectComponentComponent } from '../../../../app/authoring-tool/select-component/select-component.component'; import { SelectStepComponent } from '../../../../app/authoring-tool/select-step/select-step.component'; import { copy } from '../../common/object/object'; import { DeleteBranchService } from '../../services/deleteBranchService'; import { EditBranchService } from '../../services/editBranchService'; -import { TeacherProjectService } from '../../services/teacherProjectService'; import { AbstractBranchAuthoringComponent } from '../abstract-branch-authoring/abstract-branch-authoring.component'; import { EditBranchPathsComponent } from '../edit-branch-paths/edit-branch-paths.component'; import { SelectBranchCriteriaComponent } from '../select-branch-criteria/select-branch-criteria.component'; @@ -36,17 +35,9 @@ export class EditBranchComponent extends AbstractBranchAuthoringComponent { private node: any; protected submitting: boolean; - constructor( - private changeDetector: ChangeDetectorRef, - private deleteBranchService: DeleteBranchService, - private editBranchService: EditBranchService, - protected fb: FormBuilder, - protected projectService: TeacherProjectService, - protected route: ActivatedRoute, - protected router: Router - ) { - super(fb, projectService, route, router); - } + private changeDetector = inject(ChangeDetectorRef); + private deleteBranchService = inject(DeleteBranchService); + private editBranchService = inject(EditBranchService); ngOnInit(): void { super.ngOnInit(); diff --git a/src/messages.xlf b/src/messages.xlf index 91d122eaeb0..32554c93207 100644 --- a/src/messages.xlf +++ b/src/messages.xlf @@ -11344,7 +11344,7 @@ Click "Cancel" to keep the invalid JSON open so you can fix it.Creating Branch src/assets/wise5/authoringTool/create-branch/create-branch.component.ts - 83 + 74 @@ -11402,7 +11402,7 @@ Click "Cancel" to keep the invalid JSON open so you can fix it. src/assets/wise5/authoringTool/edit-branch/edit-branch.component.ts - 157 + 148 From 960c3ccd23be90eb5464b7520d78e6bbc722ff19 Mon Sep 17 00:00:00 2001 From: Hiroki Terashima Date: Sat, 6 Dec 2025 20:22:26 -0800 Subject: [PATCH 16/28] Use inject() for AbstractTranslatableFieldComponent and its child classes --- .../abstract-translatable-field.component.ts | 9 ++++----- .../translatable-asset-chooser.component.ts | 12 ++---------- .../translatable-rich-text-editor.component.ts | 12 ++---------- src/messages.xlf | 4 ++-- 4 files changed, 10 insertions(+), 27 deletions(-) diff --git a/src/assets/wise5/authoringTool/components/abstract-translatable-field/abstract-translatable-field.component.ts b/src/assets/wise5/authoringTool/components/abstract-translatable-field/abstract-translatable-field.component.ts index e58bde1ec7f..68624c04f3f 100644 --- a/src/assets/wise5/authoringTool/components/abstract-translatable-field/abstract-translatable-field.component.ts +++ b/src/assets/wise5/authoringTool/components/abstract-translatable-field/abstract-translatable-field.component.ts @@ -1,4 +1,4 @@ -import { Input, Signal, Output, computed, Directive } from '@angular/core'; +import { Input, Signal, Output, computed, Directive, inject } from '@angular/core'; import { Subject, Subscription, debounceTime } from 'rxjs'; import { Language } from '../../../../../app/domain/language'; import { TeacherProjectTranslationService } from '../../../services/teacherProjectTranslationService'; @@ -10,6 +10,9 @@ import { copy } from '../../../common/object/object'; @Directive() export abstract class AbstractTranslatableFieldComponent { + protected projectService = inject(TeacherProjectService); + protected projectTranslationService = inject(TeacherProjectTranslationService); + @Input() content: object; protected currentLanguage: Signal = this.projectService.currentLanguage; private currentTranslations$ = toObservable(this.projectTranslationService.currentTranslations); @@ -26,10 +29,6 @@ export abstract class AbstractTranslatableFieldComponent { protected subscriptions: Subscription = new Subscription(); protected translationText: string; protected translationTextChanged: Subject = new Subject(); - constructor( - protected projectService: TeacherProjectService, - protected projectTranslationService: TeacherProjectTranslationService - ) {} ngOnChanges(): void { this.setI18nId(); diff --git a/src/assets/wise5/authoringTool/components/translatable-asset-chooser/translatable-asset-chooser.component.ts b/src/assets/wise5/authoringTool/components/translatable-asset-chooser/translatable-asset-chooser.component.ts index 610a9f945bf..bbdd1bd20d5 100644 --- a/src/assets/wise5/authoringTool/components/translatable-asset-chooser/translatable-asset-chooser.component.ts +++ b/src/assets/wise5/authoringTool/components/translatable-asset-chooser/translatable-asset-chooser.component.ts @@ -1,4 +1,4 @@ -import { Component, Input } from '@angular/core'; +import { Component, Input, inject } from '@angular/core'; import { MatIconModule } from '@angular/material/icon'; import { MatButtonModule } from '@angular/material/button'; import { MatTooltipModule } from '@angular/material/tooltip'; @@ -6,8 +6,6 @@ import { AssetChooser } from '../../project-asset-authoring/asset-chooser'; import { MatDialog } from '@angular/material/dialog'; import { filter } from 'rxjs'; import { AbstractTranslatableFieldComponent } from '../abstract-translatable-field/abstract-translatable-field.component'; -import { TeacherProjectService } from '../../../services/teacherProjectService'; -import { TeacherProjectTranslationService } from '../../../services/teacherProjectTranslationService'; @Component({ selector: 'translatable-asset-chooser', @@ -21,13 +19,7 @@ export class TranslatableAssetChooserComponent extends AbstractTranslatableField return value; }; - constructor( - private dialog: MatDialog, - protected projectService: TeacherProjectService, - protected projectTranslationService: TeacherProjectTranslationService - ) { - super(projectService, projectTranslationService); - } + private dialog = inject(MatDialog); protected chooseAsset(): void { new AssetChooser(this.dialog) diff --git a/src/assets/wise5/authoringTool/components/translatable-rich-text-editor/translatable-rich-text-editor.component.ts b/src/assets/wise5/authoringTool/components/translatable-rich-text-editor/translatable-rich-text-editor.component.ts index 40fddaf4437..285b79222ef 100644 --- a/src/assets/wise5/authoringTool/components/translatable-rich-text-editor/translatable-rich-text-editor.component.ts +++ b/src/assets/wise5/authoringTool/components/translatable-rich-text-editor/translatable-rich-text-editor.component.ts @@ -1,11 +1,9 @@ -import { Component, ViewChild } from '@angular/core'; +import { Component, inject, ViewChild } from '@angular/core'; import { AbstractTranslatableFieldComponent } from '../abstract-translatable-field/abstract-translatable-field.component'; import { WiseAuthoringTinymceEditorComponent } from '../../../directives/wise-tinymce-editor/wise-authoring-tinymce-editor.component'; import { MatTabGroup, MatTabsModule } from '@angular/material/tabs'; import { insertWiseLinks, replaceWiseLinks } from '../../../common/wise-link/wise-link'; import { ConfigService } from '../../../services/configService'; -import { TeacherProjectTranslationService } from '../../../services/teacherProjectTranslationService'; -import { TeacherProjectService } from '../../../services/teacherProjectService'; import { MatButtonModule } from '@angular/material/button'; @Component({ @@ -18,13 +16,7 @@ export class TranslatableRichTextEditorComponent extends AbstractTranslatableFie protected html: string = ''; @ViewChild(MatTabGroup) private tabs: MatTabGroup; - constructor( - private configService: ConfigService, - protected projectService: TeacherProjectService, - protected projectTranslationService: TeacherProjectTranslationService - ) { - super(projectService, projectTranslationService); - } + private configService = inject(ConfigService); ngOnChanges(): void { super.ngOnChanges(); diff --git a/src/messages.xlf b/src/messages.xlf index 32554c93207..c04ea757830 100644 --- a/src/messages.xlf +++ b/src/messages.xlf @@ -10799,7 +10799,7 @@ Click "Cancel" to keep the invalid JSON open so you can fix it.Choose image src/assets/wise5/authoringTool/components/translatable-asset-chooser/translatable-asset-chooser.component.ts - 19 + 17 @@ -10827,7 +10827,7 @@ Click "Cancel" to keep the invalid JSON open so you can fix it.Are you sure you want to replace the content in with content in for this item? src/assets/wise5/authoringTool/components/translatable-rich-text-editor/translatable-rich-text-editor.component.ts - 50,52 + 42,44 From d6c149babc22ba2b5b99669ab7ce315975f1684c Mon Sep 17 00:00:00 2001 From: Hiroki Terashima Date: Thu, 11 Dec 2025 08:53:56 -0800 Subject: [PATCH 17/28] Use inject() for EditProfileComponent and its child classes --- .../edit-profile/edit-profile.component.ts | 8 ++--- .../edit-profile/edit-profile.component.ts | 34 +++++++------------ .../edit-profile/edit-profile.component.ts | 18 +++------- src/messages.xlf | 4 +-- 4 files changed, 23 insertions(+), 41 deletions(-) diff --git a/src/app/common/edit-profile/edit-profile.component.ts b/src/app/common/edit-profile/edit-profile.component.ts index 066745a106f..3fbdbe37e50 100644 --- a/src/app/common/edit-profile/edit-profile.component.ts +++ b/src/app/common/edit-profile/edit-profile.component.ts @@ -1,14 +1,12 @@ +import { inject } from '@angular/core'; import { MatDialog } from '@angular/material/dialog'; import { MatSnackBar } from '@angular/material/snack-bar'; import { UnlinkGoogleAccountConfirmComponent } from '../../modules/shared/unlink-google-account-confirm/unlink-google-account-confirm.component'; export abstract class EditProfileComponent { changed: boolean = false; - - constructor( - public dialog: MatDialog, - public snackBar: MatSnackBar - ) {} + dialog = inject(MatDialog); + snackBar = inject(MatSnackBar); handleUpdateProfileResponse(response) { if (response.status === 'success') { diff --git a/src/app/student/account/edit-profile/edit-profile.component.ts b/src/app/student/account/edit-profile/edit-profile.component.ts index c04cec08089..37dc09ea869 100644 --- a/src/app/student/account/edit-profile/edit-profile.component.ts +++ b/src/app/student/account/edit-profile/edit-profile.component.ts @@ -1,4 +1,4 @@ -import { Component } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { FormGroup, FormControl, @@ -8,12 +8,10 @@ import { ReactiveFormsModule } from '@angular/forms'; import { finalize } from 'rxjs/operators'; -import { MatSnackBar } from '@angular/material/snack-bar'; import { Student } from '../../../domain/student'; import { UserService } from '../../../services/user.service'; import { StudentService } from '../../student.service'; import { Subscription } from 'rxjs'; -import { MatDialog } from '@angular/material/dialog'; import { EditProfileComponent } from '../../../common/edit-profile/edit-profile.component'; import { MatFormField, MatLabel, MatError } from '@angular/material/form-field'; import { MatInput } from '@angular/material/input'; @@ -43,6 +41,10 @@ import { MatProgressBar } from '@angular/material/progress-bar'; templateUrl: './edit-profile.component.html' }) export class StudentEditProfileComponent extends EditProfileComponent { + private fb = inject(FormBuilder); + private studentService = inject(StudentService); + private userService = inject(UserService); + user: Student; languages: object[]; isSaving: boolean = false; @@ -55,24 +57,6 @@ export class StudentEditProfileComponent extends EditProfileComponent { language: new FormControl('', [Validators.required]) }); - constructor( - private fb: FormBuilder, - private studentService: StudentService, - private userService: UserService, - public dialog: MatDialog, - public snackBar: MatSnackBar - ) { - super(dialog, snackBar); - this.user = this.getUser().getValue(); - this.setControlFieldValue('firstName', this.user.firstName); - this.setControlFieldValue('lastName', this.user.lastName); - this.setControlFieldValue('username', this.user.username); - this.setControlFieldValue('language', this.user.language); - this.userService.getLanguages().subscribe((response) => { - this.languages = response; - }); - } - getUser() { return this.userService.getUser(); } @@ -82,6 +66,14 @@ export class StudentEditProfileComponent extends EditProfileComponent { } ngOnInit() { + this.user = this.getUser().getValue(); + this.setControlFieldValue('firstName', this.user.firstName); + this.setControlFieldValue('lastName', this.user.lastName); + this.setControlFieldValue('username', this.user.username); + this.setControlFieldValue('language', this.user.language); + this.userService.getLanguages().subscribe((response) => { + this.languages = response; + }); this.editProfileFormGroup.valueChanges.subscribe(() => { this.changed = true; }); diff --git a/src/app/teacher/account/edit-profile/edit-profile.component.ts b/src/app/teacher/account/edit-profile/edit-profile.component.ts index 15884763072..4dbac4422c2 100644 --- a/src/app/teacher/account/edit-profile/edit-profile.component.ts +++ b/src/app/teacher/account/edit-profile/edit-profile.component.ts @@ -1,4 +1,4 @@ -import { Component } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { FormControl, FormGroup, @@ -8,11 +8,9 @@ import { ReactiveFormsModule } from '@angular/forms'; import { finalize } from 'rxjs/operators'; -import { MatSnackBar } from '@angular/material/snack-bar'; import { UserService } from '../../../services/user.service'; import { Teacher } from '../../../domain/teacher'; import { TeacherService } from '../../teacher.service'; -import { MatDialog } from '@angular/material/dialog'; import { Subscription } from 'rxjs'; import { SchoolLevel, schoolLevels } from '../../../domain/profile.constants'; import { EditProfileComponent } from '../../../common/edit-profile/edit-profile.component'; @@ -45,6 +43,10 @@ import { MatProgressBar } from '@angular/material/progress-bar'; templateUrl: './edit-profile.component.html' }) export class TeacherEditProfileComponent extends EditProfileComponent { + private fb = inject(FormBuilder); + private teacherService = inject(TeacherService); + private userService = inject(UserService); + user: Teacher; schoolLevels: SchoolLevel[] = schoolLevels; languages: object[]; @@ -65,16 +67,6 @@ export class TeacherEditProfileComponent extends EditProfileComponent { language: new FormControl('', [Validators.required]) }); - constructor( - private fb: FormBuilder, - private teacherService: TeacherService, - private userService: UserService, - public dialog: MatDialog, - public snackBar: MatSnackBar - ) { - super(dialog, snackBar); - } - getUser() { this.subscriptions.add( this.userService.getUser().subscribe((user) => { diff --git a/src/messages.xlf b/src/messages.xlf index b2a81b9d7f1..76097fa6878 100644 --- a/src/messages.xlf +++ b/src/messages.xlf @@ -1885,14 +1885,14 @@ Click "Cancel" to keep the invalid JSON open so you can fix it.Profile updated. src/app/common/edit-profile/edit-profile.component.ts - 16 + 14 An error occurred. Please try again. src/app/common/edit-profile/edit-profile.component.ts - 18 + 16 src/app/forgot/student/forgot-student-password-change/forgot-student-password-change.component.ts From db9d67fa1ffbf9674ea7da72ebc33974854e746e Mon Sep 17 00:00:00 2001 From: Hiroki Terashima Date: Thu, 11 Dec 2025 16:27:54 -0800 Subject: [PATCH 18/28] Use inject() for NodeService and its child classes --- .../student-teacher-common-services.module.ts | 2 ++ .../classroom-monitor-testing.module.ts | 4 +++ .../classroom-monitor.component.spec.ts | 5 +--- .../classroom-monitor.component.ts | 4 +-- src/assets/wise5/services/nodeService.ts | 20 ++++++------- .../wise5/services/studentNodeService.ts | 28 ++++++------------- .../wise5/services/teacherNodeService.ts | 18 ++++-------- src/messages.xlf | 6 ++-- 8 files changed, 35 insertions(+), 52 deletions(-) diff --git a/src/app/student-teacher-common-services.module.ts b/src/app/student-teacher-common-services.module.ts index 54f5d1bacd6..66dbe982d81 100644 --- a/src/app/student-teacher-common-services.module.ts +++ b/src/app/student-teacher-common-services.module.ts @@ -59,6 +59,7 @@ import { TeacherNodeService } from '../assets/wise5/services/teacherNodeService' import { TeacherWebSocketService } from '../assets/wise5/services/teacherWebSocketService'; import { VLEProjectService } from '../assets/wise5/vle/vleProjectService'; import { WiseLinkService } from './services/wiseLinkService'; +import { DataService } from './services/data.service'; @NgModule({ providers: [ @@ -80,6 +81,7 @@ import { WiseLinkService } from './services/wiseLinkService'; ComputerAvatarService, ConfigService, CRaterService, + { provide: DataService, useExisting: StudentDataService }, DialogGuidanceService, DiscussionService, DrawService, diff --git a/src/assets/wise5/classroomMonitor/classroom-monitor-testing.module.ts b/src/assets/wise5/classroomMonitor/classroom-monitor-testing.module.ts index 4c36554035b..aa42809d7f4 100644 --- a/src/assets/wise5/classroomMonitor/classroom-monitor-testing.module.ts +++ b/src/assets/wise5/classroomMonitor/classroom-monitor-testing.module.ts @@ -28,6 +28,8 @@ import { StudentNodeService } from '../services/studentNodeService'; import { ConstraintService } from '../services/constraintService'; import { StudentDataService } from '../services/studentDataService'; import { NodeStatusService } from '../services/nodeStatusService'; +import { TeacherNodeService } from '../services/teacherNodeService'; +import { DataService } from '../../../app/services/data.service'; @NgModule({ providers: [ @@ -38,6 +40,7 @@ import { NodeStatusService } from '../services/nodeStatusService'; ConfigService, MockProvider(ConstraintService), ClassroomStatusService, + { provide: DataService, useClass: TeacherDataService }, GradingNodeService, MilestoneService, MilestoneReportService, @@ -52,6 +55,7 @@ import { NodeStatusService } from '../services/nodeStatusService'; StudentDataService, StudentNodeService, TeacherDataService, + TeacherNodeService, TeacherPauseScreenService, TeacherPeerGroupService, TeacherProjectService, diff --git a/src/assets/wise5/classroomMonitor/classroom-monitor.component.spec.ts b/src/assets/wise5/classroomMonitor/classroom-monitor.component.spec.ts index 223113bd3de..d1c1fe7fac2 100644 --- a/src/assets/wise5/classroomMonitor/classroom-monitor.component.spec.ts +++ b/src/assets/wise5/classroomMonitor/classroom-monitor.component.spec.ts @@ -9,8 +9,6 @@ import { MainMenuComponent } from '../common/main-menu/main-menu.component'; import { WorkgroupService } from '../../../app/services/workgroup.service'; import { ConfigService } from '../services/configService'; import { TeacherDataService } from '../services/teacherDataService'; -import { NodeService } from '../services/nodeService'; -import { TeacherNodeService } from '../services/teacherNodeService'; let component: ClassroomMonitorComponent; let fixture: ComponentFixture; @@ -25,8 +23,7 @@ describe('ClassroomMonitorComponent', () => { ], providers: [ provideRouter([]), - WorkgroupService, - { provide: NodeService, useClass: TeacherNodeService } + WorkgroupService ] }).compileComponents(); const notebookService = TestBed.inject(NotebookService); diff --git a/src/assets/wise5/classroomMonitor/classroom-monitor.component.ts b/src/assets/wise5/classroomMonitor/classroom-monitor.component.ts index c6ce04d3e68..b768b046c45 100644 --- a/src/assets/wise5/classroomMonitor/classroom-monitor.component.ts +++ b/src/assets/wise5/classroomMonitor/classroom-monitor.component.ts @@ -5,7 +5,6 @@ import { Router, NavigationEnd, RouterModule } from '@angular/router'; import { Notification } from '../../../app/domain/notification'; import { DialogWithConfirmComponent } from '../directives/dialog-with-confirm/dialog-with-confirm.component'; import { ConfigService } from '../services/configService'; -import { NodeService } from '../services/nodeService'; import { NotebookService } from '../services/notebookService'; import { NotificationService } from '../services/notificationService'; import { SessionService } from '../services/sessionService'; @@ -20,6 +19,7 @@ import { NotebookReportComponent } from '../../../app/notebook/notebook-report/n import { SideMenuComponent } from '../common/side-menu/side-menu.component'; import { MatSidenavModule } from '@angular/material/sidenav'; import { MainMenuComponent } from '../common/main-menu/main-menu.component'; +import { TeacherNodeService } from '../services/teacherNodeService'; @Component({ selector: 'classroom-monitor', @@ -56,7 +56,7 @@ export class ClassroomMonitorComponent implements OnInit { private configService: ConfigService, private dataService: TeacherDataService, private dialog: MatDialog, - private nodeService: NodeService, + private nodeService: TeacherNodeService, private notebookService: NotebookService, private notificationService: NotificationService, private pauseScreenService: TeacherPauseScreenService, diff --git a/src/assets/wise5/services/nodeService.ts b/src/assets/wise5/services/nodeService.ts index 80fc2698b07..3273851b203 100644 --- a/src/assets/wise5/services/nodeService.ts +++ b/src/assets/wise5/services/nodeService.ts @@ -1,24 +1,22 @@ -import { Injectable } from '@angular/core'; -import { ConfigService } from './configService'; -import { ProjectService } from './projectService'; -import { DataService } from '../../../app/services/data.service'; +import { inject, Injectable } from '@angular/core'; import { Observable, Subject } from 'rxjs'; +import { DataService } from '../../../app/services/data.service'; +import { ConfigService } from './configService'; import { ConstraintService } from './constraintService'; +import { ProjectService } from './projectService'; @Injectable() export abstract class NodeService { + protected configService = inject(ConfigService); + protected constraintService = inject(ConstraintService); + protected dataService = inject(DataService); + protected projectService = inject(ProjectService); + private doneRenderingComponentSource: Subject = new Subject(); public doneRenderingComponent$ = this.doneRenderingComponentSource.asObservable(); private nodeSubmitClickedSource: Subject = new Subject(); public nodeSubmitClicked$: Observable = this.nodeSubmitClickedSource.asObservable(); - constructor( - protected configService: ConfigService, - protected constraintService: ConstraintService, - protected dataService: DataService, - protected projectService: ProjectService - ) {} - setCurrentNode(nodeId: string): void { this.dataService.setCurrentNodeByNodeId(nodeId); } diff --git a/src/assets/wise5/services/studentNodeService.ts b/src/assets/wise5/services/studentNodeService.ts index 86144c2eadd..402f1806a62 100644 --- a/src/assets/wise5/services/studentNodeService.ts +++ b/src/assets/wise5/services/studentNodeService.ts @@ -1,32 +1,22 @@ -import { Injectable } from '@angular/core'; -import { NodeService } from './nodeService'; +import { inject, Injectable } from '@angular/core'; import { MatDialog } from '@angular/material/dialog'; -import { ConfigService } from './configService'; -import { ConstraintService } from './constraintService'; -import { ProjectService } from './projectService'; -import { NodeStatusService } from './nodeStatusService'; -import { DialogWithCloseComponent } from '../directives/dialog-with-close/dialog-with-close.component'; +import { ChooseBranchPathDialogComponent } from '../../../app/preview/modules/choose-branch-path-dialog/choose-branch-path-dialog.component'; import { Constraint } from '../../../app/domain/constraint'; import { TransitionLogic } from '../common/TransitionLogic'; +import { DialogWithCloseComponent } from '../directives/dialog-with-close/dialog-with-close.component'; +import { NodeService } from './nodeService'; +import { NodeStatusService } from './nodeStatusService'; import { StudentDataService } from './studentDataService'; -import { ChooseBranchPathDialogComponent } from '../../../app/preview/modules/choose-branch-path-dialog/choose-branch-path-dialog.component'; @Injectable() export class StudentNodeService extends NodeService { + protected override dataService = inject(StudentDataService); + private dialog = inject(MatDialog); + private nodeStatusService = inject(NodeStatusService); + private chooseTransitionPromises = {}; private transitionResults = {}; - constructor( - protected configService: ConfigService, - protected constraintService: ConstraintService, - protected dataService: StudentDataService, - private dialog: MatDialog, - private nodeStatusService: NodeStatusService, - protected projectService: ProjectService - ) { - super(configService, constraintService, dataService, projectService); - } - setCurrentNode(nodeId: string): void { if (this.nodeStatusService.getNodeStatusByNodeId(nodeId).isVisitable) { this.dataService.setCurrentNodeByNodeId(nodeId); diff --git a/src/assets/wise5/services/teacherNodeService.ts b/src/assets/wise5/services/teacherNodeService.ts index 9835c431921..92c8d5e2b5d 100644 --- a/src/assets/wise5/services/teacherNodeService.ts +++ b/src/assets/wise5/services/teacherNodeService.ts @@ -1,13 +1,14 @@ -import { Injectable } from '@angular/core'; +import { inject, Injectable } from '@angular/core'; +import { Observable, Subject } from 'rxjs'; import { NodeService } from './nodeService'; -import { Subject, Observable } from 'rxjs'; import { TeacherDataService } from './teacherDataService'; import { TeacherProjectService } from './teacherProjectService'; -import { ConfigService } from './configService'; -import { ConstraintService } from './constraintService'; @Injectable() export class TeacherNodeService extends NodeService { + protected override dataService = inject(TeacherDataService); + protected override projectService = inject(TeacherProjectService); + private componentShowSubmitButtonValueChangedSource: Subject = new Subject(); public componentShowSubmitButtonValueChanged$: Observable = this.componentShowSubmitButtonValueChangedSource.asObservable(); @@ -16,15 +17,6 @@ export class TeacherNodeService extends NodeService { private starterStateResponseSource: Subject = new Subject(); public starterStateResponse$: Observable = this.starterStateResponseSource.asObservable(); - constructor( - protected configService: ConfigService, - protected constraintService: ConstraintService, - protected dataService: TeacherDataService, - protected projectService: TeacherProjectService - ) { - super(configService, constraintService, dataService, projectService); - } - broadcastComponentShowSubmitButtonValueChanged(args: any): void { this.componentShowSubmitButtonValueChangedSource.next(args); } diff --git a/src/messages.xlf b/src/messages.xlf index 76097fa6878..ba6aa3734e4 100644 --- a/src/messages.xlf +++ b/src/messages.xlf @@ -22145,21 +22145,21 @@ If this problem continues, let your teacher know and move on to the next activit Sorry, you cannot view this item yet. src/assets/wise5/services/studentNodeService.ts - 44 + 34 Item Locked src/assets/wise5/services/studentNodeService.ts - 48 + 38 <p>To visit <b></b> you need to:</p><ul> src/assets/wise5/services/studentNodeService.ts - 55 + 45 From e6eb461d231d88d04245851aa3cd9b9688164c5b Mon Sep 17 00:00:00 2001 From: Hiroki Terashima Date: Thu, 11 Dec 2025 17:29:42 -0800 Subject: [PATCH 19/28] Use inject() for ProjectTranslationService and its child classes --- .../copy-component-button.component.spec.ts | 3 ++- .../editProjectTranslationsService.ts | 18 +++++----------- .../services/projectTranslationService.ts | 12 +++++------ .../studentProjectTranslationService.ts | 20 +++++------------- .../teacherProjectTranslationService.ts | 21 ++++++++----------- src/messages.xlf | 2 +- 6 files changed, 27 insertions(+), 49 deletions(-) diff --git a/src/assets/wise5/authoringTool/node/copy-component-button/copy-component-button.component.spec.ts b/src/assets/wise5/authoringTool/node/copy-component-button/copy-component-button.component.spec.ts index d9bc212fd5d..3acedaa4ee4 100644 --- a/src/assets/wise5/authoringTool/node/copy-component-button/copy-component-button.component.spec.ts +++ b/src/assets/wise5/authoringTool/node/copy-component-button/copy-component-button.component.spec.ts @@ -4,6 +4,7 @@ import { TeacherProjectService } from '../../../services/teacherProjectService'; import { CopyTranslationsService } from '../../../services/copyTranslationsService'; import { ConfigService } from '../../../services/configService'; import { provideHttpClient, withInterceptorsFromDi } from '@angular/common/http'; +import { MockProvider } from 'ng-mocks'; class MockTeacherProjectService {} describe('CopyComponentButtonComponent', () => { @@ -15,7 +16,7 @@ describe('CopyComponentButtonComponent', () => { imports: [CopyComponentButtonComponent], providers: [ ConfigService, - CopyTranslationsService, + MockProvider(CopyTranslationsService), provideHttpClient(withInterceptorsFromDi()), { provide: TeacherProjectService, useClass: MockTeacherProjectService } ] diff --git a/src/assets/wise5/services/editProjectTranslationsService.ts b/src/assets/wise5/services/editProjectTranslationsService.ts index 3cd4d72b1c3..c2063dbd172 100644 --- a/src/assets/wise5/services/editProjectTranslationsService.ts +++ b/src/assets/wise5/services/editProjectTranslationsService.ts @@ -1,21 +1,13 @@ -import { HttpClient } from '@angular/common/http'; -import { ConfigService } from './configService'; -import { ProjectTranslationService } from './projectTranslationService'; -import { TeacherProjectService } from './teacherProjectService'; +import { inject, Injectable } from '@angular/core'; import { lastValueFrom, Observable } from 'rxjs'; -import { Translations } from '../../../app/domain/translations'; import { Language } from '../../../app/domain/language'; -import { Injectable } from '@angular/core'; +import { Translations } from '../../../app/domain/translations'; +import { ProjectTranslationService } from './projectTranslationService'; +import { TeacherProjectService } from './teacherProjectService'; @Injectable() export class EditTranslationsService extends ProjectTranslationService { - constructor( - protected configService: ConfigService, - protected http: HttpClient, - protected projectService: TeacherProjectService - ) { - super(configService, http, projectService); - } + protected override projectService = inject(TeacherProjectService); protected async fetchAllTranslations(): Promise> { const allTranslations = new Map(); diff --git a/src/assets/wise5/services/projectTranslationService.ts b/src/assets/wise5/services/projectTranslationService.ts index e65f8807ebf..3fa58415780 100644 --- a/src/assets/wise5/services/projectTranslationService.ts +++ b/src/assets/wise5/services/projectTranslationService.ts @@ -1,17 +1,15 @@ import { HttpClient, HttpHeaders } from '@angular/common/http'; -import { Injectable } from '@angular/core'; +import { inject, Injectable } from '@angular/core'; import { catchError, Observable, of } from 'rxjs'; +import { Translations } from '../../../app/domain/translations'; import { ConfigService } from './configService'; import { ProjectService } from './projectService'; -import { Translations } from '../../../app/domain/translations'; @Injectable() export class ProjectTranslationService { - constructor( - protected configService: ConfigService, - protected http: HttpClient, - protected projectService: ProjectService - ) {} + protected configService = inject(ConfigService); + protected http = inject(HttpClient); + protected projectService = inject(ProjectService); protected fetchTranslations(locale: string): Observable { return this.http diff --git a/src/assets/wise5/services/studentProjectTranslationService.ts b/src/assets/wise5/services/studentProjectTranslationService.ts index 13e38ade854..6a8d5b0a73f 100644 --- a/src/assets/wise5/services/studentProjectTranslationService.ts +++ b/src/assets/wise5/services/studentProjectTranslationService.ts @@ -1,25 +1,15 @@ -import { Injectable } from '@angular/core'; +import { inject, Injectable } from '@angular/core'; +import { toObservable, toSignal } from '@angular/core/rxjs-interop'; import { lastValueFrom, of, switchMap, tap } from 'rxjs'; -import { copy } from '../common/object/object'; +import { Language } from '../../../app/domain/language'; import { Translations } from '../../../app/domain/translations'; +import { copy } from '../common/object/object'; import { ProjectTranslationService } from './projectTranslationService'; -import { toSignal, toObservable } from '@angular/core/rxjs-interop'; -import { Language } from '../../../app/domain/language'; -import { HttpClient } from '@angular/common/http'; -import { ConfigService } from './configService'; -import { ProjectService } from './projectService'; import { StudentDataService } from './studentDataService'; @Injectable() export class StudentProjectTranslationService extends ProjectTranslationService { - constructor( - protected configService: ConfigService, - private dataService: StudentDataService, - protected http: HttpClient, - protected projectService: ProjectService - ) { - super(configService, http, projectService); - } + private dataService = inject(StudentDataService); currentTranslations = toSignal( toObservable(this.projectService.currentLanguage).pipe( diff --git a/src/assets/wise5/services/teacherProjectTranslationService.ts b/src/assets/wise5/services/teacherProjectTranslationService.ts index 627dfd30a2e..571776fafe9 100644 --- a/src/assets/wise5/services/teacherProjectTranslationService.ts +++ b/src/assets/wise5/services/teacherProjectTranslationService.ts @@ -1,22 +1,19 @@ -import { Injectable, WritableSignal, signal } from '@angular/core'; -import { Observable, catchError, lastValueFrom, map, throwError } from 'rxjs'; -import { TeacherProjectService } from './teacherProjectService'; +import { inject, Injectable, signal, WritableSignal } from '@angular/core'; +import { toObservable } from '@angular/core/rxjs-interop'; +import { catchError, lastValueFrom, map, Observable, throwError } from 'rxjs'; import { Translations } from '../../../app/domain/translations'; import { ProjectTranslationService } from './projectTranslationService'; -import { HttpClient } from '@angular/common/http'; -import { ConfigService } from './configService'; -import { toObservable } from '@angular/core/rxjs-interop'; +import { TeacherProjectService } from './teacherProjectService'; @Injectable() export class TeacherProjectTranslationService extends ProjectTranslationService { + protected override projectService = inject(TeacherProjectService); + private currentTranslationsSignal: WritableSignal = signal({}); readonly currentTranslations = this.currentTranslationsSignal.asReadonly(); - constructor( - protected configService: ConfigService, - protected http: HttpClient, - protected projectService: TeacherProjectService - ) { - super(configService, http, projectService); + + constructor() { + super(); toObservable(this.projectService.currentLanguage).subscribe(async (language) => { this.currentTranslationsSignal.set( this.projectService.isDefaultLocale() diff --git a/src/messages.xlf b/src/messages.xlf index ba6aa3734e4..8f9ef8b3272 100644 --- a/src/messages.xlf +++ b/src/messages.xlf @@ -22166,7 +22166,7 @@ If this problem continues, let your teacher know and move on to the next activit Error saving translation. Please try again later. src/assets/wise5/services/teacherProjectTranslationService.ts - 46 + 43 From 0464462772e6ce89b98f3018ea6365de407de01c Mon Sep 17 00:00:00 2001 From: Hiroki Terashima Date: Thu, 11 Dec 2025 18:04:04 -0800 Subject: [PATCH 20/28] Use inject() for AuthorPeerGroupingDialogComponent and its child classes --- .../author-peer-grouping-dialog.component.ts | 18 ++++------ ...eate-new-peer-grouping-dialog.component.ts | 26 +++++--------- .../edit-peer-grouping-dialog.component.ts | 34 +++++++------------ src/messages.xlf | 6 ++-- 4 files changed, 32 insertions(+), 52 deletions(-) diff --git a/src/assets/wise5/authoringTool/peer-grouping/author-peer-grouping-dialog/author-peer-grouping-dialog.component.ts b/src/assets/wise5/authoringTool/peer-grouping/author-peer-grouping-dialog/author-peer-grouping-dialog.component.ts index 6912ee730b0..b6d95d37aa8 100644 --- a/src/assets/wise5/authoringTool/peer-grouping/author-peer-grouping-dialog/author-peer-grouping-dialog.component.ts +++ b/src/assets/wise5/authoringTool/peer-grouping/author-peer-grouping-dialog/author-peer-grouping-dialog.component.ts @@ -1,15 +1,19 @@ -import { Directive, OnInit } from '@angular/core'; +import { Directive, inject, OnInit } from '@angular/core'; import { MatDialogRef } from '@angular/material/dialog'; +import { MatSnackBar } from '@angular/material/snack-bar'; import { PeerGrouping } from '../../../../../app/domain/peerGrouping'; import { ReferenceComponent } from '../../../../../app/domain/referenceComponent'; import { ProjectService } from '../../../services/projectService'; import { AVAILABLE_LOGIC, AVAILABLE_MODES, PeerGroupingLogic } from '../PeerGroupingLogic'; -import { MatSnackBar } from '@angular/material/snack-bar'; @Directive() export abstract class AuthorPeerGroupingDialogComponent implements OnInit { + protected dialogRef = inject(MatDialogRef); + protected projectService = inject(ProjectService); + protected snackBar = inject(MatSnackBar); + allowedReferenceComponentTypes: string[] = ['OpenResponse']; - availableLogic: PeerGroupingLogic[]; + availableLogic: PeerGroupingLogic[] = AVAILABLE_LOGIC; logicType: string; logicTypesWithModes: string[] = ['differentIdeas', 'differentKIScores']; mode: string; @@ -17,14 +21,6 @@ export abstract class AuthorPeerGroupingDialogComponent implements OnInit { peerGrouping: PeerGrouping; referenceComponent: ReferenceComponent = new ReferenceComponent(null, null); - constructor( - protected dialogRef: MatDialogRef, - protected projectService: ProjectService, - protected snackBar: MatSnackBar - ) { - this.availableLogic = AVAILABLE_LOGIC; - } - ngOnInit(): void {} protected updatePeerGroupingLogic(): void { diff --git a/src/assets/wise5/authoringTool/peer-grouping/create-new-peer-grouping-dialog/create-new-peer-grouping-dialog.component.ts b/src/assets/wise5/authoringTool/peer-grouping/create-new-peer-grouping-dialog/create-new-peer-grouping-dialog.component.ts index 4b306cf9c1e..60622fe1409 100644 --- a/src/assets/wise5/authoringTool/peer-grouping/create-new-peer-grouping-dialog/create-new-peer-grouping-dialog.component.ts +++ b/src/assets/wise5/authoringTool/peer-grouping/create-new-peer-grouping-dialog/create-new-peer-grouping-dialog.component.ts @@ -1,17 +1,15 @@ -import { Component } from '@angular/core'; +import { Component, inject } from '@angular/core'; +import { FormsModule } from '@angular/forms'; +import { MatButtonModule } from '@angular/material/button'; import { MatDialogModule, MatDialogRef } from '@angular/material/dialog'; +import { MatFormFieldModule } from '@angular/material/form-field'; +import { MatInputModule } from '@angular/material/input'; +import { MatSelectModule } from '@angular/material/select'; import { Subscription } from 'rxjs'; +import { SelectStepAndComponentComponent } from '../../../../../app/authoring-tool/select-step-and-component/select-step-and-component.component'; import { PeerGrouping } from '../../../../../app/domain/peerGrouping'; import { PeerGroupingAuthoringService } from '../../../services/peerGroupingAuthoringService'; import { AuthorPeerGroupingDialogComponent } from '../author-peer-grouping-dialog/author-peer-grouping-dialog.component'; -import { MatSnackBar } from '@angular/material/snack-bar'; -import { ProjectService } from '../../../services/projectService'; -import { SelectStepAndComponentComponent } from '../../../../../app/authoring-tool/select-step-and-component/select-step-and-component.component'; -import { MatFormFieldModule } from '@angular/material/form-field'; -import { FormsModule } from '@angular/forms'; -import { MatSelectModule } from '@angular/material/select'; -import { MatButtonModule } from '@angular/material/button'; -import { MatInputModule } from '@angular/material/input'; @Component({ imports: [ @@ -27,14 +25,8 @@ import { MatInputModule } from '@angular/material/input'; templateUrl: './create-new-peer-grouping-dialog.component.html' }) export class CreateNewPeerGroupingDialogComponent extends AuthorPeerGroupingDialogComponent { - constructor( - protected dialogRef: MatDialogRef, - private peerGroupingAuthoringService: PeerGroupingAuthoringService, - protected projectService: ProjectService, - protected snackBar: MatSnackBar - ) { - super(dialogRef, projectService, snackBar); - } + protected override dialogRef = inject(MatDialogRef); + private peerGroupingAuthoringService = inject(PeerGroupingAuthoringService); ngOnInit(): void { this.peerGrouping = new PeerGrouping({ logic: 'random', maxMembershipCount: 2 }); diff --git a/src/assets/wise5/authoringTool/peer-grouping/edit-peer-grouping-dialog/edit-peer-grouping-dialog.component.ts b/src/assets/wise5/authoringTool/peer-grouping/edit-peer-grouping-dialog/edit-peer-grouping-dialog.component.ts index 31c3f680045..3858fe7c5dd 100644 --- a/src/assets/wise5/authoringTool/peer-grouping/edit-peer-grouping-dialog/edit-peer-grouping-dialog.component.ts +++ b/src/assets/wise5/authoringTool/peer-grouping/edit-peer-grouping-dialog/edit-peer-grouping-dialog.component.ts @@ -1,8 +1,14 @@ -import { Component, Inject } from '@angular/core'; -import { MatDialogRef, MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog'; +import { Component, inject, Inject } from '@angular/core'; +import { FormsModule } from '@angular/forms'; +import { MatButtonModule } from '@angular/material/button'; +import { MAT_DIALOG_DATA, MatDialogModule, MatDialogRef } from '@angular/material/dialog'; +import { MatFormFieldModule } from '@angular/material/form-field'; +import { MatInputModule } from '@angular/material/input'; +import { MatSelectModule } from '@angular/material/select'; +import { MatTooltipModule } from '@angular/material/tooltip'; +import { SelectStepAndComponentComponent } from '../../../../../app/authoring-tool/select-step-and-component/select-step-and-component.component'; import { PeerGrouping } from '../../../../../app/domain/peerGrouping'; import { PeerGroupingAuthoringService } from '../../../services/peerGroupingAuthoringService'; -import { ProjectService } from '../../../services/projectService'; import { AuthorPeerGroupingDialogComponent } from '../author-peer-grouping-dialog/author-peer-grouping-dialog.component'; import { DIFFERENT_IDEAS_REGEX, @@ -10,14 +16,6 @@ import { DIFFERENT_SCORES_REGEX, DIFFERENT_SCORES_VALUE } from '../PeerGroupingLogic'; -import { MatSnackBar } from '@angular/material/snack-bar'; -import { MatButtonModule } from '@angular/material/button'; -import { MatFormFieldModule } from '@angular/material/form-field'; -import { SelectStepAndComponentComponent } from '../../../../../app/authoring-tool/select-step-and-component/select-step-and-component.component'; -import { FormsModule } from '@angular/forms'; -import { MatSelectModule } from '@angular/material/select'; -import { MatTooltipModule } from '@angular/material/tooltip'; -import { MatInputModule } from '@angular/material/input'; @Component({ imports: [ @@ -33,17 +31,11 @@ import { MatInputModule } from '@angular/material/input'; templateUrl: './edit-peer-grouping-dialog.component.html' }) export class EditPeerGroupingDialogComponent extends AuthorPeerGroupingDialogComponent { - stepsUsedIn: string[] = []; + @Inject(MAT_DIALOG_DATA) public peerGrouping = inject(MAT_DIALOG_DATA) as PeerGrouping; + protected override dialogRef = inject(MatDialogRef); + private peerGroupingAuthoringService = inject(PeerGroupingAuthoringService); - constructor( - @Inject(MAT_DIALOG_DATA) public peerGrouping: PeerGrouping, - protected dialogRef: MatDialogRef, - private peerGroupingAuthoringService: PeerGroupingAuthoringService, - protected projectService: ProjectService, - protected snackBar: MatSnackBar - ) { - super(dialogRef, projectService, snackBar); - } + stepsUsedIn: string[] = []; ngOnInit(): void { this.peerGrouping = new PeerGrouping(this.peerGrouping); diff --git a/src/messages.xlf b/src/messages.xlf index 8f9ef8b3272..1a32adb2d12 100644 --- a/src/messages.xlf +++ b/src/messages.xlf @@ -1904,7 +1904,7 @@ Click "Cancel" to keep the invalid JSON open so you can fix it. src/assets/wise5/authoringTool/peer-grouping/author-peer-grouping-dialog/author-peer-grouping-dialog.component.ts - 61 + 57 @@ -12654,7 +12654,7 @@ The branches will be removed but the steps will remain in the unit. You are not allowed to perform this action. src/assets/wise5/authoringTool/peer-grouping/author-peer-grouping-dialog/author-peer-grouping-dialog.component.ts - 64 + 60 @@ -12759,7 +12759,7 @@ The branches will be removed but the steps will remain in the unit. Are you sure you want to delete this Peer Grouping? src/assets/wise5/authoringTool/peer-grouping/edit-peer-grouping-dialog/edit-peer-grouping-dialog.component.ts - 84 + 76 From 1a7ddb60fffb0041c17d9ce46bbd14f4f8f920c8 Mon Sep 17 00:00:00 2001 From: Hiroki Terashima Date: Thu, 11 Dec 2025 18:34:17 -0800 Subject: [PATCH 21/28] Use inject() for ProjectService and its child classes. Need to update tests --- ...uidanceComponentDataExportStrategy.spec.ts | 21 ++++++++-- ...cussionComponentDataExportStrategy.spec.ts | 21 ++++++++-- .../strategies/ExportStrategyTester.ts | 2 +- .../LabelComponentDataExportStrategy.spec.ts | 21 ++++++++-- .../MatchComponentDataExportStrategy.spec.ts | 21 ++++++++-- ...penResponseComponentExportStrategy.spec.ts | 21 ++++++++-- ...eerChatComponentDataExportStrategy.spec.ts | 21 ++++++++-- src/assets/wise5/services/projectService.ts | 39 ++++++++----------- .../wise5/services/teacherProjectService.ts | 24 ++---------- src/assets/wise5/vle/vleProjectService.ts | 1 - 10 files changed, 130 insertions(+), 62 deletions(-) diff --git a/src/assets/wise5/classroomMonitor/dataExport/strategies/DialogGuidanceComponentDataExportStrategy.spec.ts b/src/assets/wise5/classroomMonitor/dataExport/strategies/DialogGuidanceComponentDataExportStrategy.spec.ts index af0d30d314d..772aca25d3d 100644 --- a/src/assets/wise5/classroomMonitor/dataExport/strategies/DialogGuidanceComponentDataExportStrategy.spec.ts +++ b/src/assets/wise5/classroomMonitor/dataExport/strategies/DialogGuidanceComponentDataExportStrategy.spec.ts @@ -1,6 +1,13 @@ +import { TestBed } from '@angular/core/testing'; import { ComponentState } from '../../../../../app/domain/componentState'; import { DialogGuidanceComponentDataExportStrategy } from './DialogGuidanceComponentDataExportStrategy'; import { ExportStrategyTester } from './ExportStrategyTester'; +import { MockProviders } from 'ng-mocks'; +import { provideHttpClient } from '@angular/common/http'; +import { BranchService } from '../../../services/branchService'; +import { ComponentServiceLookupService } from '../../../services/componentServiceLookupService'; +import { ConfigService } from '../../../services/configService'; +import { PathService } from '../../../services/pathService'; let componentState1: any; let componentState2: any; @@ -52,9 +59,17 @@ const text3: string = 'Text 3'; const text4: string = 'Text 4'; describe('DialogGuidanceComponentDataExportStrategy', () => { - beforeEach(() => { - exportStrategyTester = new ExportStrategyTester(); - exportStrategyTester.setUpServices(); + beforeEach(async() => { + await TestBed.configureTestingModule({ + providers: [ + MockProviders(BranchService, ComponentServiceLookupService, ConfigService, PathService), + provideHttpClient() + ], + }) + await TestBed.runInInjectionContext(async () => { + exportStrategyTester = new ExportStrategyTester(); + exportStrategyTester.setUpServices(); + }); initializeStudentWork(); }); exportAllRevisions(); diff --git a/src/assets/wise5/classroomMonitor/dataExport/strategies/DiscussionComponentDataExportStrategy.spec.ts b/src/assets/wise5/classroomMonitor/dataExport/strategies/DiscussionComponentDataExportStrategy.spec.ts index 907925ef0f4..a47020b7f4b 100644 --- a/src/assets/wise5/classroomMonitor/dataExport/strategies/DiscussionComponentDataExportStrategy.spec.ts +++ b/src/assets/wise5/classroomMonitor/dataExport/strategies/DiscussionComponentDataExportStrategy.spec.ts @@ -1,5 +1,12 @@ +import { TestBed } from '@angular/core/testing'; import { DiscussionComponentDataExportStrategy } from './DiscussionComponentDataExportStrategy'; import { ExportStrategyTester } from './ExportStrategyTester'; +import { provideHttpClient } from '@angular/common/http'; +import { MockProviders } from 'ng-mocks'; +import { BranchService } from '../../../services/branchService'; +import { ComponentServiceLookupService } from '../../../services/componentServiceLookupService'; +import { ConfigService } from '../../../services/configService'; +import { PathService } from '../../../services/pathService'; const componentType: string = 'Discussion'; let exportStrategyTester: ExportStrategyTester; @@ -7,9 +14,17 @@ let studentData1: any; let studentData2: any; describe('DiscussionComponentDataExportStrategy', () => { - beforeEach(() => { - exportStrategyTester = new ExportStrategyTester(); - exportStrategyTester.setUpServices(); + beforeEach(async() => { + await TestBed.configureTestingModule({ + providers: [ + MockProviders(BranchService, ComponentServiceLookupService, ConfigService, PathService), + provideHttpClient() + ], + }) + await TestBed.runInInjectionContext(async () => { + exportStrategyTester = new ExportStrategyTester(); + exportStrategyTester.setUpServices(); + }); initializeStudentWork(); }); exportDiscussion(); diff --git a/src/assets/wise5/classroomMonitor/dataExport/strategies/ExportStrategyTester.ts b/src/assets/wise5/classroomMonitor/dataExport/strategies/ExportStrategyTester.ts index 6c9008552f2..7bca7245e45 100644 --- a/src/assets/wise5/classroomMonitor/dataExport/strategies/ExportStrategyTester.ts +++ b/src/assets/wise5/classroomMonitor/dataExport/strategies/ExportStrategyTester.ts @@ -105,7 +105,7 @@ export class ExportStrategyTester { } setUpTeacherProjectService(): void { - this.teacherProjectService = new TeacherProjectService(null, null, null, null, null); + this.teacherProjectService = new TeacherProjectService(); spyOn(this.teacherProjectService, 'getNodePositionById').and.returnValue(this.stepNumber); spyOn(this.teacherProjectService, 'getNodePositionAndTitle').and.returnValue( this.nodePositionAndTitle diff --git a/src/assets/wise5/classroomMonitor/dataExport/strategies/LabelComponentDataExportStrategy.spec.ts b/src/assets/wise5/classroomMonitor/dataExport/strategies/LabelComponentDataExportStrategy.spec.ts index c99dbdd2ee4..e3313aacfe1 100644 --- a/src/assets/wise5/classroomMonitor/dataExport/strategies/LabelComponentDataExportStrategy.spec.ts +++ b/src/assets/wise5/classroomMonitor/dataExport/strategies/LabelComponentDataExportStrategy.spec.ts @@ -1,4 +1,11 @@ +import { provideHttpClient } from '@angular/common/http'; +import { TestBed } from '@angular/core/testing'; +import { MockProviders } from 'ng-mocks'; import { ComponentState } from '../../../../../app/domain/componentState'; +import { BranchService } from '../../../services/branchService'; +import { ComponentServiceLookupService } from '../../../services/componentServiceLookupService'; +import { ConfigService } from '../../../services/configService'; +import { PathService } from '../../../services/pathService'; import { ExportStrategyTester } from './ExportStrategyTester'; import { LabelComponentDataExportStrategy } from './LabelComponentDataExportStrategy'; @@ -14,9 +21,17 @@ let componentState3: any; let componentState4: any; describe('LabelComponentDataExportStrategy', () => { - beforeEach(() => { - exportStrategyTester = new ExportStrategyTester(); - exportStrategyTester.setUpServices(); + beforeEach(async() => { + await TestBed.configureTestingModule({ + providers: [ + MockProviders(BranchService, ComponentServiceLookupService, ConfigService, PathService), + provideHttpClient() + ], + }) + await TestBed.runInInjectionContext(async () => { + exportStrategyTester = new ExportStrategyTester(); + exportStrategyTester.setUpServices(); + }); initializeStudentWork(); }); exportAllRevisions(); diff --git a/src/assets/wise5/classroomMonitor/dataExport/strategies/MatchComponentDataExportStrategy.spec.ts b/src/assets/wise5/classroomMonitor/dataExport/strategies/MatchComponentDataExportStrategy.spec.ts index a7da629c4ee..29f7e75f510 100644 --- a/src/assets/wise5/classroomMonitor/dataExport/strategies/MatchComponentDataExportStrategy.spec.ts +++ b/src/assets/wise5/classroomMonitor/dataExport/strategies/MatchComponentDataExportStrategy.spec.ts @@ -1,6 +1,13 @@ +import { TestBed } from '@angular/core/testing'; import { ComponentState } from '../../../../../app/domain/componentState'; import { ExportStrategyTester } from './ExportStrategyTester'; import { MatchComponentDataExportStrategy } from './MatchComponentDataExportStrategy'; +import { MockProviders } from 'ng-mocks'; +import { BranchService } from '../../../services/branchService'; +import { ComponentServiceLookupService } from '../../../services/componentServiceLookupService'; +import { provideHttpClient } from '@angular/common/http'; +import { ConfigService } from '../../../services/configService'; +import { PathService } from '../../../services/pathService'; const additionalColumns = [ 'Choice A', @@ -41,9 +48,17 @@ let studentData3: any; let studentData4: any; describe('MatchComponentDataExportStrategy', () => { - beforeEach(() => { - exportStrategyTester = new ExportStrategyTester(); - exportStrategyTester.setUpServices(); + beforeEach(async () => { + await TestBed.configureTestingModule({ + providers: [ + MockProviders(BranchService, ComponentServiceLookupService, ConfigService, PathService), + provideHttpClient() + ], + }) + await TestBed.runInInjectionContext(async () => { + exportStrategyTester = new ExportStrategyTester(); + exportStrategyTester.setUpServices(); + }); initializeStudentWork(); }); exportAllRevisions(); diff --git a/src/assets/wise5/classroomMonitor/dataExport/strategies/OpenResponseComponentExportStrategy.spec.ts b/src/assets/wise5/classroomMonitor/dataExport/strategies/OpenResponseComponentExportStrategy.spec.ts index bf5c15b4e70..178d2c479c2 100644 --- a/src/assets/wise5/classroomMonitor/dataExport/strategies/OpenResponseComponentExportStrategy.spec.ts +++ b/src/assets/wise5/classroomMonitor/dataExport/strategies/OpenResponseComponentExportStrategy.spec.ts @@ -1,4 +1,11 @@ +import { provideHttpClient } from '@angular/common/http'; +import { TestBed } from '@angular/core/testing'; +import { MockProviders } from 'ng-mocks'; import { ComponentState } from '../../../../../app/domain/componentState'; +import { BranchService } from '../../../services/branchService'; +import { ComponentServiceLookupService } from '../../../services/componentServiceLookupService'; +import { ConfigService } from '../../../services/configService'; +import { PathService } from '../../../services/pathService'; import { ExportStrategyTester } from './ExportStrategyTester'; import { OpenResponseComponentDataExportStrategy } from './OpenResponseComponentExportStrategy'; @@ -15,9 +22,17 @@ let componentState3: any; let componentState4: any; describe('OpenResponseComponentDataExportStrategy', () => { - beforeEach(() => { - exportStrategyTester = new ExportStrategyTester(); - exportStrategyTester.setUpServices(); + beforeEach(async() => { + await TestBed.configureTestingModule({ + providers: [ + MockProviders(BranchService, ComponentServiceLookupService, ConfigService, PathService), + provideHttpClient() + ], + }) + await TestBed.runInInjectionContext(async () => { + exportStrategyTester = new ExportStrategyTester(); + exportStrategyTester.setUpServices(); + }); initializeStudentWork(); }); exportWithSingleAutoScore(); diff --git a/src/assets/wise5/classroomMonitor/dataExport/strategies/PeerChatComponentDataExportStrategy.spec.ts b/src/assets/wise5/classroomMonitor/dataExport/strategies/PeerChatComponentDataExportStrategy.spec.ts index 809863eb331..227927a9f7d 100644 --- a/src/assets/wise5/classroomMonitor/dataExport/strategies/PeerChatComponentDataExportStrategy.spec.ts +++ b/src/assets/wise5/classroomMonitor/dataExport/strategies/PeerChatComponentDataExportStrategy.spec.ts @@ -1,5 +1,12 @@ import { PeerChatComponentDataExportStrategy } from './PeerChatComponentDataExportStrategy'; import { ExportStrategyTester } from './ExportStrategyTester'; +import { provideHttpClient } from '@angular/common/http'; +import { TestBed } from '@angular/core/testing'; +import { MockProviders } from 'ng-mocks'; +import { BranchService } from '../../../services/branchService'; +import { ComponentServiceLookupService } from '../../../services/componentServiceLookupService'; +import { ConfigService } from '../../../services/configService'; +import { PathService } from '../../../services/pathService'; const componentType = 'PeerChat'; const dynamicPrompt1 = 'This is the dynamic prompt 1.'; @@ -14,9 +21,17 @@ const questionId1 = 'q1'; const questionId2 = 'q2'; describe('PeerChatComponentDataExportStrategy', () => { - beforeEach(() => { - exportStrategyTester = new ExportStrategyTester(); - exportStrategyTester.setUpServices(); + beforeEach(async() => { + await TestBed.configureTestingModule({ + providers: [ + MockProviders(BranchService, ComponentServiceLookupService, ConfigService, PathService), + provideHttpClient() + ], + }) + await TestBed.runInInjectionContext(async () => { + exportStrategyTester = new ExportStrategyTester(); + exportStrategyTester.setUpServices(); + }); }); exportWithRegularPrompt(); exportWithDynamicPrompt(); diff --git a/src/assets/wise5/services/projectService.ts b/src/assets/wise5/services/projectService.ts index 0fdf55ce8a9..8dcf38c98ed 100644 --- a/src/assets/wise5/services/projectService.ts +++ b/src/assets/wise5/services/projectService.ts @@ -1,28 +1,31 @@ -'use strict'; - -import { ConfigService } from './configService'; -import { Injectable, WritableSignal, signal } from '@angular/core'; import { HttpClient, HttpHeaders } from '@angular/common/http'; +import { inject, Injectable, signal, WritableSignal } from '@angular/core'; import { Observable, Subject, tap } from 'rxjs'; -import { Node } from '../common/Node'; +import { Language } from '../../../app/domain/language'; import { PeerGrouping } from '../../../app/domain/peerGrouping'; -import { ComponentServiceLookupService } from './componentServiceLookupService'; +import { ReferenceComponent } from '../../../app/domain/referenceComponent'; import { Branch } from '../../../app/domain/branch'; -import { BranchService } from './branchService'; -import { PathService } from './pathService'; +import { Component } from '../common/Component'; import { ComponentContent } from '../common/ComponentContent'; -import { MultipleChoiceContent } from '../components/multipleChoice/MultipleChoiceContent'; -import { TransitionLogic } from '../common/TransitionLogic'; +import { Node } from '../common/Node'; +import { ProjectLocale } from '../../../app/domain/projectLocale'; import { Transition } from '../common/Transition'; -import { ReferenceComponent } from '../../../app/domain/referenceComponent'; +import { MultipleChoiceContent } from '../components/multipleChoice/MultipleChoiceContent'; import { QuestionBank } from '../components/peerChat/peer-chat-question-bank/QuestionBank'; import { DynamicPrompt } from '../directives/dynamic-prompt/DynamicPrompt'; -import { Component } from '../common/Component'; -import { ProjectLocale } from '../../../app/domain/projectLocale'; -import { Language } from '../../../app/domain/language'; +import { BranchService } from './branchService'; +import { ComponentServiceLookupService } from './componentServiceLookupService'; +import { ConfigService } from './configService'; +import { PathService } from './pathService'; @Injectable() export class ProjectService { + protected branchService = inject(BranchService); + protected componentServiceLookupService = inject(ComponentServiceLookupService); + protected http = inject(HttpClient); + protected configService = inject(ConfigService); + protected pathService = inject(PathService); + achievements: any = []; additionalProcessingFunctionsMap: any = {}; allPaths: string[][] = []; @@ -50,14 +53,6 @@ export class ProjectService { private projectParsedSource: Subject = new Subject(); public projectParsed$: Observable = this.projectParsedSource.asObservable(); - constructor( - protected branchService: BranchService, - protected componentServiceLookupService: ComponentServiceLookupService, - protected http: HttpClient, - protected configService: ConfigService, - protected pathService: PathService - ) {} - getProject(): any { return this.project; } diff --git a/src/assets/wise5/services/teacherProjectService.ts b/src/assets/wise5/services/teacherProjectService.ts index fc81e095df1..9443e880cbe 100644 --- a/src/assets/wise5/services/teacherProjectService.ts +++ b/src/assets/wise5/services/teacherProjectService.ts @@ -1,18 +1,12 @@ -'use strict'; -import { ProjectService } from './projectService'; -import { Injectable, Signal, WritableSignal, signal } from '@angular/core'; +import { Injectable, Signal, signal, WritableSignal } from '@angular/core'; import { Observable, Subject } from 'rxjs'; -import { BranchService } from './branchService'; -import { ComponentServiceLookupService } from './componentServiceLookupService'; -import { HttpClient } from '@angular/common/http'; -import { ConfigService } from './configService'; -import { PathService } from './pathService'; +import { NodeTypeSelected } from '../authoringTool/domain/node-type-selected'; +import { ComponentContent } from '../common/ComponentContent'; import { copy } from '../common/object/object'; import { generateRandomKey } from '../common/string/string'; import { branchPathBackgroundColors } from '../common/color/color'; import { reduceByUniqueId } from '../common/array/array'; -import { NodeTypeSelected } from '../authoringTool/domain/node-type-selected'; -import { ComponentContent } from '../common/ComponentContent'; +import { ProjectService } from './projectService'; @Injectable() export class TeacherProjectService extends ProjectService { @@ -35,16 +29,6 @@ export class TeacherProjectService extends ProjectService { private uiChangedSource: Subject = new Subject(); public uiChanged$: Observable = this.uiChangedSource.asObservable(); - constructor( - protected branchService: BranchService, - protected componentServiceLookupService: ComponentServiceLookupService, - protected http: HttpClient, - protected configService: ConfigService, - protected pathService: PathService - ) { - super(branchService, componentServiceLookupService, http, configService, pathService); - } - /** * Retrieve the project JSON * @param projectId retrieve the project JSON with this id diff --git a/src/assets/wise5/vle/vleProjectService.ts b/src/assets/wise5/vle/vleProjectService.ts index 9eaa5edec4e..c754053ee38 100644 --- a/src/assets/wise5/vle/vleProjectService.ts +++ b/src/assets/wise5/vle/vleProjectService.ts @@ -1,4 +1,3 @@ -'use strict'; import { ProjectService } from '../services/projectService'; import { Injectable } from '@angular/core'; From 5c58caa62cd34fbcd49ec6d47f8eedb08986cd16 Mon Sep 17 00:00:00 2001 From: Hiroki Terashima Date: Thu, 11 Dec 2025 18:47:05 -0800 Subject: [PATCH 22/28] Use inject() for AbstractClassResponsesComponent and its child classes --- .../AbstractClassResponsesComponent.ts | 22 +++++----- .../milestone-class-responses.component.ts | 18 ++++---- .../node-class-responses.component.ts | 43 +++++-------------- 3 files changed, 29 insertions(+), 54 deletions(-) diff --git a/src/assets/wise5/classroomMonitor/classroomMonitorComponents/AbstractClassResponsesComponent.ts b/src/assets/wise5/classroomMonitor/classroomMonitorComponents/AbstractClassResponsesComponent.ts index f515ba11ba6..67227e8c045 100644 --- a/src/assets/wise5/classroomMonitor/classroomMonitorComponents/AbstractClassResponsesComponent.ts +++ b/src/assets/wise5/classroomMonitor/classroomMonitorComponents/AbstractClassResponsesComponent.ts @@ -1,16 +1,23 @@ -import { Directive } from '@angular/core'; +import { Directive, inject } from '@angular/core'; +import { Node } from '../../common/Node'; +import { copy } from '../../common/object/object'; import { AnnotationService } from '../../services/annotationService'; import { ClassroomStatusService } from '../../services/classroomStatusService'; import { ConfigService } from '../../services/configService'; import { NotificationService } from '../../services/notificationService'; import { TeacherDataService } from '../../services/teacherDataService'; import { TeacherProjectService } from '../../services/teacherProjectService'; -import { Node } from '../../common/Node'; -import { copy } from '../../common/object/object'; import { CompletionStatus } from './shared/CompletionStatus'; @Directive() export abstract class AbstractClassResponsesComponent { + protected annotationService = inject(AnnotationService); + protected classroomStatusService = inject(ClassroomStatusService); + protected configService = inject(ConfigService); + protected dataService = inject(TeacherDataService); + protected notificationService = inject(NotificationService); + protected projectService = inject(TeacherProjectService); + protected allWorkgroupsExpanded: boolean; protected component: any; protected node: Node; @@ -21,15 +28,6 @@ export abstract class AbstractClassResponsesComponent { private workgroupInView: Record = {}; // workgroup is in view or not protected workgroupsById: Record = {}; - constructor( - protected annotationService: AnnotationService, - protected classroomStatusService: ClassroomStatusService, - protected configService: ConfigService, - protected dataService: TeacherDataService, - protected notificationService: NotificationService, - protected projectService: TeacherProjectService - ) {} - protected retrieveStudentData(node: Node): void { this.dataService.retrieveStudentDataForNode(node).subscribe(() => { this.workgroups = copy(this.configService.getClassmateUserInfos()).filter( diff --git a/src/assets/wise5/classroomMonitor/classroomMonitorComponents/milestones/milestone-class-responses/milestone-class-responses.component.ts b/src/assets/wise5/classroomMonitor/classroomMonitorComponents/milestones/milestone-class-responses/milestone-class-responses.component.ts index 9dd5a7a4056..4c3702e05c2 100644 --- a/src/assets/wise5/classroomMonitor/classroomMonitorComponents/milestones/milestone-class-responses/milestone-class-responses.component.ts +++ b/src/assets/wise5/classroomMonitor/classroomMonitorComponents/milestones/milestone-class-responses/milestone-class-responses.component.ts @@ -1,17 +1,17 @@ +import { NgClass } from '@angular/common'; import { Component, Input, ViewEncapsulation } from '@angular/core'; -import { copy } from '../../../../common/object/object'; -import { Annotation } from '../../../../common/Annotation'; -import { filter, Subscription } from 'rxjs'; -import { AbstractClassResponsesComponent } from '../../AbstractClassResponsesComponent'; -import { Node } from '../../../../common/Node'; -import { Notification } from '../../../../../../app/domain/notification'; -import { MatList, MatListItem } from '@angular/material/list'; -import { WorkgroupSelectAutocompleteComponent } from '../../../../../../app/classroom-monitor/workgroup-select/workgroup-select-autocomplete/workgroup-select-autocomplete.component'; import { MatButton } from '@angular/material/button'; -import { NgClass } from '@angular/common'; import { MatIcon } from '@angular/material/icon'; +import { MatList, MatListItem } from '@angular/material/list'; import { MatTooltip } from '@angular/material/tooltip'; import { IntersectionObserverModule } from '@ng-web-apis/intersection-observer'; +import { filter, Subscription } from 'rxjs'; +import { WorkgroupSelectAutocompleteComponent } from '../../../../../../app/classroom-monitor/workgroup-select/workgroup-select-autocomplete/workgroup-select-autocomplete.component'; +import { Notification } from '../../../../../../app/domain/notification'; +import { Annotation } from '../../../../common/Annotation'; +import { Node } from '../../../../common/Node'; +import { copy } from '../../../../common/object/object'; +import { AbstractClassResponsesComponent } from '../../AbstractClassResponsesComponent'; import { MilestoneWorkgroupItemComponent } from '../milestone-workgroup-item/milestone-workgroup-item.component'; @Component({ diff --git a/src/assets/wise5/classroomMonitor/classroomMonitorComponents/nodeGrading/node-class-responses/node-class-responses.component.ts b/src/assets/wise5/classroomMonitor/classroomMonitorComponents/nodeGrading/node-class-responses/node-class-responses.component.ts index 90be65a0e18..3b9a8f0e128 100644 --- a/src/assets/wise5/classroomMonitor/classroomMonitorComponents/nodeGrading/node-class-responses/node-class-responses.component.ts +++ b/src/assets/wise5/classroomMonitor/classroomMonitorComponents/nodeGrading/node-class-responses/node-class-responses.component.ts @@ -1,22 +1,16 @@ -import { Component, Input } from '@angular/core'; -import { MatListModule } from '@angular/material/list'; -import { WorkgroupSelectAutocompleteComponent } from '../../../../../../app/classroom-monitor/workgroup-select/workgroup-select-autocomplete/workgroup-select-autocomplete.component'; +import { CommonModule } from '@angular/common'; +import { Component, inject, Input } from '@angular/core'; import { MatButtonModule } from '@angular/material/button'; import { MatIconModule } from '@angular/material/icon'; +import { MatListModule } from '@angular/material/list'; import { IntersectionObserverModule } from '@ng-web-apis/intersection-observer'; -import { CommonModule } from '@angular/common'; -import { AbstractClassResponsesComponent } from '../../AbstractClassResponsesComponent'; -import { Node } from '../../../../common/Node'; +import { Subscription } from 'rxjs'; +import { WorkgroupSelectAutocompleteComponent } from '../../../../../../app/classroom-monitor/workgroup-select/workgroup-select-autocomplete/workgroup-select-autocomplete.component'; import { ComponentContent } from '../../../../common/ComponentContent'; -import { NodeWorkgroupItemComponent } from '../node-workgroup-item/node-workgroup-item.component'; -import { AnnotationService } from '../../../../services/annotationService'; -import { ClassroomStatusService } from '../../../../services/classroomStatusService'; +import { Node } from '../../../../common/Node'; import { ComponentServiceLookupService } from '../../../../services/componentServiceLookupService'; -import { ConfigService } from '../../../../services/configService'; -import { TeacherDataService } from '../../../../services/teacherDataService'; -import { NotificationService } from '../../../../services/notificationService'; -import { TeacherProjectService } from '../../../../services/teacherProjectService'; -import { Subscription } from 'rxjs'; +import { AbstractClassResponsesComponent } from '../../AbstractClassResponsesComponent'; +import { NodeWorkgroupItemComponent } from '../node-workgroup-item/node-workgroup-item.component'; @Component({ imports: [ @@ -33,30 +27,13 @@ import { Subscription } from 'rxjs'; templateUrl: './node-class-responses.component.html' }) export class NodeClassResponsesComponent extends AbstractClassResponsesComponent { + private componentServiceLookupService = inject(ComponentServiceLookupService); + @Input() components: ComponentContent[]; protected maxScore: number; @Input() node: Node; private subscriptions: Subscription = new Subscription(); - constructor( - protected annotationService: AnnotationService, - protected classroomStatusService: ClassroomStatusService, - private componentServiceLookupService: ComponentServiceLookupService, - protected configService: ConfigService, - protected dataService: TeacherDataService, - protected notificationService: NotificationService, - protected projectService: TeacherProjectService - ) { - super( - annotationService, - classroomStatusService, - configService, - dataService, - notificationService, - projectService - ); - } - ngOnInit(): void { this.subscriptions.add(this.projectService.projectSaved$.subscribe(() => this.setMaxScore())); } From 889bb3cec3f6ff79d22372a797bd56c5de6c3be7 Mon Sep 17 00:00:00 2001 From: Hiroki Terashima Date: Fri, 12 Dec 2025 08:38:37 -0800 Subject: [PATCH 23/28] Use inject() for DataService and its child classes --- src/app/services/data.service.ts | 6 +-- ...uidanceComponentDataExportStrategy.spec.ts | 17 +++++-- ...cussionComponentDataExportStrategy.spec.ts | 17 +++++-- .../strategies/ExportStrategyTester.ts | 16 +++---- .../LabelComponentDataExportStrategy.spec.ts | 17 +++++-- .../MatchComponentDataExportStrategy.spec.ts | 16 ++++++- ...penResponseComponentExportStrategy.spec.ts | 16 ++++++- ...eerChatComponentDataExportStrategy.spec.ts | 17 +++++-- .../wise5/services/studentDataService.ts | 20 +++----- .../wise5/services/teacherDataService.ts | 47 +++++++++---------- src/messages.xlf | 8 ++-- 11 files changed, 128 insertions(+), 69 deletions(-) diff --git a/src/app/services/data.service.ts b/src/app/services/data.service.ts index 9d097243f0a..e6c466338d6 100644 --- a/src/app/services/data.service.ts +++ b/src/app/services/data.service.ts @@ -1,9 +1,11 @@ -import { Injectable } from '@angular/core'; +import { inject, Injectable } from '@angular/core'; import { Subject } from 'rxjs'; import { ProjectService } from '../../assets/wise5/services/projectService'; @Injectable() export abstract class DataService { + protected projectService = inject(ProjectService); + currentNode = null; previousStep = null; private currentNodeChangedSource: Subject = new Subject(); @@ -11,8 +13,6 @@ export abstract class DataService { private studentWorkReceivedSource: Subject = new Subject(); public studentWorkReceived$ = this.studentWorkReceivedSource.asObservable(); - constructor(protected projectService: ProjectService) {} - getCurrentNode(): any { return this.currentNode; } diff --git a/src/assets/wise5/classroomMonitor/dataExport/strategies/DialogGuidanceComponentDataExportStrategy.spec.ts b/src/assets/wise5/classroomMonitor/dataExport/strategies/DialogGuidanceComponentDataExportStrategy.spec.ts index 772aca25d3d..921887d1696 100644 --- a/src/assets/wise5/classroomMonitor/dataExport/strategies/DialogGuidanceComponentDataExportStrategy.spec.ts +++ b/src/assets/wise5/classroomMonitor/dataExport/strategies/DialogGuidanceComponentDataExportStrategy.spec.ts @@ -2,12 +2,17 @@ import { TestBed } from '@angular/core/testing'; import { ComponentState } from '../../../../../app/domain/componentState'; import { DialogGuidanceComponentDataExportStrategy } from './DialogGuidanceComponentDataExportStrategy'; import { ExportStrategyTester } from './ExportStrategyTester'; -import { MockProviders } from 'ng-mocks'; +import { MockProvider, MockProviders } from 'ng-mocks'; import { provideHttpClient } from '@angular/common/http'; import { BranchService } from '../../../services/branchService'; import { ComponentServiceLookupService } from '../../../services/componentServiceLookupService'; import { ConfigService } from '../../../services/configService'; import { PathService } from '../../../services/pathService'; +import { of } from 'rxjs'; +import { AnnotationService } from '../../../services/annotationService'; +import { ProjectService } from '../../../services/projectService'; +import { TeacherProjectService } from '../../../services/teacherProjectService'; +import { TeacherWebSocketService } from '../../../services/teacherWebSocketService'; let componentState1: any; let componentState2: any; @@ -62,8 +67,14 @@ describe('DialogGuidanceComponentDataExportStrategy', () => { beforeEach(async() => { await TestBed.configureTestingModule({ providers: [ - MockProviders(BranchService, ComponentServiceLookupService, ConfigService, PathService), - provideHttpClient() + MockProviders(BranchService, ComponentServiceLookupService, ConfigService, PathService, ProjectService, TeacherProjectService), + MockProvider(AnnotationService, { + annotationSavedToServer$: of() + }), + MockProvider(TeacherWebSocketService, { + newAnnotationReceived$: of(), + newStudentWorkReceived$: of() + }), provideHttpClient() ], }) await TestBed.runInInjectionContext(async () => { diff --git a/src/assets/wise5/classroomMonitor/dataExport/strategies/DiscussionComponentDataExportStrategy.spec.ts b/src/assets/wise5/classroomMonitor/dataExport/strategies/DiscussionComponentDataExportStrategy.spec.ts index a47020b7f4b..0f0f4b3d0ca 100644 --- a/src/assets/wise5/classroomMonitor/dataExport/strategies/DiscussionComponentDataExportStrategy.spec.ts +++ b/src/assets/wise5/classroomMonitor/dataExport/strategies/DiscussionComponentDataExportStrategy.spec.ts @@ -2,11 +2,16 @@ import { TestBed } from '@angular/core/testing'; import { DiscussionComponentDataExportStrategy } from './DiscussionComponentDataExportStrategy'; import { ExportStrategyTester } from './ExportStrategyTester'; import { provideHttpClient } from '@angular/common/http'; -import { MockProviders } from 'ng-mocks'; +import { MockProvider, MockProviders } from 'ng-mocks'; import { BranchService } from '../../../services/branchService'; import { ComponentServiceLookupService } from '../../../services/componentServiceLookupService'; import { ConfigService } from '../../../services/configService'; import { PathService } from '../../../services/pathService'; +import { of } from 'rxjs'; +import { AnnotationService } from '../../../services/annotationService'; +import { ProjectService } from '../../../services/projectService'; +import { TeacherProjectService } from '../../../services/teacherProjectService'; +import { TeacherWebSocketService } from '../../../services/teacherWebSocketService'; const componentType: string = 'Discussion'; let exportStrategyTester: ExportStrategyTester; @@ -17,8 +22,14 @@ describe('DiscussionComponentDataExportStrategy', () => { beforeEach(async() => { await TestBed.configureTestingModule({ providers: [ - MockProviders(BranchService, ComponentServiceLookupService, ConfigService, PathService), - provideHttpClient() + MockProviders(BranchService, ComponentServiceLookupService, ConfigService, PathService, ProjectService, TeacherProjectService), + MockProvider(AnnotationService, { + annotationSavedToServer$: of() + }), + MockProvider(TeacherWebSocketService, { + newAnnotationReceived$: of(), + newStudentWorkReceived$: of() + }), provideHttpClient() ], }) await TestBed.runInInjectionContext(async () => { diff --git a/src/assets/wise5/classroomMonitor/dataExport/strategies/ExportStrategyTester.ts b/src/assets/wise5/classroomMonitor/dataExport/strategies/ExportStrategyTester.ts index 7bca7245e45..509288e40ce 100644 --- a/src/assets/wise5/classroomMonitor/dataExport/strategies/ExportStrategyTester.ts +++ b/src/assets/wise5/classroomMonitor/dataExport/strategies/ExportStrategyTester.ts @@ -116,17 +116,15 @@ export class ExportStrategyTester { spyOn(this.teacherProjectService, 'getProjectTitle').and.returnValue(this.projectTitle); } - setUpTeacherDataService(): void { - this.dataService = new TeacherDataService( - this.annotationService, - this.configService, - null, - this.teacherProjectService, - this.teacherWebSocketService - ); + private setUpTeacherDataService(): void { + this.dataService = new TeacherDataService(); + this.dataService['projectService'] = this.teacherProjectService; + this.dataService['configService'] = this.configService; + this.dataService['annotationService'] = this.annotationService; + this.dataService['teacherWebSocketService'] = this.teacherWebSocketService; } - setUpWorkgroups(): void { + private setUpWorkgroups(): void { this.addWorkgroup(this.workgroupId1, this.workgroupUserInfo1); this.addWorkgroup(this.workgroupId2, this.workgroupUserInfo2); } diff --git a/src/assets/wise5/classroomMonitor/dataExport/strategies/LabelComponentDataExportStrategy.spec.ts b/src/assets/wise5/classroomMonitor/dataExport/strategies/LabelComponentDataExportStrategy.spec.ts index e3313aacfe1..d3e76fec6ed 100644 --- a/src/assets/wise5/classroomMonitor/dataExport/strategies/LabelComponentDataExportStrategy.spec.ts +++ b/src/assets/wise5/classroomMonitor/dataExport/strategies/LabelComponentDataExportStrategy.spec.ts @@ -1,6 +1,6 @@ import { provideHttpClient } from '@angular/common/http'; import { TestBed } from '@angular/core/testing'; -import { MockProviders } from 'ng-mocks'; +import { MockProvider, MockProviders } from 'ng-mocks'; import { ComponentState } from '../../../../../app/domain/componentState'; import { BranchService } from '../../../services/branchService'; import { ComponentServiceLookupService } from '../../../services/componentServiceLookupService'; @@ -8,6 +8,11 @@ import { ConfigService } from '../../../services/configService'; import { PathService } from '../../../services/pathService'; import { ExportStrategyTester } from './ExportStrategyTester'; import { LabelComponentDataExportStrategy } from './LabelComponentDataExportStrategy'; +import { of } from 'rxjs'; +import { AnnotationService } from '../../../services/annotationService'; +import { ProjectService } from '../../../services/projectService'; +import { TeacherProjectService } from '../../../services/teacherProjectService'; +import { TeacherWebSocketService } from '../../../services/teacherWebSocketService'; const componentType = 'Label'; let exportStrategyTester: ExportStrategyTester = new ExportStrategyTester(); @@ -24,8 +29,14 @@ describe('LabelComponentDataExportStrategy', () => { beforeEach(async() => { await TestBed.configureTestingModule({ providers: [ - MockProviders(BranchService, ComponentServiceLookupService, ConfigService, PathService), - provideHttpClient() + MockProviders(BranchService, ComponentServiceLookupService, ConfigService, PathService, ProjectService, TeacherProjectService), + MockProvider(AnnotationService, { + annotationSavedToServer$: of() + }), + MockProvider(TeacherWebSocketService, { + newAnnotationReceived$: of(), + newStudentWorkReceived$: of() + }), provideHttpClient() ], }) await TestBed.runInInjectionContext(async () => { diff --git a/src/assets/wise5/classroomMonitor/dataExport/strategies/MatchComponentDataExportStrategy.spec.ts b/src/assets/wise5/classroomMonitor/dataExport/strategies/MatchComponentDataExportStrategy.spec.ts index 29f7e75f510..a2accd67728 100644 --- a/src/assets/wise5/classroomMonitor/dataExport/strategies/MatchComponentDataExportStrategy.spec.ts +++ b/src/assets/wise5/classroomMonitor/dataExport/strategies/MatchComponentDataExportStrategy.spec.ts @@ -2,12 +2,17 @@ import { TestBed } from '@angular/core/testing'; import { ComponentState } from '../../../../../app/domain/componentState'; import { ExportStrategyTester } from './ExportStrategyTester'; import { MatchComponentDataExportStrategy } from './MatchComponentDataExportStrategy'; -import { MockProviders } from 'ng-mocks'; +import { MockProvider, MockProviders } from 'ng-mocks'; import { BranchService } from '../../../services/branchService'; import { ComponentServiceLookupService } from '../../../services/componentServiceLookupService'; import { provideHttpClient } from '@angular/common/http'; import { ConfigService } from '../../../services/configService'; import { PathService } from '../../../services/pathService'; +import { ProjectService } from '../../../services/projectService'; +import { AnnotationService } from '../../../services/annotationService'; +import { TeacherProjectService } from '../../../services/teacherProjectService'; +import { TeacherWebSocketService } from '../../../services/teacherWebSocketService'; +import { of } from 'rxjs'; const additionalColumns = [ 'Choice A', @@ -51,7 +56,14 @@ describe('MatchComponentDataExportStrategy', () => { beforeEach(async () => { await TestBed.configureTestingModule({ providers: [ - MockProviders(BranchService, ComponentServiceLookupService, ConfigService, PathService), + MockProviders(BranchService, ComponentServiceLookupService, ConfigService, PathService, ProjectService, TeacherProjectService), + MockProvider(AnnotationService, { + annotationSavedToServer$: of() + }), + MockProvider(TeacherWebSocketService, { + newAnnotationReceived$: of(), + newStudentWorkReceived$: of() + }), provideHttpClient() ], }) diff --git a/src/assets/wise5/classroomMonitor/dataExport/strategies/OpenResponseComponentExportStrategy.spec.ts b/src/assets/wise5/classroomMonitor/dataExport/strategies/OpenResponseComponentExportStrategy.spec.ts index 178d2c479c2..4d8ddeeb83a 100644 --- a/src/assets/wise5/classroomMonitor/dataExport/strategies/OpenResponseComponentExportStrategy.spec.ts +++ b/src/assets/wise5/classroomMonitor/dataExport/strategies/OpenResponseComponentExportStrategy.spec.ts @@ -1,6 +1,6 @@ import { provideHttpClient } from '@angular/common/http'; import { TestBed } from '@angular/core/testing'; -import { MockProviders } from 'ng-mocks'; +import { MockProvider, MockProviders } from 'ng-mocks'; import { ComponentState } from '../../../../../app/domain/componentState'; import { BranchService } from '../../../services/branchService'; import { ComponentServiceLookupService } from '../../../services/componentServiceLookupService'; @@ -8,6 +8,11 @@ import { ConfigService } from '../../../services/configService'; import { PathService } from '../../../services/pathService'; import { ExportStrategyTester } from './ExportStrategyTester'; import { OpenResponseComponentDataExportStrategy } from './OpenResponseComponentExportStrategy'; +import { AnnotationService } from '../../../services/annotationService'; +import { TeacherWebSocketService } from '../../../services/teacherWebSocketService'; +import { of } from 'rxjs'; +import { ProjectService } from '../../../services/projectService'; +import { TeacherProjectService } from '../../../services/teacherProjectService'; const componentType = 'OpenResponse'; let exportStrategyTester: ExportStrategyTester = new ExportStrategyTester(); @@ -25,7 +30,14 @@ describe('OpenResponseComponentDataExportStrategy', () => { beforeEach(async() => { await TestBed.configureTestingModule({ providers: [ - MockProviders(BranchService, ComponentServiceLookupService, ConfigService, PathService), + MockProviders(BranchService, ComponentServiceLookupService, ConfigService, PathService, ProjectService, TeacherProjectService), + MockProvider(AnnotationService, { + annotationSavedToServer$: of() + }), + MockProvider(TeacherWebSocketService, { + newAnnotationReceived$: of(), + newStudentWorkReceived$: of() + }), provideHttpClient() ], }) diff --git a/src/assets/wise5/classroomMonitor/dataExport/strategies/PeerChatComponentDataExportStrategy.spec.ts b/src/assets/wise5/classroomMonitor/dataExport/strategies/PeerChatComponentDataExportStrategy.spec.ts index 227927a9f7d..a18009178ba 100644 --- a/src/assets/wise5/classroomMonitor/dataExport/strategies/PeerChatComponentDataExportStrategy.spec.ts +++ b/src/assets/wise5/classroomMonitor/dataExport/strategies/PeerChatComponentDataExportStrategy.spec.ts @@ -2,11 +2,16 @@ import { PeerChatComponentDataExportStrategy } from './PeerChatComponentDataExpo import { ExportStrategyTester } from './ExportStrategyTester'; import { provideHttpClient } from '@angular/common/http'; import { TestBed } from '@angular/core/testing'; -import { MockProviders } from 'ng-mocks'; +import { MockProvider, MockProviders } from 'ng-mocks'; import { BranchService } from '../../../services/branchService'; import { ComponentServiceLookupService } from '../../../services/componentServiceLookupService'; import { ConfigService } from '../../../services/configService'; import { PathService } from '../../../services/pathService'; +import { of } from 'rxjs'; +import { AnnotationService } from '../../../services/annotationService'; +import { ProjectService } from '../../../services/projectService'; +import { TeacherProjectService } from '../../../services/teacherProjectService'; +import { TeacherWebSocketService } from '../../../services/teacherWebSocketService'; const componentType = 'PeerChat'; const dynamicPrompt1 = 'This is the dynamic prompt 1.'; @@ -24,8 +29,14 @@ describe('PeerChatComponentDataExportStrategy', () => { beforeEach(async() => { await TestBed.configureTestingModule({ providers: [ - MockProviders(BranchService, ComponentServiceLookupService, ConfigService, PathService), - provideHttpClient() + MockProviders(BranchService, ComponentServiceLookupService, ConfigService, PathService, ProjectService, TeacherProjectService), + MockProvider(AnnotationService, { + annotationSavedToServer$: of() + }), + MockProvider(TeacherWebSocketService, { + newAnnotationReceived$: of(), + newStudentWorkReceived$: of() + }), provideHttpClient() ], }) await TestBed.runInInjectionContext(async () => { diff --git a/src/assets/wise5/services/studentDataService.ts b/src/assets/wise5/services/studentDataService.ts index e2ad0ead3e5..692044d1da3 100644 --- a/src/assets/wise5/services/studentDataService.ts +++ b/src/assets/wise5/services/studentDataService.ts @@ -1,15 +1,18 @@ -import { Injectable } from '@angular/core'; -import { ConfigService } from './configService'; -import { AnnotationService } from './annotationService'; -import { ProjectService } from './projectService'; import { HttpClient, HttpParams } from '@angular/common/http'; +import { inject, Injectable } from '@angular/core'; import { Observable, Subject } from 'rxjs'; import { DataService } from '../../../app/services/data.service'; import { generateRandomKey } from '../common/string/string'; import { RunStatus } from '../common/RunStatus'; +import { AnnotationService } from './annotationService'; +import { ConfigService } from './configService'; @Injectable() export class StudentDataService extends DataService { + private annotationService = inject(AnnotationService); + private configService = inject(ConfigService); + public http = inject(HttpClient); + dummyStudentWorkId: number = 1; nodeStatuses: any = {}; previousStep = null; @@ -50,15 +53,6 @@ export class StudentDataService extends DataService { private updateNodeStatusesSource: Subject = new Subject(); public updateNodeStatuses$: Observable = this.updateNodeStatusesSource.asObservable(); - constructor( - private annotationService: AnnotationService, - private configService: ConfigService, - public http: HttpClient, - protected projectService: ProjectService - ) { - super(projectService); - } - broadcastComponentStudentData(componentStudentData: any) { this.componentStudentDataSource.next(componentStudentData); } diff --git a/src/assets/wise5/services/teacherDataService.ts b/src/assets/wise5/services/teacherDataService.ts index 4b40c973bfe..fe6b1bd2724 100644 --- a/src/assets/wise5/services/teacherDataService.ts +++ b/src/assets/wise5/services/teacherDataService.ts @@ -1,20 +1,32 @@ import { HttpClient, HttpParams } from '@angular/common/http'; -import { AnnotationService } from './annotationService'; -import { ConfigService } from './configService'; -import { TeacherProjectService } from './teacherProjectService'; -import { TeacherWebSocketService } from './teacherWebSocketService'; -import { Injectable } from '@angular/core'; +import { inject, Injectable } from '@angular/core'; import { Observable, Subject, tap } from 'rxjs'; -import { DataService } from '../../../app/services/data.service'; -import { Node } from '../common/Node'; import { compressToEncodedURIComponent } from 'lz-string'; +import { DataService } from '../../../app/services/data.service'; +import { Annotation } from '../common/Annotation'; import { getIntersectOfArrays } from '../common/array/array'; +import { Node } from '../common/Node'; import { serverSaveTimeComparator } from '../common/object/object'; -import { Annotation } from '../common/Annotation'; +import { AnnotationService } from './annotationService'; +import { ConfigService } from './configService'; +import { TeacherProjectService } from './teacherProjectService'; +import { TeacherWebSocketService } from './teacherWebSocketService'; @Injectable() export class TeacherDataService extends DataService { - studentData: any; + private annotationService = inject(AnnotationService); + private configService = inject(ConfigService); + private http = inject(HttpClient); + protected override projectService = inject(TeacherProjectService); + private webSocketService = inject(TeacherWebSocketService); + + studentData: any = { + annotationsByNodeId: {}, + annotationsToWorkgroupId: {}, + componentStatesByWorkgroupId: {}, + componentStatesByNodeId: {}, + componentStatesByComponentId: {} + }; currentPeriod = null; currentWorkgroup = null; previousStep = null; @@ -28,21 +40,8 @@ export class TeacherDataService extends DataService { public currentWorkgroupChanged$: Observable = this.currentWorkgroupChangedSource.asObservable(); - constructor( - private annotationService: AnnotationService, - private configService: ConfigService, - private http: HttpClient, - protected projectService: TeacherProjectService, - private webSocketService: TeacherWebSocketService - ) { - super(projectService); - this.studentData = { - annotationsByNodeId: {}, - annotationsToWorkgroupId: {}, - componentStatesByWorkgroupId: {}, - componentStatesByNodeId: {}, - componentStatesByComponentId: {} - }; + constructor() { + super(); this.subscribeToEvents(); } diff --git a/src/messages.xlf b/src/messages.xlf index 1a32adb2d12..c07bb23ccf8 100644 --- a/src/messages.xlf +++ b/src/messages.xlf @@ -22117,28 +22117,28 @@ If this problem continues, let your teacher know and move on to the next activit Preview Student src/assets/wise5/services/studentDataService.ts - 80 + 74 StudentDataService.saveComponentEvent: component, category, event args must not be null src/assets/wise5/services/studentDataService.ts - 247 + 241 StudentDataService.saveComponentEvent: nodeId, componentId, componentType must not be null src/assets/wise5/services/studentDataService.ts - 257 + 251 StudentDataService.saveVLEEvent: category and event args must not be null src/assets/wise5/services/studentDataService.ts - 266 + 260 From 68d02a6d666d77b41060f1bfb28dfcc3cdc463cd Mon Sep 17 00:00:00 2001 From: Hiroki Terashima Date: Thu, 18 Dec 2025 14:37:28 -0800 Subject: [PATCH 24/28] Use inject() for NotificationService and its child classes --- .../wise5/services/notificationService.ts | 60 +++++++++---------- .../services/studentNotificationService.ts | 22 ++----- src/messages.xlf | 8 +-- 3 files changed, 37 insertions(+), 53 deletions(-) diff --git a/src/assets/wise5/services/notificationService.ts b/src/assets/wise5/services/notificationService.ts index 2304381aef0..e370f19882b 100644 --- a/src/assets/wise5/services/notificationService.ts +++ b/src/assets/wise5/services/notificationService.ts @@ -1,4 +1,4 @@ -import { Injectable } from '@angular/core'; +import { inject, Injectable } from '@angular/core'; import { HttpClient, HttpParams } from '@angular/common/http'; import { ConfigService } from './configService'; import { ProjectService } from './projectService'; @@ -11,6 +11,12 @@ import { generateRandomKey } from '../common/string/string'; @Injectable() export class NotificationService { + protected annotationService = inject(AnnotationService); + protected configService = inject(ConfigService); + protected dialog = inject(MatDialog); + protected http = inject(HttpClient); + protected projectService = inject(ProjectService); + notifications: Notification[] = []; private notificationChangedSource: Subject = new Subject(); public notificationChanged$: Observable = this.notificationChangedSource.asObservable(); @@ -22,14 +28,6 @@ export class NotificationService { public viewCurrentAmbientNotification$: Observable = this.viewCurrentAmbientNotificationSource.asObservable(); - constructor( - protected annotationService: AnnotationService, - protected dialog: MatDialog, - protected http: HttpClient, - protected ConfigService: ConfigService, - protected ProjectService: ProjectService - ) {} - /** * Creates a new notification object * @param notificationType type of notification [component, node, annotation, etc] @@ -54,9 +52,9 @@ export class NotificationService { data = null, groupId = null ): Notification { - const nodePosition = this.ProjectService.getNodePositionById(nodeId); - const nodePositionAndTitle = this.ProjectService.getNodePositionAndTitle(nodeId); - const component = this.ProjectService.getComponent(nodeId, componentId); + const nodePosition = this.projectService.getNodePositionById(nodeId); + const nodePositionAndTitle = this.projectService.getNodePositionAndTitle(nodeId); + const component = this.projectService.getComponent(nodeId, componentId); let componentType = null; if (component != null) { componentType = component.type; @@ -82,18 +80,18 @@ export class NotificationService { } retrieveNotifications() { - if (this.ConfigService.isPreview()) { + if (this.configService.isPreview()) { this.notifications = []; return; } const options: any = {}; - if (this.ConfigService.getMode() === 'studentRun') { + if (this.configService.getMode() === 'studentRun') { options.params = new HttpParams() - .set('periodId', this.ConfigService.getPeriodId()) - .set('toWorkgroupId', this.ConfigService.getWorkgroupId()); + .set('periodId', this.configService.getPeriodId()) + .set('toWorkgroupId', this.configService.getWorkgroupId()); } return this.http - .get(this.ConfigService.getNotificationURL(), options) + .get(this.configService.getNotificationURL(), options) .toPromise() .then((notifications: any) => { this.notifications = notifications; @@ -165,8 +163,8 @@ export class NotificationService { } setNotificationNodePositionAndTitle(notification: Notification) { - notification.nodePosition = this.ProjectService.getNodePositionById(notification.nodeId); - notification.nodePositionAndTitle = this.ProjectService.getNodePositionAndTitle( + notification.nodePosition = this.projectService.getNodePositionById(notification.nodeId); + notification.nodePositionAndTitle = this.projectService.getNodePositionAndTitle( notification.nodeId ); } @@ -174,9 +172,9 @@ export class NotificationService { sendNotificationForScore(notificationForScore) { const notificationType = notificationForScore.notificationType; if (notificationForScore.isNotifyTeacher || notificationForScore.isNotifyStudent) { - const fromWorkgroupId = this.ConfigService.getWorkgroupId(); - const runId = this.ConfigService.getRunId(); - const periodId = this.ConfigService.getPeriodId(); + const fromWorkgroupId = this.configService.getWorkgroupId(); + const runId = this.configService.getRunId(); + const periodId = this.configService.getPeriodId(); const notificationGroupId = runId + '_' + generateRandomKey(); // links student and teacher notifications together const notificationData: any = {}; if (notificationForScore.isAmbient) { @@ -193,7 +191,7 @@ export class NotificationService { runId, periodId, notificationType, - this.ConfigService.getWorkgroupId(), + this.configService.getWorkgroupId(), notificationData, notificationGroupId ).then((notification) => { @@ -208,7 +206,7 @@ export class NotificationService { runId, periodId, notificationType, - this.ConfigService.getTeacherWorkgroupId(), + this.configService.getTeacherWorkgroupId(), notificationData, notificationGroupId ); @@ -228,7 +226,7 @@ export class NotificationService { notificationGroupId: string ) { const notificationMessage = notificationMessageTemplate - .replace('{{username}}', this.ConfigService.getUsernameByWorkgroupId(fromWorkgroupId)) + .replace('{{username}}', this.configService.getUsernameByWorkgroupId(fromWorkgroupId)) .replace('{{score}}', notificationForScore.score) .replace('{{dismissCode}}', notificationForScore.dismissCode); const notification = this.createNewNotification( @@ -247,11 +245,11 @@ export class NotificationService { } saveNotificationToServer(notification) { - if (this.ConfigService.isPreview()) { + if (this.configService.isPreview()) { return this.pretendServerRequest(notification); } else { return this.http - .post(this.ConfigService.getNotificationURL(), notification) + .post(this.configService.getNotificationURL(), notification) .toPromise() .then((notification: Notification) => { return notification; @@ -260,7 +258,7 @@ export class NotificationService { } dismissNotification(notification: Notification): void { - if (this.ConfigService.isPreview()) { + if (this.configService.isPreview()) { this.pretendServerRequest(notification); } const notificationsToDismiss = this.getActiveNotificationsWithSameSource( @@ -285,7 +283,7 @@ export class NotificationService { notifications.forEach((notification: any) => { notification.timeDismissed = Date.parse(new Date().toString()); return this.http - .post(`${this.ConfigService.getNotificationURL()}/dismiss`, notification) + .post(`${this.configService.getNotificationURL()}/dismiss`, notification) .subscribe((notification: Notification) => { this.addNotification(notification); }); @@ -395,8 +393,8 @@ export class NotificationService { params.periodId = args.periodId === -1 ? null : args.periodId; } - if (nodeId && this.ProjectService.isGroupNode(nodeId)) { - const groupNode = this.ProjectService.getNodeById(nodeId); + if (nodeId && this.projectService.isGroupNode(nodeId)) { + const groupNode = this.projectService.getNodeById(nodeId); const children = groupNode.ids; for (let childId of children) { params.nodeId = childId; diff --git a/src/assets/wise5/services/studentNotificationService.ts b/src/assets/wise5/services/studentNotificationService.ts index b4c324f3f10..27f07b4533a 100644 --- a/src/assets/wise5/services/studentNotificationService.ts +++ b/src/assets/wise5/services/studentNotificationService.ts @@ -1,28 +1,14 @@ -import { HttpClient } from '@angular/common/http'; -import { Injectable } from '@angular/core'; -import { MatDialog } from '@angular/material/dialog'; +import { inject, Injectable } from '@angular/core'; import { Message } from '@stomp/stompjs'; -import { AnnotationService } from './annotationService'; -import { ConfigService } from './configService'; import { Notification } from '../../../app/domain/notification'; import { NotificationService } from './notificationService'; -import { ProjectService } from './projectService'; import { StompService } from './stompService'; import { StudentDataService } from './studentDataService'; @Injectable() export class StudentNotificationService extends NotificationService { - constructor( - protected annotationService: AnnotationService, - protected dialog: MatDialog, - protected http: HttpClient, - protected configService: ConfigService, - protected projectService: ProjectService, - private stompService: StompService, - private studentDataService: StudentDataService - ) { - super(annotationService, dialog, http, configService, projectService); - } + private dataService = inject(StudentDataService); + private stompService = inject(StompService); initialize(): void { this.subscribeToNotificationMessages(); @@ -43,7 +29,7 @@ export class StudentNotificationService extends NotificationService { private isDismissImmediately(notification: Notification): boolean { return ( - notification.nodeId === this.studentDataService.getCurrentNodeId() && + notification.nodeId === this.dataService.getCurrentNodeId() && notification.type === 'PeerChatMessage' ); } diff --git a/src/messages.xlf b/src/messages.xlf index c07bb23ccf8..6c23c5a32c2 100644 --- a/src/messages.xlf +++ b/src/messages.xlf @@ -10514,7 +10514,7 @@ Click "Cancel" to keep the invalid JSON open so you can fix it. src/assets/wise5/services/notificationService.ts - 476 + 474 @@ -22068,21 +22068,21 @@ If this problem continues, let your teacher know and move on to the next activit You have new replies to your discussion post! src/assets/wise5/services/notificationService.ts - 131 + 129 You have new feedback from your teacher! src/assets/wise5/services/notificationService.ts - 133 + 131 You have new feedback! src/assets/wise5/services/notificationService.ts - 148 + 146 From a538f76279547da0130ea068904ce1e91c5f7a28 Mon Sep 17 00:00:00 2001 From: Hiroki Terashima Date: Thu, 18 Dec 2025 14:49:08 -0800 Subject: [PATCH 25/28] Use inject() for PeerGroupService and its child classes --- src/assets/wise5/services/peerGroupService.ts | 12 ++++----- .../wise5/services/studentPeerGroupService.ts | 27 +++++++------------ .../wise5/services/teacherPeerGroupService.ts | 12 ++------- 3 files changed, 17 insertions(+), 34 deletions(-) diff --git a/src/assets/wise5/services/peerGroupService.ts b/src/assets/wise5/services/peerGroupService.ts index 662c1c9fbc4..212e751af14 100644 --- a/src/assets/wise5/services/peerGroupService.ts +++ b/src/assets/wise5/services/peerGroupService.ts @@ -1,5 +1,5 @@ import { HttpClient } from '@angular/common/http'; -import { Injectable } from '@angular/core'; +import { inject, Injectable } from '@angular/core'; import { Observable, of } from 'rxjs'; import { map } from 'rxjs/operators'; import { PeerGroupStudentData } from '../../../app/domain/peerGroupStudentData'; @@ -10,13 +10,11 @@ import { ConfigService } from './configService'; @Injectable() export class PeerGroupService { - static readonly PREVIEW_PEER_GROUP_ID = 1; - - runId: number; + protected configService = inject(ConfigService); + protected http = inject(HttpClient); + runId: number = this.configService.getRunId(); - constructor(protected configService: ConfigService, protected http: HttpClient) { - this.runId = this.configService.getRunId(); - } + static readonly PREVIEW_PEER_GROUP_ID = 1; getPeerGroupingTags(node: Node): Set { const tags = new Set(); diff --git a/src/assets/wise5/services/studentPeerGroupService.ts b/src/assets/wise5/services/studentPeerGroupService.ts index 557f3df8011..23a6be5ff0f 100644 --- a/src/assets/wise5/services/studentPeerGroupService.ts +++ b/src/assets/wise5/services/studentPeerGroupService.ts @@ -1,25 +1,17 @@ -import { HttpClient } from '@angular/common/http'; -import { Injectable } from '@angular/core'; +import { inject, Injectable } from '@angular/core'; import { Observable, of } from 'rxjs'; import { PeerGroupStudentData } from '../../../app/domain/peerGroupStudentData'; import { PeerGroup } from '../components/peerChat/PeerGroup'; import { AnnotationService } from './annotationService'; -import { ConfigService } from './configService'; import { PeerGroupService } from './peerGroupService'; -import { StudentDataService } from './studentDataService'; import { ProjectService } from './projectService'; +import { StudentDataService } from './studentDataService'; @Injectable() export class StudentPeerGroupService extends PeerGroupService { - constructor( - private annotationService: AnnotationService, - protected configService: ConfigService, - protected http: HttpClient, - private projectService: ProjectService, - private studentDataService: StudentDataService - ) { - super(configService, http); - } + private annotationService = inject(AnnotationService); + private projectService = inject(ProjectService); + private studentDataService = inject(StudentDataService); retrievePeerGroup( peerGroupingTag: string, @@ -128,10 +120,11 @@ export class StudentPeerGroupService extends PeerGroupService { showWorkComponentId: string ): Observable { if (this.configService.isPreview()) { - const latestComponentState = this.studentDataService.getLatestComponentStateByNodeIdAndComponentId( - showWorkNodeId, - showWorkComponentId - ); + const latestComponentState = + this.studentDataService.getLatestComponentStateByNodeIdAndComponentId( + showWorkNodeId, + showWorkComponentId + ); return latestComponentState != null ? of([latestComponentState]) : of([]); } return super.retrieveStudentWork( diff --git a/src/assets/wise5/services/teacherPeerGroupService.ts b/src/assets/wise5/services/teacherPeerGroupService.ts index 2879435bfad..6377fc36ff6 100644 --- a/src/assets/wise5/services/teacherPeerGroupService.ts +++ b/src/assets/wise5/services/teacherPeerGroupService.ts @@ -1,21 +1,13 @@ -import { HttpClient } from '@angular/common/http'; -import { Injectable } from '@angular/core'; +import { inject, Injectable } from '@angular/core'; import { MatDialog } from '@angular/material/dialog'; import { Observable, of } from 'rxjs'; import { PeerGroupDialogComponent } from '../classroomMonitor/classroomMonitorComponents/peer-group/peer-group-dialog/peer-group-dialog.component'; import { PeerGroup } from '../components/peerChat/PeerGroup'; -import { ConfigService } from './configService'; import { PeerGroupService } from './peerGroupService'; @Injectable() export class TeacherPeerGroupService extends PeerGroupService { - constructor( - protected configService: ConfigService, - private dialog: MatDialog, - protected http: HttpClient - ) { - super(configService, http); - } + private dialog = inject(MatDialog); showPeerGroupDetails(peerGroupingTag: string): void { this.dialog.open(PeerGroupDialogComponent, { From aa22edafbbdc1a95a55dfd6960287f7ea0115d0d Mon Sep 17 00:00:00 2001 From: Hiroki Terashima Date: Thu, 18 Dec 2025 15:01:58 -0800 Subject: [PATCH 26/28] Use inject() for StepToolsComponent and its child classes --- .../grading-step-tools.component.spec.ts | 3 ++- .../grading-step-tools.component.ts | 18 ++++-------------- .../common/stepTools/step-tools.component.ts | 14 ++++++-------- 3 files changed, 12 insertions(+), 23 deletions(-) diff --git a/src/assets/wise5/classroomMonitor/classroomMonitorComponents/grading-step-tools/grading-step-tools.component.spec.ts b/src/assets/wise5/classroomMonitor/classroomMonitorComponents/grading-step-tools/grading-step-tools.component.spec.ts index 1ddbf865bad..4a2e14ee8a6 100644 --- a/src/assets/wise5/classroomMonitor/classroomMonitorComponents/grading-step-tools/grading-step-tools.component.spec.ts +++ b/src/assets/wise5/classroomMonitor/classroomMonitorComponents/grading-step-tools/grading-step-tools.component.spec.ts @@ -7,6 +7,7 @@ import { GradingNodeService } from '../../../services/gradingNodeService'; import { TeacherProjectService } from '../../../services/teacherProjectService'; import { of } from 'rxjs'; import { NodeIconComponent } from '../../../vle/node-icon/node-icon.component'; +import { NodeService } from '../../../services/nodeService'; describe('GradingStepToolsComponent', () => { let component: GradingStepToolsComponent; @@ -16,7 +17,7 @@ describe('GradingStepToolsComponent', () => { await TestBed.configureTestingModule({ imports: [GradingStepToolsComponent, MockComponent(NodeIconComponent)], providers: [ - MockProviders(GradingNodeService), + MockProviders(NodeService, GradingNodeService), MockProvider(TeacherDataService, { currentNodeChanged$: of() }), diff --git a/src/assets/wise5/classroomMonitor/classroomMonitorComponents/grading-step-tools/grading-step-tools.component.ts b/src/assets/wise5/classroomMonitor/classroomMonitorComponents/grading-step-tools/grading-step-tools.component.ts index 7ef730da481..7d68ff48bda 100644 --- a/src/assets/wise5/classroomMonitor/classroomMonitorComponents/grading-step-tools/grading-step-tools.component.ts +++ b/src/assets/wise5/classroomMonitor/classroomMonitorComponents/grading-step-tools/grading-step-tools.component.ts @@ -1,5 +1,4 @@ -import { Component, ViewEncapsulation } from '@angular/core'; -import { Directionality } from '@angular/cdk/bidi'; +import { Component, inject, ViewEncapsulation } from '@angular/core'; import { StepToolsComponent } from '../../../common/stepTools/step-tools.component'; import { MatButtonModule } from '@angular/material/button'; import { MatFormFieldModule } from '@angular/material/form-field'; @@ -10,9 +9,7 @@ import { CommonModule } from '@angular/common'; import { FormsModule } from '@angular/forms'; import { MatInputModule } from '@angular/material/input'; import { NodeIconComponent } from '../../../vle/node-icon/node-icon.component'; -import { TeacherDataService } from '../../../services/teacherDataService'; import { GradingNodeService } from '../../../services/gradingNodeService'; -import { TeacherProjectService } from '../../../services/teacherProjectService'; import { ActivatedRoute, Router } from '@angular/router'; @Component({ @@ -33,16 +30,9 @@ import { ActivatedRoute, Router } from '@angular/router'; templateUrl: '../../../common/stepTools/step-tools.component.html' }) export class GradingStepToolsComponent extends StepToolsComponent { - constructor( - protected dataService: TeacherDataService, - protected dir: Directionality, - protected nodeService: GradingNodeService, - protected projectService: TeacherProjectService, - private route: ActivatedRoute, - private router: Router - ) { - super(dataService, dir, nodeService, projectService); - } + protected override nodeService = inject(GradingNodeService); + private route = inject(ActivatedRoute); + private router = inject(Router); ngOnInit(): void { super.ngOnInit(); diff --git a/src/assets/wise5/common/stepTools/step-tools.component.ts b/src/assets/wise5/common/stepTools/step-tools.component.ts index 9799476ff5e..347af555136 100644 --- a/src/assets/wise5/common/stepTools/step-tools.component.ts +++ b/src/assets/wise5/common/stepTools/step-tools.component.ts @@ -1,5 +1,5 @@ import { CommonModule } from '@angular/common'; -import { Component, ViewEncapsulation } from '@angular/core'; +import { Component, inject, ViewEncapsulation } from '@angular/core'; import { Directionality } from '@angular/cdk/bidi'; import { FormsModule } from '@angular/forms'; import { MatButtonModule } from '@angular/material/button'; @@ -32,6 +32,11 @@ import { TeacherProjectService } from '../../services/teacherProjectService'; templateUrl: 'step-tools.component.html' }) export class StepToolsComponent { + protected dataService = inject(TeacherDataService); + protected dir = inject(Directionality); + protected nodeService = inject(NodeService); + protected projectService = inject(TeacherProjectService); + protected icons: any; protected nextId: any; protected nodeId: string; @@ -39,13 +44,6 @@ export class StepToolsComponent { protected prevId: any; private subscriptions: Subscription = new Subscription(); - constructor( - protected dataService: TeacherDataService, - protected dir: Directionality, - protected nodeService: NodeService, - protected projectService: TeacherProjectService - ) {} - ngOnInit(): void { this.calculateNodeIds(); this.updateModel(); From d36fb1e65b37371be8ec519998dbb88eb3de6fa4 Mon Sep 17 00:00:00 2001 From: Hiroki Terashima Date: Thu, 18 Dec 2025 15:20:04 -0800 Subject: [PATCH 27/28] Replace constructor with inject() in StepToolsComponent --- .../stepTools/step-tools.component.ts | 24 +++++++------------ 1 file changed, 9 insertions(+), 15 deletions(-) diff --git a/src/assets/wise5/themes/default/themeComponents/stepTools/step-tools.component.ts b/src/assets/wise5/themes/default/themeComponents/stepTools/step-tools.component.ts index 0194d8918f2..872e5947856 100644 --- a/src/assets/wise5/themes/default/themeComponents/stepTools/step-tools.component.ts +++ b/src/assets/wise5/themes/default/themeComponents/stepTools/step-tools.component.ts @@ -1,5 +1,5 @@ import { CommonModule } from '@angular/common'; -import { Component, OnInit, ViewEncapsulation } from '@angular/core'; +import { Component, inject, OnInit, ViewEncapsulation } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { MatButtonModule } from '@angular/material/button'; import { MatFormFieldModule } from '@angular/material/form-field'; @@ -32,6 +32,11 @@ import { Subscription } from 'rxjs'; templateUrl: './step-tools.component.html' }) export class StepToolsComponent implements OnInit { + private dataService = inject(StudentDataService); + private nodeService = inject(NodeService); + private nodeStatusService = inject(NodeStatusService); + private projectService = inject(ProjectService); + protected icons: any; protected isSurvey: boolean; protected is_rtl: boolean; @@ -44,13 +49,6 @@ export class StepToolsComponent implements OnInit { private subscriptions: Subscription = new Subscription(); protected toNodeId: string; - constructor( - private nodeService: NodeService, - private nodeStatusService: NodeStatusService, - private projectService: ProjectService, - private studentDataService: StudentDataService - ) {} - ngOnInit(): void { this.is_rtl = $('html').attr('dir') == 'rtl'; this.icons = { prev: 'chevron_left', next: 'chevron_right' }; @@ -65,14 +63,10 @@ export class StepToolsComponent implements OnInit { private subscribeToChanges(): void { this.subscriptions.add( - this.studentDataService.currentNodeChanged$.subscribe(() => { - this.updateModel(); - }) + this.dataService.currentNodeChanged$.subscribe(() => this.updateModel()) ); this.subscriptions.add( - this.studentDataService.nodeStatusesChanged$.subscribe(() => { - this.updateModel(); - }) + this.dataService.nodeStatusesChanged$.subscribe(() => this.updateModel()) ); } @@ -90,7 +84,7 @@ export class StepToolsComponent implements OnInit { } private updateModel(): void { - const nodeId = this.studentDataService.getCurrentNodeId(); + const nodeId = this.dataService.getCurrentNodeId(); if (!this.projectService.isGroupNode(nodeId)) { this.nodeId = nodeId; this.nodeStatus = this.nodeStatuses[this.nodeId]; From 5a905b35e3606b34bbe5a82ba97ba9fa67c2ce39 Mon Sep 17 00:00:00 2001 From: Hiroki Terashima Date: Thu, 18 Dec 2025 16:24:57 -0800 Subject: [PATCH 28/28] Use inject() for AbstractExportComponent and its child classes --- .../dataExport/abstract-export.component.ts | 22 ++++++------ .../export-one-workgroup-per-row.component.ts | 34 ++----------------- .../export-student-work.component.ts | 34 ++----------------- src/messages.xlf | 2 +- 4 files changed, 17 insertions(+), 75 deletions(-) diff --git a/src/assets/wise5/classroomMonitor/dataExport/abstract-export.component.ts b/src/assets/wise5/classroomMonitor/dataExport/abstract-export.component.ts index e23cb427a2a..70022fb71d8 100644 --- a/src/assets/wise5/classroomMonitor/dataExport/abstract-export.component.ts +++ b/src/assets/wise5/classroomMonitor/dataExport/abstract-export.component.ts @@ -6,10 +6,19 @@ import { ConfigService } from '../../services/configService'; import { DataExportService } from '../../services/dataExportService'; import { TeacherDataService } from '../../services/teacherDataService'; import { TeacherProjectService } from '../../services/teacherProjectService'; -import { Directive } from '@angular/core'; +import { Directive, inject } from '@angular/core'; @Directive() export abstract class AbstractExportComponent { + public annotationService = inject(AnnotationService); + public configService = inject(ConfigService); + public dataExportService = inject(DataExportService); + public dataService = inject(TeacherDataService); + protected dialog = inject(MatDialog); + public projectService = inject(TeacherProjectService); + protected route = inject(ActivatedRoute); + protected router = inject(Router); + protected canViewStudentNames = false; protected exportStepSelectionType: string = 'exportAllSteps'; protected flattenedProjectAsNodeIds: string[] = []; @@ -20,17 +29,6 @@ export abstract class AbstractExportComponent { protected projectIdToOrder: any; protected projectItems: any; - constructor( - public annotationService: AnnotationService, - public configService: ConfigService, - public dataExportService: DataExportService, - public dataService: TeacherDataService, - protected dialog: MatDialog, - public projectService: TeacherProjectService, - protected route: ActivatedRoute, - protected router: Router - ) {} - ngOnInit(): void { this.project = this.projectService.project; const nodeOrderOfProject = this.projectService.getNodeOrderOfProject(this.project); diff --git a/src/assets/wise5/classroomMonitor/dataExport/export-one-workgroup-per-row/export-one-workgroup-per-row.component.ts b/src/assets/wise5/classroomMonitor/dataExport/export-one-workgroup-per-row/export-one-workgroup-per-row.component.ts index e2417ea0396..4277954916d 100644 --- a/src/assets/wise5/classroomMonitor/dataExport/export-one-workgroup-per-row/export-one-workgroup-per-row.component.ts +++ b/src/assets/wise5/classroomMonitor/dataExport/export-one-workgroup-per-row/export-one-workgroup-per-row.component.ts @@ -1,14 +1,7 @@ -import { Component } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { AbstractExportComponent } from '../abstract-export.component'; import { OneWorkgroupPerRowDataExportStrategy } from '../strategies/OneWorkgroupPerRowDataExportStrategy'; -import { MatDialog } from '@angular/material/dialog'; -import { ActivatedRoute, Router } from '@angular/router'; -import { AnnotationService } from '../../../services/annotationService'; import { ComponentServiceLookupService } from '../../../services/componentServiceLookupService'; -import { ConfigService } from '../../../services/configService'; -import { DataExportService } from '../../../services/dataExportService'; -import { TeacherDataService } from '../../../services/teacherDataService'; -import { TeacherProjectService } from '../../../services/teacherProjectService'; import { MatButton } from '@angular/material/button'; import { MatTooltip } from '@angular/material/tooltip'; import { MatIcon } from '@angular/material/icon'; @@ -29,6 +22,8 @@ import { SelectStepAndComponentCheckboxesComponent } from '../select-step-and-co templateUrl: './export-one-workgroup-per-row.component.html' }) export class ExportOneWorkgroupPerRowComponent extends AbstractExportComponent { + public componentServiceLookupService = inject(ComponentServiceLookupService); + protected includeBranchPathTaken: boolean; protected includeBranchPathTakenNodeId: boolean; protected includeBranchPathTakenStepTitle: boolean; @@ -41,29 +36,6 @@ export class ExportOneWorkgroupPerRowComponent extends AbstractExportComponent { protected includeStudentWorkIds: boolean; protected includeStudentWorkTimestamps: boolean; - constructor( - public annotationService: AnnotationService, - public componentServiceLookupService: ComponentServiceLookupService, - public configService: ConfigService, - public dataExportService: DataExportService, - public dataService: TeacherDataService, - protected dialog: MatDialog, - public projectService: TeacherProjectService, - protected route: ActivatedRoute, - protected router: Router - ) { - super( - annotationService, - configService, - dataExportService, - dataService, - dialog, - projectService, - route, - router - ); - } - protected export(): void { this.showDownloadingExportMessage(); const strategy = new OneWorkgroupPerRowDataExportStrategy(); diff --git a/src/assets/wise5/classroomMonitor/dataExport/export-student-work/export-student-work.component.ts b/src/assets/wise5/classroomMonitor/dataExport/export-student-work/export-student-work.component.ts index 4820fcb3c82..519d845ae9c 100644 --- a/src/assets/wise5/classroomMonitor/dataExport/export-student-work/export-student-work.component.ts +++ b/src/assets/wise5/classroomMonitor/dataExport/export-student-work/export-student-work.component.ts @@ -1,14 +1,7 @@ -import { Component } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { AbstractExportComponent } from '../abstract-export.component'; import { StudentWorkDataExportStrategy } from '../strategies/StudentWorkDataExportStrategy'; -import { MatDialog } from '@angular/material/dialog'; -import { ActivatedRoute, Router } from '@angular/router'; -import { AnnotationService } from '../../../services/annotationService'; import { ComponentServiceLookupService } from '../../../services/componentServiceLookupService'; -import { ConfigService } from '../../../services/configService'; -import { DataExportService } from '../../../services/dataExportService'; -import { TeacherDataService } from '../../../services/teacherDataService'; -import { TeacherProjectService } from '../../../services/teacherProjectService'; import { MatButton } from '@angular/material/button'; import { MatTooltip } from '@angular/material/tooltip'; import { MatIcon } from '@angular/material/icon'; @@ -32,32 +25,11 @@ import { SelectStepAndComponentCheckboxesComponent } from '../select-step-and-co templateUrl: './export-student-work.component.html' }) export class ExportStudentWorkComponent extends AbstractExportComponent { + public componentServiceLookupService = inject(ComponentServiceLookupService); + protected canViewStudentNames: boolean = false; protected exportType: string = 'latestStudentWork'; - constructor( - public annotationService: AnnotationService, - public componentServiceLookupService: ComponentServiceLookupService, - public configService: ConfigService, - public dataExportService: DataExportService, - public dataService: TeacherDataService, - protected dialog: MatDialog, - public projectService: TeacherProjectService, - protected route: ActivatedRoute, - protected router: Router - ) { - super( - annotationService, - configService, - dataExportService, - dataService, - dialog, - projectService, - route, - router - ); - } - ngOnInit(): void { super.ngOnInit(); this.canViewStudentNames = this.configService.getPermissions().canViewStudentNames; diff --git a/src/messages.xlf b/src/messages.xlf index 6c23c5a32c2..405fbfd9bf7 100644 --- a/src/messages.xlf +++ b/src/messages.xlf @@ -14900,7 +14900,7 @@ Are you sure you want to proceed? Downloading Export src/assets/wise5/classroomMonitor/dataExport/abstract-export.component.ts - 52 + 50 src/assets/wise5/classroomMonitor/dataExport/data-export/data-export.component.ts