Merge pull request #373 from ioet/340-enable-projects

fix: #340 after customer creation enabling projects and project types tabs

Author: enriquezrene

src/app/modules/customer-management/components/customer-info/components/create-customer/create-customer.spec.ts

@@ -1,3 +1,5 @@
+import { LoadCustomerProjects, CleanCustomerProjects } from './../../../projects/components/store/project.actions';
+import { LoadProjectTypes, CleanProjectTypes } from './../../../projects-type/store/project-type.actions';
 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
 import { FormBuilder } from '@angular/forms';
 import { MockStore, provideMockStore } from '@ngrx/store/testing';
@@ -108,12 +110,34 @@ describe('CreateCustomerComponent', () => {
     expect(component.areTabsActive).toBeTruthy();
   });
 
-  it('set data to update ', () => {
+  it('loads projects and projectTypes when customerData is not null', () => {
     spyOn(store, 'dispatch');
 
     component.ngOnInit();
     component.setDataToUpdate(customerData);
 
-    expect(store.dispatch).toHaveBeenCalledTimes(2);
+    expect(store.dispatch).toHaveBeenCalledWith(new LoadProjectTypes(customerData.id));
+    expect(store.dispatch).toHaveBeenCalledWith(new LoadCustomerProjects(customerData.id));
   });
+
+  it('cleans projects and projectTypes when customerData is null', () => {
+    spyOn(store, 'dispatch');
+
+    component.ngOnInit();
+    component.setDataToUpdate(null);
+
+    expect(store.dispatch).toHaveBeenCalledWith(new CleanProjectTypes());
+    expect(store.dispatch).toHaveBeenCalledWith(new CleanCustomerProjects());
+  });
+
+  it('sets areTabsActive to false and emit its value on markTabsAsInactive', () => {
+    component.areTabsActive = true;
+    spyOn(component.changeValueAreTabsActives, 'emit');
+
+    component.markTabsAsInactive();
+
+    expect(component.areTabsActive).toBe(false);
+    expect(component.changeValueAreTabsActives.emit).toHaveBeenCalledWith(component.areTabsActive);
+  });
+
 });

src/app/modules/customer-management/components/customer-info/components/create-customer/create-customer.ts

@@ -1,3 +1,4 @@
+import { CleanProjectTypes } from './../../../projects-type/store/project-type.actions';
 import { Component, Input, Output, EventEmitter, OnDestroy, OnInit } from '@angular/core';
 import { FormGroup, FormBuilder, Validators } from '@angular/forms';
 import { Store, select } from '@ngrx/store';
@@ -12,7 +13,7 @@ import {
   ResetCustomerToEdit,
 } from 'src/app/modules/customer-management/store';
 import { LoadProjectTypes } from '../../../projects-type/store';
