From f07353943c1cb009addca6cd77579f8be1b0fb21 Mon Sep 17 00:00:00 2001
From: Piotr Pekala <piotrpawelpekala@gmail.com>
Date: Thu, 5 Sep 2019 05:32:34 -0700
Subject: [PATCH] Filtering for projects added

---
 src/app/app.module.ts                          |  2 ++
 .../components/projects/projects.component.css |  6 ++++++
 .../projects/projects.component.html           | 12 +++++++++++-
 .../components/projects/projects.component.ts  |  4 +++-
 src/app/filters/projectsFilter.pipe.ts         | 18 ++++++++++++++++++
 5 files changed, 40 insertions(+), 2 deletions(-)
 create mode 100644 src/app/filters/projectsFilter.pipe.ts

diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 6424c73f..a977dbb4 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -207,6 +207,7 @@ import { ConsoleDeviceActionBrowserComponent } from './components/project-map/co
 import { ChangeSymbolDialogComponent } from './components/project-map/change-symbol-dialog/change-symbol-dialog.component';
 import { ChangeSymbolActionComponent } from './components/project-map/context-menu/actions/change-symbol/change-symbol-action.component';
 import { EditProjectDialogComponent } from './components/projects/edit-project-dialog/edit-project-dialog.component';
+import { ProjectsFilter } from './filters/projectsFilter.pipe';
 
 if (environment.production) {
   Raven.config('https://b2b1cfd9b043491eb6b566fd8acee358@sentry.io/842726', {
@@ -320,6 +321,7 @@ if (environment.production) {
     SearchFilter,
     DateFilter,
     NameFilter,
+    ProjectsFilter,
     ListOfSnapshotsComponent,
     CustomAdaptersComponent,
     NodesMenuComponent,
diff --git a/src/app/components/projects/projects.component.css b/src/app/components/projects/projects.component.css
index d7d423ad..5ed0ed20 100644
--- a/src/app/components/projects/projects.component.css
+++ b/src/app/components/projects/projects.component.css
@@ -7,3 +7,9 @@
     height: 40px;
     margin: 20px;
 }
+
+.full-width {
+    width: 940px;
+    margin-left: -470px;
+    left: 50%;
+}
diff --git a/src/app/components/projects/projects.component.html b/src/app/components/projects/projects.component.html
index 90d28c2e..f53b130f 100644
--- a/src/app/components/projects/projects.component.html
+++ b/src/app/components/projects/projects.component.html
@@ -24,9 +24,19 @@
       </button>
     </div>
   </div>
+
+  <form>
+      <mat-form-field class="full-width">
+          <input matInput
+              placeholder="Search by name"
+              [(ngModel)]="searchText"
+              [ngModelOptions]="{standalone: true}">
+      </mat-form-field>
+  </form>
+
   <div class="default-content">
     <div class="mat-elevation-z8">
-      <mat-table #table [dataSource]="dataSource" matSort>
+      <mat-table #table [dataSource]="dataSource | projectsfilter: searchText" matSort>
         <ng-container matColumnDef="name">
           <mat-header-cell *matHeaderCellDef mat-sort-header> Name </mat-header-cell>
           <mat-cell *matCellDef="let row">
diff --git a/src/app/components/projects/projects.component.ts b/src/app/components/projects/projects.component.ts
index 1c7fa38a..787fd60b 100644
--- a/src/app/components/projects/projects.component.ts
+++ b/src/app/components/projects/projects.component.ts
@@ -29,6 +29,8 @@ export class ProjectsComponent implements OnInit {
   displayedColumns = ['name', 'actions'];
   settings: Settings;
 
+  searchText: string = '';
+
   @ViewChild(MatSort, {static: true}) sort: MatSort;
 
   constructor(
@@ -157,7 +159,7 @@ export class ProjectDatabase {
 }
 
 export class ProjectDataSource extends DataSource<any> {
-  constructor(private projectDatabase: ProjectDatabase, private sort: MatSort) {
+  constructor(public projectDatabase: ProjectDatabase, private sort: MatSort) {
     super();
   }
 
diff --git a/src/app/filters/projectsFilter.pipe.ts b/src/app/filters/projectsFilter.pipe.ts
new file mode 100644
index 00000000..a0d637f4
--- /dev/null
+++ b/src/app/filters/projectsFilter.pipe.ts
@@ -0,0 +1,18 @@
+import { Pipe, PipeTransform } from '@angular/core';
+import { ProjectDataSource } from '../components/projects/projects.component';
+
+
+@Pipe({
+  name: 'projectsfilter'
+})
+export class ProjectsFilter implements PipeTransform {
+    transform(items: ProjectDataSource, searchText: string) {
+        if(!items) return [];
+        if(!searchText) return items;
+        
+        searchText = searchText.toLowerCase();
+            return items.projectDatabase.data.filter( item => {
+              return item.filename.toLowerCase().includes(searchText);
+            });
+    } 
+}