Development: Migrate account module to Angular lazy standalone compon…

…ent (#9378)

src/main/webapp/app/account/activate/activate.component.ts

@@ -1,25 +1,26 @@
-import { Component, OnInit } from '@angular/core';
-import { ActivatedRoute } from '@angular/router';
-
+import { Component, OnInit, inject } from '@angular/core';
+import { ActivatedRoute, RouterLink } from '@angular/router';
+import { ArtemisSharedModule } from 'app/shared/shared.module';
 import { ActivateService } from './activate.service';
 import { ProfileService } from 'app/shared/layouts/profiles/profile.service';
 import { mergeMap } from 'rxjs/operators';
+import { TranslateDirective } from 'app/shared/language/translate.directive';
 
 @Component({
     selector: 'jhi-activate',
     templateUrl: './activate.component.html',
+    standalone: true,
+    imports: [TranslateDirective, RouterLink, ArtemisSharedModule],
 })
 export class ActivateComponent implements OnInit {
+    private activateService = inject(ActivateService);
+    private route = inject(ActivatedRoute);
+    private profileService = inject(ProfileService);
+
     error = false;
     success = false;
     isRegistrationEnabled = false;
 
-    constructor(
-        private activateService: ActivateService,
-        private route: ActivatedRoute,
-        private profileService: ProfileService,
-    ) {}
-
     /**
      * Checks if the user can be activated with ActivateService
      */

src/main/webapp/app/account/activate/activate.service.ts

@@ -1,10 +1,10 @@
-import { Injectable } from '@angular/core';
+import { Injectable, inject } from '@angular/core';
 import { HttpClient, HttpParams } from '@angular/common/http';
 import { Observable } from 'rxjs';
 
 @Injectable({ providedIn: 'root' })
 export class ActivateService {
-    constructor(private http: HttpClient) {}
+    private http = inject(HttpClient);
 
     /**
      * Sends request to the server to activate the user

src/main/webapp/app/account/password-reset/external/external-user-password-reset-modal.component.ts

@@ -1,16 +1,20 @@
-import { Component } from '@angular/core';
+import { Component, inject } from '@angular/core';
 import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+import { TranslateDirective } from 'app/shared/language/translate.directive';
+import { ArtemisSharedModule } from 'app/shared/shared.module';
 
 @Component({
     selector: 'jhi-external-user-password-reset-modal',
     templateUrl: './external-user-password-reset-modal.component.html',
+    standalone: true,
+    imports: [TranslateDirective, ArtemisSharedModule],
 })
 export class ExternalUserPasswordResetModalComponent {
+    private activeModal = inject(NgbActiveModal);
+
     externalCredentialProvider: string;
     externalPasswordResetLink: string;
 
-    constructor(private activeModal: NgbActiveModal) {}
-
     /**
      * Closes the dialog, removes the query parameter and shows a helper message
      */

src/main/webapp/app/account/password-reset/finish/password-reset-finish.component.ts

@@ -1,15 +1,24 @@
-import { AfterViewInit, Component, ElementRef, OnInit, ViewChild } from '@angular/core';
-import { ActivatedRoute } from '@angular/router';
-
+import { AfterViewInit, Component, ElementRef, OnInit, ViewChild, inject } from '@angular/core';
+import { ActivatedRoute, RouterLink } from '@angular/router';
+import { PasswordStrengthBarComponent } from 'app/account/password/password-strength-bar.component';
+import { ArtemisSharedModule } from 'app/shared/shared.module';
 import { PasswordResetFinishService } from './password-reset-finish.service';
-import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+import { FormBuilder, FormGroup, FormsModule, ReactiveFormsModule, Validators } from '@angular/forms';
 import { PASSWORD_MAX_LENGTH, PASSWORD_MIN_LENGTH } from 'app/app.constants';
+import { TranslateDirective } from 'app/shared/language/translate.directive';
+import { ArtemisSharedCommonModule } from 'app/shared/shared-common.module';
 
 @Component({
     selector: 'jhi-password-reset-finish',
     templateUrl: './password-reset-finish.component.html',
+    standalone: true,
+    imports: [TranslateDirective, RouterLink, FormsModule, ReactiveFormsModule, PasswordStrengthBarComponent, ArtemisSharedCommonModule, ArtemisSharedModule],
 })
 export class PasswordResetFinishComponent implements OnInit, AfterViewInit {
+    private passwordResetFinishService = inject(PasswordResetFinishService);
+    private route = inject(ActivatedRoute);
+    private fb = inject(FormBuilder);
+
     @ViewChild('newPassword', { static: false })
     newPassword?: ElementRef;
 
@@ -24,12 +33,6 @@ export class PasswordResetFinishComponent implements OnInit, AfterViewInit {
 
     passwordForm: FormGroup;
 
-    constructor(
-        private passwordResetFinishService: PasswordResetFinishService,
-        private route: ActivatedRoute,
-        private fb: FormBuilder,
-    ) {}
-
     ngOnInit() {
         this.route.queryParams.subscribe((params) => {
             if (params['key']) {

src/main/webapp/app/account/password-reset/finish/password-reset-finish.service.ts

@@ -1,10 +1,10 @@
-import { Injectable } from '@angular/core';
+import { Injectable, inject } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
 import { Observable } from 'rxjs';
 
 @Injectable({ providedIn: 'root' })
 export class PasswordResetFinishService {
-    constructor(private http: HttpClient) {}
+    private http = inject(HttpClient);
 
     save(key: string, newPassword: string): Observable<object> {
         return this.http.post('api/public/account/reset-password/finish', { key, newPassword });

src/main/webapp/app/account/password-reset/init/password-reset-init.component.ts

@@ -1,19 +1,30 @@
-import { AfterViewInit, Component, ElementRef, OnInit, ViewChild } from '@angular/core';
+import { AfterViewInit, Component, ElementRef, OnInit, ViewChild, inject } from '@angular/core';
+import { ArtemisSharedModule } from 'app/shared/shared.module';
 import { PasswordResetInitService } from './password-reset-init.service';
 import { ProfileService } from 'app/shared/layouts/profiles/profile.service';
-import { FormBuilder } from '@angular/forms';
+import { FormsModule } from '@angular/forms';
 import { AlertService } from 'app/core/util/alert.service';
 import { HttpErrorResponse } from '@angular/common/http';
 import { onError } from 'app/shared/util/global.utils';
 import { TranslateService } from '@ngx-translate/core';
 import { NgbModal, NgbModalRef } from '@ng-bootstrap/ng-bootstrap';
 import { ExternalUserPasswordResetModalComponent } from 'app/account/password-reset/external/external-user-password-reset-modal.component';
+import { TranslateDirective } from 'app/shared/language/translate.directive';
+import { ArtemisSharedCommonModule } from 'app/shared/shared-common.module';
 
 @Component({
     selector: 'jhi-password-reset-init',
     templateUrl: './password-reset-init.component.html',
+    standalone: true,
+    imports: [TranslateDirective, FormsModule, ArtemisSharedCommonModule, ArtemisSharedModule],
 })
 export class PasswordResetInitComponent implements OnInit, AfterViewInit {
+    private passwordResetInitService = inject(PasswordResetInitService);
+    private profileService = inject(ProfileService);
+    private alertService = inject(AlertService);
+    private translateService = inject(TranslateService);
+    private modalService = inject(NgbModal);
+
     @ViewChild('emailUsername', { static: false })
     emailUsernameElement?: ElementRef;
     emailUsernameValue = '';
@@ -22,15 +33,6 @@ export class PasswordResetInitComponent implements OnInit, AfterViewInit {
     externalPasswordResetLink?: string;
     externalResetModalRef: NgbModalRef | undefined;
 
-    constructor(
-        private passwordResetInitService: PasswordResetInitService,
-        private fb: FormBuilder,
-        private profileService: ProfileService,
-        private alertService: AlertService,
-        private translateService: TranslateService,
-        private modalService: NgbModal,
-    ) {}
-
     ngOnInit() {
         this.profileService.getProfileInfo().subscribe((profileInfo) => {
             if (profileInfo) {

src/main/webapp/app/account/password-reset/init/password-reset-init.service.ts

@@ -1,10 +1,10 @@
-import { Injectable } from '@angular/core';
+import { Injectable, inject } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
 import { Observable } from 'rxjs';
 
 @Injectable({ providedIn: 'root' })
 export class PasswordResetInitService {
-    constructor(private http: HttpClient) {}
+    private http = inject(HttpClient);
 
     save(mail: string): Observable<object> {
         return this.http.post('api/public/account/reset-password/init', mail);

src/main/webapp/app/account/password/password-strength-bar.component.ts

@@ -1,4 +1,6 @@
-import { Component, ElementRef, Input, Renderer2 } from '@angular/core';
+import { Component, ElementRef, Input, Renderer2, inject } from '@angular/core';
+import { TranslateDirective } from 'app/shared/language/translate.directive';
+import { ArtemisSharedModule } from 'app/shared/shared.module';
 
 @Component({
     selector: 'jhi-password-strength-bar',
@@ -13,14 +15,14 @@ import { Component, ElementRef, Input, Renderer2 } from '@angular/core';
         </ul>
     </div>`,
     styleUrls: ['password-strength-bar.scss'],
+    standalone: true,
+    imports: [TranslateDirective, ArtemisSharedModule],
 })
 export class PasswordStrengthBarComponent {
-    colors = ['#F00', '#F90', '#FF0', '#9F0', '#0F0'];
+    private renderer = inject(Renderer2);
+    private elementRef = inject(ElementRef);
 
-    constructor(
-        private renderer: Renderer2,
-        private elementRef: ElementRef,
-    ) {}
+    colors = ['#F00', '#F90', '#FF0', '#9F0', '#0F0'];
 
     measureStrength(p: string): number {
         let force = 0;

src/main/webapp/app/account/password/password.component.ts

@@ -1,17 +1,25 @@
-import { Component, OnInit } from '@angular/core';
-
+import { Component, OnInit, inject } from '@angular/core';
 import { User } from 'app/core/user/user.model';
 import { AccountService } from 'app/core/auth/account.service';
+import { ArtemisSharedModule } from 'app/shared/shared.module';
 import { PasswordService } from './password.service';
-import { ProfileService } from 'app/shared/layouts/profiles/profile.service';
-import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+import { FormBuilder, FormGroup, FormsModule, ReactiveFormsModule, Validators } from '@angular/forms';
 import { PASSWORD_MAX_LENGTH, PASSWORD_MIN_LENGTH } from 'app/app.constants';
+import { TranslateDirective } from 'app/shared/language/translate.directive';
+import { PasswordStrengthBarComponent } from './password-strength-bar.component';
+import { ArtemisSharedCommonModule } from 'app/shared/shared-common.module';
 
 @Component({
     selector: 'jhi-password',
     templateUrl: './password.component.html',
+    standalone: true,
+    imports: [TranslateDirective, FormsModule, ReactiveFormsModule, PasswordStrengthBarComponent, ArtemisSharedCommonModule, ArtemisSharedModule],
 })
 export class PasswordComponent implements OnInit {
+    private passwordService = inject(PasswordService);
+    private accountService = inject(AccountService);
+    private fb = inject(FormBuilder);
+
     readonly PASSWORD_MIN_LENGTH = PASSWORD_MIN_LENGTH;
     readonly PASSWORD_MAX_LENGTH = PASSWORD_MAX_LENGTH;
 
@@ -22,13 +30,6 @@ export class PasswordComponent implements OnInit {
     passwordForm: FormGroup;
     passwordResetEnabled = false;
 
-    constructor(
-        private passwordService: PasswordService,
-        private accountService: AccountService,
-        private profileService: ProfileService,
-        private fb: FormBuilder,
-    ) {}
-
     ngOnInit() {
         this.accountService.identity().then((user) => {
             this.user = user;

src/main/webapp/app/account/password/password.service.ts

@@ -1,10 +1,10 @@
-import { Injectable } from '@angular/core';
+import { Injectable, inject } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
 import { Observable } from 'rxjs';
 
 @Injectable({ providedIn: 'root' })
 export class PasswordService {
-    constructor(private http: HttpClient) {}
+    private http = inject(HttpClient);
 
     /**
      * Sets a new password for the current user. Receives an HTTP 400 if the old password is incorrect.