UI: Image gallery fixex

ui-ngx/src/app/shared/components/image/image-gallery.component.html

@@ -151,7 +151,9 @@
           <ng-container matColumnDef="preview">
             <mat-header-cell *matHeaderCellDef style="width: 50px; min-width: 50px;"></mat-header-cell>
             <mat-cell *matCellDef="let image">
-              <img class="tb-image-preview" [src]="image.link | image: {preview: true} | async" alt="{{ image.title }}">
+              <div class="tb-image-preview-cell">
+                <img class="tb-image-preview" [src]="image.link | image: {preview: true} | async" alt="{{ image.title }}">
+              </div>
             </mat-cell>
           </ng-container>
           <ng-container matColumnDef="title">
@@ -259,7 +261,8 @@
             </mat-cell>
           </ng-container>
           <mat-header-row [ngClass]="{'mat-row-select': true}" *matHeaderRowDef="displayedColumns; sticky: true"></mat-header-row>
-          <mat-row [ngClass]="{'mat-row-select': true,
+          <mat-row [fxShow]="!dataSource.dataLoading"
+                   [ngClass]="{'mat-row-select': true,
                                'mat-selected': dataSource.selection.isSelected(image)}"
                    *matRowDef="let image; columns: displayedColumns;" (click)="rowClick($event, image)"></mat-row>
         </table>

ui-ngx/src/app/shared/components/image/image-gallery.component.scss

@@ -275,10 +275,14 @@ $tb-button-selected-color: rgb(255, 110, 64) !default;
         width: 50px;
         height: 50px;
         padding: 2px 12px;
-        display: block;
       }
     }
 
+    .tb-image-preview-cell {
+      width: 50px;
+      height: 50px;
+    }
+
     .tb-image-preview {
       width: 50px;
       height: 50px;

ui-ngx/src/app/shared/components/image/image-gallery.component.ts

@@ -29,7 +29,7 @@ import {
   AfterViewInit,
   ChangeDetectorRef,
   Component,
-  ElementRef, EventEmitter,
+  ElementRef, EventEmitter, HostBinding,
   Input,
   OnDestroy,
   OnInit, Output,
@@ -107,6 +107,9 @@ const popoverGridColumns: ScrollGridColumns = {
 })
 export class ImageGalleryComponent extends PageComponent implements OnInit, OnDestroy, AfterViewInit {
 
+  @HostBinding('style.display')
+  private display = 'block';
+
   @Input()
   @coerceBoolean()
   pageMode = true;