fix: #99 fix messages

Author: enriquezrene

package-lock.json

@@ -4,27 +4,27 @@
       <span class="input-group-text span-width" id="inputGroup-sizing-sm">Project</span>
     </div>
     <select
-      [class.is-invalid]="project.invalid && project.touched"
+      [class.is-invalid]="project_id.invalid && project_id.touched"
       required
-      id="activity"
+      id="project_id"
       class="form-control"
-      formControlName="project"
+      formControlName="project_id"
     >
-      <option *ngFor="let project of listProjects">{{ project.name }}</option>
+      <option *ngFor="let project of listProjects" value="{{project.id}}">{{ project.name }}</option>
     </select>
   </div>
   <div class="input-group input-group-sm mb-3">
     <div class="input-group-prepend">
       <span class="input-group-text span-width" id="inputGroup-sizing-sm">Activity</span>
     </div>
     <select
-      [class.is-invalid]="activity.invalid && activity.touched"
+      [class.is-invalid]="activity_id.invalid && activity_id.touched"
       required
-      id="activity"
+      id="activity_id"
       class="form-control"
-      formControlName="activity"
+      formControlName="activity_id"
     >
-      <option *ngFor="let activity of activities">{{ activity.name }}</option>
+      <option *ngFor="let activity of activities" value="{{activity.id}}">{{ activity.name }}</option>
     </select>
   </div>
 
@@ -109,7 +109,7 @@
     <textarea formControlName="description" class="form-control" id="NotesTextarea" rows="3"></textarea>
   </div>
   <div class="modal-footer">
-    <button type="submit" class="btn btn-primary" [disabled]="!entryForm.valid">Save</button>
+    <button type="submit" class="btn btn-primary">Save</button>
     <button #closeModal type="button" class="btn btn-secondary" data-dismiss="modal">
       Close
     </button>

src/app/modules/shared/components/details-fields/details-fields.component.html

