Show partners with implementation data toggle button and functionality

src/app/dashboard/table/table.component.html

@@ -1,6 +1,6 @@
 <div class="subpage">
     <header class="main-header">
-        <h2> All Partners </h2>
+        <h2> All Partners <ng-container *ngIf="userData">({{ userData.length }})</ng-container> </h2>
     </header>
 
     <div class="card">
@@ -12,6 +12,14 @@
                 <input type="text" placeholder="Partner name, location, PRA user, contact...">
                 <label> Search </label>
             </div>
+            <button class="button" (click)="shouldHaveImplementationData = !shouldHaveImplementationData; allData()">
+                <ng-container *ngIf="!shouldHaveImplementationData">
+                    Partners with implmentation data
+                </ng-container>
+                <ng-container *ngIf="shouldHaveImplementationData">
+                    Show all Partners
+                </ng-container>
+            </button>
             <button class="button" (click)="showExportOptions = true"> <img src="assets/export.svg" alt=""> Export </button>
             <button class="button"> <img src="assets/filter.svg" alt=""> Filter </button>
         </div>
@@ -20,8 +28,8 @@
             <div class="export-options">
                 <header>
                     <h5> Export as </h5>
-                </header>
-                <div class="options">
+                </header>                
+                <div class="options">                    
                     <button class="button"> CSV </button>
                     <button class="button"> Excel </button>
                 </div>

src/app/dashboard/table/table.component.ts

@@ -10,6 +10,7 @@ import { Router } from '@angular/router';
 export class TableComponent implements OnInit {
     userData: Array<any> = [];
     showExportOptions: boolean = false;
+    shouldHaveImplementationData: boolean = false;
 
     constructor(
         private partnerProfileService: PartnerProfileService,
@@ -17,9 +18,23 @@ export class TableComponent implements OnInit {
     ) { }
 
     ngOnInit(): void {
+        this.allData();
+    }
+
+    allData() {
         this.partnerProfileService.getPartnersData().then((data: any) => {
-            this.userData = data;
-            console.log(data);
+            this.userData = data;            
+
+            if (this.shouldHaveImplementationData) {
+                this.userData = this.userData.filter(user => {
+                    return (user.surveyCtoData.hiiData && user.surveyCtoData.hiiData.length > 0) || 
+                    (user.surveyCtoData.spData && user.surveyCtoData.spData.length > 0) || 
+                    (user.surveyCtoData.spSchemeData && user.surveyCtoData.spSchemeData.length > 0)
+                });
+            }
+
+            console.log(this.userData);
+
         }, (e) => console.log(e));
     }