-import { LoadCustomerProjects } from '../../../projects/components/store/project.actions';
+import { LoadCustomerProjects, CleanCustomerProjects } from '../../../projects/components/store/project.actions';
 
 @Component({
   selector: 'app-create-customer',
@@ -35,8 +36,7 @@ export class CreateCustomerComponent implements OnInit, OnDestroy {
   }
 
   ngOnInit() {
-    this.areTabsActive = true;
-    this.changeValueAreTabsActives.emit(this.areTabsActive);
+    this.markTabsAsInactive();
     const customers$ = this.store.pipe(select(getCustomerUnderEdition));
     this.editSubscription = customers$.subscribe((customer) => {
       this.customerToEdit = customer;
@@ -73,10 +73,18 @@ export class CreateCustomerComponent implements OnInit, OnDestroy {
         description: customerData.description,
       });
     } else {
+      this.store.dispatch(new CleanProjectTypes());
+      this.store.dispatch(new CleanCustomerProjects());
+      this.markTabsAsInactive();
       this.customerForm.reset();
     }
   }
 
+  markTabsAsInactive() {
+    this.areTabsActive = false;
+    this.changeValueAreTabsActives.emit(this.areTabsActive);
+  }
+
   get name() {
     return this.customerForm.get('name');
   }

src/app/modules/customer-management/components/projects-type/store/project-type.actions.spec.ts

@@ -1,6 +1,12 @@
 import * as actions from './project-type.actions';
 
 describe('LoadProjectTypesSuccess', () => {
+
+  it('CleanProjectTypes type is ProjectTypeActionTypes.CLEAN_PROJECT_TYPES', () => {
+    const action = new actions.CleanProjectTypes();
+    expect(action.type).toEqual(actions.ProjectTypeActionTypes.CLEAN_PROJECT_TYPES);
+  });
+
   it('LoadProjectTypesSuccess type is ProjectTypeActionTypes.LOAD_PROJECT_TYPES_SUCCESS', () => {
     const loadProjectTypesSuccess = new actions.LoadProjectTypesSuccess([]);
     expect(loadProjectTypesSuccess.type).toEqual(actions.ProjectTypeActionTypes.LOAD_PROJECT_TYPES_SUCCESS);

src/app/modules/customer-management/components/projects-type/store/project-type.actions.ts

@@ -18,6 +18,12 @@ export enum ProjectTypeActionTypes {
   SET_PROJECT_TYPE_ID_TO_EDIT = '[ProjectType] SET_PROJECT_TYPE_ID_TO_EDIT',
   RESET_PROJECT_TYPE_ID_TO_EDIT = '[ProjectType] RESET_PROJECT_TYPE_ID_TO_EDIT',
   DEFAULT_PROJECT_TYPE = '[ProjectType] DEFAULT_PROJECT_TYPE',
+  CLEAN_PROJECT_TYPES = '[ProjectType] CLEAN_PROJECT_TYPES',
+}
+
+export class CleanProjectTypes implements Action {
+  public readonly type = ProjectTypeActionTypes.CLEAN_PROJECT_TYPES;
+  constructor() {}
 }
 
 export class LoadProjectTypes implements Action {
@@ -105,6 +111,7 @@ export class DefaultProjectTypes implements Action {
 }
 
 export type ProjectTypeActions =
+  | CleanProjectTypes
   | LoadProjectTypes
   | LoadProjectTypesSuccess
   | LoadProjectTypesFail

src/app/modules/customer-management/components/projects-type/store/project-type.reducers.spec.ts

@@ -12,6 +12,15 @@ describe('projectTypeReducer', () => {
     expect(state.data).toEqual(initialState.data);
   });
 
+  it('on CLEAN_PROJECT_TYPES, data is cleared', () => {
+    initialState.data = [projectType];
+    const action = new actions.CleanProjectTypes();
+
+    const state = projectTypeReducer(initialState, action);
+
+    expect(state.data).toEqual([]);
+  });
+
   it('on LoadProjectTypes, isLoading is true', () => {
     const action = new actions.LoadProjectTypes();
 
@@ -46,6 +55,7 @@ describe('projectTypeReducer', () => {
   });
 
   it('on CreateProjectTypeSuccess, activitiesFound are saved in the store', () => {
+    initialState.data = [];
     const action = new actions.CreateProjectTypeSuccess(projectType);
 
     const state = projectTypeReducer(initialState, action);

src/app/modules/customer-management/components/projects-type/store/project-type.reducers.ts

@@ -18,6 +18,12 @@ export const initialState: ProjectTypeState = {
 export const projectTypeReducer = (state: ProjectTypeState = initialState, action: ProjectTypeActions) => {
   const projectTypeList = [...state.data];
   switch (action.type) {
+    case ProjectTypeActionTypes.CLEAN_PROJECT_TYPES: {
+      return {
+        ...state,
+        data: [],
+      };
+    }
     case ProjectTypeActionTypes.LOAD_PROJECT_TYPES: {
       return {
         ...state,

src/app/modules/customer-management/components/projects/components/store/project.actions.spec.ts

@@ -2,6 +2,11 @@ import * as actions from './project.actions';
 
 describe('Actions for Projects', () => {
 
+  it('CleanCustomerProjects type is ProjectActionTypes.CLEAN_CUSTOMER_PROJECTS', () => {
+    const action = new actions.CleanCustomerProjects();
+    expect(action.type).toEqual(actions.ProjectActionTypes.CLEAN_CUSTOMER_PROJECTS);
+  });
+
   it('LoadProjectsSuccess type is ProjectActionTypes.LOAD_PROJECTS_SUCCESS', () => {
     const action = new actions.LoadProjectsSuccess([]);
     expect(action.type).toEqual(actions.ProjectActionTypes.LOAD_PROJECTS_SUCCESS);

src/app/modules/customer-management/components/projects/components/store/project.actions.ts

@@ -19,6 +19,12 @@ export enum ProjectActionTypes {
   DELETE_PROJECT = '[Projects] DELETE_PROJECT',
   DELETE_PROJECT_SUCCESS = '[Projects] DELETE_PROJECT_SUCESS',
   DELETE_PROJECT_FAIL = '[Projects] DELETE_PROJECT_FAIL',
+  CLEAN_CUSTOMER_PROJECTS = '[Projects] CLEAN_CUSTOMER_PROJECTS',
+}
+
+export class CleanCustomerProjects implements Action {
+  public readonly type = ProjectActionTypes.CLEAN_CUSTOMER_PROJECTS;
+  constructor() {}
 }
 
 export class LoadProjects implements Action {
@@ -117,6 +123,7 @@ export class DeleteProjectFail implements Action {
 }
 
 export type ProjectActions =
+  | CleanCustomerProjects
   | LoadProjects
   | LoadProjectsSuccess
   | LoadProjectsFail

src/app/modules/customer-management/components/projects/components/store/project.reducer.spec.ts

@@ -9,6 +9,15 @@ describe('projectReducer', () => {
   };
   const project: Project = { id: '1', name: 'aaa', description: 'bbb', project_type_id: '123' };
 
+  it('on CLEAN_CUSTOMER_PROJECTS, customerProjects is empty', () => {
+    initialState.customerProjects = [project];
+    const action = new actions.CleanCustomerProjects();
+
+    const state = projectReducer(initialState, action);
+
+    expect(state.customerProjects).toEqual([]);
+  });
+
   it('on LoadProjects, isLoading is true', () => {
     const action = new actions.LoadCustomerProjects('1');
     const state = projectReducer(initialState, action);
@@ -36,18 +45,20 @@ describe('projectReducer', () => {
   });
 
   it('on CreateProjectSuccess, project is saved in the store', () => {
+    initialState.customerProjects = [];
     const action = new actions.CreateProjectSuccess(project);
+
     const state = projectReducer(initialState, action);
 
     expect(state.customerProjects).toEqual([project]);
     expect(state.isLoading).toEqual(false);
   });
 
-  it('on CreateProjectFail, customerProjects equal []', () => {
+  it('on CreateProjectFail, isLoading is false', () => {
     const action = new actions.CreateProjectFail('error');
+
     const state = projectReducer(initialState, action);
 
-    expect(state.customerProjects).toEqual([]);
     expect(state.isLoading).toEqual(false);
   });
 

src/app/modules/customer-management/components/projects/components/store/project.reducer.ts

@@ -87,8 +87,6 @@ export const projectReducer = (state: ProjectState = initialState, action: Proje
       return {
         ...state,
         isLoading: false,
-        message: 'Something went wrong creating projects!',
-        projectToEdit: undefined,
       };
     }
 
@@ -163,6 +161,12 @@ export const projectReducer = (state: ProjectState = initialState, action: Proje
         projectToEdit: undefined,
       };
     }
+    case ProjectActionTypes.CLEAN_CUSTOMER_PROJECTS: {
+      return {
+        ...state,
+        customerProjects: [],
+      };
+    }
 
     default:
       return state;