Added support for change list sizes on bundle edit

src/app/item-page/edit-item-page/item-bitstreams/item-edit-bitstream-bundle/item-edit-bitstream-bundle.component.html

@@ -15,6 +15,21 @@
                 title="{{'item.edit.bitstreams.bundle.edit.buttons.upload' | translate}}">
           <i class="fas fa-upload fa-fw"></i>
         </button>
+        <div ngbDropdown #paginationControls="ngbDropdown" placement="bottom-right" class="btn-group float-right">
+          <button class="btn btn-outline-secondary" id="paginationControls" ngbDropdownToggle [title]="'pagination.options.description' | translate" [attr.aria-label]="'pagination.options.description' | translate" aria-haspopup="true" aria-expanded="false"><i class="fas fa-cog" aria-hidden="true"></i></button>
+          <ul id="paginationControlsDropdownMenu" aria-labelledby="paginationControls" role="menu" ngbDropdownMenu>
+            <li role="menuitem">
+              <span class="dropdown-header" id="pagination-control_results-per-page" role="heading">{{ 'pagination.results-per-page' | translate}}</span>
+              <ul aria-labelledby="pagination-control_results-per-page" class="list-unstyled" role="listbox">
+                <li *ngFor="let item of pageSizeOptions" role="option" [attr.aria-selected]="item === (pageSize$ | async)">
+                  <button (click)="doPageSizeChange(item)" class="dropdown-item">
+                    <i [ngClass]="{'invisible': item !== (pageSize$ | async) }" class="fas fa-check" aria-hidden="true"></i> {{item}}
+                  </button>
+                </li>
+              </ul>
+            </li>
+          </ul>
+        </div>
       </div>
     </div>
   </div>

src/app/item-page/edit-item-page/item-bitstreams/item-edit-bitstream-bundle/item-edit-bitstream-bundle.component.ts

@@ -1,3 +1,8 @@
+import {
+  AsyncPipe,
+  NgClass,
+  NgFor,
+} from '@angular/common';
 import {
   Component,
   EventEmitter,
@@ -9,7 +14,14 @@ import {
   ViewContainerRef,
 } from '@angular/core';
 import { RouterLink } from '@angular/router';
+import { NgbDropdownModule } from '@ng-bootstrap/ng-bootstrap';
 import { TranslateModule } from '@ngx-translate/core';
+import {
+  map,
+  Observable,
+} from 'rxjs';
+import { PaginationService } from 'src/app/core/pagination/pagination.service';
+import { PaginationComponentOptions } from 'src/app/shared/pagination/pagination-component-options.model';
 
 import { DSONameService } from '../../../../core/breadcrumbs/dso-name.service';
 import { Bundle } from '../../../../core/shared/bundle.model';
@@ -29,6 +41,10 @@ import { PaginatedDragAndDropBitstreamListComponent } from './paginated-drag-and
     TranslateModule,
     RouterLink,
     ItemEditBitstreamDragHandleComponent,
+    NgbDropdownModule,
+    AsyncPipe,
+    NgClass,
+    NgFor,
   ],
   standalone: true,
 })
@@ -77,20 +93,54 @@ export class ItemEditBitstreamBundleComponent implements OnInit, OnDestroy {
    */
   itemPageRoute: string;
 
+  /**
+   * Reference to child paginatedDragAndDropBitstreamListComponent
+   */
+  @ViewChild(PaginatedDragAndDropBitstreamListComponent) paginatedDragAndDropBitstreamListComponent: PaginatedDragAndDropBitstreamListComponent;
+
+  /**
+   * Options object for PaginationComponent
+   * ID match with default ID to affect all paginated bundles
+   */
+  options = Object.assign(new PaginationComponentOptions(),{
+    id: 'dad',
+  });
+
+  /**
+   * current page size
+   */
+  public pageSize$: Observable<number>;
+
+  public pageSizeOptions: number[];
+
   constructor(
     protected viewContainerRef: ViewContainerRef,
     public dsoNameService: DSONameService,
+    public paginationService: PaginationService,
   ) {
   }
 
   ngOnInit(): void {
     this.bundleNameColumn = this.columnSizes.combineColumns(0, 2);
     this.viewContainerRef.createEmbeddedView(this.bundleView);
     this.itemPageRoute = getItemPageRoute(this.item);
+    this.pageSizeOptions = this.options.pageSizeOptions;
+    this.pageSize$ = this.paginationService.getCurrentPagination(this.options.id, this.options).pipe(
+      map((currentPagination) => currentPagination.pageSize),
+    );
   }
 
   ngOnDestroy(): void {
     this.viewContainerRef.clear();
   }
 
+  /**
+   * Method to update page size in child components
+   *
+   * @param pageSize
+   *    The page size being navigated to.
+   */
+  public doPageSizeChange(pageSize: number) {
+    this.paginatedDragAndDropBitstreamListComponent.paginationComponent.doPageSizeChange(pageSize);
+  }
 }