feature(deltagare): Går man bakåt när man är under deltagare så hamnar man på samma flik. (TV-746)

Squashed commit of the following:

commit 564f851551957276d2b89ab38da1d15bddc5fb12
Author: Daniel Appelgren <daniel.appelgren@arbetsformedlingen.se>
Date:   Wed Oct 13 16:04:27 2021 +0200

    Fixed comments

commit 083210ef03697bc864b73d0dd69acf5c51dbd1cc
Merge: f9b46d87 bdb1d161
Author: Daniel Appelgren <daniel.appelgren@arbetsformedlingen.se>
Date:   Wed Oct 13 14:00:24 2021 +0200

    Merge branch 'develop' into feature/TV-746-ga-bakat-flikar-deltagarkort

commit f9b46d87d8ac92acb000cd1d73a7a27a7e51ca3e
Author: Daniel Appelgren <daniel.appelgren@arbetsformedlingen.se>
Date:   Wed Oct 13 14:00:18 2021 +0200

    make fetch methods into properties instead

commit 00c6cff90a8c193b22dc722decd13bc9849e66db
Author: Daniel Appelgren <daniel.appelgren@arbetsformedlingen.se>
Date:   Wed Oct 13 13:54:35 2021 +0200

    unsubscribe

commit 7161597851a867d510dc510caf8830378abfceeb
Author: Daniel Appelgren <daniel.appelgren@arbetsformedlingen.se>
Date:   Wed Oct 13 13:51:17 2021 +0200

    move genomforandeReferens$ to service

commit 7676d72593b3f930aa108c294664a6293c5d1fbd
Author: Daniel Appelgren <daniel.appelgren@arbetsformedlingen.se>
Date:   Tue Oct 12 10:53:34 2021 +0200

    Moved activeTab to service and added init-active-tab to read from service

apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-card/deltagare-card.component.html

@@ -6,9 +6,12 @@
           <msfa-back-link [route]="['/deltagare']">Tillbaka till deltagarlistan</msfa-back-link>
           <h1>{{contactInformation.fullName }}</h1>
         </header>
-        <digi-navigation-tabs [afAriaLabel]="'Deltagarinformation för ' + contactInformation.fullName">
+        <digi-navigation-tabs
+          [afAriaLabel]="'Deltagarinformation för ' + contactInformation.fullName"
+          [afInitActiveTab]="activeTab"
+        >
           <digi-navigation-tab
-            (afOnToggle)="setActiveTab(0)"
+            (afOnToggle)="setActiveTab('0')"
             af-aria-label="Deltagare & tjänst"
             af-id="deltagare-card-personal-information"
             *ngIf="deltagareTjanstVisible"
@@ -26,7 +29,7 @@
           </digi-navigation-tab>
 
           <digi-navigation-tab
-            (afOnToggle)="setActiveTab(1)"
+            (afOnToggle)="setActiveTab('1')"
             af-aria-label="Rapportering"
             af-id="deltagare-card-reports"
             *ngIf="reportingTabVisible"
@@ -40,7 +43,7 @@
           </digi-navigation-tab>
 
           <digi-navigation-tab
-            (afOnToggle)="setActiveTab(2)"
+            (afOnToggle)="setActiveTab('2')"
             af-aria-label="Erfarenheter"
             af-id="deltagare-card-experiences"
             *ngIf="experiencesVisible"
@@ -58,7 +61,7 @@
           </digi-navigation-tab>
 
           <digi-navigation-tab
-            (afOnToggle)="setActiveTab(3)"
+            (afOnToggle)="setActiveTab('3')"
             af-aria-label="Känsliga uppgifter"
             af-id="deltagare-card-sensitive-information"
             *ngIf="sensitiveDataVisible"

apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-card/deltagare-card.component.ts

@@ -19,6 +19,7 @@ import { HandledareService } from '@msfa-services/handledare.service';
 import { BehaviorSubject, combineLatest, Observable } from 'rxjs';
 import { distinctUntilChanged, filter, map, shareReplay, startWith, switchMap } from 'rxjs/operators';
 import { DeltagareCardService } from './deltagare-card.service';
