Skip to content

Commit

Permalink
Merge pull request DSpace#3253 from alexandrevryghem/w2p-117287_fix-i…
Browse files Browse the repository at this point in the history 
…tem-version-performance-issues_contribute-main

Fixed Edit Item's Version History crashing
  • Loading branch information
@tdonohue
tdonohue authored Aug 29, 2024
2 parents 843056d + 04bbaf9 commit c659061
Show file tree
Hide file tree
Showing 2 changed files with 68 additions and 79 deletions.
65 changes: 33 additions & 32 deletions src/app/item-page/versions/item-versions.component.html
View file
Original file line number Diff line number Diff line change
@@ -1,16 +1,16 @@
<div *ngVar="(versionsRD$ | async)?.payload as versions">
<div *ngVar="(versionRD$ | async)?.payload as itemVersion">
<div class="mb-2" *ngIf="versions?.page?.length > 0 || displayWhenEmpty">
<div *ngIf="(versionsDTO$ | async) as versionsDTO; else noItemVersion">
<div *ngIf="(versionRD$ | async)?.payload as itemVersion">
<div class="mb-2" *ngIf="versionsDTO.versionDTOs.length > 0 || displayWhenEmpty">
<h2 *ngIf="displayTitle" class="h4">{{"item.version.history.head" | translate}}</h2>
<ds-alert [type]="AlertTypeEnum.Info" *ngIf="itemVersion">
<ds-alert [type]="AlertTypeEnum.Info">
{{ "item.version.history.selected.alert" | translate : {version: itemVersion.version} }}
</ds-alert>
<ds-pagination *ngIf="versions?.page?.length > 0"
<ds-pagination *ngIf="versionsDTO.versionDTOs.length > 0"
(paginationChange)="onPageChange()"
[hideGear]="true"
[hidePagerWhenSinglePage]="true"
[paginationOptions]="options"
[collectionSize]="versions?.totalElements"
[collectionSize]="versionsDTO.totalElements"
[retainScrollPosition]="true">
<table class="table table-striped table-bordered align-middle my-2">
<thead>
Expand All @@ -22,70 +22,71 @@ <h2 *ngIf="displayTitle" class="h4">{{"item.version.history.head" | translate}}<
</tr>
</thead>
<tbody>
<tr *ngFor="let version of versions?.page" [id]="'version-row-' + version.id">
<tr *ngFor="let versionDTO of versionsDTO.versionDTOs" [id]="'version-row-' + versionDTO.version.id">
<td class="version-row-element-version">
<ds-item-versions-row-element-version [hasDraftVersion]="hasDraftVersion$ | async"
[version]="version"
[version]="versionDTO.version"
[item]="item" [displayActions]="displayActions"
[itemVersion]="itemVersion"
[versionBeingEditedNumber]="versionBeingEditedNumber"
(versionsHistoryChange)="getAllVersions($event)"
></ds-item-versions-row-element-version>
</td>
<td class="version-row-element-editor" *ngIf="(showSubmitter$ | async)">
{{version?.submitterName}}
{{versionDTO.version.submitterName}}
</td>
<td class="version-row-element-date">
{{version?.created | date : 'yyyy-MM-dd HH:mm:ss'}}
{{versionDTO.version.created | date : 'yyyy-MM-dd HH:mm:ss'}}
</td>
<td class="version-row-element-summary">
<div class="float-left">
<ng-container *ngIf="isThisBeingEdited(version); then editSummary else showSummary"></ng-container>
<ng-template #showSummary>{{version?.summary}}</ng-template>
<ng-container *ngIf="isThisBeingEdited(versionDTO.version); then editSummary else showSummary"></ng-container>
<ng-template #showSummary>{{versionDTO.version.summary}}</ng-template>
<ng-template #editSummary>
<input [attr.aria-label]="'item.version.history.table.action.editSummary' | translate"
[(ngModel)]="versionBeingEditedSummary" (keyup.enter)="onSummarySubmit()"
class="form-control" type="text"/>
</ng-template>
</div>

