feat: #405 loading my last entry

Author: enriquezrene

src/app/modules/shared/models/entry.model.ts

@@ -1,10 +1,10 @@
 export interface Entry {
   running?: boolean;
-  id: string;
+  id?: string;
   start_date: Date;
   end_date?: Date;
   activity_id?: string;
-  technologies: string[];
+  technologies?: string[];
   uri?: string;
   activity_name?: string;
   description?: string;

src/app/modules/time-clock/components/entry-fields/entry-fields.component.ts

@@ -1,12 +1,14 @@
-import { getActiveTimeEntry } from './../../store/entry.selectors';
+import { ActivityManagementActionTypes } from './../../../activities-management/store/activity-management.actions';
+import { EntryActionTypes, LoadActiveEntry } from './../../store/entry.actions';
+import { filter } from 'rxjs/operators';
 import { Component, OnInit } from '@angular/core';
 import { FormBuilder, FormGroup } from '@angular/forms';
-import { select, Store } from '@ngrx/store';
+import { Store, ActionsSubject } from '@ngrx/store';
 
 import { Activity, NewEntry } from '../../../shared/models';
 import { ProjectState } from '../../../customer-management/components/projects/components/store/project.reducer';
 import { TechnologyState } from '../../../shared/store/technology.reducers';
-import { ActivityState, allActivities, LoadActivities } from '../../../activities-management/store';
+import { ActivityState, LoadActivities } from '../../../activities-management/store';
 
 import * as entryActions from '../../store/entry.actions';
 
@@ -24,37 +26,44 @@ export class EntryFieldsComponent implements OnInit {
   activeEntry;
   newData;
 
-  constructor(private formBuilder: FormBuilder, private store: Store<Merged>) {
+  constructor(private formBuilder: FormBuilder, private store: Store<Merged>, private actionsSubject$: ActionsSubject) {
     this.entryForm = this.formBuilder.group({
       description: '',
       uri: '',
-      activity_id: '-1',
+      activity_id: '',
     });
   }
 
   ngOnInit(): void {
     this.store.dispatch(new LoadActivities());
-    const activities$ = this.store.pipe(select(allActivities));
-    activities$.subscribe((response) => {
-      this.activities = response;
-      this.loadActiveEntry();
+
+    this.actionsSubject$.pipe(
+      filter((action: any) => (action.type === ActivityManagementActionTypes.LOAD_ACTIVITIES_SUCCESS))
+    ).subscribe((action) => {
+      this.activities = action.payload;
+      this.store.dispatch(new LoadActiveEntry());
     });
-  }
 
-  loadActiveEntry() {
-    const activeEntry$ = this.store.pipe(select(getActiveTimeEntry));
-    activeEntry$.subscribe((response) => {
-      if (response) {
-        this.activeEntry = response;
-        this.setDataToUpdate(this.activeEntry);
-        this.newData = {
-          id: this.activeEntry.id,
-          project_id: this.activeEntry.project_id,
-          uri: this.activeEntry.uri,
-          activity_id: this.activeEntry.activity_id,
-        };
+    this.actionsSubject$.pipe(
+      filter((action: any) => (action.type === EntryActionTypes.CREATE_ENTRY_SUCCESS))
+    ).subscribe((action) => {
+      if (!action.payload.end_date) {
+        this.store.dispatch(new LoadActiveEntry());
       }
     });
+
+    this.actionsSubject$.pipe(
+      filter((action: any) => ( action.type === EntryActionTypes.LOAD_ACTIVE_ENTRY_SUCCESS ))
+    ).subscribe((action) => {
+      this.activeEntry = action.payload;
+      this.setDataToUpdate(this.activeEntry);
+      this.newData = {
+        id: this.activeEntry.id,
+        project_id: this.activeEntry.project_id,
+        uri: this.activeEntry.uri,
+        activity_id: this.activeEntry.activity_id,
+      };
+    });
   }
 
   get activity_id() {

src/app/modules/time-clock/components/project-list-hover/project-list-hover.component.spec.ts

@@ -1,15 +1,15 @@
-import { HttpClientTestingModule } from '@angular/common/http/testing';
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ToastrService, IndividualConfig } from 'ngx-toastr';
+import { SwitchTimeEntry, ClockIn } from './../../store/entry.actions';
 import { FormBuilder } from '@angular/forms';
-import { MockStore, provideMockStore } from '@ngrx/store/testing';
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { provideMockStore, MockStore } from '@ngrx/store/testing';
+import { HttpClientTestingModule } from '@angular/common/http/testing';
 import { AutocompleteLibModule } from 'angular-ng-autocomplete';
-import { IndividualConfig, ToastrService } from 'ngx-toastr';
 import { Subscription } from 'rxjs';
 import { ProjectState } from '../../../customer-management/components/projects/components/store/project.reducer';
 import { getCustomerProjects } from '../../../customer-management/components/projects/components/store/project.selectors';
 import { FilterProjectPipe } from '../../../shared/pipes';
-import { CreateEntry, UpdateEntryRunning } from '../../store/entry.actions';
-import { SwitchTimeEntry } from './../../store/entry.actions';
+import { UpdateEntryRunning } from '../../store/entry.actions';
 import { ProjectListHoverComponent } from './project-list-hover.component';
 
 describe('ProjectListHoverComponent', () => {
@@ -68,7 +68,7 @@ describe('ProjectListHoverComponent', () => {
 
     component.clockIn(1, 'customer', 'project');
 
-    expect(store.dispatch).toHaveBeenCalledWith(jasmine.any(CreateEntry));
+    expect(store.dispatch).toHaveBeenCalledWith(jasmine.any(ClockIn));
   });
 
   it('dispatch a UpdateEntryRunning action on updateProject', () => {
@@ -118,6 +118,7 @@ describe('ProjectListHoverComponent', () => {
       .toHaveBeenCalledWith({ project_id: 'customer - xyz'});
   });
 
+
   // TODO Fix this test since it is throwing this error
   // Expected spy dispatch to have been called with:
   // [CreateEntry({ payload: Object({ project_id: '1', start_date: '2020-07-27T22:30:26.743Z', timezone_offset: 300 }),

src/app/modules/time-clock/components/project-list-hover/project-list-hover.component.ts

@@ -83,7 +83,7 @@ export class ProjectListHoverComponent implements OnInit, OnDestroy {
       start_date: new Date().toISOString(),
       timezone_offset: new Date().getTimezoneOffset(),
     };
-    this.store.dispatch(new entryActions.CreateEntry(entry));
+    this.store.dispatch(new entryActions.ClockIn(entry));
     this.projectsForm.setValue( { project_id: `${customerName} - ${name}`, } );
   }
 

src/app/modules/time-clock/services/entry.service.spec.ts

@@ -123,4 +123,13 @@ describe('EntryService', () => {
     const restartEntryRequest = httpMock.expectOne( `${service.baseUrl}/${entry}/restart`);
     expect(restartEntryRequest.request.method).toBe('POST');
   });
+
+  it('entries are found by project id with a limit 2 by default', () => {
+    const projectId = 'project-id';
+
+    service.findEntriesByProjectId(projectId).subscribe();
+
+    const restartEntryRequest = httpMock.expectOne( `${service.baseUrl}?limit=2&project_id=${projectId}`);
+    expect(restartEntryRequest.request.method).toBe('GET');
+  });
 });

src/app/modules/time-clock/services/entry.service.ts

@@ -57,6 +57,11 @@ export class EntryService {
     return this.http.get<TimeEntriesSummary>(summaryUrl);
   }
 
+  findEntriesByProjectId(projectId: string): Observable<Entry[]> {
+    const findEntriesByProjectURL = `${this.baseUrl}?limit=2&project_id=${projectId}`;
+    return this.http.get<Entry[]>(findEntriesByProjectURL);
+  }
+
   loadEntriesByTimeRange(range: TimeEntriesTimeRange, userId: string): Observable<any> {
     const MAX_NUMBER_OF_ENTRIES_FOR_REPORTS = 9999;
     return this.http.get(this.baseUrl,

src/app/modules/time-clock/store/entry.actions.ts

@@ -13,6 +13,8 @@ export enum EntryActionTypes {
   LOAD_ENTRIES = '[Entry] LOAD_ENTRIES',
   LOAD_ENTRIES_SUCCESS = '[Entry] LOAD_ENTRIES_SUCCESS',
   LOAD_ENTRIES_FAIL = '[Entry] LOAD_ENTRIES_FAIL',
+  CLOCK_IN = '[Entry] CLOCK_IN',
+  CLOCK_IN_SUCCESS = '[Entry] CLOCK_IN_SUCCESS',
   CREATE_ENTRY = '[Entry] CREATE_ENTRY',
   CREATE_ENTRY_SUCCESS = '[Entry] CREATE_ENTRY_SUCCESS',
   CREATE_ENTRY_FAIL = '[Entry] CREATE_ENTRY_FAIL',
@@ -39,6 +41,16 @@ export enum EntryActionTypes {
   RESTART_ENTRY_FAIL = '[Entry] RESTART_ENTRY_FAIL',
 }
 
+export class ClockIn implements Action {
+  public readonly type = EntryActionTypes.CLOCK_IN;
+  constructor(readonly payload: NewEntry) {}
+}
+
+export class ClockInSuccess implements Action {
+  public readonly type = EntryActionTypes.CLOCK_IN_SUCCESS;
+  constructor() {}
+}
+
 export class SwitchTimeEntry implements Action {
   public readonly type = EntryActionTypes.SWITCH_TIME_ENTRY;
   constructor(readonly idEntrySwitching: string, readonly idProjectSwitching) {}
@@ -250,6 +262,8 @@ export class RestartEntryFail implements Action {
 }
 
 export type EntryActions =
+  | ClockIn
+  | ClockInSuccess
   | LoadEntriesSummary
   | LoadEntriesSummarySuccess
   | LoadEntriesSummaryFail

src/app/modules/time-clock/store/entry.effects.ts

@@ -1,11 +1,12 @@
+import { NewEntry } from './../../shared/models/entry.model';
+import { INFO_DELETE_SUCCESSFULLY, INFO_SAVED_SUCCESSFULLY } from './../../shared/messages';
 import { Injectable } from '@angular/core';
 import { Actions, Effect, ofType } from '@ngrx/effects';
 import { Action } from '@ngrx/store';
 import { ToastrService } from 'ngx-toastr';
 import { Observable, of } from 'rxjs';
 import { catchError, map, mergeMap, switchMap } from 'rxjs/operators';
 import { EntryService } from '../services/entry.service';
-import { INFO_DELETE_SUCCESSFULLY, INFO_SAVED_SUCCESSFULLY } from './../../shared/messages';
 import * as actions from './entry.actions';
 
 @Injectable()
@@ -20,7 +21,7 @@ export class EntryEffects {
       this.entryService.stopEntryRunning(action.idEntrySwitching).pipe(
         map((response) => {
           const stopDateForEntry = new Date(response.end_date);
-          stopDateForEntry.setSeconds(stopDateForEntry.getSeconds() + 1 );
+          stopDateForEntry.setSeconds(stopDateForEntry.getSeconds() + 1);
           return new actions.CreateEntry({
             project_id: action.idProjectSwitching,
             start_date: stopDateForEntry.toISOString(),
@@ -116,6 +117,31 @@ export class EntryEffects {
     )
   );
 
+  @Effect()
+  clockIn$: Observable<Action> = this.actions$.pipe(
+    ofType(actions.EntryActionTypes.CLOCK_IN),
+    map((action: actions.CreateEntry) => action.payload),
+    mergeMap((entry: NewEntry) =>
+      this.entryService.findEntriesByProjectId(entry.project_id).pipe(
+        map((entriesFound) => {
+          if (entriesFound && entriesFound.length > 0) {
+            const dataToUse = entriesFound[0];
+            entry = { ...entry };
+            entry.description = dataToUse.description;
+            entry.technologies = dataToUse.technologies ? dataToUse.technologies : [];
+            entry.uri = dataToUse.uri;
+            entry.activity_id = dataToUse.activity_id;
+          }
+          return new actions.CreateEntry(entry);
+        }),
+        catchError((error) => {
+          this.toastrService.error('We could not clock in you, try again later.');
+          return of(new actions.CreateEntryFail('Error'));
+        })
+      )
+    )
+  );
+
   @Effect()
   deleteEntry$: Observable<Action> = this.actions$.pipe(
     ofType(actions.EntryActionTypes.DELETE_ENTRY),
@@ -214,7 +240,7 @@ export class EntryEffects {
           return new actions.RestartEntrySuccess(entryResponse);
         }),
         catchError((error) => {
-          this.toastrService.error( error.error.message, 'This entry could not be restarted');
+          this.toastrService.error(error.error.message, 'This entry could not be restarted');
           return of(new actions.RestartEntryFail(error));
         })
       )