From 319860f4209b6d8ad2d4041d62e2fc61f17a5435 Mon Sep 17 00:00:00 2001 From: Richard Cox Date: Fri, 27 Nov 2020 18:00:58 +0000 Subject: [PATCH] Fix clear and auto select multi filter/s on reset --- .../application-wall.component.html | 1 + .../application-wall.component.ts | 31 ++--- .../services-wall.component.html | 1 + .../services-wall/services-wall.component.ts | 21 +--- .../cf-routes-list-config.service.ts | 13 +- .../cf-org-space-service.service.ts | 71 +++++------ .../list-pagination-controller.ts | 23 +++- .../endpoint/endpoints-list-config.service.ts | 2 +- .../shared/components/list/list.component.ts | 116 ++++++++++-------- .../components/list/list.component.types.ts | 11 +- .../src/helpers/local-storage-service.ts | 7 +- 11 files changed, 149 insertions(+), 148 deletions(-) diff --git a/src/frontend/packages/cloud-foundry/src/features/applications/application-wall/application-wall.component.html b/src/frontend/packages/cloud-foundry/src/features/applications/application-wall/application-wall.component.html index 34ef360c0f..b533b0a99a 100644 --- a/src/frontend/packages/cloud-foundry/src/features/applications/application-wall/application-wall.component.html +++ b/src/frontend/packages/cloud-foundry/src/features/applications/application-wall/application-wall.component.html @@ -23,5 +23,6 @@

Applications