<div class="float-right btn-group edit-field space-children-mr" *ngIf="displayActions">
<!--DISCARD EDIT -->
<ng-container *ngIf="(canEditVersion$(version) | async) && isThisBeingEdited(version)">
<button class="btn btn-sm"
[ngClass]="isThisBeingEdited(version) ? 'btn-outline-warning' : 'btn-outline-primary'"
<div class="float-right btn-group edit-field space-children-mr" *ngIf="displayActions && versionDTO.canEditVersion | async">
<ng-container *ngIf="isThisBeingEdited(versionDTO.version); else notThisBeingEdited">
<!--DISCARD EDIT-->
<button class="btn btn-sm btn-outline-warning"
(click)="disableVersionEditing()"
title="{{'item.version.history.table.action.discardSummary' | translate}}">
<i class="fas fa-undo-alt fa-fw"></i>
</button>
</ng-container>
<!--EDIT / SAVE-->
<ng-container *ngIf="canEditVersion$(version) | async">
<button class="btn btn-outline-primary btn-sm version-row-element-edit"
*ngIf="!isThisBeingEdited(version)"
[disabled]="isAnyBeingEdited()"
(click)="enableVersionEditing(version)"
title="{{'item.version.history.table.action.editSummary' | translate}}">
<i class="fas fa-edit fa-fw"></i>
</button>
<!--SAVE-->
<button class="btn btn-outline-success btn-sm"
*ngIf="isThisBeingEdited(version)"
(click)="onSummarySubmit()"
title="{{'item.version.history.table.action.saveSummary' | translate}}">
<i class="fas fa-check fa-fw"></i>
</button>
</ng-container>
<ng-template #notThisBeingEdited>
<!--EDIT-->
<button class="btn btn-outline-primary btn-sm version-row-element-edit"
[disabled]="isAnyBeingEdited()"
(click)="enableVersionEditing(versionDTO.version)"
title="{{'item.version.history.table.action.editSummary' | translate}}">
<i class="fas fa-edit fa-fw"></i>
</button>
</ng-template>
</div>


</td>
</tr>
</tbody>
</table>
<div>*&nbsp;{{"item.version.history.selected" | translate}}</div>
</ds-pagination>
<ds-alert *ngIf="!itemVersion || versions?.page?.length === 0" [content]="'item.version.history.empty'"
[type]="AlertTypeEnum.Info"></ds-alert>
</div>
</div>
</div>

<ng-template #noItemVersion>
<ds-alert *ngIf="displayWhenEmpty"
[content]="'item.version.history.empty'"
[type]="AlertTypeEnum.Info">
</ds-alert>
</ng-template>
82 changes: 35 additions & 47 deletions src/app/item-page/versions/item-versions.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,13 +12,11 @@ import {
OnInit,
} from '@angular/core';
import { FormsModule } from '@angular/forms';
import { RouterLink } from '@angular/router';
import {
TranslateModule,
TranslateService,
} from '@ngx-translate/core';
import {
BehaviorSubject,
combineLatest,
Observable,
Subscription,
Expand All @@ -41,7 +39,6 @@ import { PaginationService } from '../../core/pagination/pagination.service';
import { Item } from '../../core/shared/item.model';
import {
getAllSucceededRemoteData,
getAllSucceededRemoteDataPayload,
getFirstCompletedRemoteData,
getFirstSucceededRemoteData,
getFirstSucceededRemoteDataPayload,
Expand All @@ -60,16 +57,35 @@ import { PaginationComponent } from '../../shared/pagination/pagination.componen
import { PaginationComponentOptions } from '../../shared/pagination/pagination-component-options.model';
import { PaginatedSearchOptions } from '../../shared/search/models/paginated-search-options.model';
import { followLink } from '../../shared/utils/follow-link-config.model';
import { VarDirective } from '../../shared/utils/var.directive';
import { getItemPageRoute } from '../item-page-routing-paths';
import { ItemVersionsRowElementVersionComponent } from './item-versions-row-element-version/item-versions-row-element-version.component';

interface VersionsDTO {
totalElements: number;
versionDTOs: VersionDTO[];
}

interface VersionDTO {
version: Version;
canEditVersion: Observable<boolean>;
}

@Component({
selector: 'ds-item-versions',
templateUrl: './item-versions.component.html',
styleUrls: ['./item-versions.component.scss'],
standalone: true,
imports: [VarDirective, NgIf, AlertComponent, PaginationComponent, NgFor, RouterLink, NgClass, FormsModule, AsyncPipe, DatePipe, TranslateModule, ItemVersionsRowElementVersionComponent],
imports: [
AlertComponent,
AsyncPipe,
DatePipe,
FormsModule,
ItemVersionsRowElementVersionComponent,
NgClass,
NgFor,
NgIf,
PaginationComponent,
TranslateModule,
],
})

/**
Expand Down Expand Up @@ -128,13 +144,7 @@ export class ItemVersionsComponent implements OnDestroy, OnInit {
/**
* The version history's list of versions
*/
versionsRD$: BehaviorSubject<RemoteData<PaginatedList<Version>>> = new BehaviorSubject<RemoteData<PaginatedList<Version>>>(null);

/**
* Verify if the list of versions has at least one e-person to display
* Used to hide the "Editor" column when no e-persons are present to display
*/
hasEpersons$: Observable<boolean>;
versionsDTO$: Observable<VersionsDTO>;

/**
* Verify if there is an inprogress submission in the version history
Expand Down Expand Up @@ -162,15 +172,6 @@ export class ItemVersionsComponent implements OnDestroy, OnInit {
pageSize: this.pageSize,
});

/**
* The routes to the versions their item pages
* Key: Item ID
* Value: Route to item page
*/
itemPageRoutes$: Observable<{
[itemId: string]: string
}>;

/**
* The number of the version whose summary is currently being edited
*/
Expand All @@ -186,9 +187,6 @@ export class ItemVersionsComponent implements OnDestroy, OnInit {
*/
versionBeingEditedSummary: string;

canCreateVersion$: Observable<boolean>;
createVersionTitle$: Observable<string>;

constructor(private versionHistoryService: VersionHistoryDataService,
private versionService: VersionDataService,
private paginationService: PaginationService,
Expand Down Expand Up @@ -257,8 +255,7 @@ export class ItemVersionsComponent implements OnDestroy, OnInit {
this.notificationsService.warning(null, this.translateService.get(failureMessageKey, { 'version': this.versionBeingEditedNumber }));
}
this.disableVersionEditing();
},
);
});
}

