From 7fbe49a2757d4f6b52081e9fc552d50f2ff534d2 Mon Sep 17 00:00:00 2001
From: Edgar Guaman <edgar.guaman@ioet.com>
Date: Fri, 6 Aug 2021 12:01:05 -0500
Subject: [PATCH 1/8] fix: TT-304 Handle message: the data could not be load

---
 .../pages/time-entries.component.html         |  2 +-
 .../pages/time-entries.component.ts           | 36 +++++++++++++++++--
 2 files changed, 34 insertions(+), 4 deletions(-)

diff --git a/src/app/modules/time-entries/pages/time-entries.component.html b/src/app/modules/time-entries/pages/time-entries.component.html
index 1711ea0b8..df2e1869b 100644
--- a/src/app/modules/time-entries/pages/time-entries.component.html
+++ b/src/app/modules/time-entries/pages/time-entries.component.html
@@ -42,7 +42,7 @@
   </ng-template>
   <ng-template #listView>
     <div id="listView">
-      <table class="table table-sm table-striped mb-0" *ngIf="timeEntriesDataSource$ | async as dataSource">
+      <table class="table table-sm table-striped mb-0" datatable [dtTrigger]="dtTrigger" [dtOptions]="dtOptions" *ngIf="timeEntriesDataSource$ | async as dataSource">
         <thead class="thead-blue">
           <tr class="d-flex">
             <th class="col">Date</th>
diff --git a/src/app/modules/time-entries/pages/time-entries.component.ts b/src/app/modules/time-entries/pages/time-entries.component.ts
index 7ba274bbe..3fdc19aba 100644
--- a/src/app/modules/time-entries/pages/time-entries.component.ts
+++ b/src/app/modules/time-entries/pages/time-entries.component.ts
@@ -1,7 +1,7 @@
-import { Component, OnDestroy, OnInit } from '@angular/core';
+import { Component, OnDestroy, OnInit, ViewChild, AfterViewInit } from '@angular/core';
 import { ActionsSubject, select, Store } from '@ngrx/store';
 import { ToastrService } from 'ngx-toastr';
-import { Observable, Subscription } from 'rxjs';
+import { Observable, Subscription, Subject } from 'rxjs';
 import { delay, filter } from 'rxjs/operators';
 import { ProjectSelectedEvent } from '../../shared/components/details-fields/project-selected-event';
 import { SaveEntryEvent } from '../../shared/components/details-fields/save-entry-event';
@@ -14,12 +14,13 @@ import { EntryActionTypes } from './../../time-clock/store/entry.actions';
 import { getActiveTimeEntry, getTimeEntriesDataSource } from './../../time-clock/store/entry.selectors';
 import { CookieService } from 'ngx-cookie-service';
 import { FeatureToggle } from './../../../../environments/enum';
+import { DataTableDirective } from 'angular-datatables';
 @Component({
   selector: 'app-time-entries',
   templateUrl: './time-entries.component.html',
   styleUrls: ['./time-entries.component.scss'],
 })
