From 9e20d6e78796775e59d1acbda82bde2096e2aa5f Mon Sep 17 00:00:00 2001 From: Vanessa Date: Fri, 19 Feb 2021 22:42:28 -0500 Subject: [PATCH 1/4] fix: TT-141 Have the data persistent in the modal --- .../components/details-fields/details-fields.component.ts | 5 ++++- .../modules/time-entries/pages/time-entries.component.html | 1 + src/app/modules/time-entries/pages/time-entries.component.ts | 3 +++ 3 files changed, 8 insertions(+), 1 deletion(-) diff --git a/src/app/modules/shared/components/details-fields/details-fields.component.ts b/src/app/modules/shared/components/details-fields/details-fields.component.ts index 5a0434d8a..b677d4507 100644 --- a/src/app/modules/shared/components/details-fields/details-fields.component.ts +++ b/src/app/modules/shared/components/details-fields/details-fields.component.ts @@ -30,6 +30,7 @@ export class DetailsFieldsComponent implements OnChanges, OnInit { keyword = 'search_field'; @Input() entryToEdit: Entry; @Input() canMarkEntryAsWIP: boolean; + @Input() isEdit: boolean; @Output() saveEntry = new EventEmitter(); @Output() projectSelected = new EventEmitter(); @ViewChild('closeModal') closeModal: ElementRef; @@ -143,7 +144,9 @@ export class DetailsFieldsComponent implements OnChanges, OnInit { technology: '', }); } else { - this.cleanForm(); + if (this.isEdit) { + this.cleanForm(); + } } } 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 9df5c7f0a..3c95d2040 100644 --- a/src/app/modules/time-entries/pages/time-entries.component.html +++ b/src/app/modules/time-entries/pages/time-entries.component.html @@ -68,6 +68,7 @@
{{ entryId ? 'Edit Entry' : 'New Entry' }}
, private toastrService: ToastrService, private actionsSubject$: ActionsSubject) { this.timeEntriesDataSource$ = this.store.pipe(delay(0), select(getTimeEntriesDataSource)); @@ -75,6 +76,7 @@ export class TimeEntriesComponent implements OnInit, OnDestroy { editEntry(entryId: string) { this.entryId = entryId; + this.isEdit = true; this.store.pipe(select(getTimeEntriesDataSource)).subscribe(ds => { this.entry = ds.data.find((entry) => entry.id === entryId); this.canMarkEntryAsWIP = this.isEntryRunningEqualsToEntryToEdit(this.getEntryRunning(ds.data), this.entry) @@ -123,6 +125,7 @@ export class TimeEntriesComponent implements OnInit, OnDestroy { } projectSelected(event: ProjectSelectedEvent): void { + this.isEdit = false; this.store.pipe(select(getTimeEntriesDataSource)).subscribe(ds => { const dataToUse = ds.data.find(item => item.project_id === event.projectId); if (dataToUse && this.isNewEntry()) { From 46be8e9d1938cce5ed6fcc35534fda91a0555105 Mon Sep 17 00:00:00 2001 From: Vanessa Date: Tue, 23 Feb 2021 15:19:05 -0500 Subject: [PATCH 2/4] feat: TT-141 Create test to validate the isEdit flag of the DetailsFields component --- .../details-fields.component.spec.ts | 16 ++++++++++++++++ .../details-fields/details-fields.component.ts | 2 +- 2 files changed, 17 insertions(+), 1 deletion(-) diff --git a/src/app/modules/shared/components/details-fields/details-fields.component.spec.ts b/src/app/modules/shared/components/details-fields/details-fields.component.spec.ts index 60139632f..9542e9f30 100644 --- a/src/app/modules/shared/components/details-fields/details-fields.component.spec.ts +++ b/src/app/modules/shared/components/details-fields/details-fields.component.spec.ts @@ -171,6 +171,7 @@ describe('DetailsFieldsComponent', () => { it('should emit ngOnChange without data', () => { component.entryToEdit = null; + component.isEdit = true; component.ngOnChanges(); expect(component.shouldRestartEntry).toBeFalse(); expect(component.entryForm.value).toEqual(initialData); @@ -192,6 +193,7 @@ describe('DetailsFieldsComponent', () => { technology: '', }; component.entryToEdit = null; + component.isEdit = true; component.ngOnChanges(); expect(component.entryForm.value).toEqual(formValue); }); @@ -443,6 +445,20 @@ describe('DetailsFieldsComponent', () => { expect(component.projectSelected.emit).toHaveBeenCalledWith(data); }); + it('should clear the form fields', () => { + spyOn(component, 'cleanForm'); + component.isEdit = true; + component.ngOnChanges(); + expect(component.cleanForm).toHaveBeenCalled(); + }); + + it('should persist entry form value', () => { + spyOn(component, 'cleanForm'); + component.isEdit = false; + component.ngOnChanges(); + expect(component.cleanForm).toHaveBeenCalledTimes(0); + }); + /* TODO As part of https://github.com/ioet/time-tracker-ui/issues/424 a new parameter was added to the details-field-component, and now these couple of tests are failing. A solution to this error might be generate a Test Wrapper Component. More details here: diff --git a/src/app/modules/shared/components/details-fields/details-fields.component.ts b/src/app/modules/shared/components/details-fields/details-fields.component.ts index b677d4507..7d8887e4a 100644 --- a/src/app/modules/shared/components/details-fields/details-fields.component.ts +++ b/src/app/modules/shared/components/details-fields/details-fields.component.ts @@ -145,7 +145,7 @@ export class DetailsFieldsComponent implements OnChanges, OnInit { }); } else { if (this.isEdit) { - this.cleanForm(); + this.cleanForm(); } } } From d2fc8aae2d3a0314ef0509dee6461cdc1c2be280 Mon Sep 17 00:00:00 2001 From: Vanessa Date: Thu, 25 Feb 2021 14:06:36 -0500 Subject: [PATCH 3/4] feat: TT-141 Create flag in the TimeEntries component to control whether it is a new entry or an existing one and persist the data in the form, create their respective tests --- .../details-fields.component.spec.ts | 16 ------- .../details-fields.component.ts | 5 +-- .../pages/time-entries.component.html | 1 - .../pages/time-entries.component.spec.ts | 15 ++++++- .../pages/time-entries.component.ts | 45 +++++++------------ 5 files changed, 30 insertions(+), 52 deletions(-) diff --git a/src/app/modules/shared/components/details-fields/details-fields.component.spec.ts b/src/app/modules/shared/components/details-fields/details-fields.component.spec.ts index 9542e9f30..60139632f 100644 --- a/src/app/modules/shared/components/details-fields/details-fields.component.spec.ts +++ b/src/app/modules/shared/components/details-fields/details-fields.component.spec.ts @@ -171,7 +171,6 @@ describe('DetailsFieldsComponent', () => { it('should emit ngOnChange without data', () => { component.entryToEdit = null; - component.isEdit = true; component.ngOnChanges(); expect(component.shouldRestartEntry).toBeFalse(); expect(component.entryForm.value).toEqual(initialData); @@ -193,7 +192,6 @@ describe('DetailsFieldsComponent', () => { technology: '', }; component.entryToEdit = null; - component.isEdit = true; component.ngOnChanges(); expect(component.entryForm.value).toEqual(formValue); }); @@ -445,20 +443,6 @@ describe('DetailsFieldsComponent', () => { expect(component.projectSelected.emit).toHaveBeenCalledWith(data); }); - it('should clear the form fields', () => { - spyOn(component, 'cleanForm'); - component.isEdit = true; - component.ngOnChanges(); - expect(component.cleanForm).toHaveBeenCalled(); - }); - - it('should persist entry form value', () => { - spyOn(component, 'cleanForm'); - component.isEdit = false; - component.ngOnChanges(); - expect(component.cleanForm).toHaveBeenCalledTimes(0); - }); - /* TODO As part of https://github.com/ioet/time-tracker-ui/issues/424 a new parameter was added to the details-field-component, and now these couple of tests are failing. A solution to this error might be generate a Test Wrapper Component. More details here: diff --git a/src/app/modules/shared/components/details-fields/details-fields.component.ts b/src/app/modules/shared/components/details-fields/details-fields.component.ts index 7d8887e4a..a4fbad6fe 100644 --- a/src/app/modules/shared/components/details-fields/details-fields.component.ts +++ b/src/app/modules/shared/components/details-fields/details-fields.component.ts @@ -30,7 +30,6 @@ export class DetailsFieldsComponent implements OnChanges, OnInit { keyword = 'search_field'; @Input() entryToEdit: Entry; @Input() canMarkEntryAsWIP: boolean; - @Input() isEdit: boolean; @Output() saveEntry = new EventEmitter(); @Output() projectSelected = new EventEmitter(); @ViewChild('closeModal') closeModal: ElementRef; @@ -144,9 +143,7 @@ export class DetailsFieldsComponent implements OnChanges, OnInit { technology: '', }); } else { - if (this.isEdit) { - this.cleanForm(); - } + this.cleanForm(); } } 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 3c95d2040..9df5c7f0a 100644 --- a/src/app/modules/time-entries/pages/time-entries.component.html +++ b/src/app/modules/time-entries/pages/time-entries.component.html @@ -68,7 +68,6 @@
{{ entryId ? 'Edit Entry' : 'New Entry' }}
{ it('when creating a new entry, then entryId should be null', () => { component.newEntry(); - expect(component.entry).toBe(null); expect(component.entryId).toBe(null); }); @@ -427,4 +426,18 @@ describe('TimeEntriesComponent', () => { expect(entryData.customer_name).toContain('ioet Inc.'); }); })); + + it('Should the entry be null if the flag is true', () => { + component.wasEditingExistingTimeEntry = true; + component.newEntry(); + expect(component.entry).toBe(null); + }); + + it('Should the input persist the data if the flag is false', () => { + const newEntry = { start_date: new Date(), id: '1234', technologies: [], project_name: 'time-tracker' }; + component.entry = newEntry; + component.wasEditingExistingTimeEntry = false; + component.newEntry(); + expect(component.entry).toEqual(newEntry); + }); }); 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 eeaaeaa87..59d537b61 100644 --- a/src/app/modules/time-entries/pages/time-entries.component.ts +++ b/src/app/modules/time-entries/pages/time-entries.component.ts @@ -25,25 +25,21 @@ export class TimeEntriesComponent implements OnInit, OnDestroy { message: string; idToDelete: string; entriesSubscription: Subscription; + wasEditingExistingTimeEntry = false; canMarkEntryAsWIP = true; timeEntriesDataSource$: Observable>; selectedYearAsText: string; selectedMonth: number; selectedYear: number; selectedMonthAsText: string; - isEdit: boolean; - constructor(private store: Store, private toastrService: ToastrService, private actionsSubject$: ActionsSubject) { this.timeEntriesDataSource$ = this.store.pipe(delay(0), select(getTimeEntriesDataSource)); } - ngOnDestroy(): void { this.entriesSubscription.unsubscribe(); } - ngOnInit(): void { this.loadActiveEntry(); - this.entriesSubscription = this.actionsSubject$.pipe( filter((action: any) => ( action.type === EntryActionTypes.CREATE_ENTRY_SUCCESS || @@ -56,34 +52,32 @@ export class TimeEntriesComponent implements OnInit, OnDestroy { this.store.dispatch(new entryActions.LoadEntries(this.selectedMonth, this.selectedYear)); }); } - newEntry() { - this.entry = null; + if (this.wasEditingExistingTimeEntry) { + this.entry = null; + } + console.log('Esta es', this.entry); this.entryId = null; this.store.pipe(select(getTimeEntriesDataSource)).subscribe(ds => { this.canMarkEntryAsWIP = !this.isThereAnEntryRunning(ds.data); }); } - private getEntryRunning(entries: Entry[]) { const runningEntry: Entry = entries.find(entry => entry.running === true); return runningEntry; } - private isThereAnEntryRunning(entries: Entry[]) { return !!this.getEntryRunning(entries); } - editEntry(entryId: string) { this.entryId = entryId; - this.isEdit = true; this.store.pipe(select(getTimeEntriesDataSource)).subscribe(ds => { this.entry = ds.data.find((entry) => entry.id === entryId); this.canMarkEntryAsWIP = this.isEntryRunningEqualsToEntryToEdit(this.getEntryRunning(ds.data), this.entry) || this.isTheEntryToEditTheLastOne(ds.data); }); + this.wasEditingExistingTimeEntry = true; } - private isEntryRunningEqualsToEntryToEdit(entryRunning: Entry, entryToEdit: Entry) { if (entryRunning && entryToEdit) { return entryRunning.id === entryToEdit.id; @@ -91,7 +85,6 @@ export class TimeEntriesComponent implements OnInit, OnDestroy { return false; } } - private isTheEntryToEditTheLastOne(entries: Entry[]) { if (entries && entries.length > 0) { const lastEntry = entries[0]; @@ -100,11 +93,9 @@ export class TimeEntriesComponent implements OnInit, OnDestroy { return false; } } - private isNewEntry() { return this.entryId === null; } - saveEntry(event: SaveEntryEvent): void { if (this.activeTimeEntry) { const startDateAsLocalDate = new Date(event.entry.start_date); @@ -123,27 +114,25 @@ export class TimeEntriesComponent implements OnInit, OnDestroy { this.doSave(event); } } - projectSelected(event: ProjectSelectedEvent): void { - this.isEdit = false; + this.wasEditingExistingTimeEntry = false; this.store.pipe(select(getTimeEntriesDataSource)).subscribe(ds => { const dataToUse = ds.data.find(item => item.project_id === event.projectId); if (dataToUse && this.isNewEntry()) { const startDate = new Date(new Date().setHours(0, 0, 0, 0)); const entry = { - description : dataToUse.description ? dataToUse.description : '', - technologies : dataToUse.technologies ? dataToUse.technologies : [], - uri : dataToUse.uri ? dataToUse.uri : '', - activity_id : dataToUse.activity_id, - project_id : dataToUse.project_id, - start_date : startDate, - end_date : startDate + description: dataToUse.description ? dataToUse.description : '', + technologies: dataToUse.technologies ? dataToUse.technologies : [], + uri: dataToUse.uri ? dataToUse.uri : '', + activity_id: dataToUse.activity_id, + project_id: dataToUse.project_id, + start_date: startDate, + end_date: startDate }; this.entry = entry; } }); } - doSave(event: SaveEntryEvent) { if (this.entryId) { event.entry.id = this.entryId; @@ -155,19 +144,16 @@ export class TimeEntriesComponent implements OnInit, OnDestroy { this.store.dispatch(new entryActions.CreateEntry(event.entry)); } } - loadActiveEntry() { this.store.dispatch(new entryActions.LoadActiveEntry()); this.store.pipe(select(getActiveTimeEntry)).subscribe((activeTimeEntry) => { this.activeTimeEntry = activeTimeEntry; }); } - removeEntry() { this.store.dispatch(new entryActions.DeleteEntry(this.idToDelete)); this.showModal = false; } - dateSelected(event: { monthIndex: number; year: number }) { this.selectedYear = event.year; this.selectedYearAsText = event.year.toString(); @@ -175,10 +161,9 @@ export class TimeEntriesComponent implements OnInit, OnDestroy { this.selectedMonthAsText = moment().month(event.monthIndex).format('MMMM'); this.store.dispatch(new entryActions.LoadEntries(this.selectedMonth, this.selectedYear)); } - openModal(item: any) { this.idToDelete = item.id; this.message = `Are you sure you want to delete ${item.activity_name}?`; this.showModal = true; } -} +} \ No newline at end of file From 8dc0d4af31edc7007790506d6fa1f7a85193ea46 Mon Sep 17 00:00:00 2001 From: Vanessa Date: Thu, 25 Feb 2021 18:03:09 -0500 Subject: [PATCH 4/4] fix: TT-141 Delete test lines and add in the test the method of edited an entry --- .../modules/time-entries/pages/time-entries.component.spec.ts | 2 ++ src/app/modules/time-entries/pages/time-entries.component.ts | 1 - 2 files changed, 2 insertions(+), 1 deletion(-) 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 73dc3fba1..095d14156 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 @@ -429,6 +429,8 @@ describe('TimeEntriesComponent', () => { it('Should the entry be null if the flag is true', () => { component.wasEditingExistingTimeEntry = true; + const idEntry = '1'; + component.editEntry(idEntry); component.newEntry(); expect(component.entry).toBe(null); }); 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 59d537b61..21a89ccb8 100644 --- a/src/app/modules/time-entries/pages/time-entries.component.ts +++ b/src/app/modules/time-entries/pages/time-entries.component.ts @@ -56,7 +56,6 @@ export class TimeEntriesComponent implements OnInit, OnDestroy { if (this.wasEditingExistingTimeEntry) { this.entry = null; } - console.log('Esta es', this.entry); this.entryId = null; this.store.pipe(select(getTimeEntriesDataSource)).subscribe(ds => { this.canMarkEntryAsWIP = !this.isThereAnEntryRunning(ds.data);