+import { UnsubscribeDirective } from '@msfa-directives/unsubscribe.directive';
 
 @Component({
   selector: 'msfa-deltagare-details',
@@ -26,61 +27,28 @@ import { DeltagareCardService } from './deltagare-card.service';
   styleUrls: ['./deltagare-card.component.scss'],
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class DeltagareCardComponent {
+export class DeltagareCardComponent extends UnsubscribeDirective {
+  activeTab$: Observable<string> = this.deltagareCardService.activeTab$;
+
   private _reportsParams$ = new BehaviorSubject<PaginationParams>({ page: 1, limit: 20 });
   private _activeFeatures: Feature[] = environment.activeFeatures;
-  private _activeTab$ = new BehaviorSubject<string>('0');
-  activeTab$: Observable<string> = this._activeTab$.asObservable();
   private _userRoles: Role[] = this.userService.userRolesSnapshot;
 
-  currentGenomforandeReferens$: Observable<number> = this.activatedRoute.params.pipe(
+  contactInformation$: Observable<ContactInformation> = this.deltagareCardService.contactInformation$;
-    map(params => params.genomforandeReferens as string),
+  avropInformation$: Observable<Avrop> = this.deltagareCardService.avropInformation$;
-    distinctUntilChanged(
+  workExperiences$: Observable<WorkExperience[]> = this.deltagareCardService.workExperiences$;
-      ([prevGenomforandeReferens], [currGenomforandeReferens]) => prevGenomforandeReferens === currGenomforandeReferens
+  highestEducation$: Observable<HighestEducation> = this.deltagareCardService.highestEducation$;
-    ),
+  educations$: Observable<Education[]> = this.deltagareCardService.educations$;
-    map(genomforandeReferens => +genomforandeReferens)
+  driversLicense$: Observable<DriversLicense> = this.deltagareCardService.driversLicense$;
-  );
+  workLanguages$: Observable<string[]> = this.deltagareCardService.workLanguages$;
-  contactInformation$: Observable<ContactInformation> = this.currentGenomforandeReferens$.pipe(
+  disabilities$: Observable<Disability[]> = this.deltagareCardService.disabilities$;
-    switchMap(genomforandeReferens => this.deltagareCardService.fetchContactInformation$(genomforandeReferens)),
-    shareReplay(1)
-  );
-  avropInformation$: Observable<Avrop> = this.currentGenomforandeReferens$.pipe(
-    switchMap(genomforandeReferens => this.deltagareCardService.fetchAvropInformation$(genomforandeReferens)),
-    shareReplay(1)
-  );
-  workExperiences$: Observable<WorkExperience[]> = this.currentGenomforandeReferens$.pipe(
-    switchMap(genomforandeReferens => this.deltagareCardService.fetchWorkExperiences$(genomforandeReferens)),
-    shareReplay(1)
-  );
-  highestEducation$: Observable<HighestEducation> = this.currentGenomforandeReferens$.pipe(
-    switchMap(genomforandeReferens => this.deltagareCardService.fetchHighestEducation$(genomforandeReferens)),
-    shareReplay(1)
-  );
-  educations$: Observable<Education[]> = this.currentGenomforandeReferens$.pipe(
-    switchMap(genomforandeReferens => this.deltagareCardService.fetchEducations$(genomforandeReferens)),
-    shareReplay(1)
-  );
-  driversLicense$: Observable<DriversLicense> = this.currentGenomforandeReferens$.pipe(
-    switchMap(genomforandeReferens => this.deltagareCardService.fetchDriversLicense$(genomforandeReferens)),
-    shareReplay(1)
-  );
-  workLanguages$: Observable<string[]> = this.currentGenomforandeReferens$.pipe(
-    switchMap(genomforandeReferens => this.deltagareCardService.fetchWorkLanguages$(genomforandeReferens)),
-    shareReplay(1)
-  );
-  disabilities$: Observable<Disability[]> = this.currentGenomforandeReferens$.pipe(
-    switchMap(genomforandeReferens => this.deltagareCardService.fetchDisabilities$(genomforandeReferens)),
-    shareReplay(1)
-  );
   availableHandledare$: Observable<Handledare[]> = this.avropInformation$.pipe(
     filter(() => !!this.handledarePickerVisible),
     distinctUntilChanged((prevAvrop, currAvrop) => prevAvrop.id === currAvrop.id),
     switchMap(avropInformation => this.handledareService.fetchAvailableHandledare$([avropInformation.id]))
   );
-  reportsData$: Observable<ReportsData> = combineLatest([this._reportsParams$, this.currentGenomforandeReferens$]).pipe(
+  reportsData$: Observable<ReportsData> = this._reportsParams$.pipe(
-    switchMap(([params, genomforandeReferens]) =>
+    switchMap(params => this.deltagareCardService.fetchReports$(params)),
-      this.deltagareCardService.fetchReports$(genomforandeReferens, params)
-    ),
     shareReplay(1)
   );
   tab0Loading$: Observable<boolean> = combineLatest([this.contactInformation$, this.avropInformation$]).pipe(
@@ -113,7 +81,14 @@ export class DeltagareCardComponent {
     private deltagareCardService: DeltagareCardService,
     private handledareService: HandledareService,
     private userService: UserService
-  ) { }
+  ) {
+    super();
+    super.unsubscribeOnDestroy(
+      this.activatedRoute.params.subscribe(params => {
+        this.deltagareCardService.setGenomforandereferens(params.genomforandeReferens as string);
+      })
+    );
+  }
 
   get deltagareTjanstVisible(): boolean {
     return this._userRoles?.some(
@@ -143,8 +118,8 @@ export class DeltagareCardComponent {
     );
   }
 
-  setActiveTab(tab: number): void {
+  setActiveTab(tabId: string): void {
-    this._activeTab$.next(tab.toString());
+    this.deltagareCardService.setActiveTab(tabId);
   }
 
   setNewPage(page: number): void {

apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-card/deltagare-card.service.ts

@@ -10,50 +10,81 @@ import { ReportsData } from '@msfa-models/report.model';
 import { WorkExperience } from '@msfa-models/work-experience.model';
 import { DeltagareApiService } from '@msfa-services/api/deltagare.api.service';
 import { HandledareService } from '@msfa-services/handledare.service';
-import { Observable } from 'rxjs';
+import { BehaviorSubject, combineLatest, Observable } from 'rxjs';
-import { mapTo, switchMap } from 'rxjs/operators';
+import { filter, map, mapTo, shareReplay, switchMap } from 'rxjs/operators';
 
 @Injectable()
 export class DeltagareCardService {
+  private _activeTab$ = new BehaviorSubject<string>('0');
+  activeTab$: Observable<string> = this._activeTab$.asObservable();
+
+  private _genomforandeReferensFromParams$ = new BehaviorSubject<string | null>(null);
+
+  currentGenomforandeReferens$: Observable<number> = this._genomforandeReferensFromParams$.pipe(
+    filter(gr => !!gr),
+    map(genomforandeReferens => +genomforandeReferens)
+  );
   avropNeedsUpdate$: Observable<void> = this.handledareService.lastSavedHandledare$.pipe(mapTo(undefined as void));
 
+  contactInformation$: Observable<ContactInformation> = this.currentGenomforandeReferens$.pipe(
+    switchMap(genomforandeReferens => this.deltagareApiService.fetchContactInformation$(genomforandeReferens)),
+    shareReplay(1)
+  );
+
+  avropInformation$: Observable<Avrop> = combineLatest([
+    this.currentGenomforandeReferens$,
+    this.avropNeedsUpdate$,
+  ]).pipe(
+    switchMap(([genomforandeReferens]) => this.deltagareApiService.fetchAvropInformation$(genomforandeReferens)),
+    shareReplay(1)
+  );
+
+  workExperiences$: Observable<WorkExperience[]> = this.currentGenomforandeReferens$.pipe(
+    switchMap(genomforandeReferens => this.deltagareApiService.fetchWorkExperiences$(genomforandeReferens)),
+    shareReplay(1)
+  );
+
+  highestEducation$: Observable<HighestEducation> = this.currentGenomforandeReferens$.pipe(
+    switchMap(genomforandeReferens => this.deltagareApiService.fetchHighestEducation$(genomforandeReferens)),
+    shareReplay(1)
+  );
+
+  educations$: Observable<Education[]> = this.currentGenomforandeReferens$.pipe(
+    switchMap(genomforandeReferens => this.deltagareApiService.fetchEducations$(genomforandeReferens)),
+    shareReplay(1)
+  );
+
+  driversLicense$: Observable<DriversLicense> = this.currentGenomforandeReferens$.pipe(
+    switchMap(genomforandeReferens => this.deltagareApiService.fetchDriversLicense$(genomforandeReferens)),
+    shareReplay(1)
+  );
+
+  workLanguages$: Observable<string[]> = this.currentGenomforandeReferens$.pipe(
+    switchMap(genomforandeReferens => this.deltagareApiService.fetchWorkLanguages$(genomforandeReferens)),
+    shareReplay(1)
+  );
+
+  disabilities$: Observable<Disability[]> = this.currentGenomforandeReferens$.pipe(
+    switchMap(genomforandeReferens => this.deltagareApiService.fetchDisabilities$(genomforandeReferens)),
+    shareReplay(1)
+  );
+
   constructor(private deltagareApiService: DeltagareApiService, private handledareService: HandledareService) {}
 
-  public fetchContactInformation$(genomforandeReferens: number): Observable<ContactInformation> {
+  setGenomforandereferens(genomforandeReferens: string) {
-    return this.deltagareApiService.fetchContactInformation$(genomforandeReferens);
+    if (genomforandeReferens !== this._genomforandeReferensFromParams$.value) {
+      this._genomforandeReferensFromParams$.next(genomforandeReferens);
+      this.setActiveTab('0');
+    }
   }
 
-  public fetchAvropInformation$(genomforandeReferens: number): Observable<Avrop> {
+  fetchReports$(params: PaginationParams): Observable<ReportsData> {
-    return this.avropNeedsUpdate$.pipe(
+    return this.currentGenomforandeReferens$.pipe(
-      switchMap(() => this.deltagareApiService.fetchAvropInformation$(genomforandeReferens))
+      switchMap(genomforandeReferens => this.deltagareApiService.fetchReports$(genomforandeReferens, params))
     );
   }
 
-  public fetchWorkExperiences$(genomforandeReferens: number): Observable<WorkExperience[]> {
+  setActiveTab(tabId: string): void {
-    return this.deltagareApiService.fetchWorkExperiences$(genomforandeReferens);
+    this._activeTab$.next(tabId);
-  }
-
-  public fetchHighestEducation$(genomforandeReferens: number): Observable<HighestEducation> {
-    return this.deltagareApiService.fetchHighestEducation$(genomforandeReferens);
-  }
-
-  public fetchEducations$(genomforandeReferens: number): Observable<Education[]> {
-    return this.deltagareApiService.fetchEducations$(genomforandeReferens);
-  }
-
-  public fetchDriversLicense$(genomforandeReferens: number): Observable<DriversLicense> {
-    return this.deltagareApiService.fetchDriversLicense$(genomforandeReferens);
-  }
-
-  public fetchWorkLanguages$(genomforandeReferens: number): Observable<string[]> {
-    return this.deltagareApiService.fetchWorkLanguages$(genomforandeReferens);
-  }
-
-  public fetchDisabilities$(genomforandeReferens: number): Observable<Disability[]> {
-    return this.deltagareApiService.fetchDisabilities$(genomforandeReferens);
-  }
-
-  public fetchReports$(genomforandeReferens: number, params: PaginationParams): Observable<ReportsData> {
-    return this.deltagareApiService.fetchReports$(genomforandeReferens, params);
   }
 }