Filters incomplete event to disable table

frontend/src/app/components/filters/filter-container/filter-container.directive.ts

@@ -44,7 +44,6 @@ export class WorkPackageFilterContainerComponent implements OnInit, OnDestroy {
   @Input('showFilterButton') showFilterButton:boolean = false;
   @Input('filterButtonText') filterButtonText:string = I18n.t('js.button_filter');
   @Output() public filtersChanged = new DebouncedEventEmitter<QueryFilterInstanceResource[]>(componentDestroyed(this));
-  @Output() public filtersCompleted = new DebouncedEventEmitter<boolean>(componentDestroyed(this));
 
   public visible$:Observable<Boolean>;
   public filters = this.wpTableFilters.current;
@@ -74,8 +73,7 @@ export class WorkPackageFilterContainerComponent implements OnInit, OnDestroy {
   }
 
   public replaceIfComplete(filters:QueryFilterInstanceResource[]) {
-    let complete = this.wpTableFilters.replaceIfComplete(filters);
-    this.filtersCompleted.emit(complete);
+    this.wpTableFilters.replaceIfComplete(filters);
     this.filtersChanged.emit(this.filters);
   }
 }

frontend/src/app/modules/work_packages/routing/partitioned-query-space-page/partitioned-query-space-page.component.html

@@ -26,8 +26,7 @@
     </div>
   </div>
 
-  <filter-container *ngIf="filterAllowed"
-                    (filtersCompleted)="updateResultVisibility($event)"></filter-container>
+  <filter-container *ngIf="filterAllowed"></filter-container>
 
   <!-- Left content view -->
   <div class="work-packages-partitioned-page--content-left loading-indicator--location"

frontend/src/app/modules/work_packages/routing/partitioned-query-space-page/partitioned-query-space-page.component.sass

@@ -1,9 +1,5 @@
 @import "helpers"
 
-.result-overlay
-  @include overlay-background
-  background-color: #FFFFFF
-  opacity: 0.5
 
 .work-packages--card-view-container
   width: 100%

frontend/src/app/modules/work_packages/routing/partitioned-query-space-page/partitioned-query-space-page.component.ts

@@ -94,10 +94,6 @@ export class PartitionedQuerySpacePageComponent extends WorkPackagesViewBase imp
   /** Determine when query is initially loaded */
   tableInformationLoaded = false;
 
-  /** An overlay over the table shown for example when the filters are invalid */
-  // TODO DOES NOT PROPAGATE
-  showResultOverlay = false;
-
   /** The toolbar buttons to render */
   toolbarButtonComponents:ToolbarButtonComponentDefinition[] = [];
 
@@ -248,10 +244,6 @@ export class PartitionedQuerySpacePageComponent extends WorkPackagesViewBase imp
     return Promise.resolve();
   }
 
-  public updateResultVisibility(completed:boolean) {
-    this.showResultOverlay = !completed;
-  }
-
   protected set loadingIndicator(promise:Promise<unknown>) {
     this.loadingIndicatorService.table.promise = promise;
   }

frontend/src/app/modules/work_packages/routing/wp-list-view/wp-list-view.component.html

@@ -1,6 +1,5 @@
-<!-- (TABLE + TIMELINE) and FOOTER vertical split-->
 <div class="result-overlay"
-     *ngIf="wpView.showResultOverlay && showListView"></div>
+     *ngIf="(showResultOverlay$ | async) && showListView"></div>
 
 <!-- TABLE + TIMELINE horizontal split -->
 <wp-table *ngIf="tableInformationLoaded && showListView"

frontend/src/app/modules/work_packages/routing/wp-list-view/wp-list-view.component.sass

@@ -0,0 +1,6 @@
+@import "helpers"
+
+.result-overlay
+  @include overlay-background
+  background-color: #FFFFFF
+  opacity: 0.5

frontend/src/app/modules/work_packages/routing/wp-list-view/wp-list-view.component.ts

@@ -57,10 +57,12 @@ import {IsolatedQuerySpace} from "core-app/modules/work_packages/query-space/iso
 import {DeviceService} from "core-app/modules/common/browser/device.service";
 import {WorkPackageViewPageComponent} from "core-app/modules/work_packages/routing/wp-view-page/wp-view-page.component";
 import {CurrentProjectService} from "core-components/projects/current-project.service";
