Merge branch 'master' of https://github.com/ioet/time-tracker-ui

Author: jase156

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "time-tracker",
-  "version": "1.45.6",
+  "version": "1.46.0",
   "scripts": {
     "preinstall": "npx npm-force-resolutions",
     "ng": "ng",
@@ -31,6 +31,8 @@
     "@ngrx/store": "^10.0.1",
     "@ngrx/store-devtools": "^10.0.1",
     "@types/datatables.net-buttons": "^1.4.3",
+    "angular-calendar": "^0.28.24",
+    "date-fns": "^2.22.1",
     "angular-datatables": "^9.0.2",
     "bootstrap": "^4.4.1",
     "datatables.net": "^1.10.21",

package.json

@@ -16,6 +16,8 @@ import { MatInputModule } from '@angular/material/input';
 import { MatMomentDateModule } from '@angular/material-moment-adapter';
 import { NgxPaginationModule } from 'ngx-pagination';
 import { AutocompleteLibModule } from 'angular-ng-autocomplete';
+import { CalendarModule, DateAdapter } from 'angular-calendar';
+import { adapterFactory } from 'angular-calendar/date-adapters/date-fns';
 
 import { AppRoutingModule } from './app-routing.module';
 import { AppComponent } from './app.component';
@@ -81,6 +83,7 @@ import { NgxMaterialTimepickerModule } from 'ngx-material-timepicker';
 // tslint:disable-next-line: max-line-length
 import { TechnologyReportTableComponent } from './modules/technology-report/components/technology-report-table/technology-report-table.component';
 import { TechnologyReportComponent } from './modules/technology-report/pages/technology-report.component';
+import { CalendarComponent } from './modules/time-entries/components/calendar/calendar.component';
 
 const maskConfig: Partial<IConfig> = {
   validation: false,
@@ -133,6 +136,7 @@ const maskConfig: Partial<IConfig> = {
     UsersListComponent,
     TechnologyReportComponent,
     TechnologyReportTableComponent,
+    CalendarComponent,
   ],
   imports: [
     NgxMaskModule.forRoot(maskConfig),
@@ -171,6 +175,10 @@ const maskConfig: Partial<IConfig> = {
       UserEffects,
     ]),
     ToastrModule.forRoot(),
+    CalendarModule.forRoot({
+      provide: DateAdapter,
+      useFactory: adapterFactory,
+    }),
   ],
   providers: [
     {

src/app/app.module.ts

@@ -3,7 +3,7 @@ import { AfterViewInit, Component, OnDestroy, OnInit, ViewChild} from '@angular/
 import { select, Store } from '@ngrx/store';
 import { DataTableDirective } from 'angular-datatables';
 import * as moment from 'moment';
-import { Observable, Subject } from 'rxjs';
+import { Observable, Subject, Subscription } from 'rxjs';
 import { Entry } from 'src/app/modules/shared/models';
 import { DataSource } from 'src/app/modules/shared/models/data-source.model';
 import { EntryState } from '../../../time-clock/store/entry.reducer';
@@ -60,13 +60,14 @@ export class TimeEntriesTableComponent implements OnInit, OnDestroy, AfterViewIn
   dtElement: DataTableDirective;
   isLoading$: Observable<boolean>;
   reportDataSource$: Observable<DataSource<Entry>>;
+  rerenderTableSubscription: Subscription;
 
   constructor(private store: Store<EntryState>) {
     this.reportDataSource$ = this.store.pipe(select(getReportDataSource));
   }
 
   ngOnInit(): void {
-    this.reportDataSource$.subscribe((ds) => {
+    this.rerenderTableSubscription = this.reportDataSource$.subscribe((ds) => {
       this.rerenderDataTable();
     });
   }
@@ -76,17 +77,18 @@ export class TimeEntriesTableComponent implements OnInit, OnDestroy, AfterViewIn
   }
 
   ngOnDestroy(): void {
+    this.rerenderTableSubscription.unsubscribe();
     this.dtTrigger.unsubscribe();
   }
 
   private rerenderDataTable(): void {
     if (this.dtElement && this.dtElement.dtInstance) {
       this.dtElement.dtInstance.then((dtInstance: DataTables.Api) => {
-        dtInstance.destroy();
-        this.dtTrigger.next();
+          dtInstance.destroy();
+          this.dtTrigger.next();
       });
     } else {
-      this.dtTrigger.next();
+        this.dtTrigger.next();
     }
   }
 

src/app/modules/reports/components/time-entries-table/time-entries-table.component.ts

@@ -418,19 +418,6 @@ describe('DetailsFieldsComponent', () => {
     expect(component.saveEntry.emit).toHaveBeenCalledWith(data);
   });
 
-  it('should not modify the start_date when start_hour has not been modified', () => {
-    const currentDate = moment().format('YYYY-MM-DD');
-    const startHour = moment().subtract(3, 'hours').format('HH:mm:ss');
-    const expectedStartDate = new Date(`${currentDate}T${startHour.trim()}`);
-
-    component.entryToEdit = { ...entryToEdit, start_date: expectedStartDate };
-    fixture.componentInstance.ngOnChanges();
-
-    component.entryForm.patchValue({ description: 'test' });
-
-    expect(component.dateToSubmit('start_date', 'start_hour')).toEqual(expectedStartDate);
-  });
-
   it('should modify the start_date when start_hour has been modified', () => {
     const startDate = new Date(mockCurrentDate);
 
@@ -445,19 +432,6 @@ describe('DetailsFieldsComponent', () => {
     expect(component.dateToSubmit('start_date', 'start_hour')).toEqual(expectedStartDate);
   });
 
-  it('should not modify the end_date when end_hour has not been modified', () => {
-    const currentDate = moment().format('YYYY-MM-DD');
-    const endHour = moment().subtract(3, 'hours').format('HH:mm:ss');
-    const expectedEndDate = new Date(`${currentDate}T${endHour.trim()}`);
-
-    component.entryToEdit = { ...entryToEdit, end_date: expectedEndDate };
-    fixture.componentInstance.ngOnChanges();
-
-    component.entryForm.patchValue({ description: 'test' });
-
-    expect(component.dateToSubmit('end_date', 'end_hour')).toEqual(expectedEndDate);
-  });
-
   it('should modify the end_date when end_hour has been modified', () => {
     const endDate = new Date(mockCurrentDate);
 

src/app/modules/shared/components/details-fields/details-fields.component.spec.ts

@@ -269,8 +269,7 @@ export class DetailsFieldsComponent implements OnChanges, OnInit {
     const updatedHour = this.entryForm.value[hour];
     const updatedDate = new Date(`${entryFormDate}T${updatedHour.trim()}`).toISOString();
     const initialDate = get(this.entryToEdit, date, updatedDate);
-    const initialHour = formatDate(get(this.entryToEdit, date, updatedDate), 'HH:mm', 'en');
-    const dateHasNotChanged = updatedHour === initialHour;
+    const dateHasNotChanged = (initialDate === updatedDate);
     const result = dateHasNotChanged ? initialDate : updatedDate;
     return result;
   }