Add Output Event From FilterButtomComponent

apps/sales/src/app/components/content-header/content-header.component.html

@@ -3,6 +3,6 @@
   *ngIf="showBreadCrumbs$ | async"
 >
 </app-breadcrumbs>
-<app-filter-button *ngIf="showFilter$ | async"
+<app-filter-button *ngIf="showFilter$ | async" (toggleFilter)="toggleFilter()"
 ></app-filter-button>
 </div>

apps/sales/src/app/components/content-header/content-header.component.ts

@@ -13,4 +13,8 @@ export class ContentHeaderComponent {
   @Input() showBreadCrumbs$: Observable<boolean>
 
   constructor() { }
+
+  toggleFilter() {
+    console.log('Click Filter')
+  }
 }

libs/ui/src/lib/filter-button/filter-button.component.html

@@ -1,4 +1,4 @@
-<div class="container" [class.active]="active">
+<div class="container" (click)="toggleFilter.emit()" [class.active]="active">
   <lib-icon class="icon" width="20px" [name]="active ? 'Icon_Filter_active' : 'Icon_Filter'"></lib-icon>
-  <p class="text">Filter</p>
+  <p class="text" >Filter</p>
 </div>

libs/ui/src/lib/filter-button/filter-button.component.ts

@@ -1,4 +1,4 @@
-import { Component, OnInit, ChangeDetectionStrategy, Output, EventEmitter, Input } from '@angular/core';
+import { Component, ChangeDetectionStrategy, Output, EventEmitter, Input } from '@angular/core';
 
 @Component({
   selector: 'app-filter-button',
@@ -7,10 +7,9 @@ import { Component, OnInit, ChangeDetectionStrategy, Output, EventEmitter, Input
   changeDetection: ChangeDetectionStrategy.OnPush
 })
 
-export class FilterButtonComponent implements OnInit {
+export class FilterButtonComponent {
   @Input() active = false;
+  @Output() toggleFilter = new EventEmitter();
 
   constructor() { }
-
-  ngOnInit() { }
 }