Merge pull request #136 in TEA/mina-sidor-fa-web from bugfix/TV-692 to next

Squashed commit of the following: commit 6a676d613edfef092ec860200e7b585db5af04b8 Author: Erik Tiekstra <erik.tiekstra@arbetsformedlingen.se> Date: Mon Sep 27 14:11:14 2021 +0200 Added changelog commit ec1f9adf30e985db625021d4a5b6d8d8a42fd559 Author: Erik Tiekstra <erik.tiekstra@arbetsformedlingen.se> Date: Mon Sep 27 13:12:19 2021 +0200 Updated sokandeId to genomforandeReferens to fetch data for deltagare
2021-09-27 14:13:34 +02:00
parent 85242b0544
commit 62e538e289
11 changed files with 244 additions and 204 deletions
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/components/deltagare-list/deltagare-list.component.html
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/components/deltagare-list/deltagare-list.component.html
@@ -30,7 +30,9 @@
      <tbody>
        <tr class="deltagare-list__row" *ngFor="let singleDeltagare of deltagare">
          <th scope="row">
-            <a [routerLink]="singleDeltagare.id" class="deltagare-list__link">{{ singleDeltagare.fullName }}</a>
+            <a [routerLink]="singleDeltagare.genomforandeReferens" class="deltagare-list__link"
+              >{{ singleDeltagare.fullName }}</a
+            >
          </th>
          <td>{{ singleDeltagare.tjanst }}</td>
          <td>{{ singleDeltagare.utforandeVerksamhet }}</td>
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/deltagare-routing.module.ts
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/deltagare-routing.module.ts
@@ -8,18 +8,21 @@ const routes: Routes = [
    component: DeltagareComponent,
  },
  {
-    path: ':deltagareId',
+    path: ':genomforandeReferens',
    data: { title: 'Deltagareinformation' },
    loadChildren: () => import('./pages/deltagare-card/deltagare-card.module').then(m => m.DeltagareCardModule),
  },
  {
-    path: 'rapportera/:deltagareId',
+    path: 'rapportera/:genomforandeReferens',
    data: { title: 'Skapa rapport' },
    // eslint-disable-next-line max-len
-    loadChildren: () => import('./pages/deltagare-report/pages/deltagare-avvikelse/deltagare-avvikelse.module').then(m => m.DeltagareAvvikelseModule),
+    loadChildren: () =>
+      import('./pages/deltagare-report/pages/deltagare-avvikelse/deltagare-avvikelse.module').then(
+        m => m.DeltagareAvvikelseModule
+      ),
  },
  {
-    path: 'planering/:deltagareId',
+    path: 'planering/:genomforandeReferens',
    data: { title: 'Skapa gemensam planering' },
    loadChildren: () =>
      import('./pages/deltagare-report/deltagare-gemensam-planering/deltagare-gemensam-planering.module').then(
@@ -27,7 +30,7 @@ const routes: Routes = [
      ),
  },
  {
-    path: 'periodisk-redovisning/:deltagareId',
+    path: 'periodisk-redovisning/:genomforandeReferens',
    data: { title: 'Skapa periodisk redovisning' },
    loadChildren: () =>
      import('./pages/deltagare-report/pages/periodisk-redovisning/periodisk-redovisning.module').then(
@@ -40,4 +43,4 @@ const routes: Routes = [
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule],
 })
-export class DeltagareRoutingModule { }
+export class DeltagareRoutingModule {}
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-card/components/deltagare-tab-reports/deltagare-tab-reports.component.html
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-card/components/deltagare-tab-reports/deltagare-tab-reports.component.html
@@ -16,10 +16,13 @@
      Du måste välja en rapporttyp
    </digi-form-validation-message>
  </form>
-  <div class="deltagare-tab-reports__cta-wrapper" *ngIf="currentDeltagareId$ | async as currentDeltagareId">
+  <div
+    class="deltagare-tab-reports__cta-wrapper"
+    *ngIf="currentGenomforandeReferens$ | async as currentGenomforandeReferens"
+  >
    <digi-ng-link-button
      afText="Skapa ny rapport"
-      (click)="onFormSubmitted($event, reportsFormControl.value, currentDeltagareId)"
+      (click)="onFormSubmitted($event, reportsFormControl.value, currentGenomforandeReferens)"
    ></digi-ng-link-button>
  </div>
  <div>
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-card/components/deltagare-tab-reports/deltagare-tab-reports.component.ts
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-card/components/deltagare-tab-reports/deltagare-tab-reports.component.ts
@@ -19,13 +19,21 @@ export class DeltagareTabReportsComponent {
  private _type$ = new BehaviorSubject<FormSelectItem>(null);
  readonly reportsFormControlName = 'reports';

-  public currentDeltagareId$: Observable<string> = this.activatedRoute.params.pipe(
-    map(params => params.deltagareId as string),
-    distinctUntilChanged(([prevDeltagareId], [currDeltagareId]) => prevDeltagareId === currDeltagareId)
+  public currentGenomforandeReferens$: Observable<string> = this.activatedRoute.params.pipe(
+    map(params => params.genomforandeReferens as string),
+    distinctUntilChanged(
+      ([prevGenomforandeReferens], [currGenomforandeReferens]) => prevGenomforandeReferens === currGenomforandeReferens
+    )
  );

-  reportsData$: Observable<ReportsData> = combineLatest([this.currentDeltagareId$, this._limit$, this._page$]).pipe(
-    switchMap(([deltagareId, limit, page]) => this.deltagareCardService.fetchReports$(limit, page, deltagareId)),
+  reportsData$: Observable<ReportsData> = combineLatest([
+    this.currentGenomforandeReferens$,
+    this._limit$,
+    this._page$,
+  ]).pipe(
+    switchMap(([genomforandeReferens, limit, page]) =>
+      this.deltagareCardService.fetchReports$(limit, page, genomforandeReferens)
+    ),
    shareReplay(1)
  );

@@ -51,20 +59,20 @@ export class DeltagareTabReportsComponent {
    return this.reportPickerFormGroup?.get(this.reportsFormControlName);
  }

-  onFormSubmitted(event: Event, reportType: string, deltagareId: string): void {
+  onFormSubmitted(event: Event, reportType: string, genomforandeReferens: string): void {
    event.preventDefault();

    switch (reportType) {
      case 'planering':
        if (this.reportsFormControl.valid) {
-          this.router.navigate(['/deltagare/planering', deltagareId]).catch(error => {
+          this.router.navigate(['/deltagare/planering', genomforandeReferens]).catch(error => {
            console.error(error);
          });
        }
        break;
      case 'avvikelse':
        if (this.reportsFormControl.valid) {
-          this.router.navigate(['/deltagare/rapportera', deltagareId]).catch(error => {
+          this.router.navigate(['/deltagare/rapportera', genomforandeReferens]).catch(error => {
            console.error(error);
          });
        }
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-card/deltagare-card.component.ts
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-card/deltagare-card.component.ts
@@ -28,40 +28,42 @@ export class DeltagareCardComponent {
  private _userRoles: Role[] = this.userService.userRolesSnapshot;

  public activeTab$: Observable<string> = this._activeTab$.asObservable();
-  public currentDeltagareId$: Observable<string> = this.activatedRoute.params.pipe(
-    map(params => params.deltagareId as string),
-    distinctUntilChanged(([prevDeltagareId], [currDeltagareId]) => prevDeltagareId === currDeltagareId)
+  public currentGenomforandeReferens$: Observable<string> = this.activatedRoute.params.pipe(
+    map(params => params.genomforandeReferens as string),
+    distinctUntilChanged(
+      ([prevGenomforandeReferens], [currGenomforandeReferens]) => prevGenomforandeReferens === currGenomforandeReferens
+    )
  );
-  contactInformation$: Observable<ContactInformation> = combineLatest([this.currentDeltagareId$]).pipe(
-    switchMap(([deltagareId]) => this.deltagareCardService.fetchContactInformation$(deltagareId)),
+  contactInformation$: Observable<ContactInformation> = this.currentGenomforandeReferens$.pipe(
+    switchMap(genomforandeReferens => this.deltagareCardService.fetchContactInformation$(genomforandeReferens)),
    shareReplay(1)
  );
-  avropInformation$: Observable<Avrop> = combineLatest([this.currentDeltagareId$, this._activeTab$]).pipe(
-    switchMap(([deltagareId]) => this.deltagareCardService.fetchAvropInformation$(deltagareId)),
+  avropInformation$: Observable<Avrop> = this.currentGenomforandeReferens$.pipe(
+    switchMap(genomforandeReferens => this.deltagareCardService.fetchAvropInformation$(genomforandeReferens)),
    shareReplay(1)
  );
-  workExperiences$: Observable<WorkExperience[]> = this.currentDeltagareId$.pipe(
-    switchMap(([deltagareId]) => this.deltagareCardService.fetchWorkExperiences$(deltagareId)),
+  workExperiences$: Observable<WorkExperience[]> = this.currentGenomforandeReferens$.pipe(
+    switchMap(genomforandeReferens => this.deltagareCardService.fetchWorkExperiences$(genomforandeReferens)),
    shareReplay(1)
  );
-  highestEducation$: Observable<HighestEducation> = this.currentDeltagareId$.pipe(
-    switchMap(([deltagareId]) => this.deltagareCardService.fetchHighestEducation$(deltagareId)),
+  highestEducation$: Observable<HighestEducation> = this.currentGenomforandeReferens$.pipe(
+    switchMap(genomforandeReferens => this.deltagareCardService.fetchHighestEducation$(genomforandeReferens)),
    shareReplay(1)
  );
-  educations$: Observable<Education[]> = this.currentDeltagareId$.pipe(
-    switchMap(([deltagareId]) => this.deltagareCardService.fetchEducations$(deltagareId)),
+  educations$: Observable<Education[]> = this.currentGenomforandeReferens$.pipe(
+    switchMap(genomforandeReferens => this.deltagareCardService.fetchEducations$(genomforandeReferens)),
    shareReplay(1)
  );
-  driversLicense$: Observable<DriversLicense> = this.currentDeltagareId$.pipe(
-    switchMap(([deltagareId]) => this.deltagareCardService.fetchDriversLicense$(deltagareId)),
+  driversLicense$: Observable<DriversLicense> = this.currentGenomforandeReferens$.pipe(
+    switchMap(genomforandeReferens => this.deltagareCardService.fetchDriversLicense$(genomforandeReferens)),
    shareReplay(1)
  );
-  workLanguages$: Observable<string[]> = this.currentDeltagareId$.pipe(
-    switchMap(([deltagareId]) => this.deltagareCardService.fetchWorkLanguages$(deltagareId)),
+  workLanguages$: Observable<string[]> = this.currentGenomforandeReferens$.pipe(
+    switchMap(genomforandeReferens => this.deltagareCardService.fetchWorkLanguages$(genomforandeReferens)),
    shareReplay(1)
  );
-  disabilities$: Observable<Disability[]> = this.currentDeltagareId$.pipe(
-    switchMap(([deltagareId]) => this.deltagareCardService.fetchDisabilities$(deltagareId)),
+  disabilities$: Observable<Disability[]> = this.currentGenomforandeReferens$.pipe(
+    switchMap(genomforandeReferens => this.deltagareCardService.fetchDisabilities$(genomforandeReferens)),
    shareReplay(1)
  );

--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-report/pages/deltagare-avvikelse/deltagare-avvikelse.component.ts
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-report/pages/deltagare-avvikelse/deltagare-avvikelse.component.ts
@@ -23,7 +23,7 @@ import {
  EndTimeIsRequiredCheck,
  MotiveringIsRequiredCheck,
  OrsakerIsRequiredCheck,
-  StartTimeIsRequiredCheck
+  StartTimeIsRequiredCheck,
 } from '@msfa-utils/validators/avvikelse-form-validator';
 import { RequiredValidator } from '@msfa-utils/validators/required.validator';
 import { BehaviorSubject, Observable } from 'rxjs';
@@ -35,14 +35,14 @@ import { avvikelseAlternatives, dayOrPartOfDay } from './report-alternatives';
  selector: 'msfa-deltagare-avvikelse',
  templateUrl: './deltagare-avvikelse.component.html',
  styleUrls: ['./deltagare-avvikelse.component.scss'],
-  changeDetection: ChangeDetectionStrategy.OnPush
+  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class DeltagareAvvikelseComponent implements OnInit {
  readonly alternativeFormControlName = 'alternative';
-  readonly descriptionFormControlName = 'description'
+  readonly descriptionFormControlName = 'description';
  readonly dateFormControlName = 'date';
  readonly dayOrPartOfDayFormControlName = 'dayOrPartOfDay';
-  readonly orsakerFormControlName = 'orsaker'
+  readonly orsakerFormControlName = 'orsaker';
  readonly andraKandaOrsakerFormControlName = 'andraKandaOrsaker';
  readonly fraga1FormControlName = 'fraga1';
  readonly fraga2FormControlName = 'fraga2';
@@ -52,10 +52,11 @@ export class DeltagareAvvikelseComponent implements OnInit {
  private _showSuccessNotification$ = new BehaviorSubject<boolean>(false);
  private _showDangerNotification$ = new BehaviorSubject<boolean>(false);

-  contactInformation$: Observable<ContactInformationCompact> = this.activatedRoute.params
-    .pipe(
-      switchMap(({ deltagareId }) => this.deltagareAvvikelseService.getContactInformationCompact$(deltagareId))
+  contactInformation$: Observable<ContactInformationCompact> = this.activatedRoute.params.pipe(
+    switchMap(({ genomforandeReferens }) =>
+      this.deltagareAvvikelseService.getContactInformationCompact$(genomforandeReferens)
    )
+  );
  franvaroOrsaker$: Observable<OrsaksKoderFranvaro[]>;
  avvikelseOrsaker$: Observable<OrsaksKoderAvvikelse[]>;
  andraKandaOrsaker$: Observable<KandaAvvikelseKoder[]>;
@@ -77,47 +78,51 @@ export class DeltagareAvvikelseComponent implements OnInit {
  constructor(
    private deltagareAvvikelseService: DeltagareAvvikelseService,
    private router: Router,
-    private activatedRoute: ActivatedRoute) { }
+    private activatedRoute: ActivatedRoute
+  ) {}

  ngOnInit(): void {
-    this.contactInformation$
-      .pipe(
-        first(),
-      )
-      .subscribe(contactInformation => {
-        this.contactInformation = contactInformation;
-      });
+    this.contactInformation$.pipe(first()).subscribe(contactInformation => {
+      this.contactInformation = contactInformation;
+    });

-    this.avvikelseFormGroup = new FormGroup({
-      alternative: new FormControl(null, [RequiredValidator()]),
-      description: new FormControl(''),
-      date: new FormControl(this.todayDate),
-      dayOrPartOfDay: new FormControl(null),
-      orsakerFormGroup: new FormGroup({
-        orsaker: new FormControl([]),
-        andraKandaOrsaker: new FormControl([])
-      }),
-      fragorFormGroup: new FormGroup({
-        fraga1: new FormControl(''),
-        fraga2: new FormControl('')
-      }),
-      timepickerFormGroup: new FormGroup({
-        startTime: new FormControl(''),
-        endTime: new FormControl('')
-      })
-    }, {
-      validators:
-        [
-          DescriptionIsRequiredCheck.CheckIfRequired('description', 'orsakerFormGroup', 'andraKandaOrsaker', KandaOrsakerEnum.AnnanOrsak),
+    this.avvikelseFormGroup = new FormGroup(
+      {
+        alternative: new FormControl(null, [RequiredValidator()]),
+        description: new FormControl(''),
+        date: new FormControl(this.todayDate),
+        dayOrPartOfDay: new FormControl(null),
+        orsakerFormGroup: new FormGroup({
+          orsaker: new FormControl([]),
+          andraKandaOrsaker: new FormControl([]),
+        }),
+        fragorFormGroup: new FormGroup({
+          fraga1: new FormControl(''),
+          fraga2: new FormControl(''),
+        }),
+        timepickerFormGroup: new FormGroup({
+          startTime: new FormControl(''),
+          endTime: new FormControl(''),
+        }),
+      },
+      {
+        validators: [
+          DescriptionIsRequiredCheck.CheckIfRequired(
+            'description',
+            'orsakerFormGroup',
+            'andraKandaOrsaker',
+            KandaOrsakerEnum.AnnanOrsak
+          ),
          OrsakerIsRequiredCheck.CheckIfRequired('orsakerFormGroup', 'orsaker'),
          AnnanKandOrsakeIsRequiredCheck.CheckIfRequired('orsakerFormGroup', 'andraKandaOrsaker'),
          DateIsRequiredCheck.CheckIfRequired('date'),
          DayOrPartOfDayIsRequiredCheck.CheckIfRequired('dayOrPartOfDay'),
          StartTimeIsRequiredCheck.CheckIfRequired('timepickerFormGroup', 'startTime'),
          EndTimeIsRequiredCheck.CheckIfRequired('timepickerFormGroup', 'endTime'),
-          MotiveringIsRequiredCheck.CheckIfRequired('fraga1')
-        ]
-    })
+          MotiveringIsRequiredCheck.CheckIfRequired('fraga1'),
+        ],
+      }
+    );
  }

  get alternativeFormControl(): AbstractControl | undefined {
@@ -168,22 +173,23 @@ export class DeltagareAvvikelseComponent implements OnInit {
        arbetssokande: {
          personnummer: this.contactInformation.personnummer.toString(),
          fornamn: this.contactInformation.fornamn.toString(),
-          efternamn: this.contactInformation.efternamn.toString()
+          efternamn: this.contactInformation.efternamn.toString(),
        },
-        sokandeId: +this.activatedRoute.snapshot.params['deltagareId']
-      }
+        sokandeId: +this.activatedRoute.snapshot.params['genomforandeReferens'],
+      };

-      if (this.alternativeFormControl.value as string === Alternative.AVVIKELSE) {
+      if ((this.alternativeFormControl.value as string) === Alternative.AVVIKELSE) {
        postAvvikelse['avvikelsealternativ'] = this.avvikelse;
-      } else if (this.alternativeFormControl.value as string == Alternative.FRANVARO) {
+      } else if ((this.alternativeFormControl.value as string) == Alternative.FRANVARO) {
        postAvvikelse['franvaro'] = this.franvaro;
      }

-      this.deltagareAvvikelseService.createAvvikelse$(postAvvikelse, this.alternativeFormControl.value as string)
+      this.deltagareAvvikelseService
+        .createAvvikelse$(postAvvikelse, this.alternativeFormControl.value as string)
        .subscribe({
          error: () => this._showDangerNotification$.next(true),
          next: () => this._showSuccessNotification$.next(true),
-          complete: () => this.avvikelseFormGroup.reset()
+          complete: () => this.avvikelseFormGroup.reset(),
        });
    }
  }
@@ -193,17 +199,17 @@ export class DeltagareAvvikelseComponent implements OnInit {
      avvikelseorsakskod: this.orsakerFormControl.value as string,
      datum: this.dateFormControl.value as string,
      heldag: this.dayOrPartOfDayFormControl.value === DayOrPartOfDay.HELDAG ? true : false,
-      starttid: this.startTimeFormControl.value as string || '9:00',
-      sluttid: this.endTimeFormControl.value as string || '16:00',
+      starttid: (this.startTimeFormControl.value as string) || '9:00',
+      sluttid: (this.endTimeFormControl.value as string) || '16:00',
      forvantad_narvaro: {
        starttid: '',
-        sluttid: ''
+        sluttid: '',
      },
      alternativ_for_kanda_orsaker: {
-        typ: this.andraKandaOrsakerFormControl.value as string || '',
-        motivering: this.descriptionFormControl.value as string
-      }
-    }
+        typ: (this.andraKandaOrsakerFormControl.value as string) || '',
+        motivering: this.descriptionFormControl.value as string,
+      },
+    };
  }

  get avvikelse(): AvvikelseAlternativ {
@@ -211,63 +217,64 @@ export class DeltagareAvvikelseComponent implements OnInit {
      avvikelseorsakskod: this.orsakerFormControl.value as string,
      frageformular: [
        {
-          fraga: this.avvikelseFormGroup.get('orsakerFormGroup').get('orsaker').value as string + '_1',
-          svar: this.fraga1FormControl.value as string
+          fraga: (this.avvikelseFormGroup.get('orsakerFormGroup').get('orsaker').value as string) + '_1',
+          svar: this.fraga1FormControl.value as string,
        },
        {
-          fraga: this.fraga2FormControl.value as string !== '' ?
-            this.avvikelseFormGroup.get('orsakerFormGroup').get('orsaker').value as string + '_2' : '',
-          svar: this.fraga2FormControl.value as string
-        }
+          fraga:
+            (this.fraga2FormControl.value as string) !== ''
+              ? (this.avvikelseFormGroup.get('orsakerFormGroup').get('orsaker').value as string) + '_2'
+              : '',
+          svar: this.fraga2FormControl.value as string,
+        },
      ],
-      rapporteringsdatum: this.dateFormControl.value as string
-    }
+      rapporteringsdatum: this.dateFormControl.value as string,
+    };
  }

  setAlternative(): void {
-    if (this.alternativeFormControl.value as string == Alternative.FRANVARO) {
+    if ((this.alternativeFormControl.value as string) == Alternative.FRANVARO) {
      this.franvaroOrsaker$ = this.deltagareAvvikelseService.getOrsaksKoderFranvaro$();
      this.andraKandaOrsaker$ = this.deltagareAvvikelseService.getAndraKandaOrsaker$();
    }

-    if (this.alternativeFormControl.value as string == Alternative.AVVIKELSE) {
+    if ((this.alternativeFormControl.value as string) == Alternative.AVVIKELSE) {
      this.avvikelseOrsaker$ = this.deltagareAvvikelseService.getOrsaksKoderAvvikelse$();
-      this.fragor1$ = this.deltagareAvvikelseService.getFragorForAvvikelser$()
-        .pipe(
-          map((fragor: FragorForAvvikelser[]) => {
-            return fragor.filter((fraga: FragorForAvvikelser) => fraga.id.includes('_1'))
-          }
-          )
-        );
+      this.fragor1$ = this.deltagareAvvikelseService.getFragorForAvvikelser$().pipe(
+        map((fragor: FragorForAvvikelser[]) => {
+          return fragor.filter((fraga: FragorForAvvikelser) => fraga.id.includes('_1'));
+        })
+      );

-      this.fragor2$ = this.deltagareAvvikelseService.getFragorForAvvikelser$()
-        .pipe(
-          map((fragor: FragorForAvvikelser[]) => {
-            return fragor.filter((fraga: FragorForAvvikelser) => {
-              this.setIfRequiredDescription(fraga);
-              return fraga.id.includes('_2')
-            })
-          })
-        )
+      this.fragor2$ = this.deltagareAvvikelseService.getFragorForAvvikelser$().pipe(
+        map((fragor: FragorForAvvikelser[]) => {
+          return fragor.filter((fraga: FragorForAvvikelser) => {
+            this.setIfRequiredDescription(fraga);
+            return fraga.id.includes('_2');
+          });
+        })
+      );
    }

    this.clearControlOnAlternativeChange();
  }

  private setIfRequiredDescription(fraga: FragorForAvvikelser) {
-    fraga.id === '19_2' || fraga.id === '20_2' ?
-      fraga.descriptionIsRequired = false :
-      fraga.descriptionIsRequired = true;
+    fraga.id === '19_2' || fraga.id === '20_2'
+      ? (fraga.descriptionIsRequired = false)
+      : (fraga.descriptionIsRequired = true);
  }

  setOrsakerChanged(): void {
    this.avvikelseFormGroup.markAsUntouched();
-    if (this.alternativeFormControl.value as string === Alternative.AVVIKELSE) {
+    if ((this.alternativeFormControl.value as string) === Alternative.AVVIKELSE) {
      this.selectedOrsaksKod = this.avvikelseFormGroup.get('orsakerFormGroup').get('orsaker').value as string;
    }

-    this.avvikelseFormGroup.get('orsakerFormGroup').get('orsaker').valueChanges
-      .subscribe(value => {
+    this.avvikelseFormGroup
+      .get('orsakerFormGroup')
+      .get('orsaker')
+      .valueChanges.subscribe(value => {
        if (value !== null) {
          this.avvikelseFormGroup.get('orsakerFormGroup').get('andraKandaOrsaker').reset();
        }
@@ -275,14 +282,18 @@ export class DeltagareAvvikelseComponent implements OnInit {
  }

  get showDescription(): boolean {
-    return this.alternativeFormControl.value as string == Alternative.FRANVARO &&
+    return (
+      (this.alternativeFormControl.value as string) == Alternative.FRANVARO &&
      +this.orsakerFormControl.value === FranvaroOrsaksKodEnum.AnnanKandOrsak &&
      +this.andraKandaOrsakerFormControl.value === KandaOrsakerEnum.AnnanOrsak
+    );
  }

  get showFragor(): boolean {
-    return this.alternativeFormControl.value as string === Alternative.AVVIKELSE &&
-      this.orsakerFormControl.value as boolean;
+    return (
+      (this.alternativeFormControl.value as string) === Alternative.AVVIKELSE &&
+      (this.orsakerFormControl.value as boolean)
+    );
  }

  get showDatePicker(): boolean {
@@ -290,12 +301,17 @@ export class DeltagareAvvikelseComponent implements OnInit {
  }

  get showDayOrPartOfDayPicker(): boolean {
-    return this.alternativeFormControl.value as string === Alternative.FRANVARO && this.orsakerFormControl.value as boolean;
+    return (
+      (this.alternativeFormControl.value as string) === Alternative.FRANVARO &&
+      (this.orsakerFormControl.value as boolean)
+    );
  }

  get showTimePicker(): boolean {
-    return this.alternativeFormControl.value as string === Alternative.FRANVARO &&
-      this.dayOrPartOfDayFormControl.value as string === DayOrPartOfDay.DEL_AV_DAG
+    return (
+      (this.alternativeFormControl.value as string) === Alternative.FRANVARO &&
+      (this.dayOrPartOfDayFormControl.value as string) === DayOrPartOfDay.DEL_AV_DAG
+    );
  }

  get nextStep(): number {
@@ -314,7 +330,7 @@ export class DeltagareAvvikelseComponent implements OnInit {
  }

  backToDeltagare(): void {
-    void this.router.navigate(['./deltagare', this.activatedRoute.snapshot.params['deltagareId']]);
+    void this.router.navigate(['./deltagare', this.activatedRoute.snapshot.params['genomforandeReferens']]);
  }

  private clearControlOnAlternativeChange(): void {
@@ -324,5 +340,4 @@ export class DeltagareAvvikelseComponent implements OnInit {
    this.dayOrPartOfDayFormControl.reset();
    this.avvikelseFormGroup?.get('timepickerFormGroup').reset();
  }
-
 }
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/shared/report-layout/report-layout.component.ts
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/shared/report-layout/report-layout.component.ts
@@ -1,16 +1,15 @@
-import { Component, ChangeDetectionStrategy, Input } from '@angular/core';
+import { ChangeDetectionStrategy, Component, Input } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
 import { ContactInformationCompact } from '@msfa-models/api/contact-information.response.model';
 import { Observable } from 'rxjs';
 import { switchMap } from 'rxjs/operators';
 import { DeltagareAvvikelseService } from '../../pages/deltagare-report/services/deltagare-avvikelse.service';

-
@Component({
  selector: 'msfa-report-layout',
  templateUrl: './report-layout.component.html',
  styleUrls: ['./report-layout.component.scss'],
-  changeDetection: ChangeDetectionStrategy.OnPush
+  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class ReportLayoutComponent {
  @Input() reportTitle = 'Report Title';
@@ -25,14 +24,11 @@ export class ReportLayoutComponent {
  @Input() showSuccessNotification = false;
  @Input() showDangerNotification = false;

-  contactInformation$: Observable<ContactInformationCompact> = this.activatedRoute.params
-    .pipe(
-      switchMap(({ deltagareId }) => this.deltagareAvvikelseService.getContactInformationCompact$(deltagareId))
-    );
-
-  constructor(
-    private deltagareAvvikelseService: DeltagareAvvikelseService,
-    private activatedRoute: ActivatedRoute
-  ) { }
+  contactInformation$: Observable<ContactInformationCompact> = this.activatedRoute.params.pipe(
+    switchMap(({ genomforandeReferens }) =>
+      this.deltagareAvvikelseService.getContactInformationCompact$(genomforandeReferens)
+    )
+  );

+  constructor(private deltagareAvvikelseService: DeltagareAvvikelseService, private activatedRoute: ActivatedRoute) {}
 }
--- a/apps/mina-sidor-fa/src/app/shared/services/api/deltagare.api.service.ts
+++ b/apps/mina-sidor-fa/src/app/shared/services/api/deltagare.api.service.ts
@@ -73,14 +73,14 @@ export class DeltagareApiService {
      );
  }

-  public fetchReports$(limit: number, page: number, deltagareId: string): Observable<ReportsData> {
+  public fetchReports$(limit: number, page: number, genomforandeReferens: string): Observable<ReportsData> {
    return of({ data: [], meta: null });

    // TODO:  When the API/Mock-API has implemented the endpoint, we can remove use following code
    //        to make API-requests.

    // const params: { [param: string]: string | string[] } = {
-    //   id: deltagareId.toString(),
+    //   id: genomforandeReferens.toString(),
    //   limit: limit.toString(),
    //   page: page.toString(),
    // };
--- a/apps/mina-sidor-fa/src/app/shared/services/deltagare-card.service.ts
+++ b/apps/mina-sidor-fa/src/app/shared/services/deltagare-card.service.ts
@@ -16,31 +16,31 @@ import { DeltagareApiService } from './api/deltagare.api.service';
 export class DeltagareCardService {
  constructor(private deltagareApiService: DeltagareApiService) {}

-  public fetchContactInformation$(deltagareId: string): Observable<ContactInformation> {
-    return this.deltagareApiService.fetchContactInformation$(deltagareId);
+  public fetchContactInformation$(genomforandeReferens: string): Observable<ContactInformation> {
+    return this.deltagareApiService.fetchContactInformation$(genomforandeReferens);
  }
-  public fetchAvropInformation$(deltagareId: string): Observable<Avrop> {
-    return this.deltagareApiService.fetchAvropInformation$(deltagareId);
+  public fetchAvropInformation$(genomforandeReferens: string): Observable<Avrop> {
+    return this.deltagareApiService.fetchAvropInformation$(genomforandeReferens);
  }
-  public fetchWorkExperiences$(deltagareId: string): Observable<WorkExperience[]> {
-    return this.deltagareApiService.fetchWorkExperiences$(deltagareId);
+  public fetchWorkExperiences$(genomforandeReferens: string): Observable<WorkExperience[]> {
+    return this.deltagareApiService.fetchWorkExperiences$(genomforandeReferens);
  }
-  public fetchHighestEducation$(deltagareId: string): Observable<HighestEducation> {
-    return this.deltagareApiService.fetchHighestEducation$(deltagareId);
+  public fetchHighestEducation$(genomforandeReferens: string): Observable<HighestEducation> {
+    return this.deltagareApiService.fetchHighestEducation$(genomforandeReferens);
  }
-  public fetchEducations$(deltagareId: string): Observable<Education[]> {
-    return this.deltagareApiService.fetchEducations$(deltagareId);
+  public fetchEducations$(genomforandeReferens: string): Observable<Education[]> {
+    return this.deltagareApiService.fetchEducations$(genomforandeReferens);
  }
-  public fetchDriversLicense$(deltagareId: string): Observable<DriversLicense> {
-    return this.deltagareApiService.fetchDriversLicense$(deltagareId);
+  public fetchDriversLicense$(genomforandeReferens: string): Observable<DriversLicense> {
+    return this.deltagareApiService.fetchDriversLicense$(genomforandeReferens);
  }
-  public fetchWorkLanguages$(deltagareId: string): Observable<string[]> {
-    return this.deltagareApiService.fetchWorkLanguages$(deltagareId);
+  public fetchWorkLanguages$(genomforandeReferens: string): Observable<string[]> {
+    return this.deltagareApiService.fetchWorkLanguages$(genomforandeReferens);
  }
-  public fetchDisabilities$(deltagareId: string): Observable<Disability[]> {
-    return this.deltagareApiService.fetchDisabilities$(deltagareId);
+  public fetchDisabilities$(genomforandeReferens: string): Observable<Disability[]> {
+    return this.deltagareApiService.fetchDisabilities$(genomforandeReferens);
  }
-  public fetchReports$(limit: number, page: number, deltagareId: string): Observable<ReportsData> {
-    return this.deltagareApiService.fetchReports$(limit, page, deltagareId);
+  public fetchReports$(limit: number, page: number, genomforandeReferens: string): Observable<ReportsData> {
+    return this.deltagareApiService.fetchReports$(limit, page, genomforandeReferens);
  }
 }