59695: Browse-By-Title-Page refactoring

src/app/+browse-by/+browse-by-title-page/browse-by-title-page.component.ts

-import { combineLatest as observableCombineLatest, merge as observableMerge, Observable, Subscription } from 'rxjs';
-import { Component, OnInit } from '@angular/core';
-import { RemoteData } from '../../core/data/remote-data';
-import { PaginatedList } from '../../core/data/paginated-list';
+import { combineLatest as observableCombineLatest } from 'rxjs';
+import { Component } from '@angular/core';
 import { ItemDataService } from '../../core/data/item-data.service';
-import { PaginationComponentOptions } from '../../shared/pagination/pagination-component-options.model';
-import { SortDirection, SortOptions } from '../../core/cache/models/sort-options.model';
-import { Item } from '../../core/shared/item.model';
-import { ActivatedRoute } from '@angular/router';
+import { ActivatedRoute, Router } from '@angular/router';
 import { hasValue } from '../../shared/empty.util';
-import { Collection } from '../../core/shared/collection.model';
-import { browseParamsToOptions } from '../+browse-by-metadata-page/browse-by-metadata-page.component';
+import {
+  BrowseByMetadataPageComponent,
+  browseParamsToOptions
+} from '../+browse-by-metadata-page/browse-by-metadata-page.component';
 import { BrowseEntrySearchOptions } from '../../core/browse/browse-entry-search-options.model';
-import { Community } from '../../core/shared/community.model';
-import { getSucceededRemoteData } from '../../core/shared/operators';
 import { DSpaceObjectDataService } from '../../core/data/dspace-object-data.service';
-import { DSpaceObject } from '../../core/shared/dspace-object.model';
+import { BrowseService } from '../../core/browse/browse.service';
+import { SortDirection, SortOptions } from '../../core/cache/models/sort-options.model';
 
 @Component({
   selector: 'ds-browse-by-title-page',
-  styleUrls: ['./browse-by-title-page.component.scss'],
-  templateUrl: './browse-by-title-page.component.html'
+  styleUrls: ['../+browse-by-metadata-page/browse-by-metadata-page.component.scss'],
+  templateUrl: '../+browse-by-metadata-page/browse-by-metadata-page.component.html'
 })
 /**
  * Component for browsing items by title (dc.title)
  */
-export class BrowseByTitlePageComponent implements OnInit {
-
-  /**
-   * The list of items to display
-   */
-  items$: Observable<RemoteData<PaginatedList<Item>>>;
-
-  /**
-   * The current Community or Collection we're browsing metadata/items in
-   */
-  parent$: Observable<RemoteData<DSpaceObject>>;
-
-  /**
-   * The pagination configuration to use for displaying the list of items
-   */
-  paginationConfig: PaginationComponentOptions = Object.assign(new PaginationComponentOptions(), {
-    id: 'browse-by-title-pagination',
-    currentPage: 1,
-    pageSize: 20
-  });
-
-  /**
-   * The sorting configuration to use for displaying the list of items
-   * Sorted by title (Ascending by default)
-   */
-  sortConfig: SortOptions = new SortOptions('dc.title', SortDirection.ASC);
-
-  /**
-   * List of subscriptions
-   */
-  subs: Subscription[] = [];
-
-  public constructor(private itemDataService: ItemDataService,
-                     private route: ActivatedRoute,
-                     private dsoService: DSpaceObjectDataService) {
+export class BrowseByTitlePageComponent extends BrowseByMetadataPageComponent {
 
+  public constructor(protected route: ActivatedRoute,
+                     protected browseService: BrowseService,
+                     protected dsoService: DSpaceObjectDataService,
+                     protected router: Router,
+                     protected itemDataService: ItemDataService) {
+    super(route, browseService, dsoService, router);
   }
 
   ngOnInit(): void {
+    this.sortConfig = new SortOptions('dc.title', SortDirection.ASC);
     this.updatePage(new BrowseEntrySearchOptions(null, this.paginationConfig, this.sortConfig));
     this.subs.push(
       observableCombineLatest(
         this.route.params,
         this.route.queryParams,
-        (params, queryParams, ) => {
-          return Object.assign({}, params, queryParams);
+        this.route.data,
+        (params, queryParams, data ) => {
+          return Object.assign({}, params, queryParams, data);
         })
         .subscribe((params) => {
+          this.metadata = params.metadata || this.defaultMetadata;
           this.updatePage(browseParamsToOptions(params, this.paginationConfig, this.sortConfig));
           this.updateParent(params.scope)
         }));
+    this.startsWithOptions = [];
   }
 
   /**
@@ -92,18 +64,6 @@ export class BrowseByTitlePageComponent implements OnInit {
     });
   }
 
-  /**
-   * Update the parent Community or Collection using their scope
-   * @param scope   The UUID of the Community or Collection to fetch
-   */
-  updateParent(scope: string) {
-    if (hasValue(scope)) {
-      this.parent$ = this.dsoService.findById(scope).pipe(
-        getSucceededRemoteData()
-      );
-    }
-  }
-
   ngOnDestroy(): void {
     this.subs.filter((sub) => hasValue(sub)).forEach((sub) => sub.unsubscribe());
   }

src/app/+browse-by/browse-by-routing.module.ts

@@ -7,7 +7,7 @@ import { BrowseByDatePageComponent } from './+browse-by-date-page/browse-by-date
 @NgModule({
   imports: [
     RouterModule.forChild([
-      { path: 'title', component: BrowseByTitlePageComponent },
+      { path: 'title', component: BrowseByTitlePageComponent, data: { metadata: 'title' } },
       { path: 'dateissued', component: BrowseByDatePageComponent, data: { metadata: 'dateissued', metadataField: 'dc.date.issued' } },
       { path: ':metadata', component: BrowseByMetadataPageComponent }
     ])