@firestitch/list 13.0.7 → 13.1.1

package/fesm2020/firestitch-list.mjs

@@ -2660,6 +2660,24 @@ class SortingController {
         this.sortBy(column);
         this.sortDirection(column.direction || SortingDirection.asc);
     }
+    /**
+     * Merge sorting and fake sorting cols
+     * Fake sorting cols it's cols which don't represented in table cols, like abstract cols
+     */
+    makeSortingList() {
+        return [
+            ...this.sortingColumns,
+            ...this.fakeSortingColumns,
+        ].reduce((acc, column) => {
+            const sortingItem = {
+                name: column.title,
+                value: column.name,
+                default: this.sortingColumn && this.sortingColumn.name === column.name,
+            };
+            acc.push(sortingItem);
+            return acc;
+        }, []);
+    }
     getColumn(name) {
         return [...this.sortingColumns, ...this.fakeSortingColumns]
             .find((col) => col.name === name && col.sortable);
@@ -4058,11 +4076,11 @@ class PaginationController {
     }
 }
 
-const SHOW_DELETED_FILTERS_KEY = '_showDeleted_';
+const showDeletedFilterKey = 'showDeleted';
 class List {
-    constructor(_el, config = {}, _fsScroll, _selectionDialog, _router, _route, _persistance, _inDialog) {
+    constructor(_el, _config = {}, _fsScroll, _selectionDialog, _router, _route, _persistance, _inDialog) {
         this._el = _el;
-        this.config = config;
+        this._config = _config;
         this._fsScroll = _fsScroll;
         this._selectionDialog = _selectionDialog;
         this._router = _router;
@@ -4070,14 +4088,13 @@ class List {
         this._persistance = _persistance;
         this._inDialog = _inDialog;
         this.filters = [];
-        this.initialized$ = new BehaviorSubject(false);
-        this.loading$ = new BehaviorSubject(false);
         this.paging = new PaginationController();
         this.columns = new ColumnsController();
         this.actions = new ActionsController();
         this.dataController = new DataController();
         this.sorting = new SortingController();
         this.filterConfig = null;
+        this.loading$ = new BehaviorSubject(false);
         this.fetchComplete$ = new Subject();
         this.filtersReady$ = new Subject();
         this.status = true;
@@ -4088,17 +4105,18 @@ class List {
         this.initialFetch = true;
         // Empty state
         this.emptyStateEnabled = false;
-        this.onDestroy$ = new Subject();
+        this._destroy$ = new Subject();
+        this._initialized$ = new BehaviorSubject(false);
         this._fetch$ = new Subject();
         this._filtersQuery = new BehaviorSubject(null);
         this._activeFiltersCount$ = this._filtersQuery
             .pipe(map((v) => Object.keys(v).length), shareReplay());
-        this._initialize(config);
-        this._headerConfig = new StyleConfig(config.header);
-        this._groupCellConfig = new StyleConfig(config.cell);
-        this._cellConfig = new StyleConfig(config.cell);
-        this._footerConfig = new StyleConfig(config.footer);
-        this.initialized$.next(true);
+        this._initialize(_config);
+        this._headerConfig = new StyleConfig(_config.header);
+        this._groupCellConfig = new StyleConfig(_config.cell);
+        this._cellConfig = new StyleConfig(_config.cell);
+        this._footerConfig = new StyleConfig(_config.footer);
+        this._initialized$.next(true);
         this.subscribe();
         if (this.initialFetch) {
             this.dataController.setOperation(FsListState.Load);
@@ -4117,6 +4135,12 @@ class List {
     get activeFiltersCount$() {
         return this._activeFiltersCount$;
     }
+    get destroy$() {
+        return this._destroy$;
+    }
+    get initialized$() {
+        return this._initialized$;
+    }
     fetchRemote(query) {
         const options = {
             state: this.dataController.operation,
@@ -4149,7 +4173,7 @@ class List {
         this._updateSortingColumns();
         // Default sort by
         const externalSorting = this.externalParams.externalSorting;
-        const initialSortConfig = externalSorting || this.config.sort;
+        const initialSortConfig = externalSorting || this._config.sort;
         this.sorting.initialSortBy(initialSortConfig);
         if (externalSorting && !this.sorting.isDefined) {
             this.externalParams.clearSortingParams();
@@ -4175,7 +4199,7 @@ class List {
      */
     subscribe() {
         this.paging.pageChanged$
-            .pipe(takeUntil(this.onDestroy$))
+            .pipe(takeUntil(this._destroy$))
             .subscribe((event) => {
             this.dataController.setOperation(FsListState.PageChange);
             // Remove all rows if limits was changed
@@ -4197,12 +4221,12 @@ class List {
                 let el = this._el.nativeElement;
                 if (!contains) {
                     const rect = this._el.nativeElement.getBoundingClientRect();
-                    if ((rect.top + window.pageYOffset) < window.innerHeight) {
+                    if ((Number(rect.top || 0) + window.pageYOffset) < window.innerHeight) {
                         el = document.body;
                     }
                 }
                 this.fetchComplete$.asObservable()
-                    .pipe(take(1), takeUntil(this.onDestroy$))
+                    .pipe(take(1), takeUntil(this._destroy$))
                     .subscribe((event) => {
                     if (event?.scrollIntoView ?? true) {
                         el.scrollIntoView({ behavior: 'smooth' });
@@ -4212,7 +4236,7 @@ class List {
             this._fetch$.next();
         });
         this.sorting.sortingChanged$
-            .pipe(takeUntil(this.onDestroy$))
+            .pipe(takeUntil(this._destroy$))
             .subscribe(() => {
             this.dataController.setOperation(FsListState.Sort);
             this.paging.page = 1;
@@ -4276,8 +4300,8 @@ class List {
             this.externalParams.destroy();
         }
         this.columns.destroy();
-        this.onDestroy$.next();
-        this.onDestroy$.complete();
+        this._destroy$.next();
+        this._destroy$.complete();
         this.dataController.destroy();
     }
     /**
@@ -4298,7 +4322,7 @@ class List {
     }
     _initVariables(config) {
         this.autoFocus = config.autoFocus;
-        this.rowHighlight = config.rowHighlight ?? true;
+        this.rowHoverHighlight = config.rowHoverHighlight ?? true;
         this.heading = config.heading;
         this.trackBy = config.trackBy;
         this.subheading = config.subheading;
@@ -4319,6 +4343,7 @@ class List {
         this.beforeFetchFn = config.beforeFetch;
         this.afterInit = config.afterInit;
         this.style = config.style;
+        this.autoReload = config.autoReload;
         this.columns.initConfig(config.column);
     }
     /**
@@ -4345,7 +4370,7 @@ class List {
             this.queryParam = false;
         }
         else {
-            this.queryParam = (config.queryParam === void 0)
+            this.queryParam = (config.queryParam === undefined)
                 ? true
                 : config.queryParam;
         }
@@ -4383,7 +4408,7 @@ class List {
             }
             if (this.restore.filter !== false) {
                 this.filters.push({
-                    name: SHOW_DELETED_FILTERS_KEY,
+                    name: showDeletedFilterKey,
                     type: ItemType.Checkbox,
                     label: this.restore.filterLabel || 'Show Deleted',
                 });
@@ -4437,7 +4462,7 @@ class List {
     _listenFetch() {
         let fetch$ = this.fetch$;
         // Should wait until saved filters not loaded
-        if (!!this.filters) {
+        if (this.filters) {
             fetch$ = combineLatest([fetch$, this.filtersReady$])
                 .pipe(map(([params]) => params));
         }
@@ -4493,7 +4518,7 @@ class List {
         }), catchError((error) => {
             console.error(error);
             return EMPTY;
-        }), takeUntil(this.onDestroy$))
+        }), takeUntil(this._destroy$))
             .subscribe(([paramsQuery, response]) => {
             this.initialFetch = false;
             this._completeFetch(paramsQuery.params, paramsQuery.query, response);
@@ -4501,7 +4526,7 @@ class List {
     }
     _listenRowsRemove() {
         this.dataController.rowsRemoved$
-            .pipe(takeUntil(this.onDestroy$))
+            .pipe(takeUntil(this._destroy$))
             .subscribe((rows) => {
             if (this.paging.enabled) {
                 const removedCount = rows.length;
@@ -4534,7 +4559,7 @@ class List {
      */
     _listenVisibleColumnChanges() {
         this.columns.visibleColumns$
-            .pipe(takeUntil(this.onDestroy$))
+            .pipe(takeUntil(this._destroy$))
             .subscribe(() => {
             this._updateSortingColumns();
         });
@@ -4545,12 +4570,12 @@ class List {
         }
         if (this.scrollable) {
             // Scrollable status by default
-            if (this.scrollable.status === void 0) {
+            if (this.scrollable.status === undefined) {
                 this.scrollable.status = true;
             }
             this._fsScroll
                 .component(this.scrollable.name)
-                .pipe(takeUntil(this.onDestroy$))
+                .pipe(takeUntil(this._destroy$))
                 .subscribe((fsScrollInstance) => {
                 this.fsScrollInstance = fsScrollInstance;
                 this._fsScrollSubscription = fsScrollInstance
@@ -4581,7 +4606,7 @@ class List {
                     }
                 });
                 this.dataController.remoteRowsChange$
-                    .pipe(takeUntil(this.onDestroy$))
+                    .pipe(takeUntil(this._destroy$))
                     .subscribe(() => {
                     fsScrollInstance.loaded();
                 });
@@ -4595,20 +4620,7 @@ class List {
         if (this.filterConfig) {
             return;
         }
-        // Merge sorting and fake sorting cols
-        // Fake sorting cols it's cols which don't represented in table cols, like abstract cols
-        const sortValues = [
-            ...this.sorting.sortingColumns,
-            ...this.sorting.fakeSortingColumns,
-        ].reduce((acc, column) => {
-            const sortingItem = {
-                name: column.title,
-                value: column.name,
-                default: this.sorting.sortingColumn && this.sorting.sortingColumn.name === column.name,
-            };
-            acc.push(sortingItem);
-            return acc;
-        }, []);
+        const sortValues = this.sorting.makeSortingList();
         const sortConfig = this.sorting.sortingColumn
             ? { value: this.sorting.sortingColumn.name, direction: this.sorting.sortingColumn.direction }
             : null;
@@ -4624,9 +4636,10 @@ class List {
             sorts: sortValues,
             sort: sortConfig,
             chips: this.chips,
+            autoReload: this.autoReload,
             init: this._filterInit.bind(this),
             change: this._filterChange.bind(this),
-            reload: (this.config.reload ?? true) ? this.reload.bind(this) : null,
+            reload: (this._config.reload ?? true) ? this.reload.bind(this) : null,
             sortChange: this._filterSort.bind(this),
         };
     }
@@ -4672,8 +4685,8 @@ class List {
     }
     _checkRestoreFilter() {
         // Restore option
-        if (this.restore && this.filtersQuery[SHOW_DELETED_FILTERS_KEY]) {
-            delete this.filtersQuery[SHOW_DELETED_FILTERS_KEY];
+        if (this.restore && this.filtersQuery[showDeletedFilterKey]) {
+            delete this.filtersQuery[showDeletedFilterKey];
             Object.assign(this.filtersQuery, this.restore.query);
             this.restoreMode = true;
         }
@@ -4776,10 +4789,9 @@ class List {
         const restoreClickResult = restoreClickCallback(row);
         if (restoreClickResult instanceof Observable) {
             restoreClickResult
-                .pipe(take(1), takeUntil(this.onDestroy$))
+                .pipe(take(1), takeUntil(this._destroy$))
                 .subscribe({
                 next: () => this.reload(),
-                error: () => { },
             });
         }
     }
@@ -5412,6 +5424,7 @@ class FsListComponent {
      */
     columnVisibility(name, show) {
         this.columnsVisibility([{ name, show }]);
+        this.filterRef.updateSortings(this.list.sorting.makeSortingList());
     }
     /**
      * Update visibility for list of specific columns
@@ -5444,7 +5457,7 @@ class FsListComponent {
         }
         this._updateCustomizeAction(listConfig.actions);
         this.list = new List(this._el, listConfig, this._scroll, this._selectionDialog, this._router, this._route, this._persistance, this._inDialog);
-        this.rowHighlight = this.list.rowHighlight;
+        this.rowHoverHighlight = this.list.rowHoverHighlight;
         this._waitFirstLoad();
         this.reorderController.initWithConfig(config.reorder, this.list.dataController, this.list.actions, this.list.selection);
         if (this._listColumnDirectives) {
@@ -5472,7 +5485,7 @@ class FsListComponent {
                     },
                 })
                     .afterClosed()
-                    .pipe(takeUntil(this.list.onDestroy$), takeUntil(this._destroy))
+                    .pipe(takeUntil(this.list.destroy$), takeUntil(this._destroy))
                     .subscribe((data) => {
                     if (data) {
                         this.list.columns.updateVisibilityForCols(data);
@@ -5488,7 +5501,7 @@ class FsListComponent {
     _listenSortingChange() {
         this.list.sorting
             .sortingChanged$
-            .pipe(takeUntil(this.list.onDestroy$), takeUntil(this._destroy))
+            .pipe(takeUntil(this.list.destroy$), takeUntil(this._destroy))
             .subscribe((sort) => {
             this._filterRef.updateSort(sort);
         });
@@ -5499,7 +5512,7 @@ class FsListComponent {
             .subscribe((row) => {
             this.list.dataController.removeData(row);
             this.body.rows
-                .forEach((row) => row.actionsUpdate());
+                .forEach((bodyRow) => bodyRow.actionsUpdate());
         });
     }
     _subscribeToGroupExpandStatusChange() {
@@ -5513,7 +5526,7 @@ class FsListComponent {
     }
     _waitFirstLoad() {
         this.list.loading$
-            .pipe(skip(1), filter((value) => !value), take(1), takeUntil(this.list.onDestroy$), takeUntil(this._destroy))
+            .pipe(skip(1), filter((value) => !value), take(1), takeUntil(this.list.destroy$), takeUntil(this._destroy))
             .subscribe(() => {
             this.firstLoad = false;
             this._cdRef.markForCheck();
@@ -5530,7 +5543,7 @@ class FsListComponent {
     }
 }
 FsListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: FsListComponent, deps: [{ token: ReorderController }, { token: FS_LIST_DEFAULT_CONFIG, optional: true }, { token: i2$4.FsScrollService, optional: true }, { token: i1$2.MatDialogRef, optional: true }, { token: i4$1.DrawerRef, optional: true }, { token: i0.ElementRef }, { token: i5.SelectionDialog }, { token: i1$2.MatDialog }, { token: i0.ChangeDetectorRef }, { token: GroupExpandNotifierService }, { token: i7.Router }, { token: i7.ActivatedRoute }, { token: PersistanceController }, { token: i3.Location }], target: i0.ɵɵFactoryTarget.Component });
-FsListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: FsListComponent, selector: "fs-list", inputs: { config: "config", loaderLines: "loaderLines" }, outputs: { filtersReady: "filtersReady" }, host: { properties: { "class.fs-list": "this.classFsList", "class.fs-list-row-highlight": "this.rowHighlight" } }, providers: [
+FsListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: FsListComponent, selector: "fs-list", inputs: { config: "config", loaderLines: "loaderLines" }, outputs: { filtersReady: "filtersReady" }, host: { properties: { "class.fs-list": "this.classFsList", "class.fs-list-row-highlight": "this.rowHoverHighlight" } }, providers: [
         GroupExpandNotifierService,
         PersistanceController,
         ReorderController,
@@ -5556,7 +5569,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
                 }] }, { type: i0.ElementRef }, { type: i5.SelectionDialog }, { type: i1$2.MatDialog }, { type: i0.ChangeDetectorRef }, { type: GroupExpandNotifierService }, { type: i7.Router }, { type: i7.ActivatedRoute }, { type: PersistanceController }, { type: i3.Location }]; }, propDecorators: { classFsList: [{
                 type: HostBinding,
                 args: ['class.fs-list']
-            }], rowHighlight: [{
+            }], rowHoverHighlight: [{
                 type: HostBinding,
                 args: ['class.fs-list-row-highlight']
             }], config: [{