68729: Edit Item Version History page + sidebar menu option - moving item-versions component to shared module

resources/i18n/en.json5

@@ -980,9 +980,12 @@
   "item.select.table.title": "Title",
 
 
+  "item.version.history.empty": "There are no other versions for this item yet.",
 
   "item.version.history.head": "Version History",
 
+  "item.version.history.return": "Return",
+
   "item.version.history.selected": "Selected version",
 
   "item.version.history.table.version": "Version",
@@ -1155,6 +1158,8 @@
 
   "menu.section.edit_item": "Item",
 
+  "menu.section.edit_item_version_history": "Item Version History",
+
 
 
   "menu.section.export": "Export",

src/app/+admin/admin-sidebar/admin-sidebar.component.ts

@@ -18,6 +18,7 @@ import { EditItemSelectorComponent } from '../../shared/dso-selector/modal-wrapp
 import { EditCommunitySelectorComponent } from '../../shared/dso-selector/modal-wrappers/edit-community-selector/edit-community-selector.component';
 import { EditCollectionSelectorComponent } from '../../shared/dso-selector/modal-wrappers/edit-collection-selector/edit-collection-selector.component';
 import {CreateItemParentSelectorComponent} from '../../shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component';
+import { EditItemVersionHistorySelectorComponent } from '../../shared/dso-selector/modal-wrappers/edit-item-version-history-selector/edit-item-version-history-selector.component';
 
 /**
  * Component representing the admin sidebar
@@ -214,6 +215,19 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit {
           }
         } as OnClickMenuItemModel,
       },
+      {
+        id: 'edit_item_version_history',
+        parentID: 'edit',
+        active: false,
+        visible: true,
+        model: {
+          type: MenuItemType.ONCLICK,
+          text: 'menu.section.edit_item_version_history',
+          function: () => {
+            this.modalService.open(EditItemVersionHistorySelectorComponent);
+          }
+        } as OnClickMenuItemModel,
+      },
 
       /* Import */
       {

src/app/+item-page/edit-item-page/edit-item-page.module.ts

@@ -22,6 +22,7 @@ import { EditRelationshipComponent } from './item-relationships/edit-relationshi
 import { EditRelationshipListComponent } from './item-relationships/edit-relationship-list/edit-relationship-list.component';
 import { ItemMoveComponent } from './item-move/item-move.component';
 import { VirtualMetadataComponent } from './virtual-metadata/virtual-metadata.component';
+import { ItemVersionHistoryComponent } from './item-version-history/item-version-history.component';
 
 /**
  * Module that contains all components related to the Edit Item page administrator functionality
@@ -47,6 +48,7 @@ import { VirtualMetadataComponent } from './virtual-metadata/virtual-metadata.co
     ItemMetadataComponent,
     ItemRelationshipsComponent,
     ItemBitstreamsComponent,
+    ItemVersionHistoryComponent,
     EditInPlaceFieldComponent,
     EditRelationshipComponent,
     EditRelationshipListComponent,

src/app/+item-page/edit-item-page/edit-item-page.routing.module.ts

@@ -13,6 +13,11 @@ import { ItemBitstreamsComponent } from './item-bitstreams/item-bitstreams.compo
 import { ItemCollectionMapperComponent } from './item-collection-mapper/item-collection-mapper.component';
 import { ItemMoveComponent } from './item-move/item-move.component';
 import { ItemRelationshipsComponent } from './item-relationships/item-relationships.component';
+import { ItemVersionHistoryComponent } from './item-version-history/item-version-history.component';
+
+export function getItemEditVersionHistoryPath() {
+  return ITEM_EDIT_VERSION_HISTORY;
+}
 
 const ITEM_EDIT_WITHDRAW_PATH = 'withdraw';
 const ITEM_EDIT_REINSTATE_PATH = 'reinstate';
@@ -20,6 +25,7 @@ const ITEM_EDIT_PRIVATE_PATH = 'private';
 const ITEM_EDIT_PUBLIC_PATH = 'public';
 const ITEM_EDIT_DELETE_PATH = 'delete';
 const ITEM_EDIT_MOVE_PATH = 'move';
+const ITEM_EDIT_VERSION_HISTORY = 'versionhistory';
 
 /**
  * Routing module that handles the routing for the Edit Item page administrator functionality
@@ -122,7 +128,15 @@ const ITEM_EDIT_MOVE_PATH = 'move';
         resolve: {
           item: ItemPageResolver
         }
-      }])
+      },
+      {
+        path: ITEM_EDIT_VERSION_HISTORY,
+        component: ItemVersionHistoryComponent,
+        resolve: {
+          item: ItemPageResolver
+        }
+      }
+    ])
   ],
   providers: [
     ItemPageResolver,

src/app/+item-page/edit-item-page/item-version-history/item-version-history.component.html

@@ -0,0 +1,6 @@
+<div class="container" *ngVar="(itemRD$ | async)?.payload as item">
+  <ds-item-versions *ngIf="item" [item]="item" [displayWhenEmpty]="true"></ds-item-versions>
+  <a class="btn btn-outline-primary" [routerLink]="['/items/' + item?.id]">
+    {{"item.version.history.return" | translate}}
+  </a>
+</div>

src/app/+item-page/edit-item-page/item-version-history/item-version-history.component.ts

@@ -0,0 +1,25 @@
+import { Component } from '@angular/core';
+import { Observable } from 'rxjs/internal/Observable';
+import { RemoteData } from '../../../core/data/remote-data';
+import { Item } from '../../../core/shared/item.model';
+import { map } from 'rxjs/operators';
+import { getSucceededRemoteData } from '../../../core/shared/operators';
+import { ActivatedRoute } from '@angular/router';
+
+@Component({
+  selector: 'ds-item-version-history',
+  templateUrl: './item-version-history.component.html'
+})
+export class ItemVersionHistoryComponent {
+  /**
+   * The item to display the version history for
+   */
+  itemRD$: Observable<RemoteData<Item>>;
+
+  constructor(private route: ActivatedRoute) {
+  }
+
+  ngOnInit(): void {
+    this.itemRD$ = this.route.data.pipe(map((data) => data.item)).pipe(getSucceededRemoteData()) as Observable<RemoteData<Item>>;
+  }
+}

