From 85274d304e8c1ec61deda3c092e17a24e401ead9 Mon Sep 17 00:00:00 2001 From: RaphaelKlein Date: Fri, 29 Nov 2024 17:13:03 +0100 Subject: [PATCH 01/21] push branch --- src/main/webapp/app/lti/lti13-select-content.component.ts | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/main/webapp/app/lti/lti13-select-content.component.ts b/src/main/webapp/app/lti/lti13-select-content.component.ts index f4afb5cca6b8..0ff8095f9dcf 100644 --- a/src/main/webapp/app/lti/lti13-select-content.component.ts +++ b/src/main/webapp/app/lti/lti13-select-content.component.ts @@ -8,6 +8,8 @@ import { DomSanitizer } from '@angular/platform-browser'; * and automatically submits a form with the relevant data. * According to LTI documentation auto submit form must be used. */ + +// push branch @Component({ selector: 'jhi-select-exercise', templateUrl: './lti13-select-content.component.html', From 41aa1f845b0a9bfb2630c73cc5f9ad0852b91c64 Mon Sep 17 00:00:00 2001 From: raphaelklein Date: Fri, 29 Nov 2024 17:15:56 +0100 Subject: [PATCH 02/21] Inject migration --- .../app/lti/lti13-select-content.component.ts | 13 +++++-------- 1 file changed, 5 insertions(+), 8 deletions(-) diff --git a/src/main/webapp/app/lti/lti13-select-content.component.ts b/src/main/webapp/app/lti/lti13-select-content.component.ts index 0ff8095f9dcf..639115f41308 100644 --- a/src/main/webapp/app/lti/lti13-select-content.component.ts +++ b/src/main/webapp/app/lti/lti13-select-content.component.ts @@ -1,4 +1,4 @@ -import { Component, ElementRef, NgZone, OnInit, SecurityContext, ViewChild } from '@angular/core'; +import { Component, ElementRef, NgZone, OnInit, SecurityContext, ViewChild, inject } from '@angular/core'; import { ActivatedRoute } from '@angular/router'; import { DomSanitizer } from '@angular/platform-browser'; @@ -9,12 +9,15 @@ import { DomSanitizer } from '@angular/platform-browser'; * According to LTI documentation auto submit form must be used. */ -// push branch @Component({ selector: 'jhi-select-exercise', templateUrl: './lti13-select-content.component.html', }) export class Lti13SelectContentComponent implements OnInit { + private route = inject(ActivatedRoute); + private sanitizer = inject(DomSanitizer); + private zone = inject(NgZone); + jwt: string; id: string; actionLink: string; @@ -23,12 +26,6 @@ export class Lti13SelectContentComponent implements OnInit { @ViewChild('deepLinkingForm', { static: false }) deepLinkingForm?: ElementRef; - constructor( - private route: ActivatedRoute, - private sanitizer: DomSanitizer, - private zone: NgZone, - ) {} - /** * Initializes the component. * - Retrieves query parameters from the route snapshot. From 56dae8ce9c1ff050872b98677a710df7da74f2ab Mon Sep 17 00:00:00 2001 From: raphaelklein Date: Fri, 29 Nov 2024 17:23:42 +0100 Subject: [PATCH 03/21] Standalone migration --- src/main/webapp/app/lti/lti-course-card.component.ts | 5 +++++ src/main/webapp/app/lti/lti.module.ts | 9 +++++++-- src/main/webapp/app/lti/lti13-deep-linking.component.ts | 8 ++++++++ .../app/lti/lti13-dynamic-registration.component.ts | 3 +++ .../webapp/app/lti/lti13-exercise-launch.component.ts | 3 +++ .../webapp/app/lti/lti13-select-content.component.ts | 5 +++++ src/main/webapp/app/lti/lti13-select-course.component.ts | 4 ++++ 7 files changed, 35 insertions(+), 2 deletions(-) diff --git a/src/main/webapp/app/lti/lti-course-card.component.ts b/src/main/webapp/app/lti/lti-course-card.component.ts index 1ccd137ebfd4..56d42201abdf 100644 --- a/src/main/webapp/app/lti/lti-course-card.component.ts +++ b/src/main/webapp/app/lti/lti-course-card.component.ts @@ -2,11 +2,16 @@ import { Component, Input, OnChanges } from '@angular/core'; import { Course } from 'app/entities/course.model'; import { ARTEMIS_DEFAULT_COLOR } from 'app/app.constants'; import { CachingStrategy } from 'app/shared/image/secured-image.component'; +import { RouterLink } from '@angular/router'; +import { NgStyle } from '@angular/common'; +import { ArtemisSharedModule } from 'app/shared/shared.module'; @Component({ selector: 'jhi-overview-lti-course-card', templateUrl: './lti-course-card.component.html', styleUrls: ['../overview/course-card.scss'], + standalone: true, + imports: [RouterLink, NgStyle, ArtemisSharedModule], }) export class LtiCourseCardComponent implements OnChanges { readonly ARTEMIS_DEFAULT_COLOR = ARTEMIS_DEFAULT_COLOR; diff --git a/src/main/webapp/app/lti/lti.module.ts b/src/main/webapp/app/lti/lti.module.ts index f9463398c64f..aa71f406cbaa 100644 --- a/src/main/webapp/app/lti/lti.module.ts +++ b/src/main/webapp/app/lti/lti.module.ts @@ -16,8 +16,13 @@ import { LtiCourseCardComponent } from 'app/lti/lti-course-card.component'; const LTI_LAUNCH_ROUTES = [...ltiLaunchState]; @NgModule({ - imports: [RouterModule.forChild(LTI_LAUNCH_ROUTES), ArtemisCoreModule, ArtemisSharedModule, FormsModule, ArtemisSharedComponentModule, ArtemisSharedLibsModule], - declarations: [ + imports: [ + RouterModule.forChild(LTI_LAUNCH_ROUTES), + ArtemisCoreModule, + ArtemisSharedModule, + FormsModule, + ArtemisSharedComponentModule, + ArtemisSharedLibsModule, Lti13ExerciseLaunchComponent, Lti13DynamicRegistrationComponent, Lti13DeepLinkingComponent, diff --git a/src/main/webapp/app/lti/lti13-deep-linking.component.ts b/src/main/webapp/app/lti/lti13-deep-linking.component.ts index 55be442a98f5..bfc245d5cf6a 100644 --- a/src/main/webapp/app/lti/lti13-deep-linking.component.ts +++ b/src/main/webapp/app/lti/lti13-deep-linking.component.ts @@ -10,10 +10,18 @@ import { Course } from 'app/entities/course.model'; import { AlertService } from 'app/core/util/alert.service'; import { onError } from 'app/shared/util/global.utils'; import { SessionStorageService } from 'ngx-webstorage'; +import { ArtemisSharedModule } from 'app/shared/shared.module'; +import { TranslateDirective } from '../shared/language/translate.directive'; +import { ArtemisSharedComponentModule } from '../shared/components/shared-component.module'; +import { ArtemisSharedCommonModule } from '../shared/shared-common.module'; +import { FaIconComponent } from '@fortawesome/angular-fontawesome'; +import { FormsModule } from '@angular/forms'; @Component({ selector: 'jhi-deep-linking', templateUrl: './lti13-deep-linking.component.html', + standalone: true, + imports: [ArtemisSharedModule, TranslateDirective, ArtemisSharedComponentModule, ArtemisSharedCommonModule, FaIconComponent, FormsModule], }) export class Lti13DeepLinkingComponent implements OnInit { courseId: number; diff --git a/src/main/webapp/app/lti/lti13-dynamic-registration.component.ts b/src/main/webapp/app/lti/lti13-dynamic-registration.component.ts index 7cc0091618bc..4cac59017f21 100644 --- a/src/main/webapp/app/lti/lti13-dynamic-registration.component.ts +++ b/src/main/webapp/app/lti/lti13-dynamic-registration.component.ts @@ -1,10 +1,13 @@ import { Component, OnInit } from '@angular/core'; import { ActivatedRoute } from '@angular/router'; import { HttpClient, HttpParams } from '@angular/common/http'; +import { TranslateDirective } from '../shared/language/translate.directive'; @Component({ selector: 'jhi-dynamic-registration', templateUrl: './lti13-dynamic-registration.component.html', + standalone: true, + imports: [TranslateDirective], }) export class Lti13DynamicRegistrationComponent implements OnInit { courseId: number; diff --git a/src/main/webapp/app/lti/lti13-exercise-launch.component.ts b/src/main/webapp/app/lti/lti13-exercise-launch.component.ts index 28605d6620e6..b0d7099eded9 100644 --- a/src/main/webapp/app/lti/lti13-exercise-launch.component.ts +++ b/src/main/webapp/app/lti/lti13-exercise-launch.component.ts @@ -6,6 +6,7 @@ import { captureException } from '@sentry/angular'; import { SessionStorageService } from 'ngx-webstorage'; import { LtiService } from 'app/shared/service/lti.service'; import { Theme, ThemeService } from 'app/core/theme/theme.service'; +import { TranslateDirective } from '../shared/language/translate.directive'; type LtiLaunchResponse = { targetLinkUri: string; @@ -16,6 +17,8 @@ type LtiLaunchResponse = { @Component({ selector: 'jhi-lti-exercise-launch', templateUrl: './lti13-exercise-launch.component.html', + standalone: true, + imports: [TranslateDirective], }) export class Lti13ExerciseLaunchComponent implements OnInit { isLaunching: boolean; diff --git a/src/main/webapp/app/lti/lti13-select-content.component.ts b/src/main/webapp/app/lti/lti13-select-content.component.ts index 639115f41308..d2a68ccf61ba 100644 --- a/src/main/webapp/app/lti/lti13-select-content.component.ts +++ b/src/main/webapp/app/lti/lti13-select-content.component.ts @@ -1,6 +1,9 @@ import { Component, ElementRef, NgZone, OnInit, SecurityContext, ViewChild, inject } from '@angular/core'; import { ActivatedRoute } from '@angular/router'; import { DomSanitizer } from '@angular/platform-browser'; +import { TranslateDirective } from '../shared/language/translate.directive'; +import { FormsModule } from '@angular/forms'; +import { ArtemisSharedPipesModule } from '../shared/pipes/shared-pipes.module'; /** * Component responsible for sending deep linking content. @@ -12,6 +15,8 @@ import { DomSanitizer } from '@angular/platform-browser'; @Component({ selector: 'jhi-select-exercise', templateUrl: './lti13-select-content.component.html', + standalone: true, + imports: [TranslateDirective, FormsModule, ArtemisSharedPipesModule], }) export class Lti13SelectContentComponent implements OnInit { private route = inject(ActivatedRoute); diff --git a/src/main/webapp/app/lti/lti13-select-course.component.ts b/src/main/webapp/app/lti/lti13-select-course.component.ts index 1032bde2f15f..69fe37024b52 100644 --- a/src/main/webapp/app/lti/lti13-select-course.component.ts +++ b/src/main/webapp/app/lti/lti13-select-course.component.ts @@ -3,10 +3,14 @@ import { CourseManagementService } from '../course/manage/course-management.serv import { SessionStorageService } from 'ngx-webstorage'; import { OnlineCourseDtoModel } from 'app/lti/online-course-dto.model'; import { AlertService } from 'app/core/util/alert.service'; +import { LtiCourseCardComponent } from './lti-course-card.component'; +import { TranslateDirective } from '../shared/language/translate.directive'; @Component({ selector: 'jhi-lti-courses-overview', templateUrl: './lti13-select-course.component.html', + standalone: true, + imports: [LtiCourseCardComponent, TranslateDirective], }) export class LtiCoursesComponent implements OnInit { public courses: OnlineCourseDtoModel[]; From 58809be4d6f9f231bafc4e3a8ebe78c9cd994e67 Mon Sep 17 00:00:00 2001 From: raphaelklein Date: Fri, 29 Nov 2024 18:03:04 +0100 Subject: [PATCH 04/21] inject launch component --- .../app/lti/lti13-deep-linking.component.ts | 21 +++++++++---------- .../lti/lti13-exercise-launch.component.ts | 3 ++- 2 files changed, 12 insertions(+), 12 deletions(-) diff --git a/src/main/webapp/app/lti/lti13-deep-linking.component.ts b/src/main/webapp/app/lti/lti13-deep-linking.component.ts index bfc245d5cf6a..2ac4c0aa9098 100644 --- a/src/main/webapp/app/lti/lti13-deep-linking.component.ts +++ b/src/main/webapp/app/lti/lti13-deep-linking.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 { CourseManagementService } from 'app/course/manage/course-management.service'; import { Exercise } from 'app/entities/exercise.model'; @@ -24,6 +24,15 @@ import { FormsModule } from '@angular/forms'; imports: [ArtemisSharedModule, TranslateDirective, ArtemisSharedComponentModule, ArtemisSharedCommonModule, FaIconComponent, FormsModule], }) export class Lti13DeepLinkingComponent implements OnInit { + route = inject(ActivatedRoute); + private sortService = inject(SortService); + private courseManagementService = inject(CourseManagementService); + private http = inject(HttpClient); + private accountService = inject(AccountService); + private router = inject(Router); + private alertService = inject(AlertService); + private sessionStorageService = inject(SessionStorageService); + courseId: number; exercises: Exercise[]; selectedExercises?: Set = new Set(); @@ -37,16 +46,6 @@ export class Lti13DeepLinkingComponent implements OnInit { faSort = faSort; faExclamationTriangle = faExclamationTriangle; faWrench = faWrench; - constructor( - public route: ActivatedRoute, - private sortService: SortService, - private courseManagementService: CourseManagementService, - private http: HttpClient, - private accountService: AccountService, - private router: Router, - private alertService: AlertService, - private sessionStorageService: SessionStorageService, - ) {} /** * Initializes the component. diff --git a/src/main/webapp/app/lti/lti13-exercise-launch.component.ts b/src/main/webapp/app/lti/lti13-exercise-launch.component.ts index b0d7099eded9..e109cae038fa 100644 --- a/src/main/webapp/app/lti/lti13-exercise-launch.component.ts +++ b/src/main/webapp/app/lti/lti13-exercise-launch.component.ts @@ -1,5 +1,6 @@ import { Component, OnInit } from '@angular/core'; import { ActivatedRoute, Router } from '@angular/router'; +import { CommonModule } from '@angular/common'; import { HttpClient, HttpHeaders, HttpParams } from '@angular/common/http'; import { AccountService } from 'app/core/auth/account.service'; import { captureException } from '@sentry/angular'; @@ -18,7 +19,7 @@ type LtiLaunchResponse = { selector: 'jhi-lti-exercise-launch', templateUrl: './lti13-exercise-launch.component.html', standalone: true, - imports: [TranslateDirective], + imports: [TranslateDirective, CommonModule], }) export class Lti13ExerciseLaunchComponent implements OnInit { isLaunching: boolean; From 29249dfbbc595355a696efca3d466c8f2471e00a Mon Sep 17 00:00:00 2001 From: raphaelklein Date: Fri, 29 Nov 2024 18:06:29 +0100 Subject: [PATCH 05/21] inject dynamic reg comp --- .../app/lti/lti13-dynamic-registration.component.ts | 10 ++++------ 1 file changed, 4 insertions(+), 6 deletions(-) diff --git a/src/main/webapp/app/lti/lti13-dynamic-registration.component.ts b/src/main/webapp/app/lti/lti13-dynamic-registration.component.ts index 4cac59017f21..11fc898d8b96 100644 --- a/src/main/webapp/app/lti/lti13-dynamic-registration.component.ts +++ b/src/main/webapp/app/lti/lti13-dynamic-registration.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit } from '@angular/core'; +import { Component, OnInit, inject } from '@angular/core'; import { ActivatedRoute } from '@angular/router'; import { HttpClient, HttpParams } from '@angular/common/http'; import { TranslateDirective } from '../shared/language/translate.directive'; @@ -10,15 +10,13 @@ import { TranslateDirective } from '../shared/language/translate.directive'; imports: [TranslateDirective], }) export class Lti13DynamicRegistrationComponent implements OnInit { + private route = inject(ActivatedRoute); + private http = inject(HttpClient); + courseId: number; isRegistering = true; registeredSuccessfully: boolean; - constructor( - private route: ActivatedRoute, - private http: HttpClient, - ) {} - /** * perform LTI 13 dynamic registration */ From 71769f5c2ba76cb835b960a57c1051d4320ad87a Mon Sep 17 00:00:00 2001 From: raphaelklein Date: Fri, 29 Nov 2024 18:12:30 +0100 Subject: [PATCH 06/21] signal for course card --- src/main/webapp/app/lti/lti-course-card.component.html | 8 ++++---- src/main/webapp/app/lti/lti-course-card.component.ts | 6 +++--- 2 files changed, 7 insertions(+), 7 deletions(-) diff --git a/src/main/webapp/app/lti/lti-course-card.component.html b/src/main/webapp/app/lti/lti-course-card.component.html index 3171fef4176d..0fccfe0f3902 100644 --- a/src/main/webapp/app/lti/lti-course-card.component.html +++ b/src/main/webapp/app/lti/lti-course-card.component.html @@ -1,6 +1,6 @@
- @if (course.courseIcon) { - + @if (course().courseIcon) { + }
- {{ course.title + ' (' + course.shortName + ')' }} + {{ course().title + ' (' + course().shortName + ')' }}
diff --git a/src/main/webapp/app/lti/lti-course-card.component.ts b/src/main/webapp/app/lti/lti-course-card.component.ts index 56d42201abdf..6fe432484e1a 100644 --- a/src/main/webapp/app/lti/lti-course-card.component.ts +++ b/src/main/webapp/app/lti/lti-course-card.component.ts @@ -1,4 +1,4 @@ -import { Component, Input, OnChanges } from '@angular/core'; +import { Component, OnChanges, input } from '@angular/core'; import { Course } from 'app/entities/course.model'; import { ARTEMIS_DEFAULT_COLOR } from 'app/app.constants'; import { CachingStrategy } from 'app/shared/image/secured-image.component'; @@ -15,11 +15,11 @@ import { ArtemisSharedModule } from 'app/shared/shared.module'; }) export class LtiCourseCardComponent implements OnChanges { readonly ARTEMIS_DEFAULT_COLOR = ARTEMIS_DEFAULT_COLOR; - @Input() course: Course; + course = input(); CachingStrategy = CachingStrategy; courseColor: string; ngOnChanges() { - this.courseColor = this.course.color || this.ARTEMIS_DEFAULT_COLOR; + this.courseColor = this.course().color || this.ARTEMIS_DEFAULT_COLOR; } } From 39333d61bed432dc38a10444bbb3f8c2062b3c54 Mon Sep 17 00:00:00 2001 From: raphaelklein Date: Sat, 30 Nov 2024 21:04:38 +0100 Subject: [PATCH 07/21] Inject for lti13 comps --- .../lti/lti13-exercise-launch.component.ts | 20 +++++++++---------- .../app/lti/lti13-select-course.component.ts | 11 +++++----- 2 files changed, 15 insertions(+), 16 deletions(-) diff --git a/src/main/webapp/app/lti/lti13-exercise-launch.component.ts b/src/main/webapp/app/lti/lti13-exercise-launch.component.ts index e109cae038fa..83c4887fdd18 100644 --- a/src/main/webapp/app/lti/lti13-exercise-launch.component.ts +++ b/src/main/webapp/app/lti/lti13-exercise-launch.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 { CommonModule } from '@angular/common'; import { HttpClient, HttpHeaders, HttpParams } from '@angular/common/http'; @@ -22,17 +22,17 @@ type LtiLaunchResponse = { imports: [TranslateDirective, CommonModule], }) export class Lti13ExerciseLaunchComponent implements OnInit { + private route = inject(ActivatedRoute); + private http = inject(HttpClient); + private accountService = inject(AccountService); + private router = inject(Router); + private sessionStorageService = inject(SessionStorageService); + private ltiService = inject(LtiService); + private themeService = inject(ThemeService); + isLaunching: boolean; - constructor( - private route: ActivatedRoute, - private http: HttpClient, - private accountService: AccountService, - private router: Router, - private sessionStorageService: SessionStorageService, - private ltiService: LtiService, - private themeService: ThemeService, - ) { + constructor() { this.isLaunching = true; } diff --git a/src/main/webapp/app/lti/lti13-select-course.component.ts b/src/main/webapp/app/lti/lti13-select-course.component.ts index 69fe37024b52..f9633a91315f 100644 --- a/src/main/webapp/app/lti/lti13-select-course.component.ts +++ b/src/main/webapp/app/lti/lti13-select-course.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit } from '@angular/core'; +import { Component, OnInit, inject } from '@angular/core'; import { CourseManagementService } from '../course/manage/course-management.service'; import { SessionStorageService } from 'ngx-webstorage'; import { OnlineCourseDtoModel } from 'app/lti/online-course-dto.model'; @@ -13,12 +13,11 @@ import { TranslateDirective } from '../shared/language/translate.directive'; imports: [LtiCourseCardComponent, TranslateDirective], }) export class LtiCoursesComponent implements OnInit { + private courseService = inject(CourseManagementService); + private sessionStorageService = inject(SessionStorageService); + private alertService = inject(AlertService); + public courses: OnlineCourseDtoModel[]; - constructor( - private courseService: CourseManagementService, - private sessionStorageService: SessionStorageService, - private alertService: AlertService, - ) {} async ngOnInit() { this.loadAndFilterCourses(); From e751ddd369e274ca0868a2ac34df58b2f4863106 Mon Sep 17 00:00:00 2001 From: raphaelklein Date: Sat, 30 Nov 2024 21:12:19 +0100 Subject: [PATCH 08/21] Inject for admin lti config --- .../edit-lti-configuration.component.ts | 14 ++++++-------- .../lti-configuration.component.ts | 16 +++++++--------- .../lti-configuration.service.ts | 4 ++-- 3 files changed, 15 insertions(+), 19 deletions(-) diff --git a/src/main/webapp/app/admin/lti-configuration/edit-lti-configuration.component.ts b/src/main/webapp/app/admin/lti-configuration/edit-lti-configuration.component.ts index b579f2fc822a..6f65f9c87969 100644 --- a/src/main/webapp/app/admin/lti-configuration/edit-lti-configuration.component.ts +++ b/src/main/webapp/app/admin/lti-configuration/edit-lti-configuration.component.ts @@ -1,5 +1,5 @@ import { AlertService } from 'app/core/util/alert.service'; -import { Component, OnInit } from '@angular/core'; +import { Component, OnInit, inject } from '@angular/core'; import { ActivatedRoute, Router } from '@angular/router'; import { finalize } from 'rxjs'; import { FormControl, FormGroup } from '@angular/forms'; @@ -12,6 +12,11 @@ import { LtiConfigurationService } from 'app/admin/lti-configuration/lti-configu templateUrl: './edit-lti-configuration.component.html', }) export class EditLtiConfigurationComponent implements OnInit { + private route = inject(ActivatedRoute); + private ltiConfigurationService = inject(LtiConfigurationService); + private router = inject(Router); + private alertService = inject(AlertService); + platform: LtiPlatformConfiguration; platformConfigurationForm: FormGroup; @@ -22,13 +27,6 @@ export class EditLtiConfigurationComponent implements OnInit { faSave = faSave; faPlus = faPlus; - constructor( - private route: ActivatedRoute, - private ltiConfigurationService: LtiConfigurationService, - private router: Router, - private alertService: AlertService, - ) {} - /** * Gets the configuration for the course encoded in the route and prepares the form */ diff --git a/src/main/webapp/app/admin/lti-configuration/lti-configuration.component.ts b/src/main/webapp/app/admin/lti-configuration/lti-configuration.component.ts index 2d978673adbc..a18fbb8f602c 100644 --- a/src/main/webapp/app/admin/lti-configuration/lti-configuration.component.ts +++ b/src/main/webapp/app/admin/lti-configuration/lti-configuration.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 { Course } from 'app/entities/course.model'; import { faExclamationTriangle, faPencilAlt, faPlus, faSort, faTrash, faWrench } from '@fortawesome/free-solid-svg-icons'; @@ -17,6 +17,12 @@ import { combineLatest } from 'rxjs'; templateUrl: './lti-configuration.component.html', }) export class LtiConfigurationComponent implements OnInit { + private router = inject(Router); + private ltiConfigurationService = inject(LtiConfigurationService); + private sortService = inject(SortService); + private alertService = inject(AlertService); + private activatedRoute = inject(ActivatedRoute); + course: Course; platforms: LtiPlatformConfiguration[]; ascending!: boolean; @@ -40,14 +46,6 @@ export class LtiConfigurationComponent implements OnInit { private dialogErrorSource = new Subject(); dialogError$ = this.dialogErrorSource.asObservable(); - constructor( - private router: Router, - private ltiConfigurationService: LtiConfigurationService, - private sortService: SortService, - private alertService: AlertService, - private activatedRoute: ActivatedRoute, - ) {} - /** * Gets the configuration for the course encoded in the route and fetches the exercises */ diff --git a/src/main/webapp/app/admin/lti-configuration/lti-configuration.service.ts b/src/main/webapp/app/admin/lti-configuration/lti-configuration.service.ts index c6484edd768f..277d2a6b7031 100644 --- a/src/main/webapp/app/admin/lti-configuration/lti-configuration.service.ts +++ b/src/main/webapp/app/admin/lti-configuration/lti-configuration.service.ts @@ -1,4 +1,4 @@ -import { Injectable } from '@angular/core'; +import { Injectable, inject } from '@angular/core'; import { HttpClient, HttpParams, HttpResponse } from '@angular/common/http'; import { Observable } from 'rxjs'; import { LtiPlatformConfiguration } from 'app/admin/lti-configuration/lti-configuration.model'; @@ -6,7 +6,7 @@ import { createRequestOption } from 'app/shared/util/request.util'; @Injectable({ providedIn: 'root' }) export class LtiConfigurationService { - constructor(private http: HttpClient) {} + private http = inject(HttpClient); /** * Sends a GET request to retrieve all lti platform configurations From cfc30cc79e437dfa9cc3ba1f5aa7a8ee3c7010da Mon Sep 17 00:00:00 2001 From: raphaelklein Date: Sat, 30 Nov 2024 21:33:27 +0100 Subject: [PATCH 09/21] Inject for course lti comps --- .../course-lti-configuration.component.ts | 12 +++++------- .../edit-course-lti-configuration.component.ts | 14 ++++++-------- 2 files changed, 11 insertions(+), 15 deletions(-) diff --git a/src/main/webapp/app/course/manage/course-lti-configuration/course-lti-configuration.component.ts b/src/main/webapp/app/course/manage/course-lti-configuration/course-lti-configuration.component.ts index d92f4719d383..9886968247c3 100644 --- a/src/main/webapp/app/course/manage/course-lti-configuration/course-lti-configuration.component.ts +++ b/src/main/webapp/app/course/manage/course-lti-configuration/course-lti-configuration.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit } from '@angular/core'; +import { Component, OnInit, inject } from '@angular/core'; import { ActivatedRoute } from '@angular/router'; import { Course } from 'app/entities/course.model'; import { OnlineCourseConfiguration } from 'app/entities/online-course-configuration.model'; @@ -12,6 +12,10 @@ import { SortService } from 'app/shared/service/sort.service'; templateUrl: './course-lti-configuration.component.html', }) export class CourseLtiConfigurationComponent implements OnInit { + private route = inject(ActivatedRoute); + private sortService = inject(SortService); + private courseManagementService = inject(CourseManagementService); + protected readonly Object = Object; course: Course; @@ -29,12 +33,6 @@ export class CourseLtiConfigurationComponent implements OnInit { faExclamationTriangle = faExclamationTriangle; faWrench = faWrench; - constructor( - private route: ActivatedRoute, - private sortService: SortService, - private courseManagementService: CourseManagementService, - ) {} - /** * Gets the configuration for the course encoded in the route and fetches the exercises */ diff --git a/src/main/webapp/app/course/manage/course-lti-configuration/edit-course-lti-configuration.component.ts b/src/main/webapp/app/course/manage/course-lti-configuration/edit-course-lti-configuration.component.ts index ed940d582462..df480a6941c1 100644 --- a/src/main/webapp/app/course/manage/course-lti-configuration/edit-course-lti-configuration.component.ts +++ b/src/main/webapp/app/course/manage/course-lti-configuration/edit-course-lti-configuration.component.ts @@ -1,4 +1,4 @@ -import { Component, ElementRef, OnInit, ViewChild } from '@angular/core'; +import { Component, ElementRef, OnInit, ViewChild, inject } from '@angular/core'; import { ActivatedRoute, Router } from '@angular/router'; import { Course } from 'app/entities/course.model'; import { finalize } from 'rxjs'; @@ -19,6 +19,11 @@ import { combineLatest } from 'rxjs'; templateUrl: './edit-course-lti-configuration.component.html', }) export class EditCourseLtiConfigurationComponent implements OnInit { + private route = inject(ActivatedRoute); + private courseService = inject(CourseManagementService); + private router = inject(Router); + private ltiConfigurationService = inject(LtiConfigurationService); + @ViewChild('scrollableContent') scrollableContent: ElementRef; course: Course; @@ -37,13 +42,6 @@ export class EditCourseLtiConfigurationComponent implements OnInit { faBan = faBan; faSave = faSave; - constructor( - private route: ActivatedRoute, - private courseService: CourseManagementService, - private router: Router, - private ltiConfigurationService: LtiConfigurationService, - ) {} - /** * Gets the configuration for the course encoded in the route and prepares the form */ From ad4c74bbe8c53903a820045da826569d053b585e Mon Sep 17 00:00:00 2001 From: raphaelklein Date: Sat, 30 Nov 2024 21:36:07 +0100 Subject: [PATCH 10/21] Overview lti comps --- .../lti-initializer-modal.component.ts | 14 ++++++-------- .../lti-initializer.component.ts | 18 ++++++++---------- 2 files changed, 14 insertions(+), 18 deletions(-) diff --git a/src/main/webapp/app/overview/exercise-details/lti-initializer-modal.component.ts b/src/main/webapp/app/overview/exercise-details/lti-initializer-modal.component.ts index 009f1fe00e23..0bb7a8b46d5a 100644 --- a/src/main/webapp/app/overview/exercise-details/lti-initializer-modal.component.ts +++ b/src/main/webapp/app/overview/exercise-details/lti-initializer-modal.component.ts @@ -1,4 +1,4 @@ -import { Component } from '@angular/core'; +import { Component, inject } from '@angular/core'; import { ActivatedRoute, Router } from '@angular/router'; import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap'; import { AlertService } from 'app/core/util/alert.service'; @@ -8,19 +8,17 @@ import { AlertService } from 'app/core/util/alert.service'; templateUrl: './lti-initializer-modal.component.html', }) export class LtiInitializerModalComponent { + private activeModal = inject(NgbActiveModal); + private alertService = inject(AlertService); + private router = inject(Router); + private activatedRoute = inject(ActivatedRoute); + password: string; loginName: string; passwordResetLocation = ['account', 'reset', 'request']; readAndUnderstood = false; - constructor( - private activeModal: NgbActiveModal, - private alertService: AlertService, - private router: Router, - private activatedRoute: ActivatedRoute, - ) {} - /** * Closes the dialog, removes the query parameter and shows a helper message */ diff --git a/src/main/webapp/app/overview/exercise-details/lti-initializer.component.ts b/src/main/webapp/app/overview/exercise-details/lti-initializer.component.ts index 01f6eb257308..fbd21be21bb9 100644 --- a/src/main/webapp/app/overview/exercise-details/lti-initializer.component.ts +++ b/src/main/webapp/app/overview/exercise-details/lti-initializer.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit } from '@angular/core'; +import { Component, OnInit, inject } from '@angular/core'; import { NgbModal, NgbModalRef } from '@ng-bootstrap/ng-bootstrap'; import { LtiInitializerModalComponent } from 'app/overview/exercise-details/lti-initializer-modal.component'; import { UserService } from 'app/core/user/user.service'; @@ -11,16 +11,14 @@ import { AccountService } from 'app/core/auth/account.service'; template: '', }) export class LtiInitializerComponent implements OnInit { - modalRef: NgbModalRef | undefined; + private modalService = inject(NgbModal); + private userService = inject(UserService); + private alertService = inject(AlertService); + private router = inject(Router); + private activatedRoute = inject(ActivatedRoute); + private accountService = inject(AccountService); - constructor( - private modalService: NgbModal, - private userService: UserService, - private alertService: AlertService, - private router: Router, - private activatedRoute: ActivatedRoute, - private accountService: AccountService, - ) {} + modalRef: NgbModalRef | undefined; ngOnInit() { this.activatedRoute.queryParams.subscribe((queryParams) => { From 13bf094fbc2bbb15c078b88a2121377b4d4a5ab3 Mon Sep 17 00:00:00 2001 From: raphaelklein Date: Sun, 1 Dec 2024 17:59:23 +0100 Subject: [PATCH 11/21] fix input --- src/main/webapp/app/lti/lti-course-card.component.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/main/webapp/app/lti/lti-course-card.component.ts b/src/main/webapp/app/lti/lti-course-card.component.ts index 6fe432484e1a..9b3c0e69f074 100644 --- a/src/main/webapp/app/lti/lti-course-card.component.ts +++ b/src/main/webapp/app/lti/lti-course-card.component.ts @@ -15,7 +15,7 @@ import { ArtemisSharedModule } from 'app/shared/shared.module'; }) export class LtiCourseCardComponent implements OnChanges { readonly ARTEMIS_DEFAULT_COLOR = ARTEMIS_DEFAULT_COLOR; - course = input(); + readonly course = input.required(); CachingStrategy = CachingStrategy; courseColor: string; From c75261191b92cafafcb32aee13955e74cd34a9c4 Mon Sep 17 00:00:00 2001 From: raphaelklein Date: Sun, 1 Dec 2024 18:40:56 +0100 Subject: [PATCH 12/21] signals input course card fix --- .../webapp/app/lti/lti-course-card.component.html | 14 +++++++------- .../webapp/app/lti/lti-course-card.component.ts | 5 +++-- 2 files changed, 10 insertions(+), 9 deletions(-) diff --git a/src/main/webapp/app/lti/lti-course-card.component.html b/src/main/webapp/app/lti/lti-course-card.component.html index 0fccfe0f3902..fe099147655e 100644 --- a/src/main/webapp/app/lti/lti-course-card.component.html +++ b/src/main/webapp/app/lti/lti-course-card.component.html @@ -1,21 +1,21 @@
- +
- @if (course().courseIcon) { - - } + + +
- {{ course().title + ' (' + course().shortName + ')' }} + {{ course()?.title + ' (' + course()?.shortName + ')' }}
diff --git a/src/main/webapp/app/lti/lti-course-card.component.ts b/src/main/webapp/app/lti/lti-course-card.component.ts index 9b3c0e69f074..f415284f0785 100644 --- a/src/main/webapp/app/lti/lti-course-card.component.ts +++ b/src/main/webapp/app/lti/lti-course-card.component.ts @@ -15,11 +15,12 @@ import { ArtemisSharedModule } from 'app/shared/shared.module'; }) export class LtiCourseCardComponent implements OnChanges { readonly ARTEMIS_DEFAULT_COLOR = ARTEMIS_DEFAULT_COLOR; - readonly course = input.required(); + course = input(); CachingStrategy = CachingStrategy; courseColor: string; ngOnChanges() { - this.courseColor = this.course().color || this.ARTEMIS_DEFAULT_COLOR; + const courseValue = this.course(); + this.courseColor = courseValue?.color || this.ARTEMIS_DEFAULT_COLOR; } } From cb1a74c389bf37ac630b247838cea2c00fb1ff5f Mon Sep 17 00:00:00 2001 From: raphaelklein Date: Tue, 3 Dec 2024 14:06:28 +0100 Subject: [PATCH 13/21] Fix tests --- .../app/lti/lti-course-card.component.ts | 12 ++++++---- .../lti/lti-course-card.component.spec.ts | 23 ++++++++++++++----- 2 files changed, 24 insertions(+), 11 deletions(-) diff --git a/src/main/webapp/app/lti/lti-course-card.component.ts b/src/main/webapp/app/lti/lti-course-card.component.ts index f415284f0785..0ddcc9b9ad3b 100644 --- a/src/main/webapp/app/lti/lti-course-card.component.ts +++ b/src/main/webapp/app/lti/lti-course-card.component.ts @@ -1,4 +1,4 @@ -import { Component, OnChanges, input } from '@angular/core'; +import { Component, effect, input } from '@angular/core'; import { Course } from 'app/entities/course.model'; import { ARTEMIS_DEFAULT_COLOR } from 'app/app.constants'; import { CachingStrategy } from 'app/shared/image/secured-image.component'; @@ -13,14 +13,16 @@ import { ArtemisSharedModule } from 'app/shared/shared.module'; standalone: true, imports: [RouterLink, NgStyle, ArtemisSharedModule], }) -export class LtiCourseCardComponent implements OnChanges { +export class LtiCourseCardComponent { readonly ARTEMIS_DEFAULT_COLOR = ARTEMIS_DEFAULT_COLOR; course = input(); CachingStrategy = CachingStrategy; courseColor: string; - ngOnChanges() { - const courseValue = this.course(); - this.courseColor = courseValue?.color || this.ARTEMIS_DEFAULT_COLOR; + constructor() { + effect(() => { + const courseValue = this.course(); + this.courseColor = courseValue?.color || this.ARTEMIS_DEFAULT_COLOR; + }); } } diff --git a/src/test/javascript/spec/component/lti/lti-course-card.component.spec.ts b/src/test/javascript/spec/component/lti/lti-course-card.component.spec.ts index 8bc2ffb37147..32a42acd6a4f 100644 --- a/src/test/javascript/spec/component/lti/lti-course-card.component.spec.ts +++ b/src/test/javascript/spec/component/lti/lti-course-card.component.spec.ts @@ -1,5 +1,8 @@ import { ComponentFixture, TestBed } from '@angular/core/testing'; import { LtiCourseCardComponent } from 'app/lti/lti-course-card.component'; +import { ARTEMIS_DEFAULT_COLOR } from 'app/app.constants'; +import { ActivatedRoute } from '@angular/router'; +import { of } from 'rxjs'; describe('LtiCourseCardComponent', () => { let component: LtiCourseCardComponent; @@ -7,7 +10,15 @@ describe('LtiCourseCardComponent', () => { beforeEach(async () => { await TestBed.configureTestingModule({ - declarations: [LtiCourseCardComponent], + imports: [LtiCourseCardComponent], + providers: [ + { + provide: ActivatedRoute, + useValue: { + params: of({}), + }, + }, + ], }).compileComponents(); fixture = TestBed.createComponent(LtiCourseCardComponent); @@ -15,19 +26,19 @@ describe('LtiCourseCardComponent', () => { }); it('should create', () => { + fixture.detectChanges(); expect(component).toBeTruthy(); }); it('should set default color if no color is specified in course', () => { - component.course = { id: 1, shortName: 'lti-course', title: 'LTI COURSE' }; - component.ngOnChanges(); - expect(component.courseColor).toBe(component.ARTEMIS_DEFAULT_COLOR); + fixture.detectChanges(); + expect(component.courseColor).toBe(ARTEMIS_DEFAULT_COLOR); }); it('should use course color if specified', () => { const testColor = '#123456'; - component.course = { id: 1, shortName: 'lti-course', title: 'LTI COURSE', color: testColor }; - component.ngOnChanges(); + fixture.componentRef.setInput('course', { id: 1, shortName: 'lti-course', title: 'LTI COURSE', color: testColor }); + fixture.detectChanges(); expect(component.courseColor).toBe(testColor); }); }); From 4fc3c750a628edba9079df17be50433fdd975703 Mon Sep 17 00:00:00 2001 From: raphaelklein Date: Tue, 3 Dec 2024 14:51:58 +0100 Subject: [PATCH 14/21] Fix tests 2 --- .../lti/lti13-deep-linking.component.spec.ts | 30 ++++++++++++++----- .../lti13-select-content.component.spec.ts | 28 +++++++++++++---- 2 files changed, 44 insertions(+), 14 deletions(-) diff --git a/src/test/javascript/spec/component/lti/lti13-deep-linking.component.spec.ts b/src/test/javascript/spec/component/lti/lti13-deep-linking.component.spec.ts index 69e22cff2c96..8298bae9a950 100644 --- a/src/test/javascript/spec/component/lti/lti13-deep-linking.component.spec.ts +++ b/src/test/javascript/spec/component/lti/lti13-deep-linking.component.spec.ts @@ -6,16 +6,19 @@ import { CourseManagementService } from 'app/course/manage/course-management.ser import { AccountService } from 'app/core/auth/account.service'; import { SortService } from 'app/shared/service/sort.service'; import { of, throwError } from 'rxjs'; -import { ArtemisTranslatePipe } from 'app/shared/pipes/artemis-translate.pipe'; -import { MockPipe } from 'ng-mocks'; -import { User } from 'app/core/user/user.model'; -import { Course } from 'app/entities/course.model'; -import { Exercise, ExerciseType } from 'app/entities/exercise.model'; -import { HelpIconComponent } from 'app/shared/components/help-icon.component'; -import { ArtemisDatePipe } from 'app/shared/pipes/artemis-date.pipe'; import { AlertService } from 'app/core/util/alert.service'; import { MockSyncStorage } from '../../helpers/mocks/service/mock-sync-storage.service'; import { SessionStorageService } from 'ngx-webstorage'; +import { Exercise, ExerciseType } from 'app/entities/exercise.model'; +import { Course } from 'app/entities/course.model'; +import { User } from 'app/core/user/user.model'; +import { TranslateLoader, TranslateModule, TranslateService } from '@ngx-translate/core'; +import { HttpClientTestingModule } from '@angular/common/http/testing'; +import { TranslateHttpLoader } from '@ngx-translate/http-loader'; + +function HttpLoaderFactory(http: HttpClient) { + return new TranslateHttpLoader(http); +} describe('Lti13DeepLinkingComponent', () => { let component: Lti13DeepLinkingComponent; @@ -38,7 +41,17 @@ describe('Lti13DeepLinkingComponent', () => { activatedRouteMock = { params: of({ courseId: '123' }) }; TestBed.configureTestingModule({ - declarations: [Lti13DeepLinkingComponent, MockPipe(ArtemisTranslatePipe), HelpIconComponent, MockPipe(ArtemisDatePipe)], + imports: [ + Lti13DeepLinkingComponent, + HttpClientTestingModule, + TranslateModule.forRoot({ + loader: { + provide: TranslateLoader, + useFactory: HttpLoaderFactory, + deps: [HttpClient], + }, + }), + ], providers: [ { provide: ActivatedRoute, useValue: activatedRouteMock }, { provide: Router, useValue: routerMock }, @@ -48,6 +61,7 @@ describe('Lti13DeepLinkingComponent', () => { { provide: SortService, useValue: sortServiceMock }, { provide: SessionStorageService, useClass: MockSyncStorage }, { provide: AlertService, useValue: alertServiceMock }, + TranslateService, ], }).compileComponents(); jest.spyOn(console, 'error').mockImplementation(() => {}); diff --git a/src/test/javascript/spec/component/lti/lti13-select-content.component.spec.ts b/src/test/javascript/spec/component/lti/lti13-select-content.component.spec.ts index f4715f47f7b3..d0b6b6714201 100644 --- a/src/test/javascript/spec/component/lti/lti13-select-content.component.spec.ts +++ b/src/test/javascript/spec/component/lti/lti13-select-content.component.spec.ts @@ -3,9 +3,14 @@ import { ComponentFixture, TestBed, fakeAsync, tick, waitForAsync } from '@angul import { ActivatedRoute } from '@angular/router'; import { FormBuilder, FormsModule, ReactiveFormsModule } from '@angular/forms'; import { of } from 'rxjs'; -import { ArtemisTranslatePipe } from 'app/shared/pipes/artemis-translate.pipe'; -import { SafeResourceUrlPipe } from 'app/shared/pipes/safe-resource-url.pipe'; -import { MockPipe } from 'ng-mocks'; +import { TranslateLoader, TranslateModule, TranslateService } from '@ngx-translate/core'; +import { HttpClientTestingModule } from '@angular/common/http/testing'; +import { TranslateHttpLoader } from '@ngx-translate/http-loader'; +import { HttpClient } from '@angular/common/http'; + +function HttpLoaderFactory(http: HttpClient) { + return new TranslateHttpLoader(http); +} describe('Lti13SelectContentComponent', () => { let component: Lti13SelectContentComponent; @@ -23,9 +28,20 @@ describe('Lti13SelectContentComponent', () => { }; TestBed.configureTestingModule({ - imports: [ReactiveFormsModule, FormsModule], - declarations: [Lti13SelectContentComponent, MockPipe(ArtemisTranslatePipe), MockPipe(SafeResourceUrlPipe)], - providers: [FormBuilder, { provide: ActivatedRoute, useValue: routeMock }], + imports: [ + ReactiveFormsModule, + FormsModule, + Lti13SelectContentComponent, + HttpClientTestingModule, + TranslateModule.forRoot({ + loader: { + provide: TranslateLoader, + useFactory: HttpLoaderFactory, + deps: [HttpClient], + }, + }), + ], + providers: [FormBuilder, { provide: ActivatedRoute, useValue: routeMock }, TranslateService], }).compileComponents(); })); From b65fa2177e9d8d8f1655272988a8d20f61fdab24 Mon Sep 17 00:00:00 2001 From: raphaelklein Date: Thu, 5 Dec 2024 14:24:52 +0100 Subject: [PATCH 15/21] Fixes --- .../course-lti-configuration.component.ts | 5 ++++- src/main/webapp/app/lti/lti-course-card.component.html | 4 ++-- .../exercise-details/lti-initializer-modal.component.ts | 3 +++ 3 files changed, 9 insertions(+), 3 deletions(-) diff --git a/src/main/webapp/app/course/manage/course-lti-configuration/course-lti-configuration.component.ts b/src/main/webapp/app/course/manage/course-lti-configuration/course-lti-configuration.component.ts index 9886968247c3..34e5eb3a9eb6 100644 --- a/src/main/webapp/app/course/manage/course-lti-configuration/course-lti-configuration.component.ts +++ b/src/main/webapp/app/course/manage/course-lti-configuration/course-lti-configuration.component.ts @@ -1,5 +1,6 @@ import { Component, OnInit, inject } from '@angular/core'; -import { ActivatedRoute } from '@angular/router'; +import { CommonModule } from '@angular/common'; +import { ActivatedRoute, RouterModule } from '@angular/router'; import { Course } from 'app/entities/course.model'; import { OnlineCourseConfiguration } from 'app/entities/online-course-configuration.model'; import { CourseManagementService } from 'app/course/manage/course-management.service'; @@ -8,6 +9,8 @@ import { faExclamationTriangle, faSort, faWrench } from '@fortawesome/free-solid import { SortService } from 'app/shared/service/sort.service'; @Component({ + standalone: true, + imports: [CommonModule, RouterModule], selector: 'jhi-course-lti-configuration', templateUrl: './course-lti-configuration.component.html', }) diff --git a/src/main/webapp/app/lti/lti-course-card.component.html b/src/main/webapp/app/lti/lti-course-card.component.html index fe099147655e..b317f72499b8 100644 --- a/src/main/webapp/app/lti/lti-course-card.component.html +++ b/src/main/webapp/app/lti/lti-course-card.component.html @@ -9,9 +9,9 @@
- + @if (course()?.courseIcon) { - + }
diff --git a/src/main/webapp/app/overview/exercise-details/lti-initializer-modal.component.ts b/src/main/webapp/app/overview/exercise-details/lti-initializer-modal.component.ts index 0bb7a8b46d5a..5748fd5ad390 100644 --- a/src/main/webapp/app/overview/exercise-details/lti-initializer-modal.component.ts +++ b/src/main/webapp/app/overview/exercise-details/lti-initializer-modal.component.ts @@ -2,10 +2,13 @@ import { Component, inject } from '@angular/core'; import { ActivatedRoute, Router } from '@angular/router'; import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap'; import { AlertService } from 'app/core/util/alert.service'; +import { FormsModule } from 'app/forms/forms.module'; @Component({ selector: 'jhi-lti-initializer-modal', templateUrl: './lti-initializer-modal.component.html', + standalone: true, + imports: [NgbActiveModal, FormsModule], }) export class LtiInitializerModalComponent { private activeModal = inject(NgbActiveModal); From e5c8993ab0cccbed4c924adb472ff8b7e922430b Mon Sep 17 00:00:00 2001 From: raphaelklein Date: Thu, 5 Dec 2024 15:22:19 +0100 Subject: [PATCH 16/21] Standalone course lti components + fixes --- .../course-lti-configuration.component.ts | 29 ++++++++++++++++--- ...edit-course-lti-configuration.component.ts | 29 ++++++++++++++++++- .../course/manage/course-management.module.ts | 4 +-- .../lti-initializer-modal.component.ts | 3 -- 4 files changed, 55 insertions(+), 10 deletions(-) diff --git a/src/main/webapp/app/course/manage/course-lti-configuration/course-lti-configuration.component.ts b/src/main/webapp/app/course/manage/course-lti-configuration/course-lti-configuration.component.ts index 34e5eb3a9eb6..d91fcf8469b2 100644 --- a/src/main/webapp/app/course/manage/course-lti-configuration/course-lti-configuration.component.ts +++ b/src/main/webapp/app/course/manage/course-lti-configuration/course-lti-configuration.component.ts @@ -1,18 +1,39 @@ import { Component, OnInit, inject } from '@angular/core'; -import { CommonModule } from '@angular/common'; -import { ActivatedRoute, RouterModule } from '@angular/router'; +import { ActivatedRoute, RouterLink } from '@angular/router'; import { Course } from 'app/entities/course.model'; import { OnlineCourseConfiguration } from 'app/entities/online-course-configuration.model'; import { CourseManagementService } from 'app/course/manage/course-management.service'; import { Exercise } from 'app/entities/exercise.model'; import { faExclamationTriangle, faSort, faWrench } from '@fortawesome/free-solid-svg-icons'; import { SortService } from 'app/shared/service/sort.service'; +import { FormsModule } from '@angular/forms'; +import { TranslateDirective } from '../../../shared/language/translate.directive'; +import { FaIconComponent } from '@fortawesome/angular-fontawesome'; +import { NgbNav, NgbNavContent, NgbNavItem, NgbNavLink, NgbNavLinkBase, NgbNavOutlet, NgbTooltip } from '@ng-bootstrap/ng-bootstrap'; +import { ArtemisSharedComponentModule } from '../../../shared/components/shared-component.module'; +import { ArtemisSharedCommonModule } from '../../../shared/shared-common.module'; +import { ArtemisTranslatePipe } from '../../../shared/pipes/artemis-translate.pipe'; @Component({ - standalone: true, - imports: [CommonModule, RouterModule], selector: 'jhi-course-lti-configuration', templateUrl: './course-lti-configuration.component.html', + standalone: true, + imports: [ + FormsModule, + TranslateDirective, + RouterLink, + FaIconComponent, + NgbNav, + NgbNavItem, + NgbNavLink, + NgbNavLinkBase, + NgbNavContent, + NgbTooltip, + ArtemisSharedComponentModule, + ArtemisSharedCommonModule, + NgbNavOutlet, + ArtemisTranslatePipe, + ], }) export class CourseLtiConfigurationComponent implements OnInit { private route = inject(ActivatedRoute); diff --git a/src/main/webapp/app/course/manage/course-lti-configuration/edit-course-lti-configuration.component.ts b/src/main/webapp/app/course/manage/course-lti-configuration/edit-course-lti-configuration.component.ts index df480a6941c1..78f46c1f410d 100644 --- a/src/main/webapp/app/course/manage/course-lti-configuration/edit-course-lti-configuration.component.ts +++ b/src/main/webapp/app/course/manage/course-lti-configuration/edit-course-lti-configuration.component.ts @@ -3,7 +3,7 @@ import { ActivatedRoute, Router } from '@angular/router'; import { Course } from 'app/entities/course.model'; import { finalize } from 'rxjs'; import { OnlineCourseConfiguration } from 'app/entities/online-course-configuration.model'; -import { FormControl, FormGroup } from '@angular/forms'; +import { FormControl, FormGroup, FormsModule, ReactiveFormsModule } from '@angular/forms'; import { faBan, faSave } from '@fortawesome/free-solid-svg-icons'; import { regexValidator } from 'app/shared/form/shortname-validator.directive'; import { LOGIN_PATTERN } from 'app/shared/constants/input.constants'; @@ -13,10 +13,37 @@ import { LtiConfigurationService } from 'app/admin/lti-configuration/lti-configu import { ITEMS_PER_PAGE } from 'app/shared/constants/pagination.constants'; import { HttpHeaders, HttpResponse } from '@angular/common/http'; import { combineLatest } from 'rxjs'; +import { TranslateDirective } from '../../../shared/language/translate.directive'; +import { ArtemisSharedComponentModule } from '../../../shared/components/shared-component.module'; +import { ArtemisSharedModule } from 'app/shared/shared.module'; +import { NgbDropdown, NgbDropdownButtonItem, NgbDropdownItem, NgbDropdownMenu, NgbDropdownToggle, NgbPagination, NgbTooltip } from '@ng-bootstrap/ng-bootstrap'; +import { FaIconComponent } from '@fortawesome/angular-fontawesome'; +import { KeyValuePipe } from '@angular/common'; +import { ArtemisTranslatePipe } from '../../../shared/pipes/artemis-translate.pipe'; +import { ArtemisSharedPipesModule } from '../../../shared/pipes/shared-pipes.module'; @Component({ selector: 'jhi-edit-course-lti-configuration', templateUrl: './edit-course-lti-configuration.component.html', + standalone: true, + imports: [ + FormsModule, + ReactiveFormsModule, + TranslateDirective, + ArtemisSharedComponentModule, + ArtemisSharedModule, + NgbDropdown, + NgbDropdownToggle, + NgbDropdownMenu, + NgbDropdownButtonItem, + NgbDropdownItem, + NgbTooltip, + NgbPagination, + FaIconComponent, + KeyValuePipe, + ArtemisTranslatePipe, + ArtemisSharedPipesModule, + ], }) export class EditCourseLtiConfigurationComponent implements OnInit { private route = inject(ActivatedRoute); diff --git a/src/main/webapp/app/course/manage/course-management.module.ts b/src/main/webapp/app/course/manage/course-management.module.ts index 4788d338648d..12d386095e31 100644 --- a/src/main/webapp/app/course/manage/course-management.module.ts +++ b/src/main/webapp/app/course/manage/course-management.module.ts @@ -122,6 +122,8 @@ import { ArtemisMarkdownEditorModule } from 'app/shared/markdown-editor/markdown DetailModule, SubmissionResultStatusModule, ArtemisMarkdownEditorModule, + CourseLtiConfigurationComponent, + EditCourseLtiConfigurationComponent, ], declarations: [ CourseManagementComponent, @@ -138,8 +140,6 @@ import { ArtemisMarkdownEditorModule } from 'app/shared/markdown-editor/markdown CourseDetailLineChartComponent, CourseManagementExercisesSearchComponent, CourseGroupMembershipComponent, - CourseLtiConfigurationComponent, - EditCourseLtiConfigurationComponent, CourseManagementTabBarComponent, BuildQueueComponent, ImageCropperModalComponent, diff --git a/src/main/webapp/app/overview/exercise-details/lti-initializer-modal.component.ts b/src/main/webapp/app/overview/exercise-details/lti-initializer-modal.component.ts index 5748fd5ad390..0bb7a8b46d5a 100644 --- a/src/main/webapp/app/overview/exercise-details/lti-initializer-modal.component.ts +++ b/src/main/webapp/app/overview/exercise-details/lti-initializer-modal.component.ts @@ -2,13 +2,10 @@ import { Component, inject } from '@angular/core'; import { ActivatedRoute, Router } from '@angular/router'; import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap'; import { AlertService } from 'app/core/util/alert.service'; -import { FormsModule } from 'app/forms/forms.module'; @Component({ selector: 'jhi-lti-initializer-modal', templateUrl: './lti-initializer-modal.component.html', - standalone: true, - imports: [NgbActiveModal, FormsModule], }) export class LtiInitializerModalComponent { private activeModal = inject(NgbActiveModal); From 0381c2c30df7e1ddb89a4cb8d2849e74460b9fa3 Mon Sep 17 00:00:00 2001 From: raphaelklein Date: Thu, 5 Dec 2024 16:30:06 +0100 Subject: [PATCH 17/21] test fixes --- ...course-lti-configuration.component.spec.ts | 41 +++++------------ ...course-lti-configuration.component.spec.ts | 44 +++++-------------- 2 files changed, 22 insertions(+), 63 deletions(-) diff --git a/src/test/javascript/spec/component/course/course-lti-configuration.component.spec.ts b/src/test/javascript/spec/component/course/course-lti-configuration.component.spec.ts index 2912262c8621..e38941cdfdf9 100644 --- a/src/test/javascript/spec/component/course/course-lti-configuration.component.spec.ts +++ b/src/test/javascript/spec/component/course/course-lti-configuration.component.spec.ts @@ -1,12 +1,10 @@ import { HttpResponse } from '@angular/common/http'; import { ComponentFixture, TestBed } from '@angular/core/testing'; import { CourseManagementService } from 'app/course/manage/course-management.service'; -import { CopyIconButtonComponent } from 'app/shared/components/copy-icon-button/copy-icon-button.component'; -import { HelpIconComponent } from 'app/shared/components/help-icon.component'; import { of } from 'rxjs'; import { By } from '@angular/platform-browser'; import { NgbNavModule } from '@ng-bootstrap/ng-bootstrap'; -import { MockComponent, MockDirective, MockModule, MockPipe, MockProvider } from 'ng-mocks'; +import { MockDirective, MockModule, MockPipe, MockProvider } from 'ng-mocks'; import { TranslateDirective } from 'app/shared/language/translate.directive'; import { CourseLtiConfigurationComponent } from 'app/course/manage/course-lti-configuration/course-lti-configuration.component'; import { SortService } from 'app/shared/service/sort.service'; @@ -18,18 +16,14 @@ import { ModelingExercise } from 'app/entities/modeling-exercise.model'; import { OnlineCourseConfiguration } from 'app/entities/online-course-configuration.model'; import { mockedActivatedRoute } from '../../helpers/mocks/activated-route/mock-activated-route-query-param-map'; import { ArtemisTranslatePipe } from 'app/shared/pipes/artemis-translate.pipe'; -import { SortDirective } from 'app/shared/sort/sort.directive'; -import { SortByDirective } from 'app/shared/sort/sort-by.directive'; import { MockRouterLinkDirective } from '../../helpers/mocks/directive/mock-router-link.directive'; import { ArtemisTestModule } from '../../test.module'; import { NgbTooltipModule } from '@ng-bootstrap/ng-bootstrap'; import { UMLDiagramType } from '@ls1intum/apollon'; -import { NgModel } from '@angular/forms'; describe('Course LTI Configuration Component', () => { let comp: CourseLtiConfigurationComponent; let fixture: ComponentFixture; - let courseService: CourseManagementService; let sortService: SortService; let findWithExercisesStub: jest.SpyInstance; @@ -52,20 +46,10 @@ describe('Course LTI Configuration Component', () => { const courseWithExercises = new Course(); courseWithExercises.exercises = [programmingExercise, quizExercise, fileUploadExercise, modelingExercise]; - beforeEach(() => { - TestBed.configureTestingModule({ + beforeEach(async () => { + await TestBed.configureTestingModule({ imports: [ArtemisTestModule, NgbNavModule, MockModule(NgbTooltipModule)], - declarations: [ - CourseLtiConfigurationComponent, - MockDirective(TranslateDirective), - MockPipe(ArtemisTranslatePipe), - MockDirective(SortDirective), - MockDirective(SortByDirective), - MockComponent(HelpIconComponent), - MockComponent(CopyIconButtonComponent), - MockDirective(NgModel), - MockRouterLinkDirective, - ], + declarations: [CourseLtiConfigurationComponent, MockDirective(TranslateDirective), MockPipe(ArtemisTranslatePipe), MockRouterLinkDirective], providers: [ MockProvider(CourseManagementService), MockProvider(SortService), @@ -78,15 +62,14 @@ describe('Course LTI Configuration Component', () => { {}, ), ], - }) - .compileComponents() - .then(() => { - fixture = TestBed.createComponent(CourseLtiConfigurationComponent); - comp = fixture.componentInstance; - courseService = TestBed.inject(CourseManagementService); - sortService = TestBed.inject(SortService); - findWithExercisesStub = jest.spyOn(courseService, 'findWithExercises'); - }); + }).compileComponents(); + + fixture = TestBed.createComponent(CourseLtiConfigurationComponent); + comp = fixture.componentInstance; + TestBed.inject(CourseManagementService); + sortService = TestBed.inject(SortService); + + findWithExercisesStub = jest.spyOn(TestBed.inject(CourseManagementService), 'findWithExercises'); }); afterEach(() => { diff --git a/src/test/javascript/spec/component/course/edit-course-lti-configuration.component.spec.ts b/src/test/javascript/spec/component/course/edit-course-lti-configuration.component.spec.ts index 1247723d25fa..57809a64b4a3 100644 --- a/src/test/javascript/spec/component/course/edit-course-lti-configuration.component.spec.ts +++ b/src/test/javascript/spec/component/course/edit-course-lti-configuration.component.spec.ts @@ -1,10 +1,9 @@ -import { HttpHeaders, HttpResponse } from '@angular/common/http'; +import { HttpResponse } from '@angular/common/http'; import { ComponentFixture, TestBed } from '@angular/core/testing'; import { CourseManagementService } from 'app/course/manage/course-management.service'; -import { HelpIconComponent } from 'app/shared/components/help-icon.component'; import { of } from 'rxjs'; import { NgbNavModule } from '@ng-bootstrap/ng-bootstrap'; -import { MockComponent, MockDirective, MockModule, MockPipe, MockProvider } from 'ng-mocks'; +import { MockDirective, MockModule, MockPipe, MockProvider } from 'ng-mocks'; import { FormControl, FormGroup, ReactiveFormsModule } from '@angular/forms'; import { TranslateDirective } from 'app/shared/language/translate.directive'; import { EditCourseLtiConfigurationComponent } from 'app/course/manage/course-lti-configuration/edit-course-lti-configuration.component'; @@ -14,8 +13,6 @@ import { mockedActivatedRoute } from '../../helpers/mocks/activated-route/mock-a import { MockRouter } from '../../helpers/mocks/mock-router'; import { Router } from '@angular/router'; import { ArtemisTranslatePipe } from 'app/shared/pipes/artemis-translate.pipe'; -import { SortDirective } from 'app/shared/sort/sort.directive'; -import { SortByDirective } from 'app/shared/sort/sort-by.directive'; import { ArtemisTestModule } from '../../test.module'; import { regexValidator } from 'app/shared/form/shortname-validator.directive'; import { LOGIN_PATTERN } from 'app/shared/constants/input.constants'; @@ -42,29 +39,10 @@ describe('Edit Course LTI Configuration Component', () => { onlineCourseConfiguration, } as Course; - beforeEach(() => { - ltiConfigService = { - query: jest.fn().mockReturnValue( - of( - new HttpResponse({ - body: [], - headers: new HttpHeaders({ 'X-Total-Count': '0' }), - }), - ), - ), - }; - - TestBed.configureTestingModule({ + beforeEach(async () => { + await TestBed.configureTestingModule({ imports: [ArtemisTestModule, NgbNavModule, MockModule(ReactiveFormsModule)], - declarations: [ - EditCourseLtiConfigurationComponent, - MockDirective(TranslateDirective), - MockPipe(ArtemisTranslatePipe), - MockDirective(SortDirective), - MockDirective(SortByDirective), - MockComponent(HelpIconComponent), - MockDirective(MockHasAnyAuthorityDirective), - ], + declarations: [EditCourseLtiConfigurationComponent, MockDirective(TranslateDirective), MockPipe(ArtemisTranslatePipe), MockDirective(MockHasAnyAuthorityDirective)], providers: [ MockProvider(CourseManagementService), { provide: Router, useValue: router }, @@ -78,13 +56,11 @@ describe('Edit Course LTI Configuration Component', () => { ), { provide: LtiConfigurationService, useValue: ltiConfigService }, ], - }) - .compileComponents() - .then(() => { - fixture = TestBed.createComponent(EditCourseLtiConfigurationComponent); - comp = fixture.componentInstance; - courseService = TestBed.inject(CourseManagementService); - }); + }).compileComponents(); + + fixture = TestBed.createComponent(EditCourseLtiConfigurationComponent); + comp = fixture.componentInstance; + courseService = TestBed.inject(CourseManagementService); }); afterEach(() => { From 1cd64aa75e1b0f0b8c94ddf22ce769b936c0ad30 Mon Sep 17 00:00:00 2001 From: raphaelklein Date: Fri, 6 Dec 2024 17:57:57 +0100 Subject: [PATCH 18/21] fix input required --- .../webapp/app/lti/lti-course-card.component.html | 12 ++++++------ src/main/webapp/app/lti/lti-course-card.component.ts | 2 +- 2 files changed, 7 insertions(+), 7 deletions(-) diff --git a/src/main/webapp/app/lti/lti-course-card.component.html b/src/main/webapp/app/lti/lti-course-card.component.html index b317f72499b8..9fd232b510e5 100644 --- a/src/main/webapp/app/lti/lti-course-card.component.html +++ b/src/main/webapp/app/lti/lti-course-card.component.html @@ -1,21 +1,21 @@
- +
- @if (course()?.courseIcon) { - + @if (course().courseIcon) { + }
- {{ course()?.title + ' (' + course()?.shortName + ')' }} + {{ course().title + ' (' + course().shortName + ')' }}
diff --git a/src/main/webapp/app/lti/lti-course-card.component.ts b/src/main/webapp/app/lti/lti-course-card.component.ts index 0ddcc9b9ad3b..bb66951dfd2a 100644 --- a/src/main/webapp/app/lti/lti-course-card.component.ts +++ b/src/main/webapp/app/lti/lti-course-card.component.ts @@ -15,7 +15,7 @@ import { ArtemisSharedModule } from 'app/shared/shared.module'; }) export class LtiCourseCardComponent { readonly ARTEMIS_DEFAULT_COLOR = ARTEMIS_DEFAULT_COLOR; - course = input(); + course = input.required(); CachingStrategy = CachingStrategy; courseColor: string; From d407cb47a34f8c701823435932f4dd3943b63c59 Mon Sep 17 00:00:00 2001 From: raphaelklein Date: Fri, 6 Dec 2024 18:25:01 +0100 Subject: [PATCH 19/21] reverse input required --- .../webapp/app/lti/lti-course-card.component.html | 12 ++++++------ src/main/webapp/app/lti/lti-course-card.component.ts | 2 +- 2 files changed, 7 insertions(+), 7 deletions(-) diff --git a/src/main/webapp/app/lti/lti-course-card.component.html b/src/main/webapp/app/lti/lti-course-card.component.html index 9fd232b510e5..b317f72499b8 100644 --- a/src/main/webapp/app/lti/lti-course-card.component.html +++ b/src/main/webapp/app/lti/lti-course-card.component.html @@ -1,21 +1,21 @@
- +
- @if (course().courseIcon) { - + @if (course()?.courseIcon) { + }
- {{ course().title + ' (' + course().shortName + ')' }} + {{ course()?.title + ' (' + course()?.shortName + ')' }}
diff --git a/src/main/webapp/app/lti/lti-course-card.component.ts b/src/main/webapp/app/lti/lti-course-card.component.ts index bb66951dfd2a..0ddcc9b9ad3b 100644 --- a/src/main/webapp/app/lti/lti-course-card.component.ts +++ b/src/main/webapp/app/lti/lti-course-card.component.ts @@ -15,7 +15,7 @@ import { ArtemisSharedModule } from 'app/shared/shared.module'; }) export class LtiCourseCardComponent { readonly ARTEMIS_DEFAULT_COLOR = ARTEMIS_DEFAULT_COLOR; - course = input.required(); + course = input(); CachingStrategy = CachingStrategy; courseColor: string; From 24100e50fcc5c9d77105c789069cc082168d0b58 Mon Sep 17 00:00:00 2001 From: raphaelklein Date: Fri, 6 Dec 2024 18:39:36 +0100 Subject: [PATCH 20/21] fixes --- .../webapp/app/lti/lti-course-card.component.html | 12 ++++++------ src/main/webapp/app/lti/lti-course-card.component.ts | 2 +- .../component/lti/lti-course-card.component.spec.ts | 1 + 3 files changed, 8 insertions(+), 7 deletions(-) diff --git a/src/main/webapp/app/lti/lti-course-card.component.html b/src/main/webapp/app/lti/lti-course-card.component.html index b317f72499b8..9fd232b510e5 100644 --- a/src/main/webapp/app/lti/lti-course-card.component.html +++ b/src/main/webapp/app/lti/lti-course-card.component.html @@ -1,21 +1,21 @@
- +
- @if (course()?.courseIcon) { - + @if (course().courseIcon) { + }
- {{ course()?.title + ' (' + course()?.shortName + ')' }} + {{ course().title + ' (' + course().shortName + ')' }}
diff --git a/src/main/webapp/app/lti/lti-course-card.component.ts b/src/main/webapp/app/lti/lti-course-card.component.ts index 0ddcc9b9ad3b..bb66951dfd2a 100644 --- a/src/main/webapp/app/lti/lti-course-card.component.ts +++ b/src/main/webapp/app/lti/lti-course-card.component.ts @@ -15,7 +15,7 @@ import { ArtemisSharedModule } from 'app/shared/shared.module'; }) export class LtiCourseCardComponent { readonly ARTEMIS_DEFAULT_COLOR = ARTEMIS_DEFAULT_COLOR; - course = input(); + course = input.required(); CachingStrategy = CachingStrategy; courseColor: string; diff --git a/src/test/javascript/spec/component/lti/lti-course-card.component.spec.ts b/src/test/javascript/spec/component/lti/lti-course-card.component.spec.ts index 32a42acd6a4f..320b1a3f86ca 100644 --- a/src/test/javascript/spec/component/lti/lti-course-card.component.spec.ts +++ b/src/test/javascript/spec/component/lti/lti-course-card.component.spec.ts @@ -22,6 +22,7 @@ describe('LtiCourseCardComponent', () => { }).compileComponents(); fixture = TestBed.createComponent(LtiCourseCardComponent); + fixture.componentRef.setInput('course', { id: 1, shortName: 'lti-course', title: 'LTI COURSE' }); component = fixture.componentInstance; }); From 3c3d5c26e28723f010591e48f6209913b4c7078d Mon Sep 17 00:00:00 2001 From: raphaelklein Date: Fri, 6 Dec 2024 20:11:10 +0100 Subject: [PATCH 21/21] fix httpclientmodule --- .../spec/component/lti/lti13-deep-linking.component.spec.ts | 2 -- .../component/lti/lti13-select-content.component.spec.ts | 5 ++--- 2 files changed, 2 insertions(+), 5 deletions(-) diff --git a/src/test/javascript/spec/component/lti/lti13-deep-linking.component.spec.ts b/src/test/javascript/spec/component/lti/lti13-deep-linking.component.spec.ts index 8298bae9a950..ba86523db1ac 100644 --- a/src/test/javascript/spec/component/lti/lti13-deep-linking.component.spec.ts +++ b/src/test/javascript/spec/component/lti/lti13-deep-linking.component.spec.ts @@ -13,7 +13,6 @@ import { Exercise, ExerciseType } from 'app/entities/exercise.model'; import { Course } from 'app/entities/course.model'; import { User } from 'app/core/user/user.model'; import { TranslateLoader, TranslateModule, TranslateService } from '@ngx-translate/core'; -import { HttpClientTestingModule } from '@angular/common/http/testing'; import { TranslateHttpLoader } from '@ngx-translate/http-loader'; function HttpLoaderFactory(http: HttpClient) { @@ -43,7 +42,6 @@ describe('Lti13DeepLinkingComponent', () => { TestBed.configureTestingModule({ imports: [ Lti13DeepLinkingComponent, - HttpClientTestingModule, TranslateModule.forRoot({ loader: { provide: TranslateLoader, diff --git a/src/test/javascript/spec/component/lti/lti13-select-content.component.spec.ts b/src/test/javascript/spec/component/lti/lti13-select-content.component.spec.ts index d0b6b6714201..63ce8e93700e 100644 --- a/src/test/javascript/spec/component/lti/lti13-select-content.component.spec.ts +++ b/src/test/javascript/spec/component/lti/lti13-select-content.component.spec.ts @@ -4,7 +4,7 @@ import { ActivatedRoute } from '@angular/router'; import { FormBuilder, FormsModule, ReactiveFormsModule } from '@angular/forms'; import { of } from 'rxjs'; import { TranslateLoader, TranslateModule, TranslateService } from '@ngx-translate/core'; -import { HttpClientTestingModule } from '@angular/common/http/testing'; +import { provideHttpClient } from '@angular/common/http'; import { TranslateHttpLoader } from '@ngx-translate/http-loader'; import { HttpClient } from '@angular/common/http'; @@ -32,7 +32,6 @@ describe('Lti13SelectContentComponent', () => { ReactiveFormsModule, FormsModule, Lti13SelectContentComponent, - HttpClientTestingModule, TranslateModule.forRoot({ loader: { provide: TranslateLoader, @@ -41,7 +40,7 @@ describe('Lti13SelectContentComponent', () => { }, }), ], - providers: [FormBuilder, { provide: ActivatedRoute, useValue: routeMock }, TranslateService], + providers: [FormBuilder, { provide: ActivatedRoute, useValue: routeMock }, TranslateService, provideHttpClient()], }).compileComponents(); }));