Merge branch '215-annuaire-bug' into 'dev'

Resolve "[Annuaire] - Bug retour de la page profil"

See merge request !446

src/app/annuaire/search-bar/search-bar.component.html

 <div class="block">
   <div class="content">
     <form
+      *ngIf="searchForm"
       class="inputSearch"
       [formGroup]="searchForm"
       fxLayout="row"

src/app/annuaire/search-bar/search-bar.component.ts

 import { Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges } from '@angular/core';
 import { FormBuilder, FormGroup } from '@angular/forms';
 import { ActivatedRoute, Router } from '@angular/router';
-import { forkJoin } from 'rxjs';
+import { forkJoin, lastValueFrom } from 'rxjs';
 import { ButtonType } from '../../shared/components/button/buttonType.enum';
 import { SearchService } from '../../structure-list/services/search.service';
 import { TypeModal } from '../enums/TypeModal.enum';
@@ -12,8 +12,8 @@ import { TypeModal } from '../enums/TypeModal.enum';
   styleUrls: ['./search-bar.component.scss'],
 })
 export class SearchBarComponent implements OnInit, OnChanges {
-  @Input() shouldResetFilters: number = 0;
-  @Input() shouldShowMore: number = 0;
+  @Input() shouldResetFilters = 0;
+  @Input() shouldShowMore = 0;
   @Output() searchEvent = new EventEmitter();
 
   public locate = false;
@@ -25,6 +25,7 @@ export class SearchBarComponent implements OnInit, OnChanges {
   public numberJobChecked = 0;
   public jobTypes: string[] = [];
   public employerTypes: string[] = [];
+  public TypeModal = TypeModal;
 
   public jobFilterChecked: string[] = [];
   public employerFilterChecked: string[] = [];
@@ -36,10 +37,11 @@ export class SearchBarComponent implements OnInit, OnChanges {
     private router: Router,
     public searchService: SearchService
   ) {}
-  ngOnInit(): void {
+
+  async ngOnInit(): Promise<void> {
     // Will store the different categories
-    this.getData();
-    let queryString = this.activatedRoute.snapshot.queryParamMap.get('search');
+    await this.getData();
+    const queryString = this.activatedRoute.snapshot.queryParamMap.get('search');
     // Use existing query if back to the page or init the query
     if (!this.searchService.annuaireSearchQuery) {
       this.searchService.annuaireSearchQuery = { queryParam: '', page: 1, jobFilters: [], employerFilters: [] };
@@ -47,11 +49,18 @@ export class SearchBarComponent implements OnInit, OnChanges {
     if (queryString) {
       this.searchService.annuaireSearchQuery.queryParam = queryString;
     }
+    this.splitFilters(this.searchService.checkedFilterList);
     this.searchForm = this.fb.group({
       searchTerm: this.searchService.annuaireSearchQuery.queryParam,
     });
-    this.searchEvent.emit(this.searchService.annuaireSearchQuery);
+    const term = this.searchForm.get('searchTerm').value || '';
+    this.searchEvent.emit({
+      queryParam: term,
+      jobFilters: this.jobFilterChecked,
+      employerFilters: this.employerFilterChecked,
+    });
   }
+
   ngOnChanges(changes: SimpleChanges): void {
     if (changes.shouldResetFilters && changes.shouldResetFilters.currentValue !== 0) this.resetFilters();
     if (changes.shouldShowMore && !changes.shouldShowMore.firstChange) {
@@ -64,34 +73,26 @@ export class SearchBarComponent implements OnInit, OnChanges {
       });
     }
   }
-  // Get the categories for each modal type
-  private getData(): void {
-    forkJoin({
-      job: this.searchService.getJobs(),
-      employer: this.searchService.getEmployers(),
-    }).subscribe((data) => {
-      this.jobTypes = data.job;
-      this.employerTypes = data.employer;
-      this.countCheckedFilters();
-    });
-  }
 
-  // Accessor to template angular.
-  public get TypeModal(): typeof TypeModal {
-    return TypeModal;
+  /** Get the categories for each modal type */
+  private async getData(): Promise<void> {
+    const { job, employer } = await lastValueFrom(
+      forkJoin({
+        job: this.searchService.getJobs(),
+        employer: this.searchService.getEmployers(),
+      })
+    );
+    this.jobTypes = job;
+    this.employerTypes = employer;
+    this.countCheckedFilters();
   }
 
-  // Clear input search
   public clearInput(): void {
     this.searchForm.reset();
     this.applyFilter('');
   }
 
-  public splitFilters(checkedFilterList: string[]): void {
-    this.employerFilterChecked = checkedFilterList.filter((filter) => this.employerTypes.includes(filter));
-    this.jobFilterChecked = checkedFilterList.filter((filter) => this.jobTypes.includes(filter));
-  }
-  // Sends an array containing all filters
+  /** Sends an array containing all filters */
   public applyFilter(term: string): void {
     this.shouldResetFilters = 0;
     // Add search input filter
@@ -116,6 +117,11 @@ export class SearchBarComponent implements OnInit, OnChanges {
     });
   }
 
+  private splitFilters(checkedFilterList: string[]): void {
+    this.employerFilterChecked = checkedFilterList.filter((filter) => this.employerTypes.includes(filter));
+    this.jobFilterChecked = checkedFilterList.filter((filter) => this.jobTypes.includes(filter));
+  }
+
   public fetchResults(checkedFilters: string[]): void {
     this.searchService.checkedFilterList = checkedFilters;
     const inputTerm = this.searchForm.get('searchTerm').value;
@@ -123,16 +129,6 @@ export class SearchBarComponent implements OnInit, OnChanges {
     this.applyFilter(inputTerm);
   }
 
-  // Check if some modules is checked on filter and store number of modules checked
-  public countCheckedFilters(): void {
-    this.numberJobChecked = this.searchService.checkedFilterList.filter((filter) =>
-      this.jobTypes.includes(filter)
-    ).length;
-    this.numberEmployersChecked = this.searchService.checkedFilterList.filter((filter) =>
-      this.employerTypes.includes(filter)
-    ).length;
-  }
-
   public getModalCategory(): string[] | Error {
     switch (this.modalTypeOpened) {
       case TypeModal.jobs:
@@ -144,7 +140,7 @@ export class SearchBarComponent implements OnInit, OnChanges {
     }
   }
 
-  // Open the modal and display the list according to the right filter button
+  /** Open the modal and display the list according to the right filter button */
   public openModal(modalType: TypeModal): void {
     // if modal already opened, reset type
     if (this.modalTypeOpened === modalType) {
@@ -159,6 +155,16 @@ export class SearchBarComponent implements OnInit, OnChanges {
     this.countCheckedFilters();
   }
 
+  /** Check if some modules is checked on filter and store number of modules checked */
+  private countCheckedFilters(): void {
+    this.numberJobChecked = this.searchService.checkedFilterList.filter((filter) =>
+      this.jobTypes.includes(filter)
+    ).length;
+    this.numberEmployersChecked = this.searchService.checkedFilterList.filter((filter) =>
+      this.employerTypes.includes(filter)
+    ).length;
+  }
+
   public resetFilters(): void {
     this.searchService.checkedFilterList = [];
     this.numberEmployersChecked = 0;
@@ -169,6 +175,7 @@ export class SearchBarComponent implements OnInit, OnChanges {
     this.router.navigate(['/annuaire']);
     this.searchForm.reset();
   }
+
   public removeFilter(filter: string): void {
     const index = this.searchService.checkedFilterList.findIndex((checkedFilter: string) => checkedFilter === filter);
     this.searchService.checkedFilterList.splice(index, 1);