Add Unit Tests for SearchMainComponent

2025-12-31 09:37:15 +01:00 · 2020-09-30 11:43:12 +02:00
parent 581c542848
commit deb70faa8a
2 changed files with 331 additions and 84 deletions
--- a/apps/page/customer/src/lib/customer-search/search-main/search-main.component.spec.ts
+++ b/apps/page/customer/src/lib/customer-search/search-main/search-main.component.spec.ts
@@ -1,85 +1,165 @@
+import { HttpClientTestingModule } from '@angular/common/http/testing';
+import { forwardRef } from '@angular/core';
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { FormControl, ReactiveFormsModule } from '@angular/forms';
 import { ActivatedRoute } from '@angular/router';
 import { RouterTestingModule } from '@angular/router/testing';
-import { AutocompleteDTO } from '@swagger/crm';
+import { PagedResult } from '@domain/defs';
+import { CustomerInfoDTO } from '@swagger/crm';
 import { UiIconModule } from '@ui/icon';
-import { UiSearchboxModule } from '@ui/searchbox';
-import { BehaviorSubject, Observable, of, Subject } from 'rxjs';
-import { skip, take } from 'rxjs/operators';
+import {
+  UiSearchboxAutocompleteComponent,
+  UiSearchboxModule,
+} from '@ui/searchbox';
+import { BehaviorSubject, of } from 'rxjs';
+import { take } from 'rxjs/operators';
+import { CustomerSearchComponent } from '../customer-search.component';
 import { CustomerSearch } from '../customer-search.service';
 import { CustomerSearchMainComponent } from './search-main.component';

 fdescribe('CustomerSearchMainComponent', () => {
  let fixture: ComponentFixture<CustomerSearchMainComponent>;
  let component: CustomerSearchMainComponent;
+  let autocompleteComponent: UiSearchboxAutocompleteComponent;

  let searchService: jasmine.SpyObj<CustomerSearch>;

+  const result = [{ id: 'test 1' }, { id: 'test 2' }];
+  const pagedResult: PagedResult<CustomerInfoDTO> = {
+    hits: 2,
+    result: [{ userName: '1' }, { userName: '2' }],
+  };
  const mockActivatedRoute = ({
    snapshot: { queryParams: { query: 'test' } },
  } as unknown) as ActivatedRoute;

  beforeEach(() => {
    TestBed.configureTestingModule({
-      declarations: [CustomerSearchMainComponent],
+      declarations: [CustomerSearchMainComponent, CustomerSearchComponent],
      imports: [
        RouterTestingModule,
        ReactiveFormsModule,
        UiSearchboxModule,
        UiIconModule,
+        HttpClientTestingModule,
      ],
      providers: [
-        { provide: ActivatedRoute, useValue: mockActivatedRoute },
+        CustomerSearchComponent,
        {
          provide: CustomerSearch,
-          useClass: CustomerSearchMock,
+          useExisting: forwardRef(() => CustomerSearchComponent),
        },
+        { provide: ActivatedRoute, useValue: mockActivatedRoute },
      ],
    }).compileComponents();

    fixture = TestBed.createComponent(CustomerSearchMainComponent);
    component = fixture.componentInstance;

+    autocompleteComponent = TestBed.createComponent(
+      UiSearchboxAutocompleteComponent
+    ).componentInstance;
+    component.autocomplete = autocompleteComponent;
+
    component.search.queryControl = new FormControl('');
    searchService = TestBed.inject(CustomerSearch) as jasmine.SpyObj<
      CustomerSearch
    >;
+
+    searchService.autocompleteResult$ = of(result);
+    searchService.searchState$ = new BehaviorSubject('init');
+    searchService.searchResult$ = new BehaviorSubject(pagedResult);
  });

  it('should be created', () => {
+    fixture.detectChanges();
    expect(component instanceof CustomerSearchMainComponent).toBeTruthy();
  });

  describe('initAutocomplete', () => {
-    let result: AutocompleteDTO[];
-
    beforeEach(() => {
-      result = [{ id: 'test 1' }, { id: 'test 2' }];
+      fixture.detectChanges();
+      spyOn(component, 'initAutocomplete').and.callThrough();
+      spyOn(component.autocomplete, 'open').and.callFake(() => {});
+      spyOn(component.autocomplete, 'close').and.callFake(() => {});
    });

    it('should be called OnInit', async () => {
-      spyOn(component, 'initAutocomplete').and.callFake(() => {});
-      spyOnProperty(searchService, 'autocompleteResult$').and.returnValue(
-        of(result)
-      );
-      spyOn(component.autocomplete, 'open').and.callFake(() => {});
-
      component.ngOnInit();

      await searchService.autocompleteResult$.pipe(take(1)).toPromise();

      expect(component.initAutocomplete).toHaveBeenCalledTimes(1);
-      // expect(component.autocomplete.open).toHaveBeenCalledTimes(1);
+    });
+
+    it('should open the autocomplete results', async () => {
+      component.ngOnInit();
+
+      await searchService.autocompleteResult$.pipe(take(1)).toPromise();
+
+      expect(component.autocomplete.open).toHaveBeenCalledTimes(1);
+    });
+
+    it('should close the autocomplete results', async () => {
+      searchService.autocompleteResult$ = of([]);
+      component.ngOnInit();
+
+      await searchService.autocompleteResult$.pipe(take(1)).toPromise();
+
+      expect(component.autocomplete.close).toHaveBeenCalledTimes(1);
+    });
+  });
+
+  describe('parseQueryParams', () => {
+    it('should be called onInit', () => {
+      spyOn(component, 'initAutocomplete').and.callFake(() => {});
+      spyOn(component, 'subscribeToSearchResult').and.callFake(() => {});
+      spyOn(component.search, 'parseQueryParams').and.callFake(() => {});
+
+      component.ngOnInit();
+
+      expect(component.search.parseQueryParams).toHaveBeenCalledWith(
+        mockActivatedRoute
+      );
+    });
+  });
+
+  describe('subscribeToSearchResult', () => {
+    beforeEach(() => {
+      searchService.searchState$ = new BehaviorSubject('result');
+    });
+
+    it('should be called OnInit', () => {
+      spyOn(component, 'initAutocomplete').and.callFake(() => {});
+      spyOn(component.search, 'parseQueryParams').and.callFake(() => {});
+      spyOn(component, 'subscribeToSearchResult').and.callFake(() => {});
+
+      component.ngOnInit();
+      expect(component.subscribeToSearchResult).toHaveBeenCalledTimes(1);
+    });
+
+    it('should navigate to results if more than 1 result exists', async () => {
+      spyOn(component.search, 'navigateToResults').and.callFake(() => {});
+
+      component.subscribeToSearchResult();
+      await component.search.searchResult$.pipe(take(1)).toPromise();
+
+      expect(component.search.navigateToResults).toHaveBeenCalled();
+    });
+    it('should navigate to details if 1 result exists', async () => {
+      const singleResult: PagedResult<CustomerInfoDTO> = {
+        hits: 1,
+        result: [{ userName: '1', id: 1 }],
+      };
+      searchService.searchResult$ = new BehaviorSubject(singleResult);
+      spyOn(component.search, 'navigateToDetails').and.callFake(() => {});
+
+      component.subscribeToSearchResult();
+      await component.search.searchResult$.pipe(take(1)).toPromise();
+
+      expect(component.search.navigateToDetails).toHaveBeenCalledWith(
+        singleResult.result[0].id
+      );
    });
  });
 });
