fix: TT-319 Fix calendar week and day view

Author: Andrés Soto

src/app/modules/time-entries/components/calendar/calendar.component.spec.ts

@@ -198,10 +198,11 @@ describe('CalendarComponent', () => {
   });
 
   it('emit current date and call navigationEnable when call handleChangeDateEvent', () => {
+    const calendarView: CalendarView = CalendarView.Month;
     const fakeValueEmit = {
       date: currentDate.toDate(),
+      calendarView
     };
-    const calendarView = CalendarView.Month;
     spyOn(component, 'navigationEnable');
     spyOn(component.changeDate, 'emit');
     spyOn(component, 'isVisibleForCurrentDate');

src/app/modules/time-entries/components/calendar/calendar.component.ts

@@ -109,7 +109,7 @@ export class CalendarComponent implements OnInit {
     const date = this.currentDate;
     this.isToday = this.isVisibleForCurrentDate();
     this.navigationEnable(this.calendarView);
-    this.changeDate.emit({ date });
+    this.changeDate.emit({ date, calendarView: this.calendarView });
   }
 
   changeCalendarView(calendarView: CalendarView) {

src/app/modules/time-entries/pages/time-entries.component.html

@@ -32,6 +32,7 @@
           *ngIf="!dataSource.isLoading"
           [timeEntries$]="timeEntriesDataSource$"
           [currentDate]="selectedDate.toDate()"
+          [calendarView]="calendarView"
           (changeDate)="changeDate($event)"
           (viewModal)="editEntry($event.id)"
           (deleteTimeEntry)="openModal($event.timeEntry)"

src/app/modules/time-entries/pages/time-entries.component.spec.ts

@@ -21,6 +21,7 @@ import { NgxMaterialTimepickerModule } from 'ngx-material-timepicker';
 import { CookieService } from 'ngx-cookie-service';
 import { DebugElement } from '@angular/core';
 import { FeatureToggle } from './../../../../environments/enum';
+import { CalendarView } from 'angular-calendar';
 import * as moment from 'moment';
 
 describe('TimeEntriesComponent', () => {
@@ -568,8 +569,10 @@ describe('TimeEntriesComponent', () => {
   it('set date in selectedDate when call changeDate and selectedDate.month() is same to incoming date', () => {
     const incomingDate = new Date('2021-06-07');
     const incomingMoment: moment.Moment = moment(incomingDate);
+    const calendarView: CalendarView = CalendarView.Month;
     const eventData = {
       date: incomingDate,
+      calendarView
     };
     spyOn(component, 'dateSelected');
     component.selectedDate = moment(incomingMoment).subtract(1, 'day');
@@ -583,8 +586,10 @@ describe('TimeEntriesComponent', () => {
   it('call dateSelected when call changeDate and selectedDate.month() is different to incoming date', () => {
     const incomingDate = new Date('2021-01-07');
     const incomingMoment: moment.Moment = moment(incomingDate);
+    const calendarView: CalendarView = CalendarView.Month;
     const eventData = {
       date: incomingDate,
+      calendarView
     };
     const selectedDate = {
       monthIndex: incomingMoment.month(),

src/app/modules/time-entries/pages/time-entries.component.ts

@@ -14,6 +14,7 @@ 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 { CalendarView } from 'angular-calendar';
 @Component({
   selector: 'app-time-entries',
   templateUrl: './time-entries.component.html',
@@ -38,6 +39,7 @@ export class TimeEntriesComponent implements OnInit, OnDestroy {
   selectedYear: number;
   selectedMonthAsText: string;
   isActiveEntryOverlapping = false;
+  calendarView: CalendarView = CalendarView.Month;
   readonly NO_DATA_MESSAGE: string = 'No data available in table';
   constructor(
     private store: Store<EntryState>,
@@ -182,7 +184,7 @@ export class TimeEntriesComponent implements OnInit, OnDestroy {
     this.selectedDate = moment().month(event.monthIndex).year(event.year);
   }
 
-  changeDate(event: { date: Date }){
+  changeDate(event: { date: Date, calendarView: CalendarView }){
     const newDate: moment.Moment = moment(event.date);
     if (this.selectedDate.month() !== newDate.month()){
       const monthSelected = newDate.month();
@@ -194,6 +196,7 @@ export class TimeEntriesComponent implements OnInit, OnDestroy {
       this.dateSelected(selectedDate);
     }
     this.selectedDate = newDate;
+    this.calendarView = event.calendarView;
   }
 
   openModal(item: any) {