@@ -75,7 +75,6 @@ describe('DetailsFieldsComponent', () => {
   beforeEach(() => {
     fixture = TestBed.createComponent(DetailsFieldsComponent);
     component = fixture.componentInstance;
-    fixture.detectChanges();
   });
 
   it('should create', () => {
@@ -157,25 +156,6 @@ describe('DetailsFieldsComponent', () => {
     expect(component.entryForm.value).toEqual(formValue);
   });
 
-  it('should dispatch FindTechnology action #getTechnologies', () => {
-    const value = 'java';
-    spyOn(store, 'dispatch');
-    length = value.length;
-    component.getTechnologies(value);
-
-    expect(component.showlist).toBe(true);
-    expect(store.dispatch).toHaveBeenCalledWith(new actions.FindTechnology(value));
-  });
-
-  it('should NOT dispatch FindTechnology action #getTechnologies', () => {
-    const value = 'j';
-    spyOn(store, 'dispatch');
-    length = value.length;
-    component.getTechnologies(value);
-
-    expect(store.dispatch).not.toHaveBeenCalledWith(new actions.FindTechnology(value));
-  });
-
   it('should call createError ', () => {
     mockEntriesUpdateErrorSelector = store.overrideSelector(getCreateError, false);
     spyOn(store, 'dispatch');
@@ -222,6 +202,7 @@ describe('DetailsFieldsComponent', () => {
       { id: 'fc5fab41-a21e-4155-9d05-511b956ebd05', tenant_id: 'ioet', name: 'activity1', description: '' },
     ];
     component.onSubmit();
+    fixture.detectChanges();
     const data = {
       project_id: 'id',
       activity_id: 'fc5fab41-a21e-4155-9d05-511b956ebd05',

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

@@ -11,12 +11,9 @@ import {
 } from '@angular/core';
 import { FormBuilder, FormGroup } from '@angular/forms';
 import { Store, select } from '@ngrx/store';
-import * as actions from '../../store/technology.actions';
 import { formatDate } from '@angular/common';
 
-import { allTechnologies } from '../../store/technology.selectors';
-import { Technology, Project, Activity } from '../../models';
-
+import { Project, Activity } from '../../models';
 import { ProjectState } from '../../../customer-management/components/projects/components/store/project.reducer';
 import { TechnologyState } from '../../store/technology.reducers';
 import { LoadActivities, ActivityState, allActivities } from '../../../activities-management/store';
@@ -40,7 +37,6 @@ export class DetailsFieldsComponent implements OnChanges, OnInit {
   @ViewChild('closeModal') closeModal: ElementRef;
   @ViewChild('list') list: ElementRef;
   entryForm: FormGroup;
-  technology: Technology;
   selectedTechnologies: string[] = [];
   isLoading = false;
   listProjects: Project[] = [];
@@ -56,8 +52,8 @@ export class DetailsFieldsComponent implements OnChanges, OnInit {
       }
     });
     this.entryForm = this.formBuilder.group({
-      project: '',
-      activity: '',
+      project_id: '',
+      activity_id: '',
       description: '',
       start_date: '',
       end_date: '',
@@ -69,11 +65,6 @@ export class DetailsFieldsComponent implements OnChanges, OnInit {
   }
 
   ngOnInit(): void {
-    const technologies$ = this.store.pipe(select(allTechnologies));
-    technologies$.subscribe((response) => {
-      this.isLoading = response.isLoading;
-      this.technology = response.technologyList;
-    });
 
     this.store.dispatch(new projectActions.LoadProjects());
     const projects$ = this.store.pipe(select(getProjects));
@@ -87,31 +78,29 @@ export class DetailsFieldsComponent implements OnChanges, OnInit {
       this.activities = response;
     });
 
-    const updateError$ = this.store.pipe(select(getUpdateError));
-    updateError$.subscribe((updateError) => {
-      if (updateError != null && !updateError) {
-        this.closeEntryModal();
-        this.store.dispatch(new entryActions.CleanEntryUpdateError(null));
-      }
-    });
-    const createError$ = this.store.pipe(select(getCreateError));
-    createError$.subscribe((createError) => {
-      if (createError != null && !createError) {
-        this.closeEntryModal();
-        this.store.dispatch(new entryActions.CleanEntryCreateError(null));
-      }
-    });
+    // const updateError$ = this.store.pipe(select(getUpdateError));
+    // updateError$.subscribe((updateError) => {
+    //   if (updateError != null && !updateError) {
+    //     this.closeEntryModal();
+    //     this.store.dispatch(new entryActions.CleanEntryUpdateError(null));
+    //   }
+    // });
+    // const createError$ = this.store.pipe(select(getCreateError));
+    // createError$.subscribe((createError) => {
+    //   if (createError != null && !createError) {
+    //     this.closeEntryModal();
+    //     this.store.dispatch(new entryActions.CleanEntryCreateError(null));
+    //   }
+    // });
   }
 
   ngOnChanges(): void {
     this.hoursValidation = false;
     if (this.entryToEdit) {
       this.selectedTechnologies = this.entryToEdit.technologies;
-      const project = this.listProjects.find((p) => p.id === this.entryToEdit.project_id);
-      const activity = this.activities.find((a) => a.id === this.entryToEdit.activity_id);
       this.entryForm.setValue({
-        project: project ? project.name : '',
-        activity: activity ? activity.name : '',
+        project_id: this.entryToEdit.project_id,
+        activity_id: this.entryToEdit.activity_id,
         description: this.entryToEdit.description,
         start_date: this.entryToEdit.start_date ? formatDate(this.entryToEdit.start_date, 'yyyy-MM-dd', 'en') : '',
         start_hour: this.entryToEdit.start_date ? formatDate(this.entryToEdit.start_date, 'HH:mm', 'en') : '00:00',
@@ -123,8 +112,8 @@ export class DetailsFieldsComponent implements OnChanges, OnInit {
     } else {
       this.selectedTechnologies = [];
       this.entryForm.setValue({
-        project: '',
-        activity: '',
+        project_id: '',
+        activity_id: '',
         description: '',
         start_date: formatDate(new Date(), 'yyyy-MM-dd', 'en'),
         start_hour: '00:00',
@@ -136,22 +125,15 @@ export class DetailsFieldsComponent implements OnChanges, OnInit {
     }
   }
 
-  getTechnologies(value) {
-    if (value.length >= 2) {
-      this.showlist = true;
-      this.store.dispatch(new actions.FindTechnology(value));
-    }
-  }
-
   onTechnologiesUpdated($event: string[]) {
     this.selectedTechnologies = $event;
   }
 
-  get project() {
-    return this.entryForm.get('project');
+  get project_id() {
+    return this.entryForm.get('project_id');
   }
-  get activity() {
-    return this.entryForm.get('activity');
+  get activity_id() {
+    return this.entryForm.get('activity_id');
   }
 
   get start_date() {
@@ -176,12 +158,10 @@ export class DetailsFieldsComponent implements OnChanges, OnInit {
   }
 
   onSubmit() {
-    const activity = this.activities.find((a) => a.name === this.entryForm.value.activity);
-    const project = this.listProjects.find((p) => p.name === this.entryForm.value.project);
     const entry = {
-      project_id: project ? project.id : null,
-      activity_id: activity ? activity.id : null,
-      technologies: this.selectedTechnologies,
+      project_id: this.entryForm.value.project_id,
+      activity_id: this.entryForm.value.activity_id,
+      technologies: this.selectedTechnologies ? this.selectedTechnologies : [],
       description: this.entryForm.value.description,
       start_date: `${this.entryForm.value.start_date}T${this.entryForm.value.start_hour}`,
       end_date: `${this.entryForm.value.end_date}T${this.entryForm.value.end_hour}`,

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

@@ -22,13 +22,13 @@
     {{ item.name }}
   </div>
 </div>
-<div class="selected-technologies-container d-flex flex-wrap" *ngIf="selectedTechnologies.length">
+<div class="selected-technologies-container d-flex flex-wrap" *ngIf="selectedTechnologies?.length">
   <div *ngFor="let technology of selectedTechnologies; let tagIndex = index" class="selected-technology">
     <span class="mr-3">{{ technology }}</span>
     <i class="fas fa-times text-white" (click)="removeTechnology(tagIndex)"></i>
   </div>
 </div>
-<div class="form-group" *ngIf="selectedTechnologies.length === 0">
+<div class="form-group" *ngIf="selectedTechnologies === null || selectedTechnologies.length === 0">
   <!-- empty-space -->
 </div>
 

src/app/modules/shared/components/technologies/technologies.component.html

@@ -2,7 +2,7 @@ export interface Entry {
   id: string;
   start_date: Date;
   end_date: Date;
-  activity: string;
+  activity_id?: string;
   technologies: string[];
   comments?: string;
   uri?: string;
@@ -15,4 +15,5 @@ export interface NewEntry {
   description?: string;
   technologies?: string[];
   uri?: string;
+  activity_id?: string;
 }