-export class TimeEntriesComponent implements OnInit, OnDestroy {
+export class TimeEntriesComponent implements OnInit, OnDestroy, AfterViewInit {
   entryId: string;
   entry: Entry;
   activeTimeEntry: Entry;
@@ -38,6 +39,11 @@ export class TimeEntriesComponent implements OnInit, OnDestroy {
   selectedYear: number;
   selectedMonthAsText: string;
   isActiveEntryOverlapping = false;
+  dtOptions: any = {};
+  dtTrigger: Subject<any> = new Subject();
+  @ViewChild(DataTableDirective, { static: false })
+  dtElement: DataTableDirective;
+  rerenderTableSubscription: Subscription;
   constructor(
     private store: Store<EntryState>,
     private toastrService: ToastrService,
@@ -49,8 +55,18 @@ export class TimeEntriesComponent implements OnInit, OnDestroy {
   }
   ngOnDestroy(): void {
     this.entriesSubscription.unsubscribe();
+    this.rerenderTableSubscription.unsubscribe();
+    this.dtTrigger.unsubscribe();
   }
   ngOnInit(): void {
+    this.dtOptions = {
+      scrollY: '325px',
+      paging: false,
+      responsive: true,
+    };
+    this.rerenderTableSubscription = this.timeEntriesDataSource$.subscribe((ds) => {
+      this.rerenderDataTable();
+    });
     this.loadActiveEntry();
     this.isFeatureToggleCalendarActive = (this.cookiesService.get(FeatureToggle.TIME_TRACKER_CALENDAR) === 'true');
     this.entriesSubscription = this.actionsSubject$.pipe(
@@ -65,6 +81,9 @@ export class TimeEntriesComponent implements OnInit, OnDestroy {
       this.store.dispatch(new entryActions.LoadEntries(this.selectedMonth, this.selectedYear));
     });
   }
+  ngAfterViewInit(): void {
+    this.rerenderDataTable();
+  }
   newEntry() {
     if (this.wasEditingExistingTimeEntry) {
       this.entry = null;
@@ -216,4 +235,15 @@ export class TimeEntriesComponent implements OnInit, OnDestroy {
       });
     }
   }
+
+  private rerenderDataTable(): void {
+    if (this.dtElement && this.dtElement.dtInstance) {
+      this.dtElement.dtInstance.then((dtInstance: DataTables.Api) => {
+          dtInstance.destroy();
+          this.dtTrigger.next();
+      });
+    } else {
+        this.dtTrigger.next();
+    }
+  }
 }

From f4833d2f9716f034564a6bd80d0a5cd4edeb6d08 Mon Sep 17 00:00:00 2001
From: Edgar Guaman <edgar.guaman@ioet.com>
Date: Wed, 11 Aug 2021 00:42:58 -0500
Subject: [PATCH 2/8] test: TT-304 Creating an unit test to coverage the new
 feature

---
 .../time-entries/pages/time-entries.component.spec.ts      | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/src/app/modules/time-entries/pages/time-entries.component.spec.ts b/src/app/modules/time-entries/pages/time-entries.component.spec.ts
index 2406a1a59..4ff687dd6 100644
--- a/src/app/modules/time-entries/pages/time-entries.component.spec.ts
+++ b/src/app/modules/time-entries/pages/time-entries.component.spec.ts
@@ -668,4 +668,11 @@ describe('TimeEntriesComponent', () => {
 
     expect(HTMLTimeEntriesView).not.toBeNull();
   });
+
+  it('after the component is initialized it should initialize the table', () => {
+    spyOn(component.dtTrigger, 'next');
+    component.ngAfterViewInit();
+
+    expect(component.dtTrigger.next).toHaveBeenCalled();
+  });
 });

From 38b149fc2a80be7a3c508e3a1027b512116e5194 Mon Sep 17 00:00:00 2001
From: Edgar Guaman <edgar.guaman@ioet.com>
Date: Wed, 18 Aug 2021 11:38:43 -0500
Subject: [PATCH 3/8] fix: TT-304 Handle message: A new approach for the ticket

---
 .../pages/time-entries.component.html         |  8 ++++-
 .../pages/time-entries.component.spec.ts      |  7 ----
 .../pages/time-entries.component.ts           | 36 ++-----------------
 3 files changed, 10 insertions(+), 41 deletions(-)

diff --git a/src/app/modules/time-entries/pages/time-entries.component.html b/src/app/modules/time-entries/pages/time-entries.component.html
index df2e1869b..0da68c349 100644
--- a/src/app/modules/time-entries/pages/time-entries.component.html
+++ b/src/app/modules/time-entries/pages/time-entries.component.html
@@ -42,7 +42,7 @@
   </ng-template>
   <ng-template #listView>
     <div id="listView">
-      <table class="table table-sm table-striped mb-0" datatable [dtTrigger]="dtTrigger" [dtOptions]="dtOptions" *ngIf="timeEntriesDataSource$ | async as dataSource">
+      <table class="table table-sm table-striped mb-0" *ngIf="timeEntriesDataSource$ | async as dataSource">
         <thead class="thead-blue">
           <tr class="d-flex">
             <th class="col">Date</th>
@@ -54,8 +54,14 @@
             <th class="col"></th>
           </tr>
         </thead>