+import {WorkPackageViewFiltersService} from "core-app/modules/work_packages/routing/wp-view-base/view-services/wp-view-filters.service";
 
 @Component({
   selector: 'wp-list-view',
   templateUrl: './wp-list-view.component.html',
+  styleUrls: ['./wp-list-view.component.sass'],
   host: { 'class': 'work-packages-split-view--tabletimeline-side' },
   changeDetection: ChangeDetectionStrategy.OnPush,
   providers: [
@@ -83,6 +85,9 @@ export class WorkPackageListViewComponent implements OnInit, OnDestroy {
   /** Determine when query is initially loaded */
   tableInformationLoaded = false;
 
+  /** Whether we should render a blocked view */
+  showResultOverlay$ = this.wpViewFilters.incomplete$;
+
   /** */
   readonly wpTableConfiguration:WorkPackageTableConfigurationObject = {
     dragAndDropEnabled: true
@@ -90,7 +95,7 @@ export class WorkPackageListViewComponent implements OnInit, OnDestroy {
 
   constructor(private I18n:I18nService,
               private querySpace:IsolatedQuerySpace,
-              readonly wpView:WorkPackageViewPageComponent,
+              private wpViewFilters:WorkPackageViewFiltersService,
               private deviceService:DeviceService,
               private CurrentProject:CurrentProjectService,
               private wpDisplayRepresentation:WorkPackageViewDisplayRepresentationService,

frontend/src/app/modules/work_packages/routing/wp-view-base/view-services/wp-view-filters.service.ts

@@ -32,7 +32,7 @@ import {QueryResource} from 'core-app/modules/hal/resources/query-resource';
 import {QuerySchemaResource} from 'core-app/modules/hal/resources/query-schema-resource';
 import {QueryFilterInstanceResource} from 'core-app/modules/hal/resources/query-filter-instance-resource';
 import {IsolatedQuerySpace} from "core-app/modules/work_packages/query-space/isolated-query-space";
-import {combine, InputState} from 'reactivestates';
+import {combine, input, InputState} from 'reactivestates';
 import {cloneHalResourceCollection} from 'core-app/modules/hal/helpers/hal-resource-builder';
 import {QueryFilterResource} from "core-app/modules/hal/resources/query-filter-resource";
 import {QueryFilterInstanceSchemaResource} from "core-app/modules/hal/resources/query-filter-instance-schema-resource";
@@ -61,6 +61,8 @@ export class WorkPackageViewFiltersService extends WorkPackageQueryStateService<
     'subjectOrId'
   ];
 
+  /** Flag state to determine whether the filters are incomplete */
+  private incomplete = input<boolean>(false);
 
   constructor(protected readonly states:States,
               readonly querySpace:IsolatedQuerySpace) {
@@ -82,7 +84,7 @@ export class WorkPackageViewFiltersService extends WorkPackageQueryStateService<
   }
 
   /**
-   * Return whether rth
+   * Return whether the filters are empty
    */
   public get isEmpty() {
     const value = this.lastUpdatedState.value;
@@ -93,6 +95,12 @@ export class WorkPackageViewFiltersService extends WorkPackageQueryStateService<
     return this.states.queries.filters;
   }
 
+  /** Return whether the filters the user is working on are incomplete */
+  public get incomplete$() {
+    return this.incomplete.values$();
+  }
+
+
   /**
    * Add a filter instantiation from the set of available filter schemas
    *
@@ -216,6 +224,11 @@ export class WorkPackageViewFiltersService extends WorkPackageQueryStateService<
     return undefined;
   }
 
+  update(value:QueryFilterInstanceResource[]) {
+    super.update(value);
+    this.incomplete.putValue(false);
+  }
+
   /**
    * Returns the live filter instance for the given ID, or undefined
    * if it does not exist.
@@ -283,9 +296,8 @@ export class WorkPackageViewFiltersService extends WorkPackageQueryStateService<
   public replaceIfComplete(newState:QueryFilterInstanceResource[]) {
     if (this.isComplete(newState)) {
       this.update(newState);
-      return true;
     } else {
-      return false;
+      this.incomplete.putValue(true);
     }
   }