#3 search active projects in view timeClockIn

Author: daros10

src/app/modules/shared/components/search-project/search-project.component.html

@@ -1,3 +1,3 @@
 <div class="form-group">
-  <input (keyup)="changeFilterValue()" type="text" class="form-control" placeholder="&#xF002; Search active projects..." name="filterProject" [(ngModel)]="filterProject" style="font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif, FontAwesome">
+  <input (keyup)="changeFilterValue()" type="text" class="form-control" placeholder="&#xF002; Search projects..." name="filterProject" [(ngModel)]="filterProject" style="font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif, FontAwesome">
 </div>

src/app/modules/time-clock/components/project-list-hover/project-list-hover.component.html

@@ -1,12 +1,7 @@
 <app-search-project (changeFilterProject)="filterProjects = $event"></app-search-project>
-<div class="container-fluid border rounded">
-  <ul class="list-group list-group-flush content-projects mt-2 mb-2">
-    <div *ngFor="let item of listProjects | filterProject:filterProjects;  let i = index" class="container">
-      <li *ngIf="item.status === 'Active'" class="list-group-item list-group-item-action d-flex justify-content-between align-items-center" (mouseenter)="showButton = i" (mouseleave)="showButton = -1" (click)="clockIn(item.id)" [ngClass]="{ active: selectedId === item.id }">
-        {{ item.name }}
-        <span *ngIf="showButton != i" class="badge badge-success">{{ item.status }}</span>
-        <span *ngIf="showButton === i && selectedId !== item.id" class="badge badge-light">Clock In</span>
-      </li>
-    </div>
-  </ul>
-</div>
+<ul class="list-group content-projects">
+  <li class="list-group-item list-group-item-action d-flex justify-content-between align-items-center" *ngFor="let item of projects | filterProject:filterProjects;  let i = index" (mouseenter)="showButton = i" (mouseleave)="showButton = -1" (click)="clockIn(item.id)" [ngClass]="{ active: selectedId === item.id }">
+    {{ item.name }}
+    <span *ngIf="showButton === i && selectedId !== item.id" class="badge badge-light">Clock In</span>
+  </li>
+</ul>

src/app/modules/time-clock/components/project-list-hover/project-list-hover.component.spec.ts

@@ -1,8 +1,6 @@
 import { async, ComponentFixture, TestBed, inject } from '@angular/core/testing';
 
 import { ProjectListHoverComponent } from './project-list-hover.component';
-import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing';
-import { ProjectService } from 'src/app/modules/project-management/services/project.service';
 import { FilterProjectPipe } from 'src/app/modules/shared/pipes/filter-project/filter-project.pipe';
 
 describe('ProjectListHoverComponent', () => {
@@ -11,9 +9,7 @@ describe('ProjectListHoverComponent', () => {
 
   beforeEach(async(() => {
     TestBed.configureTestingModule({
-      imports: [HttpClientTestingModule],
-      declarations: [ProjectListHoverComponent, FilterProjectPipe],
-      providers: [ProjectService]
+      declarations: [ProjectListHoverComponent, FilterProjectPipe]
     }).compileComponents();
   }));
 
@@ -23,16 +19,6 @@ describe('ProjectListHoverComponent', () => {
     fixture.detectChanges();
   });
 
-  it('service should be created', () => {
-    const service: ProjectService = TestBed.get(ProjectService);
-    expect(service).toBeTruthy();
-  });
-
-  it('should have getProjects function', () => {
-    const service: ProjectService = TestBed.get(ProjectService);
-    expect(service.getProjects).toBeTruthy();
-  });
-
   it('should create', () => {
     expect(component).toBeTruthy();
   });

src/app/modules/time-clock/components/project-list-hover/project-list-hover.component.ts

@@ -16,13 +16,11 @@ export class ProjectListHoverComponent implements OnInit {
   filterProjects: string = '';
   listProjects: Project[] = [];
 
-  constructor(private projectService: ProjectService) {
+  constructor() {
     this.showButton = -1;
   }
 
-  ngOnInit(): void {
-    this.projectService.getProjects().subscribe(data => this.listProjects = data);
-  }
+  ngOnInit(): void { }
 
   clockIn(id: string) {
     this.selectedId = id;