117287: Fixed UI freezing on withdrawn item pages

(cherry picked from commit 976ac7604b)
This commit is contained in:
Alexandre Vryghem
2024-10-29 17:36:33 +01:00
parent f0e9948992
commit 5dcc90c1cd
3 changed files with 22 additions and 9 deletions

View File

@@ -8,7 +8,7 @@
<span class="align-self-center">{{'item.alerts.withdrawn' | translate}}</span>
<div class="gap-2 d-flex">
<a routerLink="/home" class="btn btn-primary btn-sm">{{"404.link.home-page" | translate}}</a>
<a *ngIf="showReinstateButton$() | async" class="btn btn-primary btn-sm" (click)="openReinstateModal()">{{ 'item.alerts.reinstate-request' | translate}}</a>
<a *ngIf="showReinstateButton$ | async" class="btn btn-primary btn-sm" (click)="openReinstateModal()">{{ 'item.alerts.reinstate-request' | translate}}</a>
</div>
</div>
</ds-alert>

View File

@@ -161,7 +161,7 @@ describe('ItemAlertsComponent', () => {
(authorizationService.isAuthorized).and.returnValue(isAdmin$);
(correctionTypeDataService.findByItem).and.returnValue(correction$);
expectObservable(component.showReinstateButton$()).toBe(expectedMarble, expectedValues);
expectObservable(component.shouldShowReinstateButton()).toBe(expectedMarble, expectedValues);
});
});

View File

@@ -5,6 +5,8 @@ import {
import {
Component,
Input,
OnChanges,
SimpleChanges,
} from '@angular/core';
import { RouterLink } from '@angular/router';
import { TranslateModule } from '@ngx-translate/core';
@@ -45,12 +47,17 @@ import {
/**
* Component displaying alerts for an item
*/
export class ItemAlertsComponent {
export class ItemAlertsComponent implements OnChanges {
/**
* The Item to display alerts for
*/
@Input() item: Item;
/**
* Whether the reinstate button should be shown
*/
showReinstateButton$: Observable<boolean>;
/**
* The AlertType enumeration
* @type {AlertType}
@@ -58,18 +65,24 @@ export class ItemAlertsComponent {
public AlertTypeEnum = AlertType;
constructor(
private authService: AuthorizationDataService,
private dsoWithdrawnReinstateModalService: DsoWithdrawnReinstateModalService,
private correctionTypeDataService: CorrectionTypeDataService,
protected authService: AuthorizationDataService,
protected dsoWithdrawnReinstateModalService: DsoWithdrawnReinstateModalService,
protected correctionTypeDataService: CorrectionTypeDataService,
) {
}
ngOnChanges(changes: SimpleChanges): void {
if (changes.item?.currentValue.withdrawn && this.showReinstateButton$) {
this.showReinstateButton$ = this.shouldShowReinstateButton();
}
}
/**
* Determines whether to show the reinstate button.
* The button is shown if the user is not an admin and the item has a reinstate request.
* @returns An Observable that emits a boolean value indicating whether to show the reinstate button.
*/
showReinstateButton$(): Observable<boolean> {
shouldShowReinstateButton(): Observable<boolean> {
const correction$ = this.correctionTypeDataService.findByItem(this.item.uuid, true).pipe(
getFirstCompletedRemoteData(),
map((correctionTypeRD: RemoteData<PaginatedList<CorrectionType>>) => correctionTypeRD.hasSucceeded ? correctionTypeRD.payload.page : []),
@@ -78,8 +91,8 @@ export class ItemAlertsComponent {
return combineLatest([isAdmin$, correction$]).pipe(
map(([isAdmin, correction]) => {
return !isAdmin && correction.some((correctionType) => correctionType.topic === REQUEST_REINSTATE);
},
));
}),
);
}
/**