-
-export class CustomerSearchMock {
-  get autocompleteResult$(): Observable<AutocompleteDTO[]> {
-    return of([{ id: '1' }]);
-  }
-  parseQueryParams() {}
-  setQueryParams() {}
-  getQueryParams() {}
-}
--- a/apps/sales/src/app/core/store/selectors/shared.selectors.ts
+++ b/apps/sales/src/app/core/store/selectors/shared.selectors.ts
@@ -1,6 +1,9 @@
-import { Selector, StateContext, createSelector } from '@ngxs/store';
+import { Selector, createSelector } from '@ngxs/store';
 import { CustomerState, CustomerStateModel } from '../state/customer.state';
-import { BreadcrumbsState, BreadcrumbsStateModel } from '../state/breadcrumbs.state';
+import {
+  BreadcrumbsState,
+  BreadcrumbsStateModel,
+} from '../state/breadcrumbs.state';
 import { ProcessStateModel, ProcessState } from '../state/process.state';
 import { EditCustomerData } from '../../models/edit-customer.model';
 import { CartState, CartStateModel } from '../state/cart.state';
@@ -16,21 +19,34 @@ import { CartEntryStateModel, CartEntryState } from '../state/cart-entry.state';
 import { BranchesStateModel, BranchState } from '../state/branches.state';
 import { Cart } from '../../models/cart.model';
 import { DisplayOrderDTO, DisplayOrderItemDTO } from '@swagger/oms';