+        <tr *ngIf="dataSource.isLoading">
+          <td class="text-center" colspan="7">No data available in table</td>
+        </tr>
         <app-loading-bar *ngIf="dataSource.isLoading"></app-loading-bar>
         <tbody *ngIf="!dataSource.isLoading">
+          <tr *ngIf="dataSource?.data.length === 0">
+            <td class="text-center" colspan="7">No data available in table</td>
+          </tr>
           <tr class="d-flex" *ngFor="let entry of dataSource.data">
             <td class="col">{{ entry.start_date | date: 'MM/dd/yyyy' }}</td>
             <td class="col">{{ entry.start_date | date: 'HH:mm' }} - {{ entry.end_date | date: 'HH:mm' }}</td>
diff --git a/src/app/modules/time-entries/pages/time-entries.component.spec.ts b/src/app/modules/time-entries/pages/time-entries.component.spec.ts
index 4ff687dd6..2406a1a59 100644
--- a/src/app/modules/time-entries/pages/time-entries.component.spec.ts
+++ b/src/app/modules/time-entries/pages/time-entries.component.spec.ts
@@ -668,11 +668,4 @@ describe('TimeEntriesComponent', () => {
 
     expect(HTMLTimeEntriesView).not.toBeNull();
   });
-
-  it('after the component is initialized it should initialize the table', () => {
-    spyOn(component.dtTrigger, 'next');
-    component.ngAfterViewInit();
-
-    expect(component.dtTrigger.next).toHaveBeenCalled();
-  });
 });
diff --git a/src/app/modules/time-entries/pages/time-entries.component.ts b/src/app/modules/time-entries/pages/time-entries.component.ts
index 3fdc19aba..7ba274bbe 100644
--- a/src/app/modules/time-entries/pages/time-entries.component.ts
+++ b/src/app/modules/time-entries/pages/time-entries.component.ts
@@ -1,7 +1,7 @@
-import { Component, OnDestroy, OnInit, ViewChild, AfterViewInit } from '@angular/core';
+import { Component, OnDestroy, OnInit } from '@angular/core';
 import { ActionsSubject, select, Store } from '@ngrx/store';
 import { ToastrService } from 'ngx-toastr';
-import { Observable, Subscription, Subject } from 'rxjs';
+import { Observable, Subscription } from 'rxjs';
 import { delay, filter } from 'rxjs/operators';
 import { ProjectSelectedEvent } from '../../shared/components/details-fields/project-selected-event';
 import { SaveEntryEvent } from '../../shared/components/details-fields/save-entry-event';
@@ -14,13 +14,12 @@ import { EntryActionTypes } from './../../time-clock/store/entry.actions';
 import { getActiveTimeEntry, getTimeEntriesDataSource } from './../../time-clock/store/entry.selectors';
 import { CookieService } from 'ngx-cookie-service';
 import { FeatureToggle } from './../../../../environments/enum';
-import { DataTableDirective } from 'angular-datatables';
 @Component({
   selector: 'app-time-entries',
   templateUrl: './time-entries.component.html',
   styleUrls: ['./time-entries.component.scss'],
 })
