fix: reset service checkbox when filterform reset (#468)

anct-cartographie-nationale · Feb 12, 2024 · 085cd49 · 085cd49
1 parent 8599239
commit 085cd49
Show file tree

Hide file tree

Showing 4 changed files with 14 additions and 1 deletion.
diff --git a/src/features/orientation/components/besoin-link/besoin-link.component.html b/src/features/orientation/components/besoin-link/besoin-link.component.html
@@ -3,7 +3,7 @@
   class="btn orientation-btn bg-light mb-3 px-lg-3 px-2 py-0 rounded-0 d-flex position-relative">
   <span
     class="position-absolute top-0 start-0 z-index-over-base ms-lg-4 mt-sm-4 ms-sm-3 mt-1 ms-1 translate-middle square d-flex text-center small bg-secondary text-primary border border-primary rounded-circle"
-    *ngIf="serviceItem.value === selectedServiceItem">
+    *ngIf="serviceItem.value === serviceFilter">
     <span class="visually-hidden">Service sélectionné</span>
     <span role="img" class="ri-check-line m-auto" aria-hidden="true"></span>
   </span>

diff --git a/src/features/orientation/components/besoin-link/besoin-link.component.ts b/src/features/orientation/components/besoin-link/besoin-link.component.ts
@@ -12,6 +12,8 @@ export class BesoinLinkComponent {
 
   @Input() public selectedServiceItem?: string;
 
+  @Input() public serviceFilter: string | null = '';
+
   @Output() public selectServiceValue: EventEmitter<string> = new EventEmitter<string>();
 
   @Output() public addLastFilter: EventEmitter<string> = new EventEmitter<string>();

diff --git a/src/features/orientation/pages/besoin/besoin.page.html b/src/features/orientation/pages/besoin/besoin.page.html
@@ -21,6 +21,7 @@ <h2 class="text-muted h6 fw-bold mb-0 text-uppercase">Apprentissage de base</h2>
         </div>
         <app-besoin-link
           [serviceItems]="apprentissageDeBaseOrientationItems"
+          [serviceFilter]="serviceFilter$ | async"
           [selectedServiceItem]="serviceControl.value"
           (selectServiceValue)="serviceControl.setValue($event)"
           (displayInformations)="selectOrientationInformation($event)"
@@ -39,6 +40,7 @@ <h2 class="text-muted h6 fw-bold mb-0 text-uppercase">Démarches</h2>
         </div>
         <app-besoin-link
           [serviceItems]="demarchesOrientationItems"
+          [serviceFilter]="serviceFilter$ | async"
           [selectedServiceItem]="serviceControl.value"
           (selectServiceValue)="serviceControl.setValue($event)"
           (displayInformations)="selectOrientationInformation($event)"
@@ -57,6 +59,7 @@ <h2 class="text-muted h6 fw-bold mb-0 text-uppercase">Culture numérique</h2>
         </div>
         <app-besoin-link
           [serviceItems]="cultureNumeriqueOrientationItems"
+          [serviceFilter]="serviceFilter$ | async"
           [selectedServiceItem]="serviceControl.value"
           (selectServiceValue)="serviceControl.setValue($event)"
           (displayInformations)="selectOrientationInformation($event)"
@@ -75,6 +78,7 @@ <h2 class="text-muted h6 fw-bold mb-0 text-uppercase">Manque de matériel</h2>
         </div>
         <app-besoin-link
           [serviceItems]="manqueDeMaterielOrientationItems"
+          [serviceFilter]="serviceFilter$ | async"
           [selectedServiceItem]="serviceControl.value"
           (selectServiceValue)="serviceControl.setValue($event)"
           (displayInformations)="selectOrientationInformation($event)"

diff --git a/src/features/orientation/pages/besoin/besoin.page.ts b/src/features/orientation/pages/besoin/besoin.page.ts
@@ -14,6 +14,8 @@ import apprentissageDeBase from './apprentissage-de-base.json';
 import cultureNumerique from './culture-numerique.json';
 import manqueDeMateriel from './manque-de-materiel.json';
 import { BESOIN_INFORMATION_MODAL_TEXTS } from './besoin-information-modal-texts';
+import { Observable, map } from 'rxjs';
+import { ActivatedRoute, ParamMap } from '@angular/router';
 
 @Component({
   changeDetection: ChangeDetectionStrategy.OnPush,
@@ -33,13 +35,18 @@ export class BesoinPage {
 
   public constructor(
     public readonly orientationLayout: OrientationLayout,
+    public readonly route: ActivatedRoute,
     @Inject(SET_TITLE_ACTION) readonly setTitle: SetTitleAction
   ) {
     setTitle(['Besoin', 'Orientation']);
   }
 
   public serviceControl: AbstractControl | null = this.orientationLayout.filterForm.get('service');
 
+  public serviceFilter$: Observable<string | null> = this.route.queryParamMap.pipe(
+    map((paramMap: ParamMap) => paramMap.get('service'))
+  );
+
   public selectedOrientationInformation: OrientationInformationContent | null = null;
 
   public selectedOrientationInformationType: Service | null = null;