src/app/+item-page/item-page-routing.module.ts

@@ -7,6 +7,7 @@ import { ItemPageResolver } from './item-page.resolver';
 import { URLCombiner } from '../core/url-combiner/url-combiner';
 import { getItemModulePath } from '../app-routing.module';
 import { AuthenticatedGuard } from '../core/auth/authenticated.guard';
+import { getItemEditVersionHistoryPath } from './edit-item-page/edit-item-page.routing.module';
 
 export function getItemPageRoute(itemId: string) {
   return new URLCombiner(getItemModulePath(), itemId).toString();
@@ -14,8 +15,12 @@ export function getItemPageRoute(itemId: string) {
 export function getItemEditPath(id: string) {
   return new URLCombiner(getItemModulePath(),ITEM_EDIT_PATH.replace(/:id/, id)).toString()
 }
+export function getFullItemEditVersionHistoryPath(id: string) {
+  return new URLCombiner(getItemModulePath(),ITEM_EDIT_VERSION_HISTORY_PATH.replace(/:id/, id)).toString()
+}
 
 const ITEM_EDIT_PATH = ':id/edit';
+const ITEM_EDIT_VERSION_HISTORY_PATH = `${ITEM_EDIT_PATH}/${getItemEditVersionHistoryPath()}`;
 
 @NgModule({
   imports: [

src/app/+item-page/item-page.module.ts

@@ -29,7 +29,6 @@ import { MetadataFieldWrapperComponent } from './field-components/metadata-field
 import { TabbedRelatedEntitiesSearchComponent } from './simple/related-entities/tabbed-related-entities-search/tabbed-related-entities-search.component';
 import { StatisticsModule } from '../statistics/statistics.module';
 import { AbstractIncrementalListComponent } from './simple/abstract-incremental-list/abstract-incremental-list.component';
-import { ItemVersionsComponent } from './item-versions/item-versions.component';
 
 @NgModule({
   imports: [
@@ -61,7 +60,6 @@ import { ItemVersionsComponent } from './item-versions/item-versions.component';
     RelatedEntitiesSearchComponent,
     TabbedRelatedEntitiesSearchComponent,
     AbstractIncrementalListComponent,
-    ItemVersionsComponent
   ],
   exports: [
     ItemComponent,

src/app/shared/dso-selector/modal-wrappers/edit-item-version-history-selector/edit-item-version-history-selector.component.ts

@@ -0,0 +1,32 @@
+import { Component, OnInit } from '@angular/core';
+import { ActivatedRoute, Router } from '@angular/router';
+import { DSpaceObjectType } from '../../../../core/shared/dspace-object-type.model';
+import { DSpaceObject } from '../../../../core/shared/dspace-object.model';
+import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+import { getFullItemEditVersionHistoryPath } from '../../../../+item-page/item-page-routing.module';
+import { DSOSelectorModalWrapperComponent, SelectorActionType } from '../dso-selector-modal-wrapper.component';
+
+/**
+ * Component to wrap a list of existing items inside a modal
+ * Used to choose an item from to edit its version history
+ */
+@Component({
+  selector: 'ds-edit-item-version-history-selector',
+  templateUrl: '../dso-selector-modal-wrapper.component.html',
+})
+export class EditItemVersionHistorySelectorComponent extends DSOSelectorModalWrapperComponent implements OnInit {
+  objectType = DSpaceObjectType.ITEM;
+  selectorType = DSpaceObjectType.ITEM;
+  action = SelectorActionType.EDIT;
+
+  constructor(protected activeModal: NgbActiveModal, protected route: ActivatedRoute, private router: Router) {
+    super(activeModal, route);
+  }
+
+  /**
+   * Navigate to the item edit version history page
+   */
+  navigate(dso: DSpaceObject) {
+    this.router.navigate([getFullItemEditVersionHistoryPath(dso.uuid)]);
+  }
+}

src/app/shared/item/item-versions/item-versions.component.html

@@ -1,8 +1,9 @@
 <div *ngVar="(versionsRD$ | async)?.payload as versions">
   <div *ngVar="(versionRD$ | async)?.payload as itemVersion">
-    <div *ngIf="versions?.page?.length > 0">
+    <div class="mb-2" *ngIf="versions?.page?.length > 0 || displayWhenEmpty">
       <h2>{{"item.version.history.head" | translate}}</h2>
-      <ds-pagination [hideGear]="true"
+      <ds-pagination *ngIf="versions?.page?.length > 0"
+                     [hideGear]="true"
                      [hidePagerWhenSinglePage]="true"
                      [paginationOptions]="options"
                      [pageInfoState]="versions"
@@ -40,6 +41,7 @@
         </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>

src/app/shared/item/item-versions/item-versions.component.ts

@@ -1,17 +1,18 @@
 import { Component, Input, OnInit } from '@angular/core';
-import { Item } from '../../core/shared/item.model';
+import { Item } from '../../../core/shared/item.model';
-import { Version } from '../../core/shared/version.model';
+import { Version } from '../../../core/shared/version.model';
-import { RemoteData } from '../../core/data/remote-data';
+import { RemoteData } from '../../../core/data/remote-data';
 import { Observable } from 'rxjs/internal/Observable';
-import { VersionHistory } from '../../core/shared/version-history.model';
+import { VersionHistory } from '../../../core/shared/version-history.model';
-import { getAllSucceededRemoteData, getRemoteDataPayload } from '../../core/shared/operators';
+import { getAllSucceededRemoteData, getRemoteDataPayload } from '../../../core/shared/operators';
 import { map, startWith, switchMap } from 'rxjs/operators';
 import { combineLatest as observableCombineLatest } from 'rxjs';
-import { PaginatedList } from '../../core/data/paginated-list';
+import { PaginatedList } from '../../../core/data/paginated-list';
-import { PaginationComponentOptions } from '../../shared/pagination/pagination-component-options.model';
+import { PaginationComponentOptions } from '../../pagination/pagination-component-options.model';
 import { BehaviorSubject } from 'rxjs/internal/BehaviorSubject';
-import { VersionHistoryDataService } from '../../core/data/version-history-data.service';
+import { VersionHistoryDataService } from '../../../core/data/version-history-data.service';
-import { PaginatedSearchOptions } from '../../shared/search/paginated-search-options.model';
+import { PaginatedSearchOptions } from '../../search/paginated-search-options.model';
+import { AlertType } from '../../alert/aletr-type';
 
 @Component({
   selector: 'ds-item-versions',
@@ -26,6 +27,19 @@ export class ItemVersionsComponent implements OnInit {
    */
   @Input() item: Item;
 
+  /**
+   * An option to display the list of versions, even when there aren't any.
+   * Instead of the table, an alert will be displayed, notifying the user there are no other versions present
+   * for the current item.
+   */
+  @Input() displayWhenEmpty = false;
+
+  /**
+   * The AlertType enumeration
+   * @type {AlertType}
+   */
+  AlertTypeEnum = AlertType;
+
   /**
    * The item's version
    */

src/app/shared/shared.module.ts

@@ -177,6 +177,8 @@ import { ExternalSourceEntryImportModalComponent } from './form/builder/ds-dynam
 import { ImportableListItemControlComponent } from './object-collection/shared/importable-list-item-control/importable-list-item-control.component';
 import { DragDropModule } from '@angular/cdk/drag-drop';
 import { ExistingMetadataListElementComponent } from './form/builder/ds-dynamic-form-ui/existing-metadata-list-element/existing-metadata-list-element.component';
+import { EditItemVersionHistorySelectorComponent } from './dso-selector/modal-wrappers/edit-item-version-history-selector/edit-item-version-history-selector.component';
+import { ItemVersionsComponent } from './item/item-versions/item-versions.component';
 
 const MODULES = [
   // Do NOT include UniversalModule, HttpModule, or JsonpModule here
@@ -297,6 +299,7 @@ const COMPONENTS = [
   EditCommunitySelectorComponent,
   EditCollectionSelectorComponent,
   EditItemSelectorComponent,
+  EditItemVersionHistorySelectorComponent,
   CommunitySearchResultListElementComponent,
   CollectionSearchResultListElementComponent,
   BrowseByComponent,
@@ -339,7 +342,8 @@ const COMPONENTS = [
   SelectableListItemControlComponent,
   ExternalSourceEntryImportModalComponent,
   ImportableListItemControlComponent,
-  ExistingMetadataListElementComponent
+  ExistingMetadataListElementComponent,
+  ItemVersionsComponent
 ];
 
 const ENTRY_COMPONENTS = [
@@ -382,6 +386,7 @@ const ENTRY_COMPONENTS = [
   EditCommunitySelectorComponent,
   EditCollectionSelectorComponent,
   EditItemSelectorComponent,
+  EditItemVersionHistorySelectorComponent,
   StartsWithTextComponent,
   PlainTextMetadataListElementComponent,
   ItemMetadataListElementComponent,
@@ -402,7 +407,8 @@ const ENTRY_COMPONENTS = [
   DsDynamicLookupRelationSearchTabComponent,
   DsDynamicLookupRelationSelectionTabComponent,
   DsDynamicLookupRelationExternalSourceTabComponent,
-  ExternalSourceEntryImportModalComponent
+  ExternalSourceEntryImportModalComponent,
+  ItemVersionsComponent
 ];
 
 const SHARED_ITEM_PAGE_COMPONENTS = [