Table & error service updates

src/lib/error/error.service.ts

@@ -2,6 +2,8 @@ import { Injectable } from '@angular/core';
 import { BehaviorSubject, Observable } from 'rxjs';
 import { HttpErrorResponse } from '@angular/common/http';
 import { LoadingService } from '../loading';
+import { filter } from 'rxjs/operators';
+import { NavigationStart, Router } from '@angular/router';
 
 export type Error = HttpErrorResponse | null;
 
@@ -10,8 +12,11 @@ export class ErrorService {
     readonly hasError$: Observable<Error>;
     private readonly _errorEvent$ = new BehaviorSubject<Error>(null);
 
-    constructor(private readonly _loadingService: LoadingService) {
+    constructor(private readonly _loadingService: LoadingService, private readonly _router: Router) {
         this.hasError$ = this._errorEvent$.asObservable();
+        _router.events.pipe(filter(event => event instanceof NavigationStart)).subscribe(() => {
+            this.clear();
+        });
     }
 
     private _error: Error = null;

src/lib/listing/models/table-column-config.model.ts

@@ -11,5 +11,6 @@ export interface TableColumnConfig<T> {
     readonly notTranslatable?: boolean;
     readonly width?: string;
     readonly template?: TemplateRef<unknown>; // TODO: make required
+    readonly extra?: unknown;
     last?: boolean;
 }

src/lib/listing/table/table.component.html

@@ -22,16 +22,15 @@
 <cdk-virtual-scroll-viewport #scrollViewport [itemSize]="itemSize" iqserHasScrollbar>
     <div
         *cdkVirtualFor="let entity of listingComponent.sortedDisplayedEntities$ | async; trackBy: listingComponent.trackByPrimaryKey"
-        [class.pointer]="!!routerLinkFn"
+        [ngClass]="getTableItemClasses(entity)"
         [routerLink]="routerLinkFn(entity)"
-        class="table-item"
     >
         <div (click)="listingComponent.toggleEntitySelected($event, entity)" *ngIf="selectionEnabled" class="selection-column">
             <iqser-round-checkbox [active]="listingComponent.isSelected(entity)"></iqser-round-checkbox>
         </div>
 
         <ng-container *ngFor="let column of tableColumnConfigs">
-            <ng-container *ngTemplateOutlet="column.template; context: { entity: entity }"></ng-container>
+            <ng-container *ngTemplateOutlet="column.template; context: { entity: entity, extra: column.extra }"></ng-container>
         </ng-container>
 
         <div *ngIf="!!actionsTemplate" class="actions-container">

src/lib/listing/table/table.component.scss

@@ -23,7 +23,7 @@ cdk-virtual-scroll-viewport {
                 box-sizing: border-box;
                 border-bottom: 1px solid $separator;
                 height: var(--itemSize);
-                padding: 0 24px 0 var(--paddingLeft);
+                padding: 0 13px 0 var(--paddingLeft);
 
                 &:not(.scrollbar-placeholder):not(.selection-column) {
                     min-width: 110px;

src/lib/listing/table/table.component.ts

@@ -38,6 +38,7 @@ export class TableComponent<T extends Listable> implements OnInit {
     @Input() showNoDataButton = false;
     @Output() readonly noDataAction = new EventEmitter<void>();
     @Input() noMatchText?: string;
+    @Input() tableItemClasses?: { [key: string]: (e: T) => boolean };
     routerLinkFn?: (entity: T) => string | string[];
     tableColumnConfigs!: readonly TableColumnConfig<T>[];
     tableHeaderLabel?: string; // todo not optional
@@ -58,6 +59,19 @@ export class TableComponent<T extends Listable> implements OnInit {
         this._setStyles();
     }
 
+    getTableItemClasses(entity: T): { [key: string]: boolean } {
+        const classes: { [key: string]: boolean } = {
+            'table-item': true,
+            pointer: !!this.routerLinkFn && this.routerLinkFn(entity).length > 0
+        };
+        for (const key in this.tableItemClasses) {
+            if (Object.prototype.hasOwnProperty.call(this.tableItemClasses, key)) {
+                classes[key] = this.tableItemClasses[key](entity);
+            }
+        }
+        return classes;
+    }
+
     private _patchConfig() {
         this.tableColumnConfigs[this.tableColumnConfigs.length - 1].last = true;
     }