\ No newline at end of file diff --git a/src/frontend/packages/cloud-foundry/src/features/applications/application-wall/application-wall.component.ts b/src/frontend/packages/cloud-foundry/src/features/applications/application-wall/application-wall.component.ts index 79bb6cb74c..7552b1a9d3 100644 --- a/src/frontend/packages/cloud-foundry/src/features/applications/application-wall/application-wall.component.ts +++ b/src/frontend/packages/cloud-foundry/src/features/applications/application-wall/application-wall.component.ts @@ -2,15 +2,13 @@ import { animate, query, style, transition, trigger } from '@angular/animations' import { Component, OnDestroy } from '@angular/core'; import { ActivatedRoute } from '@angular/router'; import { Store } from '@ngrx/store'; -import { Observable, Subscription } from 'rxjs'; +import { Observable } from 'rxjs'; import { map } from 'rxjs/operators'; import { CFAppState } from '../../../../../cloud-foundry/src/cf-app-state'; -import { applicationEntityType } from '../../../../../cloud-foundry/src/cf-entity-types'; import { ListConfig } from '../../../../../core/src/shared/components/list/list.component.types'; import { CfAppConfigService } from '../../../shared/components/list/list-types/app/cf-app-config.service'; -import { CfAppsDataSource } from '../../../shared/components/list/list-types/app/cf-apps-data-source'; -import { CfOrgSpaceDataService, initCfOrgSpaceService } from '../../../shared/data-services/cf-org-space-service.service'; +import { CfOrgSpaceDataService } from '../../../shared/data-services/cf-org-space-service.service'; import { CloudFoundryService } from '../../../shared/data-services/cloud-foundry.service'; import { CfCurrentUserPermissions } from '../../../user-permissions/cf-user-permissions-checkers'; import { goToAppWall } from '../../cf/cf.helpers'; @@ -22,13 +20,13 @@ import { goToAppWall } from '../../cf/cf.helpers'; animations: [ trigger( 'cardEnter', [ - transition('* => *', [ - query(':enter', [ - style({ opacity: 0, transform: 'translateY(10px)' }), - animate('150ms ease-out', style({ opacity: 1, transform: 'translateY(0)' })) - ], { optional: true }) - ]) - ] + transition('* => *', [ + query(':enter', [ + style({ opacity: 0, transform: 'translateY(10px)' }), + animate('150ms ease-out', style({ opacity: 1, transform: 'translateY(0)' })) + ], { optional: true }) + ]) + ] ) ], providers: [{ @@ -40,7 +38,6 @@ import { goToAppWall } from '../../cf/cf.helpers'; }) export class ApplicationWallComponent implements OnDestroy { public cfIds$: Observable; - private initCfOrgSpaceService: Subscription; public canCreateApplication: string; @@ -49,7 +46,7 @@ export class ApplicationWallComponent implements OnDestroy { constructor( public cloudFoundryService: CloudFoundryService, private store: Store, - private cfOrgSpaceService: CfOrgSpaceDataService, + public cfOrgSpaceService: CfOrgSpaceDataService, activatedRoute: ActivatedRoute, ) { // If we have an endpoint ID, select it and redirect @@ -67,16 +64,8 @@ export class ApplicationWallComponent implements OnDestroy { this.haveConnectedCf$ = cloudFoundryService.connectedCFEndpoints$.pipe( map(endpoints => !!endpoints && endpoints.length > 0) ); - - this.initCfOrgSpaceService = initCfOrgSpaceService(this.store, - this.cfOrgSpaceService, - applicationEntityType, - CfAppsDataSource.paginationKey).subscribe(); } ngOnDestroy(): void { - if (this.initCfOrgSpaceService) { - this.initCfOrgSpaceService.unsubscribe(); - } } } diff --git a/src/frontend/packages/cloud-foundry/src/features/services/services-wall/services-wall.component.html b/src/frontend/packages/cloud-foundry/src/features/services/services-wall/services-wall.component.html index b47b7c7e12..d188fc7735 100644 --- a/src/frontend/packages/cloud-foundry/src/features/services/services-wall/services-wall.component.html +++ b/src/frontend/packages/cloud-foundry/src/features/services/services-wall/services-wall.component.html @@ -26,5 +26,6 @@

Services

\ No newline at end of file diff --git a/src/frontend/packages/cloud-foundry/src/features/services/services-wall/services-wall.component.ts b/src/frontend/packages/cloud-foundry/src/features/services/services-wall/services-wall.component.ts index 3f30841d43..05f0c8b613 100644 --- a/src/frontend/packages/cloud-foundry/src/features/services/services-wall/services-wall.component.ts +++ b/src/frontend/packages/cloud-foundry/src/features/services/services-wall/services-wall.component.ts @@ -1,17 +1,13 @@ -import { Component, OnDestroy } from '@angular/core'; +import { Component } from '@angular/core'; import { Store } from '@ngrx/store'; import { Observable, Subscription } from 'rxjs'; import { map } from 'rxjs/operators'; import { CFAppState } from '../../../../../cloud-foundry/src/cf-app-state'; -import { serviceInstancesEntityType } from '../../../../../cloud-foundry/src/cf-entity-types'; import { ServiceInstancesWallListConfigService, } from '../../../../../cloud-foundry/src/shared/components/list/list-types/services-wall/service-instances-wall-list-config.service'; -import { - CfOrgSpaceDataService, - initCfOrgSpaceService, -} from '../../../../../cloud-foundry/src/shared/data-services/cf-org-space-service.service'; +import { CfOrgSpaceDataService } from '../../../../../cloud-foundry/src/shared/data-services/cf-org-space-service.service'; import { CloudFoundryService } from '../../../../../cloud-foundry/src/shared/data-services/cloud-foundry.service'; import { ListConfig } from '../../../../../core/src/shared/components/list/list.component.types'; import { CSI_CANCEL_URL } from '../../../shared/components/add-service-instance/csi-mode.service'; @@ -29,7 +25,7 @@ import { CfCurrentUserPermissions } from '../../../user-permissions/cf-user-perm CfOrgSpaceDataService ] }) -export class ServicesWallComponent implements OnDestroy { +export class ServicesWallComponent { public haveConnectedCf$: Observable; @@ -41,7 +37,7 @@ export class ServicesWallComponent implements OnDestroy { constructor( public cloudFoundryService: CloudFoundryService, public store: Store, - private cfOrgSpaceService: CfOrgSpaceDataService) { + public cfOrgSpaceService: CfOrgSpaceDataService) { this.canCreateServiceInstance = CfCurrentUserPermissions.SERVICE_INSTANCE_CREATE; this.cfIds$ = cloudFoundryService.cFEndpoints$.pipe( @@ -51,11 +47,6 @@ export class ServicesWallComponent implements OnDestroy { ) ); - this.initCfOrgSpaceService = initCfOrgSpaceService(this.store, - this.cfOrgSpaceService, - serviceInstancesEntityType, - 'all').subscribe(); - this.haveConnectedCf$ = cloudFoundryService.connectedCFEndpoints$.pipe( map(endpoints => !!endpoints && endpoints.length > 0) ); @@ -64,8 +55,4 @@ export class ServicesWallComponent implements OnDestroy { [CSI_CANCEL_URL]: `/services` }; } - - ngOnDestroy(): void { - this.initCfOrgSpaceService.unsubscribe(); - } } diff --git a/src/frontend/packages/cloud-foundry/src/shared/components/list/list-types/cf-routes/cf-routes-list-config.service.ts b/src/frontend/packages/cloud-foundry/src/shared/components/list/list-types/cf-routes/cf-routes-list-config.service.ts index f800809ecf..4aac8771d7 100644 --- a/src/frontend/packages/cloud-foundry/src/shared/components/list/list-types/cf-routes/cf-routes-list-config.service.ts +++ b/src/frontend/packages/cloud-foundry/src/shared/components/list/list-types/cf-routes/cf-routes-list-config.service.ts @@ -16,11 +16,7 @@ import { import { APIResource } from '../../../../../../../store/src/types/api.types'; import { CloudFoundryEndpointService } from '../../../../../features/cf/services/cloud-foundry-endpoint.service'; import { CfCurrentUserPermissions } from '../../../../../user-permissions/cf-user-permissions-checkers'; -import { - CfOrgSpaceDataService, - createCfOrgSpaceFilterConfig, - initCfOrgSpaceService, -} from '../../../../data-services/cf-org-space-service.service'; +import { CfOrgSpaceDataService, createCfOrgSpaceFilterConfig } from '../../../../data-services/cf-org-space-service.service'; import { CfRoutesDataSource } from './cf-routes-data-source'; import { ListCfRoute } from './cf-routes-data-source-base'; import { CfRoutesListConfigBase } from './cf-routes-list-config-base'; @@ -76,10 +72,6 @@ export class CfRoutesListConfigService extends CfRoutesListConfigBase implements createCfOrgSpaceFilterConfig('org', 'Organization', cfOrgSpaceService.org), ]; this.getMultiFiltersConfigs = () => multiFilterConfigs; - initCfOrgSpaceService(store, cfOrgSpaceService, - this.dataSource.masterAction.entityType, - this.dataSource.masterAction.paginationKey).subscribe(); - cfOrgSpaceService.cf.select.next(cfService.cfGuid); this.getInitialised = () => combineLatest( cfOrgSpaceService.cf.list$, @@ -89,5 +81,8 @@ export class CfRoutesListConfigService extends CfRoutesListConfigBase implements map(loading => !loading), startWith(true) ); + + cfOrgSpaceService.enableAutoSelectors(); // TODO: RC TEST + // (initialised)="cfOrgSpaceService.enableAutoSelectors()" } } diff --git a/src/frontend/packages/cloud-foundry/src/shared/data-services/cf-org-space-service.service.ts b/src/frontend/packages/cloud-foundry/src/shared/data-services/cf-org-space-service.service.ts index e8ce2c3184..ec461538f1 100644 --- a/src/frontend/packages/cloud-foundry/src/shared/data-services/cf-org-space-service.service.ts +++ b/src/frontend/packages/cloud-foundry/src/shared/data-services/cf-org-space-service.service.ts @@ -1,17 +1,7 @@ import { Injectable, OnDestroy } from '@angular/core'; import { Store } from '@ngrx/store'; import { BehaviorSubject, combineLatest, Observable, Subscription } from 'rxjs'; -import { - distinctUntilChanged, - filter, - first, - map, - publishReplay, - refCount, - startWith, - tap, - withLatestFrom, -} from 'rxjs/operators'; +import { distinctUntilChanged, filter, first, map, publishReplay, refCount, tap, withLatestFrom } from 'rxjs/operators'; import { CFAppState } from '../../../../cloud-foundry/src/cf-app-state'; import { organizationEntityType, spaceEntityType } from '../../../../cloud-foundry/src/cf-entity-types'; @@ -28,7 +18,6 @@ import { PaginationMonitorFactory } from '../../../../store/src/monitors/paginat import { getPaginationObservables } from '../../../../store/src/reducers/pagination-reducer/pagination-reducer.helper'; import { getCurrentPageRequestInfo } from '../../../../store/src/reducers/pagination-reducer/pagination-reducer.types'; import { connectedEndpointsOfTypesSelector } from '../../../../store/src/selectors/endpoint.selectors'; -import { selectPaginationState } from '../../../../store/src/selectors/pagination.selectors'; import { APIResource } from '../../../../store/src/types/api.types'; import { EndpointModel } from '../../../../store/src/types/endpoint.types'; import { PaginatedAction, PaginationParam } from '../../../../store/src/types/pagination.types'; @@ -78,28 +67,28 @@ export const enum CfOrgSpaceSelectMode { } -export const initCfOrgSpaceService = ( - store: Store, - cfOrgSpaceService: CfOrgSpaceDataService, - entityKey: string, - paginationKey: string): Observable => { - return store.select(selectPaginationState(entityKey, paginationKey)).pipe( - filter((pag) => !!pag), - first(), - tap(pag => { - const { cf, org, space } = pag.clientPagination.filter.items; - if (cf) { - cfOrgSpaceService.cf.select.next(cf); - } - if (org) { - cfOrgSpaceService.org.select.next(org); - } - if (space) { - cfOrgSpaceService.space.select.next(space); - } - }) - ); -}; +// export const initCfOrgSpaceService = ( +// store: Store, +// cfOrgSpaceService: CfOrgSpaceDataService, +// entityKey: string, +// paginationKey: string): Observable => { +// return store.select(selectPaginationState(entityKey, paginationKey)).pipe( +// filter((pag) => !!pag), +// first(), +// tap(pag => { +// const { cf, org, space } = pag.clientPagination.filter.items; +// if (cf) { +// cfOrgSpaceService.cf.select.next(cf); +// } +// if (org) { +// cfOrgSpaceService.org.select.next(org); +// } +// if (space) { +// cfOrgSpaceService.space.select.next(space); +// } +// }) +// ); +// }; export const createCfOrSpaceMultipleFilterFn = ( store: Store, @@ -154,7 +143,6 @@ export const createCfOrSpaceMultipleFilterFn = ( }; }; - /** * This service relies on OnDestroy, so must be `provided` by a component */ @@ -182,6 +170,8 @@ export class CfOrgSpaceDataService implements OnDestroy { private selectMode = CfOrgSpaceSelectMode.FIRST_ONLY; private subs: Subscription[] = []; + public pEnableAutoSelectors = false; + constructor( private store: Store, public paginationMonitorFactory: PaginationMonitorFactory, @@ -318,11 +308,16 @@ export class CfOrgSpaceDataService implements OnDestroy { ); } - private setupAutoSelectors() { + public enableAutoSelectors() { + setTimeout(() => this.pEnableAutoSelectors = true, 100); + } + + private setupAutoSelectors( + ) { const orgResetSub = this.cf.select.asObservable().pipe( - startWith(undefined), distinctUntilChanged(), withLatestFrom(this.org.list$), + filter(() => this.pEnableAutoSelectors), tap(([selectedCF, orgs]) => { if ( !!orgs.length && @@ -340,9 +335,9 @@ export class CfOrgSpaceDataService implements OnDestroy { // Clear or automatically select space given org const spaceResetSub = this.org.select.asObservable().pipe( - startWith(undefined), distinctUntilChanged(), withLatestFrom(this.space.list$), + filter(() => this.pEnableAutoSelectors), tap(([selectedOrg, spaces]) => { if ( !!spaces.length && diff --git a/src/frontend/packages/core/src/shared/components/list/data-sources-controllers/list-pagination-controller.ts b/src/frontend/packages/core/src/shared/components/list/data-sources-controllers/list-pagination-controller.ts index 0cdf9bd632..2fa848bede 100644 --- a/src/frontend/packages/core/src/shared/components/list/data-sources-controllers/list-pagination-controller.ts +++ b/src/frontend/packages/core/src/shared/components/list/data-sources-controllers/list-pagination-controller.ts @@ -115,7 +115,7 @@ export class ListPaginationController implements IListPaginationController }, this.dataSource.isLocal)); } }); - } + }; filterByString = filterString => { onPaginationEntityState(this.dataSource.pagination$, (paginationEntityState) => { if (this.dataSource.isLocal) { @@ -132,17 +132,27 @@ export class ListPaginationController implements IListPaginationController this.dataSource.setFilterParam(filterString, paginationEntityState); } }); - } + }; handleMultiFilter = (changes: ListPaginationMultiFilterChange[]) => { + console.log('handleMultiFilter: Before', changes); // TODO: RC remove onPaginationEntityState(this.dataSource.pagination$, (paginationEntityState) => { if (!paginationEntityState) { return; } - // We don't want to dispatch actions if it's a no op (values are not different, falsies are treated as the same). This avoids other + // Changes may include multiple updates for the same key, so only use the very latest + const uniqueChanges = []; + for (let i = changes.length - 1; i >= 0; i--) { + const change = changes[i]; + if (!uniqueChanges.find(e => e.key === change.key)) { + uniqueChanges.push(change); + } + } + console.log('handleMultiFilter: Clean 1', uniqueChanges); // TODO: RC remove + // We don't want to dispatch actions if it's a no op (values are not different, falsies are treated as the same). This avoids other // chained actions from firing. - const cleanChanges = changes.reduce((newCleanChanges, change) => { + const cleanChanges = uniqueChanges.reduce((newCleanChanges, change) => { const storeFilterParamValue = valueOrCommonFalsy(paginationEntityState.clientPagination.filter.items[change.key]); const newFilterParamValue = valueOrCommonFalsy(change.value); if (storeFilterParamValue !== newFilterParamValue) { @@ -150,6 +160,7 @@ export class ListPaginationController implements IListPaginationController } return newCleanChanges; }, {}); + console.log('handleMultiFilter: Clean 2', cleanChanges); // TODO: RC remove if (Object.keys(cleanChanges).length > 0) { const currentFilter = paginationEntityState.clientPagination.filter; @@ -172,14 +183,14 @@ export class ListPaginationController implements IListPaginationController } }); - } + }; multiFilter = (filterConfig: IListMultiFilterConfig, filterValue: string) => { if (!this.dataSource.isLocal) { return; } this.multiFilterStream.next({ key: filterConfig.key, value: filterValue }); - } + }; private cloneMultiFilter(paginationClientFilter: PaginationClientFilter) { return { diff --git a/src/frontend/packages/core/src/shared/components/list/list-types/endpoint/endpoints-list-config.service.ts b/src/frontend/packages/core/src/shared/components/list/list-types/endpoint/endpoints-list-config.service.ts index 59764085a0..24fb90718b 100644 --- a/src/frontend/packages/core/src/shared/components/list/list-types/endpoint/endpoints-list-config.service.ts +++ b/src/frontend/packages/core/src/shared/components/list/list-types/endpoint/endpoints-list-config.service.ts @@ -153,7 +153,7 @@ export class EndpointsListConfigService implements IListConfig { stratosEntityCatalog.endpoint.store.getPaginationMonitor().pagination$ ]).pipe( debounceTime(100), // This can get pretty spammy, to help protect resetEndpointTypeFilter allow a pause - filter(([endpoints, pagination]) => !!endpoints), + filter(([endpoints]) => !!endpoints), map(([endpoints, pagination]) => { // Provide a list of endpoint types only if there are more than two registered endpoint types const types: { [type: string]: boolean; } = {}; diff --git a/src/frontend/packages/core/src/shared/components/list/list.component.ts b/src/frontend/packages/core/src/shared/components/list/list.component.ts index e140a14a7f..a1ab993fc1 100644 --- a/src/frontend/packages/core/src/shared/components/list/list.component.ts +++ b/src/frontend/packages/core/src/shared/components/list/list.component.ts @@ -3,12 +3,14 @@ import { AfterViewInit, ChangeDetectorRef, Component, + EventEmitter, Input, NgZone, OnChanges, OnDestroy, OnInit, Optional, + Output, SimpleChanges, TemplateRef, ViewChild, @@ -162,6 +164,9 @@ export class ListComponent implements OnInit, OnChanges, OnDestroy, AfterView })).subscribe(); } + @Output() initialised = new EventEmitter(); + private componentInitialised = false; + private initialPageEvent: PageEvent; private paginatorSettings: { pageSizeOptions: number[], @@ -212,8 +217,6 @@ export class ListComponent implements OnInit, OnChanges, OnDestroy, AfterView showProgressBar$: Observable; isRefreshing$: Observable; - - // Observable which allows you to determine if the paginator control should be hidden hidePaginator$: Observable; listViewKey: string; @@ -226,6 +229,8 @@ export class ListComponent implements OnInit, OnChanges, OnDestroy, AfterView pendingActions: Map, Subscription> = new Map, Subscription>(); + subs: Subscription[] = []; + public safeAddForm() { // Something strange is afoot. When using addform in [disabled] it thinks this is null, even when initialised // When applying the question mark (addForm?) it's value is ignored by [disabled] @@ -406,48 +411,60 @@ export class ListComponent implements OnInit, OnChanges, OnDestroy, AfterView this.filterColumns = this.config.getFilters ? this.config.getFilters() : []; - const filterStoreToWidget = this.paginationController.filter$.pipe(tap((paginationFilter: ListFilter) => { - this.filterString = paginationFilter.string; - - const filterKey = paginationFilter.filterKey; - if (filterKey) { - this.filterSelected = this.filterColumns.find(filterConfig => { - return filterConfig.key === filterKey; - }); - } else if (this.filterColumns) { - this.filterSelected = this.filterColumns.find(filterConfig => filterConfig.default); - if (this.filterSelected) { - this.updateListFilter(this.filterSelected); + const filterStoreToWidget = this.paginationController.filter$.pipe( + distinctUntilChanged(), + tap((paginationFilter: ListFilter) => { + this.filterString = paginationFilter.string; + + const filterKey = paginationFilter.filterKey; + if (filterKey) { + this.filterSelected = this.filterColumns.find(filterConfig => { + return filterConfig.key === filterKey; + }); + } else if (this.filterColumns) { + this.filterSelected = this.filterColumns.find(filterConfig => filterConfig.default); + if (this.filterSelected) { + this.updateListFilter(this.filterSelected); + } } - } - - // Pipe store values to filter managers. This ensures any changes such as automatically selected orgs/spaces are shown in the drop - // downs (change org to one with one space results in that space being selected) - Object.values(this.multiFilterManagers).forEach((filterManager: MultiFilterManager, index: number) => { - filterManager.applyValue(paginationFilter.items); - }); - })); - // Multi filters (e.g. cf/org/space) - // - Pass any multi filter changes made by the user to the pagination controller and thus the store - // - If the first multi filter has one value it's not shown, ensure it's automatically selected to ensure other filters are correct - this.multiFilterWidgetObservables = new Array(); - filterStoreToWidget.pipe( - first(), - tap(() => { + // Pipe store values to filter managers. This ensures any changes such as automatically selected orgs/spaces are shown in the drop + // downs (change org to one with one space results in that space being selected) Object.values(this.multiFilterManagers).forEach((filterManager: MultiFilterManager, index: number) => { - // The first filter will be hidden if there's only one filter option. - // To ensure subsequent filters behave correctly automatically select it + // TODO: RC tidy up logic + + if (index !== 0 || filterManager.hasValue(paginationFilter.items)) { + filterManager.applyValue(paginationFilter.items); + return; + } + if (index === 0 && this.multiFilterManagers.length > 1) { filterManager.filterItems$.pipe( first() ).subscribe(list => { if (list && list.length === 1) { filterManager.selectItem(list[0].value); + } else { + filterManager.applyValue(paginationFilter.items); } }); + return; } + filterManager.applyValue(paginationFilter.items); + + }); + }), + ); + + // Multi filters (e.g. cf/org/space) + // - Pass any multi filter changes made by the user to the pagination controller and thus the store + // - If the first multi filter has one value it's not shown, ensure it's automatically selected to ensure other filters are correct + this.multiFilterWidgetObservables = new Array(); + this.paginationController.filter$.pipe( + first(), + tap(() => { + Object.values(this.multiFilterManagers).forEach((filterManager: MultiFilterManager, index: number) => { // Pipe changes in the widgets to the store const sub = filterManager.multiFilterConfig.select.asObservable().pipe(tap((filterItem: string) => { this.paginationController.multiFilter(filterManager.multiFilterConfig, filterItem); @@ -492,11 +509,22 @@ export class ListComponent implements OnInit, OnChanges, OnDestroy, AfterView this.uberSub = observableCombineLatest( paginationStoreToWidget, - filterStoreToWidget, sortStoreToWidget, haveMultiActions ).subscribe(); + const initialisedSub = observableCombineLatest([ + filterStoreToWidget // Should not be unsubbed until destroy + ]).subscribe(() => { + // When this fires the first time we're initialised + if (!this.componentInitialised) { + this.componentInitialised = true; + this.initialised.next(true); + } + }); + + this.subs.push(initialisedSub); + this.pageState$ = observableCombineLatest( this.paginationController.pagination$, this.dataSource.isLoadingPage$, @@ -569,6 +597,8 @@ export class ListComponent implements OnInit, OnChanges, OnDestroy, AfterView distinctUntilChanged(), startWith(true), ); + + } ngAfterViewInit() { @@ -581,7 +611,8 @@ export class ListComponent implements OnInit, OnChanges, OnDestroy, AfterView this.paginationWidgetToStore, this.filterWidgetToStore, this.uberSub, - this.multiFilterChangesSub + this.multiFilterChangesSub, + ...this.subs, ); if (this.dataSource) { this.dataSource.destroy(); @@ -600,26 +631,13 @@ export class ListComponent implements OnInit, OnChanges, OnDestroy, AfterView } } - resetFilteringAndSort() { + public resetFilteringAndSort() { // TODO: RC multi entity type lists /* tslint:disable-next-line:no-string-literal */ const pAction: PaginatedAction = this.dataSource.action['length'] ? this.dataSource.action[0] : this.dataSource.action; this.store.dispatch(new ResetPaginationSortFilter(pAction)); - // Ensure that the changes are pushed back to the multi filter controls. Ideally the field to store relationship would be two way.. - // but it's not for the moment - this.multiFilterManagers.forEach(manager => { - // TODO: RC huh - // manager.hasOneItem$.pipe(first()).subscribe(hasOneItem => { - // // TODO: RC Test - // // const selectItem = hasOneItem || '' - // if (hasOneItem) { - // return; - // } - // manager.selectItem('') - // }) - }); - if (!this.config.isLocal) { - // TODO: RC Fixes space routes, breaks app wall!! + + if (!this.dataSource.isLocal) { this.store.dispatch(new ResetPagination(pAction, pAction.paginationKey)); } } diff --git a/src/frontend/packages/core/src/shared/components/list/list.component.types.ts b/src/frontend/packages/core/src/shared/components/list/list.component.types.ts index 4602379d29..f75894a2f3 100644 --- a/src/frontend/packages/core/src/shared/components/list/list.component.types.ts +++ b/src/frontend/packages/core/src/shared/components/list/list.component.types.ts @@ -256,13 +256,16 @@ export class MultiFilterManager { public applyValue(multiFilters: {}) { const value = multiFilters[this.multiFilterConfig.key]; - if (value) { - this.value = value; - this.selectItem(value); - } + this.value = value; + this.selectItem(value); + } + + public hasValue(multiFilters: {}): boolean { + return !!multiFilters[this.multiFilterConfig.key]; } public selectItem(itemValue: string) { + console.log(this.multiFilterConfig.key, itemValue); /// TODO: RC REMove this.multiFilterConfig.select.next(itemValue); this.value = itemValue; } diff --git a/src/frontend/packages/store/src/helpers/local-storage-service.ts b/src/frontend/packages/store/src/helpers/local-storage-service.ts index 30bb838097..4c82c006b2 100644 --- a/src/frontend/packages/store/src/helpers/local-storage-service.ts +++ b/src/frontend/packages/store/src/helpers/local-storage-service.ts @@ -19,11 +19,11 @@ export enum LocalStorageSyncTypes { export class LocalStorageService { - // TODO: RC applying cf filter works, but not org/space // TODO: RC cleaning sessions storage (entities that don't exist, etc, can be done by storeagesync??) // TODO: RC backward compatible (load 'user-dashboard' into 'user') // TODO: RC todos! - // TODO: RC only store pagination settings for those that power lists + // TODO: RC service wall reload + // TODO: RC routes (all) test /** * Normally used on app init, move local storage data into the console's store @@ -158,7 +158,8 @@ export class LocalStorageService { } res2[paginationKeysOfEntityType] = { params: paginationSection.params, - clientPagination: paginationSection.clientPagination + clientPagination: paginationSection.clientPagination, + isListPagination: paginationSection.isListPagination }; return res2; }, {});