-import { DeliveryType, DeliveryOption } from '../../models/delivery-option.model';
+import {
+  DeliveryType,
+  DeliveryOption,
+} from '../../models/delivery-option.model';
 import { OrderItem } from '../../models/order-item';
 import { ProcessCartConfirmed } from '../../models/process-cart-confirmed.model';
 import { User } from '../../models/user.model';
 import { FilterItem } from '../../models/filter-item.model';
-import { CollectingShelfState, CollectingShelfStateModel } from '../state/collecting-shelf.state';
-import { mapToIterable, undefinedToEmptyStringOrValue } from '../../utils/app.utils';
+import {
+  CollectingShelfState,
+  CollectingShelfStateModel,
+} from '../state/collecting-shelf.state';
+import {
+  mapToIterable,
+  undefinedToEmptyStringOrValue,
+} from '../../utils/app.utils';
 import { CollectingShelfOrder } from '../../models/collecting-shelf-order.model';
 import { ItemDTO } from '@swagger/cat';
 import { Process } from '../../models/process.model';
 import { isNullOrUndefined } from 'util';
 import { FilterType } from '../../models/filter-type.enum';
-import { BranchProcessState, BranchProcessStateModel } from '../state/branch-process.state';
+import {
+  BranchProcessState,
+  BranchProcessStateModel,
+} from '../state/branch-process.state';
 import { ModuleSwitcher } from '../../models/app-switcher.enum';
 import { BranchProcess } from '../../models/branch-process.model';
