Merge branch 'w2p-65195_dynamic-component-refactoring' into clean-relationships-in-submission

src/app/shared/object-collection/object-collection.component.ts

@@ -1,45 +1,73 @@
-import {
-  ChangeDetectorRef,
-  Component,
-  EventEmitter,
-  Input,
-  OnChanges,
-  OnInit,
-  Output,
-  SimpleChanges
-} from '@angular/core';
+import { ChangeDetectorRef, Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 
 import { Observable } from 'rxjs';
-import { map } from 'rxjs/operators';
+import { filter, map, startWith } from 'rxjs/operators';
 
 import { RemoteData } from '../../core/data/remote-data';
 import { PageInfo } from '../../core/shared/page-info.model';
 import { PaginationComponentOptions } from '../pagination/pagination-component-options.model';
 import { SortDirection, SortOptions } from '../../core/cache/models/sort-options.model';
 import { ListableObject } from './shared/listable-object.model';
-import { SetViewMode } from '../view-mode';
-import { hasValue, isNotEmpty } from '../empty.util';
+import { isNotEmpty } from '../empty.util';
+import { ViewMode } from '../../core/shared/view-mode.model';
+import { CollectionElementLinkType } from './collection-element-link.type';
+import { PaginatedList } from '../../core/data/paginated-list';
+import { Context } from '../../core/shared/context.model';
 
+/**
+ * Component that can render a list of listable objects in different view modes
+ */
 @Component({
   selector: 'ds-viewable-collection',
   styleUrls: ['./object-collection.component.scss'],
   templateUrl: './object-collection.component.html',
 })
-export class ObjectCollectionComponent implements OnChanges, OnInit {
+export class ObjectCollectionComponent implements OnInit {
+  /**
+   * The list of listable objects to render in this component
+   */
+  @Input() objects: RemoteData<PaginatedList<ListableObject>>;
 
-  @Input() objects: RemoteData<ListableObject[]>;
+  /**
+   * The current pagination configuration
+   */
   @Input() config?: PaginationComponentOptions;
+
+  /**
+   * The current sorting configuration
+   */
   @Input() sortConfig: SortOptions;
+
+  /**
+   * Whether or not the list elements have a border or not
+   */
   @Input() hasBorder = false;
+
+  /**
+   * Whether or not to hide the gear to change the sort and pagination configuration
+   */
   @Input() hideGear = false;
   @Input() selectable = false;
   @Input() selectionConfig: {repeatable: boolean, listId: string};
   @Output() deselectObject: EventEmitter<ListableObject> = new EventEmitter<ListableObject>();
   @Output() selectObject: EventEmitter<ListableObject> = new EventEmitter<ListableObject>();
 
+  /**
+   * The link type of the rendered list elements
+   */
+  @Input() linkType: CollectionElementLinkType;
+
+  /**
+   * The context of the rendered list elements
+   */
+  @Input() context: Context;
+
+  /**
+   * the page info of the list
+   */
   pageInfo: Observable<PageInfo>;
-  private sub;
+
   /**
    * An event fired when the page is changed.
    * Event's payload equals to the newly selected page.
@@ -58,6 +86,9 @@ export class ObjectCollectionComponent implements OnChanges, OnInit {
    */
   @Output() sortDirectionChange: EventEmitter<SortDirection> = new EventEmitter<SortDirection>();
 
+  /**
+   * An event fired one of the pagination parameters is changed
+   */
   @Output() paginationChange: EventEmitter<SortDirection> = new EventEmitter<any>();
 
   /**
@@ -65,26 +96,25 @@ export class ObjectCollectionComponent implements OnChanges, OnInit {
    * Event's payload equals to the newly selected sort field.
    */
   @Output() sortFieldChange: EventEmitter<string> = new EventEmitter<string>();
-  data: any = {};
-  currentMode: SetViewMode = SetViewMode.List;
-  viewModeEnum = SetViewMode;
 
-  ngOnChanges(changes: SimpleChanges) {
-    if (changes.objects && !changes.objects.isFirstChange()) {
-      // this.pageInfo = this.objects.pageInfo;
-    }
-  }
+  /**
+   * Emits the current view mode
+   */
+  currentMode$: Observable<ViewMode>;
+
+  /**
+   * The available view modes
+   */
+  viewModeEnum = ViewMode;
 
   ngOnInit(): void {
-    // this.pageInfo = this.objects.pageInfo;
-
-    this.sub = this.route
+    this.currentMode$ = this.route
       .queryParams
-      .subscribe((params) => {
-        if (isNotEmpty(params.view)) {
-          this.currentMode = params.view;
-        }
-      });
+      .pipe(
+        filter((params) => isNotEmpty(params.view)),
+        map((params) => params.view),
+        startWith(ViewMode.ListElement)
+      );
   }
 
   /**
@@ -101,31 +131,39 @@ export class ObjectCollectionComponent implements OnChanges, OnInit {
     private router: Router) {
   }
 
-  getViewMode(): SetViewMode {
-    this.route.queryParams.pipe(map((params) => {
-      if (isNotEmpty(params.view) && hasValue(params.view)) {
-        this.currentMode = params.view;
-      }
-    }));
-    return this.currentMode;
-  }
-
+  /**
+   * Updates the page
+   * @param event The new page number
+   */
   onPageChange(event) {
     this.pageChange.emit(event);
   }
-
+  /**
+   * Updates the page size
+   * @param event The new page size
+   */
   onPageSizeChange(event) {
     this.pageSizeChange.emit(event);
   }
-
+  /**
+   * Updates the sort direction
+   * @param event The new sort direction
+   */
   onSortDirectionChange(event) {
     this.sortDirectionChange.emit(event);
   }
-
+  /**
+   * Updates the sort field
+   * @param event The new sort field
+   */
   onSortFieldChange(event) {
     this.sortFieldChange.emit(event);
   }
 
+  /**
+   * Updates the pagination
+   * @param event The new pagination
+   */
   onPaginationChange(event) {
     this.paginationChange.emit(event);
   }