diff --git a/src/app/modules/customer-management/components/customer-info/components/create-customer/create-customer.ts b/src/app/modules/customer-management/components/customer-info/components/create-customer/create-customer.ts index 66df0d864..efe4688f4 100644 --- a/src/app/modules/customer-management/components/customer-info/components/create-customer/create-customer.ts +++ b/src/app/modules/customer-management/components/customer-info/components/create-customer/create-customer.ts @@ -3,7 +3,7 @@ import { FormGroup, FormBuilder, Validators } from '@angular/forms'; import { Store, select } from '@ngrx/store'; import { Subscription } from 'rxjs'; -import { getCustomerById } from './../../../../store/customer-management.selectors'; +import { getCustomerUnderEdition } from './../../../../store/customer-management.selectors'; import { Customer } from 'src/app/modules/shared/models'; import { CustomerState, @@ -24,7 +24,6 @@ export class CreateCustomerComponent implements OnInit, OnDestroy { @Input() areTabsActive: boolean; @Output() changeValueAreTabsActives = new EventEmitter(); @Output() closeCustomerComponent = new EventEmitter(); - @Output() sendActivityName = new EventEmitter(); customerToEdit: Customer; editSubscription: Subscription; @@ -38,7 +37,7 @@ export class CreateCustomerComponent implements OnInit, OnDestroy { ngOnInit() { this.areTabsActive = true; this.changeValueAreTabsActives.emit(this.areTabsActive); - const customers$ = this.store.pipe(select(getCustomerById)); + const customers$ = this.store.pipe(select(getCustomerUnderEdition)); this.editSubscription = customers$.subscribe((customer) => { this.customerToEdit = customer; this.setDataToUpdate(this.customerToEdit); @@ -60,7 +59,6 @@ export class CreateCustomerComponent implements OnInit, OnDestroy { } else { this.store.dispatch(new CreateCustomer(customerData)); } - this.sendActivityName.emit(customerData.name); this.areTabsActive = true; this.changeValueAreTabsActives.emit(this.areTabsActive); } @@ -70,11 +68,12 @@ export class CreateCustomerComponent implements OnInit, OnDestroy { this.store.dispatch(new LoadProjectTypes(customerData.id)); this.store.dispatch(new LoadCustomerProjects(customerData.id)); this.changeValueAreTabsActives.emit(true); - this.sendActivityName.emit(customerData.name); this.customerForm.setValue({ name: customerData.name, description: customerData.description, }); + } else { + this.customerForm.reset(); } } diff --git a/src/app/modules/customer-management/components/customer-info/components/customer-list/customer-list.component.spec.ts b/src/app/modules/customer-management/components/customer-info/components/customer-list/customer-list.component.spec.ts index 038a50c8b..67ace5006 100644 --- a/src/app/modules/customer-management/components/customer-info/components/customer-list/customer-list.component.spec.ts +++ b/src/app/modules/customer-management/components/customer-info/components/customer-list/customer-list.component.spec.ts @@ -81,7 +81,7 @@ describe('CustomerTableListComponent', () => { params.map((param) => it(`on success ${param.actionName} customer, the load all customer action should be triggered`, () => { - const actionSubject = TestBed.get(ActionsSubject) as ActionsSubject; + const actionSubject = TestBed.inject(ActionsSubject) as ActionsSubject; const action = { type: param.actionType, }; @@ -95,7 +95,7 @@ describe('CustomerTableListComponent', () => { params.map((param) => it(`on success ${param.actionName} customer, the customer form should be disabled`, () => { - const actionSubject = TestBed.get(ActionsSubject) as ActionsSubject; + const actionSubject = TestBed.inject(ActionsSubject) as ActionsSubject; const action = { type: param.actionType, }; @@ -106,7 +106,7 @@ describe('CustomerTableListComponent', () => { ); it('on success load customers, the customer list should be populated', () => { - const actionSubject = TestBed.get(ActionsSubject) as ActionsSubject; + const actionSubject = TestBed.inject(ActionsSubject) as ActionsSubject; const action = { type: CustomerManagementActionTypes.LOAD_CUSTOMERS_SUCCESS, payload: state.data, diff --git a/src/app/modules/customer-management/components/customer-info/components/customer-list/customer-list.component.ts b/src/app/modules/customer-management/components/customer-info/components/customer-list/customer-list.component.ts index b60f2c699..df871340b 100644 --- a/src/app/modules/customer-management/components/customer-info/components/customer-list/customer-list.component.ts +++ b/src/app/modules/customer-management/components/customer-info/components/customer-list/customer-list.component.ts @@ -31,8 +31,7 @@ export class CustomerListComponent implements OnInit, OnDestroy { loadCustomersSubscription: Subscription; changeCustomerSubscription: Subscription; - constructor(private store: Store, private actionsSubject$: ActionsSubject) { - } + constructor(private store: Store, private actionsSubject$: ActionsSubject) { } ngOnInit(): void { this.dtOptions = { diff --git a/src/app/modules/customer-management/components/management-customer-projects/management-customer-projects.component.html b/src/app/modules/customer-management/components/management-customer-projects/management-customer-projects.component.html index 10fe6c0c9..09bb42654 100644 --- a/src/app/modules/customer-management/components/management-customer-projects/management-customer-projects.component.html +++ b/src/app/modules/customer-management/components/management-customer-projects/management-customer-projects.component.html @@ -56,7 +56,6 @@ [areTabsActive]="areTabsActive" (changeValueAreTabsActives)="activeTabs($event)" (closeCustomerComponent)="closeCustomer($event)" - (sendActivityName)="sendActivityName($event)" >
(); areTabsActive: boolean; activeTab: string; customerName: string; - constructor() {} + + constructor(private store: Store) { } + + ngOnInit(): void { + const customers$ = this.store.pipe(select(getCustomerUnderEdition)); + customers$.subscribe((customer) => { + if (customer) { + this.customerName = customer.name; + } else { + this.customerName = undefined; + } + }); + } activeTabs($areTabsActive: boolean) { setTimeout(() => { @@ -26,9 +41,5 @@ export class ManagementCustomerProjectsComponent { showTab(activeTab: string) { this.activeTab = activeTab; } - sendActivityName(event) { - setTimeout(() => { - this.customerName = event; - }, 1); - } + } diff --git a/src/app/modules/customer-management/pages/customer.component.spec.ts b/src/app/modules/customer-management/pages/customer.component.spec.ts index 6b42b904e..7cddc30c2 100644 --- a/src/app/modules/customer-management/pages/customer.component.spec.ts +++ b/src/app/modules/customer-management/pages/customer.component.spec.ts @@ -1,3 +1,6 @@ +import { SetCustomerToEdit } from 'src/app/modules/customer-management/store'; +import { provideMockStore, MockStore } from '@ngrx/store/testing'; +import { Customer } from 'src/app/modules/shared/models'; import { async, ComponentFixture, TestBed } from '@angular/core/testing'; import { CustomerComponent } from './customer.component'; @@ -5,10 +8,12 @@ import { CustomerComponent } from './customer.component'; describe('CustomerComponent', () => { let component: CustomerComponent; let fixture: ComponentFixture; + let store: MockStore; beforeEach(async(() => { TestBed.configureTestingModule({ declarations: [CustomerComponent], + providers: [provideMockStore({ initialState: {} })], }).compileComponents(); })); @@ -16,12 +21,21 @@ describe('CustomerComponent', () => { fixture = TestBed.createComponent(CustomerComponent); component = fixture.componentInstance; fixture.detectChanges(); + store = TestBed.inject(MockStore); }); it('should be created', () => { expect(component).toBeTruthy(); }); + it('dispatches an action on activateCustomerForm', () => { + spyOn(store, 'dispatch'); + + component.activateCustomerForm(); + + expect(store.dispatch).toHaveBeenCalledWith(new SetCustomerToEdit(null)); + }); + it('should change te value of var when method is called', () => { component.showCustomerForm = false; component.activateCustomerForm(); diff --git a/src/app/modules/customer-management/pages/customer.component.ts b/src/app/modules/customer-management/pages/customer.component.ts index d07e63597..10958f525 100644 --- a/src/app/modules/customer-management/pages/customer.component.ts +++ b/src/app/modules/customer-management/pages/customer.component.ts @@ -1,3 +1,6 @@ +import { Store } from '@ngrx/store'; +import { Customer } from 'src/app/modules/shared/models'; +import { SetCustomerToEdit } from 'src/app/modules/customer-management/store'; import { Component } from '@angular/core'; @Component({ @@ -9,7 +12,10 @@ export class CustomerComponent { showCustomerForm = false; activityName: string; + constructor(private store: Store) { } + activateCustomerForm() { + this.store.dispatch(new SetCustomerToEdit(null)); this.showCustomerForm = true; } closeCustomerForm(event) { diff --git a/src/app/modules/customer-management/store/customer-management.selectors.ts b/src/app/modules/customer-management/store/customer-management.selectors.ts index 63bde3fb5..85784bcea 100644 --- a/src/app/modules/customer-management/store/customer-management.selectors.ts +++ b/src/app/modules/customer-management/store/customer-management.selectors.ts @@ -27,7 +27,7 @@ export const getCustomerId = createSelector(getCustomerState, (state: CustomerSt } }); -export const getCustomerById = createSelector(allCustomers, customerIdtoEdit, (customers, customerIdToEdit) => { +export const getCustomerUnderEdition = createSelector(allCustomers, customerIdtoEdit, (customers, customerIdToEdit) => { if (customers) { return customers.find((customer) => { return customer.id === customerIdToEdit; 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 356740487..88f494577 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 @@ -43,7 +43,7 @@ export class DetailsFieldsComponent implements OnChanges, OnInit { showlist: boolean; errorDate: boolean; - constructor(private formBuilder: FormBuilder, private store: Store, private renderer: Renderer2) { + constructor(private formBuilder: FormBuilder, private store: Store) { this.entryForm = this.formBuilder.group({ project_id: '', activity_id: '',