change default sorting in date range selection from monday to sunday

src/app/modules/reports/components/time-range-form/time-range-form.component.ts

@@ -7,6 +7,7 @@ import * as entryActions from '../../../time-clock/store/entry.actions';
 import {Store} from '@ngrx/store';
 import {EntryState} from '../../../time-clock/store/entry.reducer';
 import * as moment from 'moment';
+import { DateAdapter } from '@angular/material/core';
 
 @Component({
   selector: 'app-time-range-form',
@@ -20,12 +21,14 @@ export class TimeRangeFormComponent implements OnInit, OnChanges {
   private startDate = new FormControl('');
   private endDate = new FormControl('');
 
-  constructor(private store: Store<EntryState>, private toastrService: ToastrService) {
+  constructor(private store: Store<EntryState>, private toastrService: ToastrService, private date: DateAdapter<Date>) {
     this.reportForm = new FormGroup({
       startDate: this.startDate,
       endDate: this.endDate
     });
+    date.getFirstDayOfWeek = () => 1;
   }
+
   ngOnInit(): void {
     this.setInitialDataOnScreen();
   }
@@ -38,11 +41,12 @@ export class TimeRangeFormComponent implements OnInit, OnChanges {
 
   setInitialDataOnScreen() {
     this.reportForm.setValue({
-      startDate: formatDate(moment().startOf('week').format('l'), DATE_FORMAT, 'en'),
+      startDate: formatDate(moment().startOf('isoWeek').format('l'), DATE_FORMAT, 'en'),
       endDate: formatDate(moment().format('l'), DATE_FORMAT, 'en')
     });
     this.onSubmit();
   }
+
   onSubmit() {
     const endDate = moment(this.endDate.value).endOf('day');
     const startDate = moment(this.startDate.value).startOf('day');

src/app/modules/reports/components/time-range-form/time-range.component.spec.ts

@@ -8,12 +8,14 @@ import { InputDateComponent } from '../../../shared/components/input-date/input-
 import * as entryActions from '../../../time-clock/store/entry.actions';
 import * as moment from 'moment';
 import { SimpleChange } from '@angular/core';
+import { DateAdapter } from '@angular/material/core';
 
 describe('Reports Page', () => {
   describe('TimeRangeFormComponent', () => {
     let component: TimeRangeFormComponent;
     let fixture: ComponentFixture<TimeRangeFormComponent>;
     let store: MockStore<EntryState>;
+
     const toastrServiceStub = {
       error: (message?: string, title?: string, override?: Partial<IndividualConfig>) => { }
     };
@@ -46,11 +48,11 @@ describe('Reports Page', () => {
         declarations: [TimeRangeFormComponent, InputDateComponent],
         providers: [
           provideMockStore({ initialState: state }),
-          { provide: ToastrService, useValue: toastrServiceStub }
+          { provide: ToastrService, useValue: toastrServiceStub },
+          { provide: DateAdapter, useClass: DateAdapter }
         ],
       }).compileComponents();
       store = TestBed.inject(MockStore);
-
     }));
 
     beforeEach(() => {

src/app/modules/shared/components/input-date/input-date.component.ts

@@ -16,15 +16,13 @@ import * as moment from 'moment';
     }
   ]
 })
+
 export class InputDateComponent implements ControlValueAccessor {
   value: string;
   isDisabled: boolean;
   onChange = (_: any) => { };
   onTouch = () => {  };
 
-  constructor() {
-  }
-
   onInput(value: moment.Moment) {
     this.value = value.format(DATE_FORMAT_YEAR);
     this.onTouch();