-export class TimeEntriesComponent implements OnInit, OnDestroy, AfterViewInit {
+export class TimeEntriesComponent implements OnInit, OnDestroy {
   entryId: string;
   entry: Entry;
   activeTimeEntry: Entry;
@@ -39,11 +38,6 @@ export class TimeEntriesComponent implements OnInit, OnDestroy, AfterViewInit {
   selectedYear: number;
   selectedMonthAsText: string;
   isActiveEntryOverlapping = false;
-  dtOptions: any = {};
-  dtTrigger: Subject<any> = new Subject();
-  @ViewChild(DataTableDirective, { static: false })
-  dtElement: DataTableDirective;
-  rerenderTableSubscription: Subscription;
   constructor(
     private store: Store<EntryState>,
     private toastrService: ToastrService,
@@ -55,18 +49,8 @@ export class TimeEntriesComponent implements OnInit, OnDestroy, AfterViewInit {
   }
   ngOnDestroy(): void {
     this.entriesSubscription.unsubscribe();
-    this.rerenderTableSubscription.unsubscribe();
-    this.dtTrigger.unsubscribe();
   }
   ngOnInit(): void {
-    this.dtOptions = {
-      scrollY: '325px',
-      paging: false,
-      responsive: true,
-    };
-    this.rerenderTableSubscription = this.timeEntriesDataSource$.subscribe((ds) => {
-      this.rerenderDataTable();
-    });
     this.loadActiveEntry();
     this.isFeatureToggleCalendarActive = (this.cookiesService.get(FeatureToggle.TIME_TRACKER_CALENDAR) === 'true');
     this.entriesSubscription = this.actionsSubject$.pipe(
@@ -81,9 +65,6 @@ export class TimeEntriesComponent implements OnInit, OnDestroy, AfterViewInit {
       this.store.dispatch(new entryActions.LoadEntries(this.selectedMonth, this.selectedYear));
     });
   }
-  ngAfterViewInit(): void {
-    this.rerenderDataTable();
-  }
   newEntry() {
     if (this.wasEditingExistingTimeEntry) {
       this.entry = null;
@@ -235,15 +216,4 @@ export class TimeEntriesComponent implements OnInit, OnDestroy, AfterViewInit {
       });
     }
   }
-
-  private rerenderDataTable(): void {
-    if (this.dtElement && this.dtElement.dtInstance) {
-      this.dtElement.dtInstance.then((dtInstance: DataTables.Api) => {
-          dtInstance.destroy();
-          this.dtTrigger.next();
-      });
-    } else {
-        this.dtTrigger.next();
-    }
-  }
 }

From cc6bed42817e885c15ffbd76ad90d5037de100b1 Mon Sep 17 00:00:00 2001
From: Edgar Guaman <edgar.guaman@ioet.com>
Date: Thu, 19 Aug 2021 11:50:17 -0500
Subject: [PATCH 4/8] refactor: TT-304 Handle message: Making readonly
 variables, new methods and tests

---
 .../pages/time-entries.component.html            |  8 ++++----
 .../pages/time-entries.component.spec.ts         | 12 ++++++++++++
 .../time-entries/pages/time-entries.component.ts | 16 ++++++++++++++++
 3 files changed, 32 insertions(+), 4 deletions(-)

diff --git a/src/app/modules/time-entries/pages/time-entries.component.html b/src/app/modules/time-entries/pages/time-entries.component.html
index 0da68c349..7bd9aa721 100644
--- a/src/app/modules/time-entries/pages/time-entries.component.html
+++ b/src/app/modules/time-entries/pages/time-entries.component.html
@@ -54,13 +54,13 @@
             <th class="col"></th>
           </tr>
         </thead>
-        <tr *ngIf="dataSource.isLoading">
-          <td class="text-center" colspan="7">No data available in table</td>
+        <tr *ngIf="checkIfDataSourceIsLoading(dataSource)">
+          <td class="text-center" colspan="7">{{NO_DATA_MESSAGE}}</td>
         </tr>
         <app-loading-bar *ngIf="dataSource.isLoading"></app-loading-bar>
         <tbody *ngIf="!dataSource.isLoading">
-          <tr *ngIf="dataSource?.data.length === 0">
-            <td class="text-center" colspan="7">No data available in table</td>
+          <tr *ngIf="checkIfDataSourceIsEmpty(dataSource)">
+            <td class="text-center" colspan="7">{{NO_DATA_MESSAGE}}</td>
           </tr>
           <tr class="d-flex" *ngFor="let entry of dataSource.data">
             <td class="col">{{ entry.start_date | date: 'MM/dd/yyyy' }}</td>
diff --git a/src/app/modules/time-entries/pages/time-entries.component.spec.ts b/src/app/modules/time-entries/pages/time-entries.component.spec.ts
index 2406a1a59..3b4be46b2 100644
--- a/src/app/modules/time-entries/pages/time-entries.component.spec.ts
+++ b/src/app/modules/time-entries/pages/time-entries.component.spec.ts
@@ -668,4 +668,16 @@ describe('TimeEntriesComponent', () => {
 
     expect(HTMLTimeEntriesView).not.toBeNull();
   });
+
+  it('checkIfDataSourceIsLoading should be false when dataSource.isLoading is false', () => {
+    const expectedValue = false;
+
+    expect(component.checkIfDataSourceIsLoading(state.timeEntriesDataSource)).toEqual(expectedValue);
+  });
+
+  it('checkIfDataSourceIsEmpty should be false when dataSource.data.length is not zero', () => {
+    const expectedValue = false;
+
+    expect(component.checkIfDataSourceIsEmpty(state.timeEntriesDataSource)).toEqual(expectedValue);
+  });
 });