+import 'apps/sales/src/app/core/utils/app.prototypes';

 export class SharedSelectors {
  @Selector([AppState, ProcessState, BranchProcessState])
@@ -56,10 +72,18 @@ export class SharedSelectors {
    const currentProcessId = state.currentProcesssId;
    const currentProcess = process.processes[currentProcessId];

-    if (currentProcess && currentProcessId && breadcrumbs.activeCrumbs && breadcrumbs.activeCrumbs[currentProcessId]) {
+    if (
+      currentProcess &&
+      currentProcessId &&
+      breadcrumbs.activeCrumbs &&
+      breadcrumbs.activeCrumbs[currentProcessId]
+    ) {
      const activeCrumbs = breadcrumbs.activeCrumbs[currentProcessId];
-      const currentBreadcrumbs = breadcrumbs.processesBreadcrumbs[activeCrumbs].find((t) => t.processId === currentProcessId);
-      const detailsCustomer = customer.customers[currentProcess.detailsCustomer];
+      const currentBreadcrumbs = breadcrumbs.processesBreadcrumbs[
+        activeCrumbs
+      ].find((t) => t.processId === currentProcessId);
+      const detailsCustomer =
+        customer.customers[currentProcess.detailsCustomer];
      return {
        processId: currentProcessId,
        customer: detailsCustomer,
@@ -71,7 +95,11 @@ export class SharedSelectors {
  }

  @Selector([AppState, ProcessState, CustomerState])
-  static getActiveCustomer(state: AppStateModel, process: ProcessStateModel, customer: CustomerStateModel): User {
+  static getActiveCustomer(
+    state: AppStateModel,
+    process: ProcessStateModel,
+    customer: CustomerStateModel
+  ): User {
    const currentProcessId = state.currentProcesssId;
    const currentProcess = process.processes[currentProcessId];

@@ -83,7 +111,11 @@ export class SharedSelectors {
  }

  @Selector([AppState, ProcessState, CustomerState])
-  static getFinishedOrderCustomer(state: AppStateModel, process: ProcessStateModel, customer: CustomerStateModel): User {
+  static getFinishedOrderCustomer(
+    state: AppStateModel,
+    process: ProcessStateModel,
+    customer: CustomerStateModel
+  ): User {
    const currentProcessId = state.currentProcesssId;
    const currentProcess = process.processes[currentProcessId];

@@ -95,7 +127,11 @@ export class SharedSelectors {
  }

  @Selector([ProcessState, CartState, CartEntryState])
-  static getCartTabData(process: ProcessStateModel, cartState: CartStateModel, cartEntriesState: CartEntryStateModel) {
+  static getCartTabData(
+    process: ProcessStateModel,
+    cartState: CartStateModel,
+    cartEntriesState: CartEntryStateModel
+  ) {
    return (processId: number) => {
      if (process && processId) {
        const currentProcess = process.processes[processId];
@@ -121,7 +157,12 @@ export class SharedSelectors {
  }

  @Selector([AppState, ProcessState, CartState, CartEntryState])
-  static cartHasItemsFor(state: AppStateModel, process: ProcessStateModel, cart: CartStateModel, cartEntry: CartEntryStateModel) {
+  static cartHasItemsFor(
+    state: AppStateModel,
+    process: ProcessStateModel,
+    cart: CartStateModel,
+    cartEntry: CartEntryStateModel
+  ) {
    return (option: DeliveryOption) => {
      let found = false;
      const currentProcessId = state.currentProcesssId;
@@ -147,7 +188,12 @@ export class SharedSelectors {
  }

  @Selector([AppState, ProcessState, CartState, CartEntryState])
-  static cartHasDownloadForProcess(state: AppStateModel, process: ProcessStateModel, cart: CartStateModel, cartEntry: CartEntryStateModel) {
+  static cartHasDownloadForProcess(
+    state: AppStateModel,
+    process: ProcessStateModel,
+    cart: CartStateModel,
+    cartEntry: CartEntryStateModel
+  ) {
    let found = false;
    const currentProcessId = state.currentProcesssId;
    if (currentProcessId && process && process.processes) {
@@ -171,7 +217,11 @@ export class SharedSelectors {
  }

  @Selector([AppState, ProcessState, CartState])
-  static cartEntriesOfCurrentProcessCart(state: AppStateModel, process: ProcessStateModel, cart: CartStateModel) {
+  static cartEntriesOfCurrentProcessCart(
+    state: AppStateModel,
+    process: ProcessStateModel,
+    cart: CartStateModel
+  ) {
    const currentProcessId = state.currentProcesssId;
    if (currentProcessId) {
      const currentProcess = process.processes[currentProcessId];
@@ -201,12 +251,19 @@ export class SharedSelectors {
            if (entryId) {
              const entry = cartEntry.cartEntries[entryId];
              if (entry && entry.bookId) {
-                const currentProcessArticles = product.products[currentProcessId];
+                const currentProcessArticles =
+                  product.products[currentProcessId];
                if (currentProcessArticles) {
-                  if (currentProcessArticles && currentProcessArticles[entry.bookId]) {
+                  if (
+                    currentProcessArticles &&
+                    currentProcessArticles[entry.bookId]
+                  ) {
                    const article = currentProcessArticles[entry.bookId];
                    if (article && article.product && article.product.format) {
-                      if (article.product.format === 'EB' || article.product.format === 'DL') {
+                      if (
+                        article.product.format === 'EB' ||
+                        article.product.format === 'DL'
+                      ) {
                        response.push(article.id);
                      }
                    }
@@ -222,7 +279,12 @@ export class SharedSelectors {
  }

  @Selector([AppState, ProcessState, CartState, CartEntryState, ProductState])
-  static cartHasItems(state: AppStateModel, process: ProcessStateModel, cart: CartStateModel, cartEntry: CartEntryStateModel): boolean {
+  static cartHasItems(
+    state: AppStateModel,
+    process: ProcessStateModel,
+    cart: CartStateModel,
+    cartEntry: CartEntryStateModel
+  ): boolean {
    const currentProcessId = state.currentProcesssId;
    let response = false;
    if (currentProcessId) {
@@ -244,7 +306,15 @@ export class SharedSelectors {
    return response;
  }

-  @Selector([AppState, ProcessState, CartState, CustomerState, ProductState, CartEntryState, BranchState])
+  @Selector([
+    AppState,
+    ProcessState,
+    CartState,
+    CustomerState,
+    ProductState,
+    CartEntryState,
+    BranchState,
+  ])
  static getCart(
    state: AppStateModel,
    process: ProcessStateModel,
@@ -271,7 +341,9 @@ export class SharedSelectors {
      cartEntries.forEach((cartEntryId: number) => {
        const cartEntry = cartEntriesState.cartEntries[cartEntryId];
        const book = products[cartEntry.bookId];
-        const branch = branches[cartEntry.branch] ? branches[cartEntry.branch] : null;
+        const branch = branches[cartEntry.branch]
+          ? branches[cartEntry.branch]
+          : null;
        promotionPoints += book.promoPoints * cartEntry.quantity;
        cartData.push({
          cartId: cartId,
@@ -301,7 +373,11 @@ export class SharedSelectors {
  }

  @Selector([AppState, ProcessState, CustomerState])
-  static currentCustomer(state: AppStateModel, process: ProcessStateModel, customer: CustomerStateModel): User {
+  static currentCustomer(
+    state: AppStateModel,
+    process: ProcessStateModel,
+    customer: CustomerStateModel
+  ): User {
    const currentProcess = process.processes[state.currentProcesssId];
    if (!currentProcess) {
      return;
@@ -310,7 +386,10 @@ export class SharedSelectors {
  }

  @Selector([AppState, ProcessState])
-  static getCurrentCartId(appState: AppStateModel, processState: ProcessStateModel) {
+  static getCurrentCartId(
+    appState: AppStateModel,
+    processState: ProcessStateModel
+  ) {
    const processId = appState.currentProcesssId;
    if (processId) {
      const currentProcess = processState.processes[processId];
@@ -322,17 +401,28 @@ export class SharedSelectors {
  }

  @Selector([AppState, FilterState])
-  static getSelectedFilterItems(state: AppStateModel, filterState: FilterStateModel): Filter[] {
+  static getSelectedFilterItems(
+    state: AppStateModel,
+    filterState: FilterStateModel
+  ): Filter[] {
    const currentProcessId = state.currentProcesssId;
    if (currentProcessId) {
      const filterType = filterState.filterType[currentProcessId];
      const processesSelectedFilters =
-        filterType === FilterType.Negative ? filterState.negativeProcessesSelectedFilters : filterState.processesSelectedFilters;
-      const currentProcessSelectedFilters = processesSelectedFilters.find((f) => f.processId === currentProcessId);
+        filterType === FilterType.Negative
+          ? filterState.negativeProcessesSelectedFilters
+          : filterState.processesSelectedFilters;
+      const currentProcessSelectedFilters = processesSelectedFilters.find(
+        (f) => f.processId === currentProcessId
+      );
      if (currentProcessSelectedFilters) {
        const filter: Filter[] = [];
        currentProcessSelectedFilters.selectedFilters.map((f) => {
-          if (f.items && f.items.filter((t) => t.selected === true) && f.items.filter((t) => t.selected === true).length > 0) {
+          if (
+            f.items &&
+            f.items.filter((t) => t.selected === true) &&
+            f.items.filter((t) => t.selected === true).length > 0
+          ) {
            filter.push(f);
          }
        });
@@ -345,15 +435,24 @@ export class SharedSelectors {
  }

  @Selector([AppState, FilterState])
-  static getProcessFilters(state: AppStateModel, filterState: FilterStateModel): Filter[] {
+  static getProcessFilters(
+    state: AppStateModel,
+    filterState: FilterStateModel
+  ): Filter[] {
    const currentProcessId = state.currentProcesssId;

    if (currentProcessId) {
      const filterType = filterState.filterType[currentProcessId];
      const processesSelectedFilters =
-        filterType === FilterType.Negative ? filterState.negativeProcessesSelectedFilters : filterState.processesSelectedFilters;
-      const currentProcessSelectedFilters = processesSelectedFilters.find((f) => f.processId === currentProcessId);
-      return currentProcessSelectedFilters ? currentProcessSelectedFilters.selectedFilters : null;
+        filterType === FilterType.Negative
+          ? filterState.negativeProcessesSelectedFilters
+          : filterState.processesSelectedFilters;
+      const currentProcessSelectedFilters = processesSelectedFilters.find(
+        (f) => f.processId === currentProcessId
+      );
+      return currentProcessSelectedFilters
+        ? currentProcessSelectedFilters.selectedFilters
+        : null;
    }
  }

@@ -368,7 +467,11 @@ export class SharedSelectors {
  }

  @Selector([AppState, ProcessState, CustomerState, BreadcrumbsState])
-  static getSearchedCustomers(state: AppStateModel, process: ProcessStateModel, customer: CustomerStateModel): CustomerSearchResult {
+  static getSearchedCustomers(
+    state: AppStateModel,
+    process: ProcessStateModel,
+    customer: CustomerStateModel
+  ): CustomerSearchResult {
    const processId = state.currentProcesssId;
    const currentProcess = process.processes[processId];

@@ -387,7 +490,10 @@ export class SharedSelectors {
  }

  @Selector([AppState, ProductState])
-  static getSearchedProducts(state: AppStateModel, products: ProductStateModel): ProductSearchResult {
+  static getSearchedProducts(
+    state: AppStateModel,
+    products: ProductStateModel
+  ): ProductSearchResult {
    const currentProcessId = state.currentProcesssId;

    if (currentProcessId) {
@@ -402,13 +508,23 @@ export class SharedSelectors {
  }

  @Selector([AppState, BreadcrumbsState])
-  static getBreadcrumbs(state: AppStateModel, breadcrumbs: BreadcrumbsStateModel): Breadcrumb[] {
+  static getBreadcrumbs(
+    state: AppStateModel,
+    breadcrumbs: BreadcrumbsStateModel
+  ): Breadcrumb[] {
    const activeModule = state.activeModule;
-    const currentProcessId = activeModule === ModuleSwitcher.Customer ? state.currentProcesssId : -1;
+    const currentProcessId =
+      activeModule === ModuleSwitcher.Customer ? state.currentProcesssId : -1;

-    if (currentProcessId && breadcrumbs.activeCrumbs && breadcrumbs.activeCrumbs[currentProcessId]) {
+    if (
+      currentProcessId &&
+      breadcrumbs.activeCrumbs &&
+      breadcrumbs.activeCrumbs[currentProcessId]
+    ) {
      const activeCrumbs = breadcrumbs.activeCrumbs[currentProcessId];
-      const currentBreadcrumbs = breadcrumbs.processesBreadcrumbs[activeCrumbs].find((t) => t.processId === currentProcessId);
+      const currentBreadcrumbs = breadcrumbs.processesBreadcrumbs[
+        activeCrumbs
+      ].find((t) => t.processId === currentProcessId);
      return currentBreadcrumbs ? currentBreadcrumbs.breadcrumbs : null;
    }

@@ -416,11 +532,19 @@ export class SharedSelectors {
  }

  @Selector([AppState, BreadcrumbsState])
-  static getPreviousRoute(state: AppStateModel, breadcrumbs: BreadcrumbsStateModel): { crumb: string; path: string } {
+  static getPreviousRoute(
+    state: AppStateModel,
+    breadcrumbs: BreadcrumbsStateModel
+  ): { crumb: string; path: string } {
    const activeModule = state.activeModule;
-    const currentProcessId = activeModule === ModuleSwitcher.Customer ? state.currentProcesssId : -1;
+    const currentProcessId =
+      activeModule === ModuleSwitcher.Customer ? state.currentProcesssId : -1;

-    if (currentProcessId && breadcrumbs.previusMenuPath && breadcrumbs.previusMenuPath[currentProcessId]) {
+    if (
+      currentProcessId &&
+      breadcrumbs.previusMenuPath &&
+      breadcrumbs.previusMenuPath[currentProcessId]
+    ) {
      const previousPath = breadcrumbs.previusMenuPath[currentProcessId];
      if (previousPath && previousPath[previousPath.length - 1]) {
        return previousPath[previousPath.length - 1];
@@ -431,7 +555,10 @@ export class SharedSelectors {
  }

  @Selector([AppState, ProcessState])
-  static getConfirmedCart(state: AppStateModel, process: ProcessStateModel): ProcessCartConfirmed {
+  static getConfirmedCart(
+    state: AppStateModel,
+    process: ProcessStateModel
+  ): ProcessCartConfirmed {
    const processId = state.currentProcesssId;
    const currentProcess = process.processes[processId];

@@ -454,9 +581,13 @@ export class SharedSelectors {
              if (order.orderType === DeliveryType['Branch']) {
                targetBranchName = order.targetBranch.name;
                // tslint:disable-next-line: max-line-length
-                targetBranchAddress = `${undefinedToEmptyStringOrValue(order.targetBranch.address.street)} ${undefinedToEmptyStringOrValue(
+                targetBranchAddress = `${undefinedToEmptyStringOrValue(
+                  order.targetBranch.address.street
+                )} ${undefinedToEmptyStringOrValue(
                  order.targetBranch.address.streetNumber
-                )}, ${undefinedToEmptyStringOrValue(order.targetBranch.address.zipCode)} ${undefinedToEmptyStringOrValue(
+                )}, ${undefinedToEmptyStringOrValue(
+                  order.targetBranch.address.zipCode
+                )} ${undefinedToEmptyStringOrValue(
                  order.targetBranch.address.city
                )}`;
              }
@@ -466,7 +597,8 @@ export class SharedSelectors {
              if (item.promotion) {
                promotionPoints += item.quantity * item.promotion.points;
              }
-              const isDownload = item.product.format === 'EB' || item.product.format === 'DL';
+              const isDownload =
+                item.product.format === 'EB' || item.product.format === 'DL';
              const orderItem: OrderItem = {
                id: +item.product.catalogProductNumber,
                orderId: order.id,
@@ -477,7 +609,8 @@ export class SharedSelectors {
                currency: item.price.value.currency,
                price: item.price.value.value,
                imgUrl: item.product.ean,
-                isTakeNow: item.subsetItems[0].supplierLabel === 'F' ? true : false,
+                isTakeNow:
+                  item.subsetItems[0].supplierLabel === 'F' ? true : false,
                isDownload: isDownload,
                orderDate: item.orderDate,
                targetBranchName: targetBranchName,
@@ -485,19 +618,26 @@ export class SharedSelectors {
              };

              if (order.orderType === DeliveryType['ShippingAddress']) {
-                orderItem.deliveryDate = item.subsetItems[0].estimatedShippingDate;
+                orderItem.deliveryDate =
+                  item.subsetItems[0].estimatedShippingDate;
              }

              if (order.orderType === DeliveryType['Branch']) {
-                orderItem.pickUpDate = item.subsetItems[0].estimatedShippingDate;
+                orderItem.pickUpDate =
+                  item.subsetItems[0].estimatedShippingDate;
              }

              cartData.push(orderItem);
            });
          });

-          const takeNowItems = cartData.filter((item: OrderItem) => item.isTakeNow);
-          const pickUpItems = cartData.filter((item: OrderItem) => !item.isTakeNow && item.orderType === DeliveryType['Branch']);
+          const takeNowItems = cartData.filter(
+            (item: OrderItem) => item.isTakeNow
+          );
+          const pickUpItems = cartData.filter(
+            (item: OrderItem) =>
+              !item.isTakeNow && item.orderType === DeliveryType['Branch']
+          );

          // Prepare object for components
          return {
@@ -507,8 +647,16 @@ export class SharedSelectors {
            totalQuantity: totalQuantity,
            cartId: currentProcess.cartId,
            orderIds: orderIds,
-            isTakeNowOnly: takeNowItems && cartData && takeNowItems.length === cartData.length ? true : false,
-            isPickUpOnly: pickUpItems && cartData && pickUpItems.length === cartData.length ? true : false,
+            isTakeNowOnly:
+              takeNowItems &&
+              cartData &&
+              takeNowItems.length === cartData.length
+                ? true
+                : false,
+            isPickUpOnly:
+              pickUpItems && cartData && pickUpItems.length === cartData.length
+                ? true
+                : false,
            promotionPoints: promotionPoints,
          };
        }
@@ -532,20 +680,29 @@ export class SharedSelectors {
  }

  @Selector([AppState, FilterState])
-  static getFilters(appState: AppStateModel, state: FilterStateModel): Filter[] {
+  static getFilters(
+    appState: AppStateModel,
+    state: FilterStateModel
+  ): Filter[] {
    const currenProcessId = appState.currentProcesssId;
    const filterType = state.filterType[currenProcessId];
    const processesSelectedFilters =
-      filterType === FilterType.Negative ? state.negativeProcessesSelectedFilters : state.processesSelectedFilters;
+      filterType === FilterType.Negative
+        ? state.negativeProcessesSelectedFilters
+        : state.processesSelectedFilters;
    const processFilters = processesSelectedFilters[currenProcessId];
    return state.filters.map((filter) => {
      return <Filter>{
        ...filter,
        items: filter.items.map((item) => {
          if (processFilters) {
-            const selectedFilter = processFilters.selectedFilters.find((f) => f.id === filter.id);
+            const selectedFilter = processFilters.selectedFilters.find(
+              (f) => f.id === filter.id
+            );
            if (selectedFilter) {
-              const selectedItem = selectedFilter.items.find((i) => i.id === item.id);
+              const selectedItem = selectedFilter.items.find(
+                (i) => i.id === item.id
+              );
              if (selectedItem) {
                return <FilterItem>{ ...item, selected: selectedItem.selected };
              } else {
@@ -603,7 +760,10 @@ export class SharedSelectors {
  }

  @Selector([AppState, CollectingShelfState])
-  static getIterableOrderForCurrentProcess(appState: AppStateModel, orderState: CollectingShelfStateModel): CollectingShelfOrder[] {
+  static getIterableOrderForCurrentProcess(
+    appState: AppStateModel,
+    orderState: CollectingShelfStateModel
+  ): CollectingShelfOrder[] {
    const currenProcessId = appState.currentProcesssId;
    if (!currenProcessId) {
      return [];
@@ -621,7 +781,10 @@ export class SharedSelectors {
  }

  @Selector([AppState, ProcessState])
-  static getProcessSelectedItem(appState: AppStateModel, process: ProcessStateModel): ItemDTO {
+  static getProcessSelectedItem(
+    appState: AppStateModel,
+    process: ProcessStateModel
+  ): ItemDTO {
    const currenProcessId = appState.currentProcesssId;
    if (!currenProcessId) {
      return;
@@ -630,7 +793,11 @@ export class SharedSelectors {
  }

  @Selector([AppState, ProcessState, CustomerState])
-  static getCurrentProcessDetailsCustomer(appState: AppStateModel, processes: ProcessStateModel, customers: CustomerStateModel) {
+  static getCurrentProcessDetailsCustomer(
+    appState: AppStateModel,
+    processes: ProcessStateModel,
+    customers: CustomerStateModel
+  ) {
    const currentProcessId = appState.currentProcesssId;
    if (!currentProcessId) {
      return;