General: Migrate exercise group module to signals, inject and standalone

src/main/webapp/app/exam/manage/exercise-groups/exercise-group-update.component.ts

@@ -1,4 +1,4 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit, inject } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 import { HttpErrorResponse, HttpResponse } from '@angular/common/http';
 import { AlertService } from 'app/core/util/alert.service';
@@ -14,6 +14,11 @@ import { faBan, faSave } from '@fortawesome/free-solid-svg-icons';
     templateUrl: './exercise-group-update.component.html',
 })
 export class ExerciseGroupUpdateComponent implements OnInit {
+    private route = inject(ActivatedRoute);
+    private router = inject(Router);
+    private exerciseGroupService = inject(ExerciseGroupService);
+    private alertService = inject(AlertService);
+
     readonly alertType = 'info';
     courseId: number;
     exam: Exam;
@@ -23,13 +28,6 @@ export class ExerciseGroupUpdateComponent implements OnInit {
     faBan = faBan;
     faSave = faSave;
 
-    constructor(
-        private route: ActivatedRoute,
-        private router: Router,
-        private exerciseGroupService: ExerciseGroupService,
-        private alertService: AlertService,
-    ) {}
-
     /**
      * Initialize the courseId and exerciseGroup
      */

src/main/webapp/app/exam/manage/exercise-groups/exercise-group.service.ts

@@ -1,5 +1,4 @@
-import { Injectable } from '@angular/core';
-import { Router } from '@angular/router';
+import { Injectable, inject } from '@angular/core';
 import { HttpClient, HttpParams, HttpResponse } from '@angular/common/http';
 import { Observable } from 'rxjs';
 import { ExerciseGroup } from 'app/entities/exercise-group.model';
@@ -9,12 +8,9 @@ type EntityArrayResponseType = HttpResponse<ExerciseGroup[]>;
 
 @Injectable({ providedIn: 'root' })
 export class ExerciseGroupService {
-    public resourceUrl = 'api/courses';
+    private http = inject(HttpClient);
 
-    constructor(
-        private router: Router,
-        private http: HttpClient,
-    ) {}
+    public resourceUrl = 'api/courses';
 
     /**
      * Create an exercise group on the server using a POST request.

src/main/webapp/app/exam/manage/exercise-groups/exercise-groups.component.ts

@@ -1,4 +1,4 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit, inject } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 import { Subject, forkJoin, of } from 'rxjs';
 import { catchError } from 'rxjs/operators';
@@ -13,7 +13,6 @@ import { Course } from 'app/entities/course.model';
 import { Exam } from 'app/entities/exam/exam.model';
 import dayjs from 'dayjs/esm';
 import { ExerciseService } from 'app/exercises/shared/exercise/exercise.service';
-import { ProgrammingExerciseParticipationType } from 'app/entities/programming/programming-exercise-participation.model';
 import { IconProp } from '@fortawesome/fontawesome-svg-core';
 import { AlertService } from 'app/core/util/alert.service';
 import { EventManager } from 'app/core/util/event-manager.service';
@@ -41,7 +40,16 @@ import { PROFILE_LOCALCI, PROFILE_LOCALVC } from 'app/app.constants';
     styleUrls: ['./exercise-groups.component.scss'],
 })
 export class ExerciseGroupsComponent implements OnInit {
-    participationType = ProgrammingExerciseParticipationType;
+    private route = inject(ActivatedRoute);
+    private exerciseGroupService = inject(ExerciseGroupService);
+    exerciseService = inject(ExerciseService);
+    private examManagementService = inject(ExamManagementService);
+    private eventManager = inject(EventManager);
+    private alertService = inject(AlertService);
+    private modalService = inject(NgbModal);
+    private router = inject(Router);
+    private profileService = inject(ProfileService);
+
     courseId: number;
     course: Course;
     examId: number;
@@ -69,18 +77,6 @@ export class ExerciseGroupsComponent implements OnInit {
     faAngleDown = faAngleDown;
     faFileImport = faFileImport;
 
-    constructor(
-        private route: ActivatedRoute,
-        private exerciseGroupService: ExerciseGroupService,
-        public exerciseService: ExerciseService,
-        private examManagementService: ExamManagementService,
-        private eventManager: EventManager,
-        private alertService: AlertService,
-        private modalService: NgbModal,
-        private router: Router,
-        private profileService: ProfileService,
-    ) {}
-
     /**
      * Initialize the courseId and examId. Get all exercise groups for the exam. Setup dictionary for exercise groups which contain programming exercises.
      * See {@link setupExerciseGroupToExerciseTypesDict}.

src/main/webapp/app/exam/manage/exercise-groups/file-upload-exercise-cell/file-upload-exercise-group-cell.component.html

@@ -1,3 +1,3 @@
-@if (fileUploadExercise.type === exerciseType.FILE_UPLOAD) {
-    {{ fileUploadExercise.filePattern || '' }}
+@if (exercise().type === exerciseType.FILE_UPLOAD) {
+    {{ exercise().filePattern || '' }}
 }

src/main/webapp/app/exam/manage/exercise-groups/file-upload-exercise-cell/file-upload-exercise-group-cell.component.ts

@@ -1,6 +1,6 @@
-import { Component, Input } from '@angular/core';
+import { Component, input } from '@angular/core';
+import { ExerciseType } from 'app/entities/exercise.model';
 import { FileUploadExercise } from 'app/entities/file-upload-exercise.model';
-import { Exercise, ExerciseType } from 'app/entities/exercise.model';
 
 @Component({
     selector: 'jhi-file-upload-exercise-group-cell',
@@ -9,11 +9,5 @@ import { Exercise, ExerciseType } from 'app/entities/exercise.model';
 })
 export class FileUploadExerciseGroupCellComponent {
     exerciseType = ExerciseType;
-
-    fileUploadExercise: FileUploadExercise;
-
-    @Input()
-    set exercise(exercise: Exercise) {
-        this.fileUploadExercise = exercise as FileUploadExercise;
-    }
+    exercise = input.required<FileUploadExercise>();
 }

src/main/webapp/app/exam/manage/exercise-groups/modeling-exercise-cell/modeling-exercise-group-cell.component.html

@@ -1,3 +1,3 @@
-@if (modelingExercise.type === exerciseType.MODELING) {
-    {{ 'artemisApp.DiagramType.' + modelingExercise.diagramType | artemisTranslate }}
+@if (exercise().type === exerciseType.MODELING) {
+    {{ 'artemisApp.DiagramType.' + exercise().diagramType | artemisTranslate }}
 }

src/main/webapp/app/exam/manage/exercise-groups/modeling-exercise-cell/modeling-exercise-group-cell.component.ts

@@ -1,5 +1,5 @@
-import { Component, Input } from '@angular/core';
-import { Exercise, ExerciseType } from 'app/entities/exercise.model';
+import { Component, input } from '@angular/core';
+import { ExerciseType } from 'app/entities/exercise.model';
 import { ModelingExercise } from 'app/entities/modeling-exercise.model';
 
 @Component({
@@ -9,10 +9,5 @@ import { ModelingExercise } from 'app/entities/modeling-exercise.model';
 })
 export class ModelingExerciseGroupCellComponent {
     exerciseType = ExerciseType;
-    modelingExercise: ModelingExercise;
-
-    @Input()
-    set exercise(exercise: Exercise) {
-        this.modelingExercise = exercise as ModelingExercise;
-    }
+    exercise = input.required<ModelingExercise>();
 }

src/main/webapp/app/exam/manage/exercise-groups/programming-exercise-cell/programming-exercise-group-cell.component.html

@@ -1,54 +1,54 @@
-@if (programmingExercise) {
-    @if (displayShortName) {
+@if (exercise()) {
+    @if (displayShortName()) {
         <div>
-            {{ programmingExercise.shortName || '' }}
+            {{ exercise().shortName || '' }}
         </div>
     }
-    @if (displayRepositoryUri) {
+    @if (displayRepositoryUri()) {
         <div>
             <div>
-                @if (programmingExercise.templateParticipation?.repositoryUri) {
+                @if (exercise().templateParticipation?.repositoryUri) {
                     <!--Checks if the programming exercise has a setup with VCS and CI, if this not the case
                                             the links/clone-buttons are disabled--->
                     @if (!localVCEnabled) {
                         <span>
-                            <a href="{{ programmingExercise.templateParticipation?.repositoryUri || '' }}" target="_blank">Template</a>
+                            <a href="{{ exercise().templateParticipation?.repositoryUri || '' }}" target="_blank">Template</a>
                         </span>
                     } @else {
                         <a [routerLink]="" (click)="downloadRepository('TEMPLATE')"> <fa-icon [icon]="faDownload" /> Template </a>
                     }
                 }
-                @if (programmingExercise.templateParticipation?.results?.length) {
+                @if (exercise().templateParticipation?.results?.length) {
                     <jhi-programming-exercise-instructor-status
                         [participationType]="participationType.TEMPLATE"
-                        [participation]="programmingExercise.templateParticipation!"
-                        [exercise]="programmingExercise"
+                        [participation]="exercise().templateParticipation!"
+                        [exercise]="exercise()"
                     />
                 }
             </div>
             <div>
-                @if (programmingExercise.solutionParticipation?.repositoryUri) {
+                @if (exercise().solutionParticipation?.repositoryUri) {
                     @if (!localVCEnabled) {
                         <span>
-                            <a href="{{ programmingExercise.solutionParticipation?.repositoryUri || '' }}" target="_blank">Solution</a>
+                            <a href="{{ exercise().solutionParticipation?.repositoryUri || '' }}" target="_blank">Solution</a>
                         </span>
                     } @else {
                         <a [routerLink]="" (click)="downloadRepository('SOLUTION')"> <fa-icon [icon]="faDownload" /> Solution </a>
                     }
                 }
-                @if (programmingExercise.solutionParticipation?.results?.length) {
+                @if (exercise().solutionParticipation?.results?.length) {
                     <jhi-programming-exercise-instructor-status
                         [participationType]="participationType.SOLUTION"
-                        [participation]="programmingExercise.solutionParticipation!"
-                        [exercise]="programmingExercise"
+                        [participation]="exercise().solutionParticipation!"
+                        [exercise]="exercise()"
                     />
                 }
             </div>
             <div>
-                @if (programmingExercise.testRepositoryUri) {
+                @if (exercise().testRepositoryUri) {
                     @if (!localVCEnabled) {
                         <span>
-                            <a href="{{ programmingExercise.testRepositoryUri }}" target="_blank">Test</a>
+                            <a href="{{ exercise().testRepositoryUri }}" target="_blank">Test</a>
                         </span>
                     } @else {
                         <a [routerLink]="" (click)="downloadRepository('TESTS')"> <fa-icon [icon]="faDownload" /> Test </a>
@@ -57,44 +57,44 @@
             </div>
         </div>
     }
-    @if (displayTemplateUrls) {
+    @if (displayTemplateUrls()) {
         <div>
-            @if (programmingExercise.templateParticipation?.buildPlanId) {
+            @if (exercise().templateParticipation?.buildPlanId) {
                 <span>
                     @if (!localVCEnabled) {
-                        <a target="_blank" rel="noreferrer" href="{{ programmingExercise.templateParticipation!.buildPlanUrl }}">Template</a>
+                        <a target="_blank" rel="noreferrer" href="{{ exercise().templateParticipation!.buildPlanUrl }}">Template</a>
                     } @else {
-                        {{ programmingExercise.templateParticipation!.buildPlanId }}
+                        {{ exercise().templateParticipation!.buildPlanId }}
                     }
                 </span>
             }
             <br />
-            @if (programmingExercise.solutionParticipation?.buildPlanId) {
+            @if (exercise().solutionParticipation?.buildPlanId) {
                 <span>
                     @if (!localVCEnabled) {
-                        <a target="_blank" rel="noreferrer" href="{{ programmingExercise.solutionParticipation!.buildPlanUrl }}">Solution</a>
+                        <a target="_blank" rel="noreferrer" href="{{ exercise().solutionParticipation!.buildPlanUrl }}">Solution</a>
                     } @else {
-                        {{ programmingExercise.solutionParticipation!.buildPlanId }}
+                        {{ exercise().solutionParticipation!.buildPlanId }}
                     }
                 </span>
             }
             <br />
         </div>
     }
-    @if (displayEditorModus) {
+    @if (displayEditorModus()) {
         <div>
             <div class="d-flex justify-content-between">
                 <span class="colon-suffix" [jhiTranslate]="'artemisApp.programmingExercise.offlineIde'"></span>
-                <span [jhiTranslate]="programmingExercise.allowOfflineIde ? 'artemisApp.exercise.yes' : 'artemisApp.exercise.no'"></span>
+                <span [jhiTranslate]="exercise().allowOfflineIde ? 'artemisApp.exercise.yes' : 'artemisApp.exercise.no'"></span>
             </div>
             <div class="d-flex justify-content-between">
                 <span class="colon-suffix" [jhiTranslate]="'artemisApp.programmingExercise.onlineEditor'"></span>
-                <span [jhiTranslate]="programmingExercise.allowOnlineEditor ? 'artemisApp.exercise.yes' : 'artemisApp.exercise.no'"></span>
+                <span [jhiTranslate]="exercise().allowOnlineEditor ? 'artemisApp.exercise.yes' : 'artemisApp.exercise.no'"></span>
             </div>
             @if (onlineIdeEnabled) {
                 <div class="d-flex justify-content-between">
                     <span class="colon-suffix" [jhiTranslate]="'artemisApp.programmingExercise.onlineIde'"></span>
-                    <span [jhiTranslate]="programmingExercise.allowOnlineIde ? 'artemisApp.exercise.yes' : 'artemisApp.exercise.no'"></span>
+                    <span [jhiTranslate]="exercise().allowOnlineIde ? 'artemisApp.exercise.yes' : 'artemisApp.exercise.no'"></span>
                 </div>
             }
         </div>

src/main/webapp/app/exam/manage/exercise-groups/programming-exercise-cell/programming-exercise-group-cell.component.ts

@@ -1,8 +1,7 @@
-import { Component, Input, OnInit } from '@angular/core';
+import { Component, OnInit, inject, input } from '@angular/core';
 import { HttpResponse } from '@angular/common/http';
 import { ProgrammingExercise } from 'app/entities/programming/programming-exercise.model';
 import { ProgrammingExerciseParticipationType } from 'app/entities/programming/programming-exercise-participation.model';
-import { Exercise } from 'app/entities/exercise.model';
 import { ProfileService } from 'app/shared/layouts/profiles/profile.service';
 import { createBuildPlanUrl } from 'app/exercises/programming/shared/utils/programming-exercise.utils';
 import { ProgrammingExerciseInstructorRepositoryType, ProgrammingExerciseService } from 'app/exercises/programming/manage/services/programming-exercise.service';
@@ -17,53 +16,38 @@ import { PROFILE_LOCALVC, PROFILE_THEIA } from 'app/app.constants';
     styles: [':host{display: contents}'],
 })
 export class ProgrammingExerciseGroupCellComponent implements OnInit {
-    participationType = ProgrammingExerciseParticipationType;
+    private profileService = inject(ProfileService);
+    private programmingExerciseService = inject(ProgrammingExerciseService);
+    private alertService = inject(AlertService);
 
-    programmingExercise: ProgrammingExercise;
+    participationType = ProgrammingExerciseParticipationType;
 
     localVCEnabled = false;
     onlineIdeEnabled = false;
 
-    @Input()
-    displayShortName = false;
-    @Input()
-    displayRepositoryUri = false;
-    @Input()
-    displayTemplateUrls = false;
-    @Input()
-    displayEditorModus = false;
-
-    @Input()
-    set exercise(exercise: Exercise) {
-        this.programmingExercise = exercise as ProgrammingExercise;
-    }
+    displayShortName = input(false);
+    displayRepositoryUri = input(false);
+    displayTemplateUrls = input(false);
+    displayEditorModus = input(false);
+    exercise = input.required<ProgrammingExercise>();
 
     faDownload = faDownload;
 
-    constructor(
-        private profileService: ProfileService,
-        private programmingExerciseService: ProgrammingExerciseService,
-        private alertService: AlertService,
-    ) {}
-
     ngOnInit(): void {
         this.profileService.getProfileInfo().subscribe((profileInfo) => {
             this.localVCEnabled = profileInfo.activeProfiles.includes(PROFILE_LOCALVC);
             this.onlineIdeEnabled = profileInfo.activeProfiles.includes(PROFILE_THEIA);
-            if (this.programmingExercise.projectKey) {
-                if (this.programmingExercise.solutionParticipation?.buildPlanId) {
-                    this.programmingExercise.solutionParticipation!.buildPlanUrl = createBuildPlanUrl(
-                        profileInfo.buildPlanURLTemplate,
-                        this.programmingExercise.projectKey,
-                        this.programmingExercise.solutionParticipation.buildPlanId,
-                    );
+
+            const projectKey = this.exercise()?.projectKey;
+            if (projectKey) {
+                const solutionParticipation = this.exercise()?.solutionParticipation;
+                if (solutionParticipation?.buildPlanId) {
+                    solutionParticipation.buildPlanUrl = createBuildPlanUrl(profileInfo.buildPlanURLTemplate, projectKey, solutionParticipation.buildPlanId);
                 }
-                if (this.programmingExercise.templateParticipation?.buildPlanId) {
-                    this.programmingExercise.templateParticipation!.buildPlanUrl = createBuildPlanUrl(
-                        profileInfo.buildPlanURLTemplate,
-                        this.programmingExercise.projectKey,
-                        this.programmingExercise.templateParticipation.buildPlanId,
-                    );
+
+                const templateParticipation = this.exercise()?.templateParticipation;
+                if (templateParticipation?.buildPlanId) {
+                    templateParticipation.buildPlanUrl = createBuildPlanUrl(profileInfo.buildPlanURLTemplate, projectKey, templateParticipation.buildPlanId);
                 }
             }
         });
@@ -76,10 +60,11 @@ export class ProgrammingExerciseGroupCellComponent implements OnInit {
      *
      * @param repositoryType
      */
-    downloadRepository(repositoryType: ProgrammingExerciseInstructorRepositoryType) {
-        if (this.programmingExercise.id) {
+    downloadRepository(repositoryType: ProgrammingExerciseInstructorRepositoryType): void {
+        const programmingExerciseId = this.exercise()?.id;
+        if (programmingExerciseId) {
             // Repository type cannot be 'AUXILIARY' as auxiliary repositories are currently not supported for the local VCS.
-            this.programmingExerciseService.exportInstructorRepository(this.programmingExercise.id, repositoryType, undefined).subscribe((response: HttpResponse<Blob>) => {
+            this.programmingExerciseService.exportInstructorRepository(programmingExerciseId, repositoryType, undefined).subscribe((response: HttpResponse<Blob>) => {
                 downloadZipFileFromResponse(response);
                 this.alertService.success('artemisApp.programmingExercise.export.successMessageRepos');
             });

src/main/webapp/app/exam/manage/exercise-groups/quiz-exercise-cell/quiz-exercise-group-cell.component.html

@@ -1,3 +1,3 @@
-@if (quizExercise.type === exerciseType.QUIZ) {
-    {{ quizExercise.quizQuestions?.length || 0 }}
+@if (exercise().type === exerciseType.QUIZ) {
+    {{ exercise().quizQuestions?.length || 0 }}
 }