diff --git a/frontend/src/app/pages/home/home.component.html b/frontend/src/app/pages/home/home.component.html index d5922ca..cebbaf8 100644 --- a/frontend/src/app/pages/home/home.component.html +++ b/frontend/src/app/pages/home/home.component.html @@ -1,5 +1,5 @@

Last publications

-@if ((isLoading$ | async) === true) { +@if (isLoading()) {

Publications loading...

} @else { diff --git a/frontend/src/app/pages/home/home.component.ts b/frontend/src/app/pages/home/home.component.ts index 0f8710d..d618e75 100644 --- a/frontend/src/app/pages/home/home.component.ts +++ b/frontend/src/app/pages/home/home.component.ts @@ -1,6 +1,6 @@ -import { Component, OnInit, inject } from '@angular/core'; +import { Component, OnDestroy, OnInit, inject, signal } from '@angular/core'; import { MatProgressSpinnerModule } from '@angular/material/progress-spinner'; -import { Observable } from 'rxjs'; +import { Observable, Subscription } from 'rxjs'; import { PublicationListComponent } from '../../components/publication-list/publication-list.component'; import { Publication } from '../../core/rest-services/publications/model/publication'; import { HomeService } from './home.service'; @@ -18,18 +18,27 @@ import { CommonModule } from '@angular/common'; styleUrl: './home.component.scss', providers: [HomeService] }) -export class HomeComponent implements OnInit { +export class HomeComponent implements OnInit, OnDestroy { private homeService = inject(HomeService); - - get isLoading$(): Observable { - return this.homeService.isLoading$; - } + private isLoadingSubscription?: Subscription; + private publicationsSubscription?: Subscription; + isLoading = signal(false); + publicationsIsEmpty = signal(true); get publications$(): Observable { return this.homeService.publications$; } - + ngOnInit(): void { + this.isLoadingSubscription = this.homeService.isLoading$ + .subscribe(isLoading => this.isLoading.set(isLoading)); + this.publicationsSubscription = this.homeService.publications$ + .subscribe(publications => this.publicationsIsEmpty.set(publications.length > 0)); this.homeService.startLatestPublicationsRetrieving(); } + + ngOnDestroy(): void { + this.isLoadingSubscription?.unsubscribe(); + this.publicationsSubscription?.unsubscribe(); + } }