[DSC-2309] make default async, fix lint

Author: FrancescoMolinaro

src/app/core/shared/image.utils.ts

@@ -1,4 +1,7 @@
-import { Observable, of } from 'rxjs';
+import {
+  Observable,
+  of,
+} from 'rxjs';
 import { map } from 'rxjs/operators';
 
 export const getDefaultImageUrlByEntityType = (entityType: string): Observable<string> => {

src/app/cris-layout/cris-layout-matrix/cris-layout-box-container/boxes/metadata/rendering-types/thumbnail/thumbnail.component.html

@@ -1,4 +1,4 @@
 <ds-thumbnail *ngIf="(initialized | async)" data-test="thumbnail"
               [thumbnail]="thumbnail$ | async"
-              [defaultImage]="default">
+              [defaultImage]="default$ | async">
 </ds-thumbnail>

src/app/cris-layout/cris-layout-matrix/cris-layout-box-container/boxes/metadata/rendering-types/thumbnail/thumbnail.component.spec.ts

@@ -169,10 +169,12 @@ describe('', () => {
         expect(thumbnail).toBeTruthy();
       }));
 
-      it('should show default thumbnail', () => {
-        expect(component.default).toBe('assets/images/file-placeholder.svg');
+      it('should show default thumbnail', (done) => {
+        component.default$.subscribe(image => {
+          expect(image).toBe('assets/images/file-placeholder.svg');
+          done();
+        });
       });
-
     });
 
     describe('When bitstreams are only original', () => {
@@ -189,10 +191,12 @@ describe('', () => {
         expect(thumbnail).toBeTruthy();
       }));
 
-      it('should show default thumbnail', () => {
-        expect(component.default).toBe('assets/images/file-placeholder.svg');
+      it('should show default thumbnail', (done) => {
+        component.default$.subscribe(image => {
+          expect(image).toBe('assets/images/file-placeholder.svg');
+          done();
+        });
       });
-
     });
 
     describe('When bitstreams are only thumbnail', () => {
@@ -263,10 +267,12 @@ describe('', () => {
         expect(thumbnail).toBeTruthy();
       });
 
-      it('should show default thumbnail', () => {
-        expect(component.default).toBe('assets/images/file-placeholder.svg');
+      it('should show default thumbnail', (done) => {
+        component.default$.subscribe(image => {
+          expect(image).toBe('assets/images/file-placeholder.svg');
+          done();
+        });
       });
-
     });
 
     describe('When bitstreams are only original without the right metadata information', () => {
@@ -278,8 +284,11 @@ describe('', () => {
         fixture.detectChanges();
       });
 
-      it('should not show bitstream content image src but the default image', () => {
-        expect(component.default).toBe('assets/images/file-placeholder.svg');
+      it('should not show bitstream content image src but the default image', (done) => {
+        component.default$.subscribe(image => {
+          expect(image).toBe('assets/images/file-placeholder.svg');
+          done();
+        });
       });
 
     });
@@ -293,10 +302,12 @@ describe('', () => {
         fixture.detectChanges();
       });
 
-      it('should not show thumbnail content image src but the default image', () => {
-        expect(component.default).toBe('assets/images/file-placeholder.svg');
+      it('should not show thumbnail content image src but the default image', (done) => {
+        component.default$.subscribe(image => {
+          expect(image).toBe('assets/images/file-placeholder.svg');
+          done();
+        });
       });
-
     });
 
     describe('When bitstreams are only original with the right metadata information', () => {
@@ -308,8 +319,11 @@ describe('', () => {
         fixture.detectChanges();
       });
 
-      it('should not show thumbnail content image src but the default image', () => {
-        expect(component.default).toBe('assets/images/file-placeholder.svg');
+      it('should not show thumbnail content image src but the default image', (done) => {
+        component.default$.subscribe(image => {
+          expect(image).toBe('assets/images/file-placeholder.svg');
+          done();
+        });
       });
 
     });

src/app/cris-layout/cris-layout-matrix/cris-layout-box-container/boxes/metadata/rendering-types/thumbnail/thumbnail.component.ts

@@ -10,28 +10,28 @@ import {
 import { TranslateService } from '@ngx-translate/core';
 import {
   BehaviorSubject,
+  combineLatest,
+  Observable,
   of as observableOf,
 } from 'rxjs';
 import {
   map,
   switchMap,
-  take
 } from 'rxjs/operators';
 
 import { BitstreamDataService } from '../../../../../../../core/data/bitstream-data.service';
 import { PaginatedList } from '../../../../../../../core/data/paginated-list.model';
 import { LayoutField } from '../../../../../../../core/layout/models/box.model';
 import { Bitstream } from '../../../../../../../core/shared/bitstream.model';
+import { getDefaultImageUrlByEntityType } from '../../../../../../../core/shared/image.utils';
 import { Item } from '../../../../../../../core/shared/item.model';
 import { getFirstCompletedRemoteData } from '../../../../../../../core/shared/operators';
 import {
-  hasValue,
   isEmpty,
   isNotEmpty,
 } from '../../../../../../../shared/empty.util';
 import { ThemedThumbnailComponent } from '../../../../../../../thumbnail/themed-thumbnail.component';
 import { BitstreamRenderingModelComponent } from '../bitstream-rendering-model';
-import { getDefaultImageUrlByEntityType } from '../../../../../../../core/shared/image.utils';
 
 @Component({
   // eslint-disable-next-line @angular-eslint/component-selector, dspace-angular-ts/themed-component-selectors
@@ -58,7 +58,7 @@ export class ThumbnailRenderingComponent extends BitstreamRenderingModelComponen
   /**
    * Default image to be shown in the thumbnail
    */
-  default: string;
+  default$: Observable<string>;
 
   /**
    * Item rendering initialization state
@@ -85,9 +85,14 @@ export class ThumbnailRenderingComponent extends BitstreamRenderingModelComponen
    * Get the thumbnail information from api for this item
    */
   ngOnInit(): void {
-    this.setDefaultImage();
-    this.getBitstreamsByItem().pipe(
-      map((bitstreamList: PaginatedList<Bitstream>) => bitstreamList.page),
+    const eType = this.item.firstMetadataValue('dspace.entity.type');
+    this.default$ = getDefaultImageUrlByEntityType(eType);
+
+    combineLatest([
+      this.default$,
+      this.getBitstreamsByItem(),
+    ]).pipe(
+      map(([_, bitstreamList]: [string, PaginatedList<Bitstream>]) => bitstreamList.page),
       switchMap((filteredBitstreams: Bitstream[]) => {
         if (filteredBitstreams.length > 0) {
           if (isEmpty(filteredBitstreams[0].thumbnail)) {
@@ -115,14 +120,4 @@ export class ThumbnailRenderingComponent extends BitstreamRenderingModelComponen
       this.initialized.next(true);
     });
   }
-
-  /**
-   * Set the default image src depending on item entity type
-   */
-  setDefaultImage(): void {
-    const eType = this.item.firstMetadataValue('dspace.entity.type');
-    getDefaultImageUrlByEntityType(eType).pipe(take(1)).subscribe((url) => {
-      this.default = url;
-    });
-  }
 }

src/app/shared/metadata-link-view/metadata-link-view-avatar-popover/metadata-link-view-avatar-popover.component.ts

@@ -9,10 +9,10 @@ import {
   OnInit,
 } from '@angular/core';
 import { TranslateModule } from '@ngx-translate/core';
-import { ThumbnailComponent } from 'src/app/thumbnail/thumbnail.component';
-import { getDefaultImageUrlByEntityType } from '../../../core/shared/image.utils';
 import { Observable } from 'rxjs';
+import { ThumbnailComponent } from 'src/app/thumbnail/thumbnail.component';
 
+import { getDefaultImageUrlByEntityType } from '../../../core/shared/image.utils';
 import { ThemedLoadingComponent } from '../../loading/themed-loading.component';
 import { SafeUrlPipe } from '../../utils/safe-url-pipe';
 import { VarDirective } from '../../utils/var.directive';