diff --git a/src/frontend/packages/cloud-foundry/src/shared/components/cloud-foundry-events-list/cloud-foundry-events-list.component.ts b/src/frontend/packages/cloud-foundry/src/shared/components/cloud-foundry-events-list/cloud-foundry-events-list.component.ts index 3a7151c4d4..109ed876e0 100644 --- a/src/frontend/packages/cloud-foundry/src/shared/components/cloud-foundry-events-list/cloud-foundry-events-list.component.ts +++ b/src/frontend/packages/cloud-foundry/src/shared/components/cloud-foundry-events-list/cloud-foundry-events-list.component.ts @@ -125,13 +125,12 @@ export class CloudFoundryEventsListComponent implements OnInit, OnDestroy { this.config.getEventFilters().pipe( distinctUntilChanged() ).subscribe(params => { - if (!this.initialSet) { - this.filtersFormGroup.controls.type.setValue(params.type); - this.filtersFormGroup.controls.actee.setValue(params.actee); + this.updateType(params.type); + this.updateActee(params.actee); this.initialSet = true; } else if (this.filtersFormGroup.controls.actee.value !== params.actee) { - this.filtersFormGroup.controls.actee.setValue(params.actee); + this.updateActee(params.actee); } }) ); @@ -161,7 +160,18 @@ export class CloudFoundryEventsListComponent implements OnInit, OnDestroy { } public clearActeeFilter() { - this.filtersFormGroup.patchValue({actee: ''}); + this.filtersFormGroup.patchValue({ actee: '' }); + } + + private updateType(type: string[]) { + this.filtersFormGroup.controls.type.setValue(type); + this.filtersFormGroup.controls.type.markAsDirty(); + } + + private updateActee(actee: string) { + this.filtersFormGroup.controls.actee.setValue(actee); + this.filtersFormGroup.controls.actee.markAsDirty(); + this.hasActeeFilter = !!actee; } } diff --git a/src/frontend/packages/core/src/shared/components/list/list.component.theme.scss b/src/frontend/packages/core/src/shared/components/list/list.component.theme.scss index c7e86ff821..654f1a09e1 100644 --- a/src/frontend/packages/core/src/shared/components/list/list.component.theme.scss +++ b/src/frontend/packages/core/src/shared/components/list/list.component.theme.scss @@ -5,6 +5,7 @@ $foreground-colors: map-get($theme, foreground); $background-colors: map-get($theme, background); $is-dark: map-get($theme, is-dark); + $accent: map-get($theme, accent); $header-selected-color: #fff; @if $is-dark == true { @@ -24,6 +25,19 @@ flex-wrap: wrap; } } + + @include accent(mat-color($accent)); + .sort { + @include accent(unset) + } } } } + +@mixin accent($colour) { + .mat-select-value-text, + .mat-input-element.ng-dirty, + .mat-chip { + color: $colour; + } +}