diff --git a/src/app/modules/time-entries/pages/time-entries.component.ts b/src/app/modules/time-entries/pages/time-entries.component.ts
index 7ba274bbe..09d2435c2 100644
--- a/src/app/modules/time-entries/pages/time-entries.component.ts
+++ b/src/app/modules/time-entries/pages/time-entries.component.ts
@@ -38,6 +38,8 @@ export class TimeEntriesComponent implements OnInit, OnDestroy {
   selectedYear: number;
   selectedMonthAsText: string;
   isActiveEntryOverlapping = false;
+  readonly NO_DATA_MESSAGE: string = 'No data available in table';
+  timeEntry: DataSource<Entry>;
   constructor(
     private store: Store<EntryState>,
     private toastrService: ToastrService,
@@ -216,4 +218,18 @@ export class TimeEntriesComponent implements OnInit, OnDestroy {
       });
     }
   }
+
+  checkIfDataSourceIsLoading(data: DataSource<Entry>): boolean {
+    if (data.isLoading) {
+      return true;
+    }
+    return false;
+  }
+
+  checkIfDataSourceIsEmpty(data: DataSource<Entry>): boolean {
+    if (data.data.length === 0) {
+      return true;
+    }
+    return false;
+  }
 }

From 2437144514b4b07c2aa1544a668c7cc0899e12bf Mon Sep 17 00:00:00 2001
From: Edgar Guaman <edgar.guaman@ioet.com>
Date: Thu, 19 Aug 2021 13:26:59 -0500
Subject: [PATCH 5/8] test: TT-304 Handle message: Editind and creating unit
 tets

---
 .../pages/time-entries.component.spec.ts       | 18 +++++++++++++-----
 1 file changed, 13 insertions(+), 5 deletions(-)

diff --git a/src/app/modules/time-entries/pages/time-entries.component.spec.ts b/src/app/modules/time-entries/pages/time-entries.component.spec.ts
index 3b4be46b2..ff99f11fb 100644
--- a/src/app/modules/time-entries/pages/time-entries.component.spec.ts
+++ b/src/app/modules/time-entries/pages/time-entries.component.spec.ts
@@ -670,14 +670,22 @@ describe('TimeEntriesComponent', () => {
   });
 
   it('checkIfDataSourceIsLoading should be false when dataSource.isLoading is false', () => {
-    const expectedValue = false;
+    expect(component.checkIfDataSourceIsLoading(state.timeEntriesDataSource)).toBeFalse();
+  });
 
-    expect(component.checkIfDataSourceIsLoading(state.timeEntriesDataSource)).toEqual(expectedValue);
+  it('checkIfDataSourceIsLoading should be true when dataSource.isLoading is true', () => {
+    state.timeEntriesDataSource.isLoading = true;
+
+    expect(component.checkIfDataSourceIsLoading(state.timeEntriesDataSource)).toBeTrue();
   });
 
-  it('checkIfDataSourceIsEmpty should be false when dataSource.data.length is not zero', () => {
-    const expectedValue = false;
+  it('checkIfDataSourceIsEmpty should be false when dataSource.data.length is not empty', () => {
+    expect(component.checkIfDataSourceIsEmpty(state.timeEntriesDataSource)).toBeFalse();
+  });
+
+  it('checkIfDataSourceIsEmpty should be true when dataSource.data.length is empty', () => {
+    state.timeEntriesDataSource.data = [];
 
-    expect(component.checkIfDataSourceIsEmpty(state.timeEntriesDataSource)).toEqual(expectedValue);
+    expect(component.checkIfDataSourceIsEmpty(state.timeEntriesDataSource)).toBeTrue();
   });
 });

