Development: Update LTI components to use Angular 18 practices

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;

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,

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;

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;

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;

src/main/webapp/app/lti/lti13-select-content.component.ts

@@ -1,18 +1,28 @@
-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';
+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.
  * It reads the necessary parameters from the route, sanitizes return URL,
  * and automatically submits a form with the relevant data.
  * According to LTI documentation auto submit form must be used.
  */
+
 @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);
+    private sanitizer = inject(DomSanitizer);
+    private zone = inject(NgZone);
+
     jwt: string;
     id: string;
     actionLink: string;
@@ -21,12 +31,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.

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[];