/**
Expand Down Expand Up @@ -305,16 +302,22 @@ export class ItemVersionsComponent implements OnDestroy, OnInit {
*/
getAllVersions(versionHistory$: Observable<VersionHistory>): void {
const currentPagination = this.paginationService.getCurrentPagination(this.options.id, this.options);
combineLatest([versionHistory$, currentPagination]).pipe(
this.versionsDTO$ = combineLatest([versionHistory$, currentPagination]).pipe(
switchMap(([versionHistory, options]: [VersionHistory, PaginationComponentOptions]) => {
return this.versionHistoryService.getVersions(versionHistory.id,
new PaginatedSearchOptions({ pagination: Object.assign({}, options, { currentPage: options.currentPage }) }),
false, true, followLink('item'), followLink('eperson'));
}),
getFirstCompletedRemoteData(),
).subscribe((res: RemoteData<PaginatedList<Version>>) => {
this.versionsRD$.next(res);
});
getRemoteDataPayload(),
map((versions: PaginatedList<Version>) => ({
totalElements: versions.totalElements,
versionDTOs: (versions?.page ?? []).map((version: Version) => ({
version: version,
canEditVersion: this.canEditVersion$(version),
})),
})),
);
}

/**
Expand Down Expand Up @@ -348,22 +351,6 @@ export class ItemVersionsComponent implements OnDestroy, OnInit {
);

this.getAllVersions(this.versionHistory$);
this.hasEpersons$ = this.versionsRD$.pipe(
getAllSucceededRemoteData(),
getRemoteDataPayload(),
hasValueOperator(),
map((versions: PaginatedList<Version>) => versions.page.filter((version: Version) => version.eperson !== undefined).length > 0),
startWith(false),
);
this.itemPageRoutes$ = this.versionsRD$.pipe(
getAllSucceededRemoteDataPayload(),
switchMap((versions) => combineLatest(versions.page.map((version) => version.item.pipe(getAllSucceededRemoteDataPayload())))),
map((versions) => {
const itemPageRoutes = {};
versions.forEach((item) => itemPageRoutes[item.uuid] = getItemPageRoute(item));
return itemPageRoutes;
}),
);
}
}

Expand All @@ -380,3 +367,4 @@ export class ItemVersionsComponent implements OnDestroy, OnInit {
}

}

0 comments on commit c659061

Please sign in to comment.