From 88f1a3c6b632a83fb107b1f7f161afe068ac5458 Mon Sep 17 00:00:00 2001
From: Edgar Guaman <edgar.guaman@ioet.com>
Date: Thu, 19 Aug 2021 20:19:17 -0500
Subject: [PATCH 6/8] refactor: TT-304 Handle message: Editing methods and unit
 tests associated

---
 .../time-entries/pages/time-entries.component.html    |  4 ++--
 .../time-entries/pages/time-entries.component.spec.ts |  8 ++++----
 .../time-entries/pages/time-entries.component.ts      | 11 ++---------
 3 files changed, 8 insertions(+), 15 deletions(-)

diff --git a/src/app/modules/time-entries/pages/time-entries.component.html b/src/app/modules/time-entries/pages/time-entries.component.html
index 7bd9aa721..7ca96d614 100644
--- a/src/app/modules/time-entries/pages/time-entries.component.html
+++ b/src/app/modules/time-entries/pages/time-entries.component.html
@@ -54,12 +54,12 @@
             <th class="col"></th>
           </tr>
         </thead>
-        <tr *ngIf="checkIfDataSourceIsLoading(dataSource)">
+        <tr *ngIf="checkIfDataSourceIsLoadingorEmpty(dataSource)">
           <td class="text-center" colspan="7">{{NO_DATA_MESSAGE}}</td>
         </tr>
         <app-loading-bar *ngIf="dataSource.isLoading"></app-loading-bar>
         <tbody *ngIf="!dataSource.isLoading">
-          <tr *ngIf="checkIfDataSourceIsEmpty(dataSource)">
+          <tr *ngIf="checkIfDataSourceIsLoadingorEmpty(dataSource)">
             <td class="text-center" colspan="7">{{NO_DATA_MESSAGE}}</td>
           </tr>
           <tr class="d-flex" *ngFor="let entry of dataSource.data">
diff --git a/src/app/modules/time-entries/pages/time-entries.component.spec.ts b/src/app/modules/time-entries/pages/time-entries.component.spec.ts
index ff99f11fb..6c34bf90e 100644
--- a/src/app/modules/time-entries/pages/time-entries.component.spec.ts
+++ b/src/app/modules/time-entries/pages/time-entries.component.spec.ts
@@ -670,22 +670,22 @@ describe('TimeEntriesComponent', () => {
   });
 
   it('checkIfDataSourceIsLoading should be false when dataSource.isLoading is false', () => {
-    expect(component.checkIfDataSourceIsLoading(state.timeEntriesDataSource)).toBeFalse();
+    expect(component.checkIfDataSourceIsLoadingorEmpty(state.timeEntriesDataSource)).toBeFalse();
   });
 
   it('checkIfDataSourceIsLoading should be true when dataSource.isLoading is true', () => {
     state.timeEntriesDataSource.isLoading = true;
 
-    expect(component.checkIfDataSourceIsLoading(state.timeEntriesDataSource)).toBeTrue();
+    expect(component.checkIfDataSourceIsLoadingorEmpty(state.timeEntriesDataSource)).toBeTrue();
   });
 
   it('checkIfDataSourceIsEmpty should be false when dataSource.data.length is not empty', () => {
-    expect(component.checkIfDataSourceIsEmpty(state.timeEntriesDataSource)).toBeFalse();
+    expect(component.checkIfDataSourceIsLoadingorEmpty(state.timeEntriesDataSource)).toBeFalse();
   });
 
   it('checkIfDataSourceIsEmpty should be true when dataSource.data.length is empty', () => {
     state.timeEntriesDataSource.data = [];
 
-    expect(component.checkIfDataSourceIsEmpty(state.timeEntriesDataSource)).toBeTrue();
+    expect(component.checkIfDataSourceIsLoadingorEmpty(state.timeEntriesDataSource)).toBeTrue();
   });
 });
diff --git a/src/app/modules/time-entries/pages/time-entries.component.ts b/src/app/modules/time-entries/pages/time-entries.component.ts
index 09d2435c2..c47da281c 100644
--- a/src/app/modules/time-entries/pages/time-entries.component.ts
+++ b/src/app/modules/time-entries/pages/time-entries.component.ts
@@ -219,15 +219,8 @@ export class TimeEntriesComponent implements OnInit, OnDestroy {
     }
   }
 
