Fixing Angular 21 by migrating all values by signals. (#11)
Some checks failed
Build and Deploy Java Gradle Application / build-and-deploy (push) Failing after 53s
Some checks failed
Build and Deploy Java Gradle Application / build-and-deploy (push) Failing after 53s
This commit was merged in pull request #11.
This commit is contained in:
@@ -1,93 +1,93 @@
|
||||
import { CommonModule, Location } from '@angular/common';
|
||||
import { Component, inject, OnDestroy, OnInit } from '@angular/core';
|
||||
import { ReactiveFormsModule } from '@angular/forms';
|
||||
import { MatDialogModule } from '@angular/material/dialog';
|
||||
import { MatIconModule } from '@angular/material/icon';
|
||||
import { MatInputModule } from '@angular/material/input';
|
||||
import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
|
||||
import { MatSnackBar } from '@angular/material/snack-bar';
|
||||
import { MatTabsModule } from '@angular/material/tabs';
|
||||
import { MatTooltipModule } from '@angular/material/tooltip';
|
||||
import { ActivatedRoute, Router } from '@angular/router';
|
||||
import { BehaviorSubject, Observable, Subscription } from 'rxjs';
|
||||
import { PublicationEditionComponent } from '../../components/publication-edition/publication-edition.component';
|
||||
import { Publication } from '../../core/rest-services/publications/model/publication';
|
||||
import { PublicationRestService } from '../../core/rest-services/publications/publication.rest-service';
|
||||
import {CommonModule, Location} from '@angular/common';
|
||||
import {Component, effect, inject, Signal, signal} from '@angular/core';
|
||||
import {ReactiveFormsModule} from '@angular/forms';
|
||||
import {MatDialogModule} from '@angular/material/dialog';
|
||||
import {MatIconModule} from '@angular/material/icon';
|
||||
import {MatInputModule} from '@angular/material/input';
|
||||
import {MatProgressSpinnerModule} from '@angular/material/progress-spinner';
|
||||
import {MatSnackBar} from '@angular/material/snack-bar';
|
||||
import {MatTabsModule} from '@angular/material/tabs';
|
||||
import {MatTooltipModule} from '@angular/material/tooltip';
|
||||
import {ActivatedRoute, Router} from '@angular/router';
|
||||
import {PublicationEditionComponent} from '../../components/publication-edition/publication-edition.component';
|
||||
import {Publication} from '../../core/rest-services/publications/model/publication';
|
||||
import {PublicationRestService} from '../../core/rest-services/publications/publication.rest-service';
|
||||
import {toSignal} from "@angular/core/rxjs-interop";
|
||||
import {map} from "rxjs";
|
||||
|
||||
@Component({
|
||||
selector: 'app-publication-update',
|
||||
imports: [
|
||||
CommonModule,
|
||||
MatDialogModule,
|
||||
MatIconModule,
|
||||
MatInputModule,
|
||||
MatProgressSpinnerModule,
|
||||
MatTabsModule,
|
||||
MatTooltipModule,
|
||||
ReactiveFormsModule,
|
||||
PublicationEditionComponent
|
||||
],
|
||||
templateUrl: './publication-update.component.html',
|
||||
styleUrl: './publication-update.component.scss'
|
||||
selector: 'app-publication-update',
|
||||
imports: [
|
||||
CommonModule,
|
||||
MatDialogModule,
|
||||
MatIconModule,
|
||||
MatInputModule,
|
||||
MatProgressSpinnerModule,
|
||||
MatTabsModule,
|
||||
MatTooltipModule,
|
||||
ReactiveFormsModule,
|
||||
PublicationEditionComponent
|
||||
],
|
||||
templateUrl: './publication-update.component.html',
|
||||
styleUrl: './publication-update.component.scss'
|
||||
})
|
||||
export class PublicationUpdateComponent implements OnInit, OnDestroy {
|
||||
private readonly publicationRestService = inject(PublicationRestService);
|
||||
private readonly activatedRoute = inject(ActivatedRoute);
|
||||
private readonly location = inject(Location);
|
||||
private readonly router = inject(Router);
|
||||
private readonly snackBar = inject(MatSnackBar);
|
||||
private isLoadingSubject = new BehaviorSubject<boolean>(false);
|
||||
private isSavingSubject = new BehaviorSubject<boolean>(false);
|
||||
private subscriptions: Subscription[] = [];
|
||||
publication: Publication | undefined;
|
||||
export class PublicationUpdateComponent {
|
||||
readonly #activatedRoute = inject(ActivatedRoute);
|
||||
readonly #location = inject(Location);
|
||||
readonly #publicationRestService = inject(PublicationRestService);
|
||||
readonly #router = inject(Router);
|
||||
readonly #snackBar = inject(MatSnackBar);
|
||||
#isLoading = signal(false);
|
||||
#isSavingSubject = signal(false);
|
||||
publication = signal<Publication | undefined>(undefined);
|
||||
|
||||
get isLoading$(): Observable<boolean> {
|
||||
return this.isLoadingSubject.asObservable();
|
||||
#publicationId$ = this.#activatedRoute.params
|
||||
.pipe(map(queryParams => queryParams['publicationId']));
|
||||
#publicationId = toSignal(this.#publicationId$, {initialValue: undefined});
|
||||
|
||||
get isLoading(): Signal<boolean> {
|
||||
return this.#isLoading.asReadonly();
|
||||
}
|
||||
|
||||
get isSaving$(): Observable<boolean> {
|
||||
return this.isSavingSubject.asObservable();
|
||||
get isSaving(): Signal<boolean> {
|
||||
return this.#isSavingSubject.asReadonly();
|
||||
}
|
||||
|
||||
ngOnInit(): void {
|
||||
this.isLoadingSubject.next(true);
|
||||
const activatedRouteSubscription = this.activatedRoute.paramMap.subscribe(params => {
|
||||
const publicationId = params.get('publicationId');
|
||||
if (publicationId == undefined) {
|
||||
this.snackBar.open($localize`A technical error occurred while loading publication data.`, $localize`Close`, { duration: 5000 });
|
||||
this.location.back();
|
||||
} else {
|
||||
this.publicationRestService.getById(publicationId)
|
||||
.then(publication => {
|
||||
this.publication = publication;
|
||||
})
|
||||
.catch(error => {
|
||||
const errorMessage = $localize`A technical error occurred while loading publication data.`;
|
||||
this.snackBar.open(errorMessage, $localize`Close`, { duration: 5000 });
|
||||
console.error(errorMessage, error)
|
||||
})
|
||||
.finally(() => this.isLoadingSubject.next(false));
|
||||
}
|
||||
});
|
||||
this.subscriptions.push(activatedRouteSubscription);
|
||||
}
|
||||
constructor() {
|
||||
effect(() => {
|
||||
this.#isLoading.set(true);
|
||||
|
||||
ngOnDestroy(): void {
|
||||
this.subscriptions.forEach(subscription => subscription?.unsubscribe());
|
||||
const publicationId = this.#publicationId();
|
||||
if (publicationId) {
|
||||
this.#publicationRestService.getById(publicationId)
|
||||
.then(publication => {
|
||||
this.publication.set(publication);
|
||||
})
|
||||
.catch(error => {
|
||||
const errorMessage = $localize`A technical error occurred while loading publication data.`;
|
||||
this.#snackBar.open(errorMessage, $localize`Close`, {duration: 5000});
|
||||
console.error(errorMessage, error)
|
||||
})
|
||||
.finally(() => this.#isLoading.set(false));
|
||||
} else {
|
||||
this.#snackBar.open($localize`A technical error occurred while loading publication data.`, $localize`Close`, {duration: 5000});
|
||||
this.#location.back();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
onPublicationSave(publication: Publication): void {
|
||||
this.isSavingSubject.next(true);
|
||||
this.publicationRestService.update(publication)
|
||||
.then(() => {
|
||||
this.snackBar.open($localize`Publication updated succesfully!`, $localize`Close`, { duration: 5000 });
|
||||
this.router.navigate(['/home']);
|
||||
})
|
||||
.catch(error => {
|
||||
const errorMessage = $localize`An error occured while saving publication modifications.`;
|
||||
console.error(errorMessage, error);
|
||||
this.snackBar.open(errorMessage, $localize`Close`, { duration: 5000 });
|
||||
})
|
||||
.finally(() => this.isSavingSubject.next(false));
|
||||
this.#isSavingSubject.set(true);
|
||||
this.#publicationRestService.update(publication)
|
||||
.then(() => {
|
||||
this.#snackBar.open($localize`Publication updated succesfully!`, $localize`Close`, {duration: 5000});
|
||||
this.#router.navigate(['/home']);
|
||||
})
|
||||
.catch(error => {
|
||||
const errorMessage = $localize`An error occured while saving publication modifications.`;
|
||||
console.error(errorMessage, error);
|
||||
this.#snackBar.open(errorMessage, $localize`Close`, {duration: 5000});
|
||||
})
|
||||
.finally(() => this.#isSavingSubject.set(false));
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user