UI: Fix scroll grid.

ui-ngx/src/app/modules/home/components/grid/scroll-grid.component.html

@@ -16,9 +16,9 @@
 
 -->
 <cdk-virtual-scroll-viewport #viewport class="tb-scroll-grid-viewport" [itemSize]="itemSize" appendOnly>
-  <ng-container *cdkVirtualFor="let itemsRow of dataSource">
+  <ng-container *cdkVirtualFor="let itemsRow of dataSource; trackBy: trackByItemsRow">
     <div *ngIf="itemsRow" class="tb-scroll-grid-items-row" [style]="{gap: gap+'px'}">
-      <div *ngFor="let item of itemsRow" class="tb-scroll-grid-item-container">
+      <div *ngFor="let item of itemsRow; trackBy: trackByItem" class="tb-scroll-grid-item-container">
         <ng-container *ngIf="item === 'loadingCell'">
           <ng-container *ngTemplateOutlet="loadingCell ? loadingCell : defaultLoadingCell"></ng-container>
         </ng-container>

ui-ngx/src/app/modules/home/components/grid/scroll-grid.component.ts

@@ -100,4 +100,12 @@ export class ScrollGridComponent<T, F> implements OnInit, AfterViewInit, OnChang
   isObject(value: any): boolean {
     return isObject(value);
   }
+
+  trackByItemsRow(index: number, itemsRow: T[]): number {
+    return index;
+  }
+
+  trackByItem(index: number, item: T): T {
+    return item;
+  }
 }

ui-ngx/src/app/shared/models/resource.models.ts

@@ -82,7 +82,9 @@ export interface ImageDescriptor {
   previewDescriptor: ImageDescriptor;
 }
 
-export type ImageResourceInfo = TbResourceInfo<ImageDescriptor>;
+export interface ImageResourceInfo extends TbResourceInfo<ImageDescriptor> {
+  link?: string;
+}
 
 export type ImageResourceType = 'tenant' | 'system';
 

ui-ngx/src/app/shared/pipe/image.pipe.ts

@@ -17,11 +17,13 @@
 import { Pipe, PipeTransform } from '@angular/core';
 import { ImageService } from '@core/http/image.service';
 import { DomSanitizer, SafeUrl } from '@angular/platform-browser';
-import { BehaviorSubject, Observable, of, Subject } from 'rxjs';
+import { BehaviorSubject, Observable, Subject } from 'rxjs';
 import { isDefinedAndNotNull } from '@core/utils';
 import { NO_IMAGE_DATA_URI } from '@shared/models/resource.models';
 
-const LOADING_IMAGE_DATA_URI = 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZlcnNpb249IjEuMSIgdmlld0JveD0iMCAwIDIwIDIwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPgo=';
+const LOADING_IMAGE_DATA_URI = 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRG' +
+                                      'LTgiPz4KPHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZlcnNpb249IjEuMSIgdmlld0JveD0iMCAw' +
+                                      'IDIwIDIwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPgo=';
 
 @Pipe({
   name: 'image'