-  checkIfDataSourceIsLoading(data: DataSource<Entry>): boolean {
-    if (data.isLoading) {
-      return true;
-    }
-    return false;
-  }
-
-  checkIfDataSourceIsEmpty(data: DataSource<Entry>): boolean {
-    if (data.data.length === 0) {
+  checkIfDataSourceIsLoadingorEmpty(source?: DataSource<Entry>): boolean {
+    if (source.isLoading || source.data.length === 0) {
       return true;
     }
     return false;

From b927d9615f9a7422e2b704582b4af49349fca45e Mon Sep 17 00:00:00 2001
From: Edgar Guaman <edgar.guaman@ioet.com>
Date: Fri, 20 Aug 2021 01:13:17 -0500
Subject: [PATCH 7/8] refactor: TT-304 Handle message: Rewriting method and
 unit tests for that method

---
 .../pages/time-entries.component.html            |  2 +-
 .../pages/time-entries.component.spec.ts         | 16 +++-------------
 .../time-entries/pages/time-entries.component.ts |  2 +-
 3 files changed, 5 insertions(+), 15 deletions(-)

diff --git a/src/app/modules/time-entries/pages/time-entries.component.html b/src/app/modules/time-entries/pages/time-entries.component.html
index 7ca96d614..141d9b484 100644
--- a/src/app/modules/time-entries/pages/time-entries.component.html
+++ b/src/app/modules/time-entries/pages/time-entries.component.html
@@ -59,7 +59,7 @@
         </tr>
         <app-loading-bar *ngIf="dataSource.isLoading"></app-loading-bar>
         <tbody *ngIf="!dataSource.isLoading">
-          <tr *ngIf="checkIfDataSourceIsLoadingorEmpty(dataSource)">
+          <tr *ngIf="!checkIfDataSourceIsLoadingorEmpty(dataSource)">
             <td class="text-center" colspan="7">{{NO_DATA_MESSAGE}}</td>
           </tr>
           <tr class="d-flex" *ngFor="let entry of dataSource.data">
diff --git a/src/app/modules/time-entries/pages/time-entries.component.spec.ts b/src/app/modules/time-entries/pages/time-entries.component.spec.ts
index 6c34bf90e..4039da2bf 100644
--- a/src/app/modules/time-entries/pages/time-entries.component.spec.ts
+++ b/src/app/modules/time-entries/pages/time-entries.component.spec.ts
@@ -669,23 +669,13 @@ describe('TimeEntriesComponent', () => {
     expect(HTMLTimeEntriesView).not.toBeNull();
   });
 
-  it('checkIfDataSourceIsLoading should be false when dataSource.isLoading is false', () => {
-    expect(component.checkIfDataSourceIsLoadingorEmpty(state.timeEntriesDataSource)).toBeFalse();
-  });
-
-  it('checkIfDataSourceIsLoading should be true when dataSource.isLoading is true', () => {
+  it('checkIfDataSourceIsLoadingorEmpty should be true when dataSource is Loading and data is not empty', () => {
     state.timeEntriesDataSource.isLoading = true;
-
+    state.timeEntriesDataSource.data = [];
     expect(component.checkIfDataSourceIsLoadingorEmpty(state.timeEntriesDataSource)).toBeTrue();
   });
 
-  it('checkIfDataSourceIsEmpty should be false when dataSource.data.length is not empty', () => {
+  it('checkIfDataSourceIsLoadingorEmpty should be false when just dataSource.data.length is empty', () => {
     expect(component.checkIfDataSourceIsLoadingorEmpty(state.timeEntriesDataSource)).toBeFalse();
   });
-
-  it('checkIfDataSourceIsEmpty should be true when dataSource.data.length is empty', () => {
-    state.timeEntriesDataSource.data = [];
-
-    expect(component.checkIfDataSourceIsLoadingorEmpty(state.timeEntriesDataSource)).toBeTrue();
-  });
 });
diff --git a/src/app/modules/time-entries/pages/time-entries.component.ts b/src/app/modules/time-entries/pages/time-entries.component.ts
index c47da281c..df62fc040 100644
--- a/src/app/modules/time-entries/pages/time-entries.component.ts
+++ b/src/app/modules/time-entries/pages/time-entries.component.ts
@@ -220,7 +220,7 @@ export class TimeEntriesComponent implements OnInit, OnDestroy {
   }
 
   checkIfDataSourceIsLoadingorEmpty(source?: DataSource<Entry>): boolean {
-    if (source.isLoading || source.data.length === 0) {
+    if (source.isLoading && source.data.length === 0) {
       return true;
     }
     return false;

From 9bff77928f7f65be6c8fcf6d650276ec99017054 Mon Sep 17 00:00:00 2001
From: Edgar Guaman <edgar.guaman@ioet.com>
Date: Fri, 20 Aug 2021 21:09:21 -0500
Subject: [PATCH 8/8] refactor: TT-304 Handle message: New approach for the
 ticket

---
 .../time-entries/pages/time-entries.component.html     |  4 ++--
 .../time-entries/pages/time-entries.component.spec.ts  | 10 ----------
 .../time-entries/pages/time-entries.component.ts       |  7 -------
 3 files changed, 2 insertions(+), 19 deletions(-)

diff --git a/src/app/modules/time-entries/pages/time-entries.component.html b/src/app/modules/time-entries/pages/time-entries.component.html
index 141d9b484..ac2060ef3 100644
--- a/src/app/modules/time-entries/pages/time-entries.component.html
+++ b/src/app/modules/time-entries/pages/time-entries.component.html
@@ -54,12 +54,12 @@
             <th class="col"></th>
           </tr>
         </thead>
-        <tr *ngIf="checkIfDataSourceIsLoadingorEmpty(dataSource)">
+        <tr *ngIf="dataSource.isLoading">
           <td class="text-center" colspan="7">{{NO_DATA_MESSAGE}}</td>
         </tr>
         <app-loading-bar *ngIf="dataSource.isLoading"></app-loading-bar>
         <tbody *ngIf="!dataSource.isLoading">
-          <tr *ngIf="!checkIfDataSourceIsLoadingorEmpty(dataSource)">
+          <tr *ngIf="!dataSource?.data.length">
             <td class="text-center" colspan="7">{{NO_DATA_MESSAGE}}</td>
           </tr>
           <tr class="d-flex" *ngFor="let entry of dataSource.data">
diff --git a/src/app/modules/time-entries/pages/time-entries.component.spec.ts b/src/app/modules/time-entries/pages/time-entries.component.spec.ts
index 4039da2bf..2406a1a59 100644
--- a/src/app/modules/time-entries/pages/time-entries.component.spec.ts
+++ b/src/app/modules/time-entries/pages/time-entries.component.spec.ts
@@ -668,14 +668,4 @@ describe('TimeEntriesComponent', () => {
 
     expect(HTMLTimeEntriesView).not.toBeNull();
   });
-
-  it('checkIfDataSourceIsLoadingorEmpty should be true when dataSource is Loading and data is not empty', () => {
-    state.timeEntriesDataSource.isLoading = true;
-    state.timeEntriesDataSource.data = [];
-    expect(component.checkIfDataSourceIsLoadingorEmpty(state.timeEntriesDataSource)).toBeTrue();
-  });
-
-  it('checkIfDataSourceIsLoadingorEmpty should be false when just dataSource.data.length is empty', () => {
-    expect(component.checkIfDataSourceIsLoadingorEmpty(state.timeEntriesDataSource)).toBeFalse();
-  });
 });
diff --git a/src/app/modules/time-entries/pages/time-entries.component.ts b/src/app/modules/time-entries/pages/time-entries.component.ts
index df62fc040..07d3687ea 100644
--- a/src/app/modules/time-entries/pages/time-entries.component.ts
+++ b/src/app/modules/time-entries/pages/time-entries.component.ts
@@ -218,11 +218,4 @@ export class TimeEntriesComponent implements OnInit, OnDestroy {
       });
     }
   }
-
-  checkIfDataSourceIsLoadingorEmpty(source?: DataSource<Entry>): boolean {
-    if (source.isLoading && source.data.length === 0) {
-      return true;
-    }
-    return false;
-  }
 }