Fixed some issues with invites mock-data and response from api

apps/mina-sidor-fa/src/app/pages/administration/pages/employee-invite/employee-invite.component.html

@@ -2,7 +2,7 @@
   <section class="employee-invite">
     <digi-typography>
       <h1>Skapa nytt personalkonto</h1>
-      <p>Såhär skapar du ett nytt personalkonto:</p>
+      <p>Så här skapar du ett nytt personalkonto:</p>
       <ol>
         <li>Skicka en inbjudningslänk till personalens e-postadress.</li>
         <li>Personalen öppnar inbjudningslänken via sin e-post och skapar ett personalkonto med sitt Bank-ID.</li>
@@ -32,9 +32,9 @@
             afLabel="E-postadress"
             afType="email"
             [afRequired]="true"
-            [afInvalidMessage]="email.errors?.message || 'Ogiltig e-postadress'"
+            [afInvalidMessage]="emailControl.errors?.message || 'Ogiltig e-postadress'"
             [afDisableValidStyle]="true"
-            [afInvalid]="email.invalid && email.dirty"
+            [afInvalid]="emailControl.invalid && emailControl.dirty"
           ></digi-ng-form-input>
           <digi-button af-size="m" af-type="submit" class="employee-invite__invitation-btn"
             >Skicka inbjudningslänk</digi-button
@@ -42,14 +42,17 @@
         </div>
       </div>
       <digi-notification-alert
-        *ngIf="(latestSubmittedInvite$ | async) as latestSubmittedInvite"
+        *ngIf="(lastInvite$ | async) as lastInvite"
         af-variation="success"
         af-heading="Allt gick bra"
         af-heading-level="h3"
         af-closeable="true"
         (click)="onCloseAlert()"
       >
-        <p>Inbjudan har skickats till {{latestSubmittedInvite.email}}</p>
+        <p *ngIf="lastInvitedNewUsers?.length">Inbjudan har skickats till {{lastInvitedNewUsers.join(', ')}}.</p>
+        <p *ngIf="lastInvitedExistingUsers?.length">
+          Följande personal är redan registrerat: {{lastInvitedExistingUsers.join(', ')}}.
+        </p>
       </digi-notification-alert>
 
       <footer class="employee-invite__footer">

apps/mina-sidor-fa/src/app/pages/administration/pages/employee-invite/employee-invite.component.ts

@@ -1,5 +1,6 @@
-import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core';
-import { FormControl, FormGroup, Validators } from '@angular/forms';
+import { ChangeDetectionStrategy, Component } from '@angular/core';
+import { AbstractControl, FormControl, FormGroup, Validators } from '@angular/forms';
+import { EmployeeInviteResponse } from '@msfa-models/api/employee-invite.response.model';
 import { EmployeeService } from '@msfa-services/api/employee.service';
 import { RequiredValidator } from '@msfa-utils/validators/required.validator';
 import { BehaviorSubject, Observable } from 'rxjs';
@@ -10,46 +11,57 @@ import { BehaviorSubject, Observable } from 'rxjs';
   styleUrls: ['./employee-invite.component.scss'],
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class EmployeeInviteComponent implements OnInit {
-  form: FormGroup;
-  private latestSubmittedInvite_ = new BehaviorSubject<string>('');
-  latestSubmittedInvite$: Observable<string> = this.latestSubmittedInvite_.asObservable();
+export class EmployeeInviteComponent {
+  form: FormGroup = new FormGroup({
+    email: new FormControl('', [
+      RequiredValidator('E-postadress'),
+      Validators.pattern('^[a-z0-9._%+-]+@[a-z0-9.-]+\\.[a-z]{2,4}$'),
+    ]),
+  });
+  private _lastInvite$ = new BehaviorSubject<EmployeeInviteResponse>(null);
+  lastInvite$: Observable<EmployeeInviteResponse> = this._lastInvite$.asObservable();
 
   constructor(private employeeService: EmployeeService) {}
 
-  ngOnInit(): void {
-    this.form = new FormGroup({
-      email: new FormControl('', [
-        RequiredValidator('E-postadress'),
-        Validators.pattern('^[a-z0-9._%+-]+@[a-z0-9.-]+\\.[a-z]{2,4}$'),
-      ]),
-    });
-  }
-
-  get email() {
+  get emailControl(): AbstractControl {
     return this.form.get('email');
   }
 
+  get lastInvite(): EmployeeInviteResponse {
+    return this._lastInvite$.getValue();
+  }
+
+  get lastInvitedNewUsers(): string[] {
+    const invitedUsers = this.lastInvite?.invitedUsers || [];
+    const assignedUsers = this.lastInvite?.assignedUsers || [];
+    return [...invitedUsers, ...assignedUsers.map(assigned => assigned.email)];
+  }
+
+  get lastInvitedExistingUsers(): string[] {
+    const existingUsersInCurrentOrg = this.lastInvite?.existingUsersInCurrentOrg || [];
+    return existingUsersInCurrentOrg.map(existing => existing.email);
+  }
+
   submitForm(): void {
+    this._lastInvite$.next(null);
     if (this.form.invalid) {
-      this.email.markAsDirty();
-      this.email.markAsTouched();
+      this.emailControl.markAsDirty();
+      this.emailControl.markAsTouched();
       return;
     }
 
-    const post = this.employeeService.postEmployeeInvitation(this.form.value).subscribe({
-      next: () => {
-        this.latestSubmittedInvite_.next(this.form.value);
+    const post = this.employeeService.postEmployeeInvitation(this.emailControl.value).subscribe({
+      next: data => {
+        this._lastInvite$.next(data);
         this.form.reset();
       },
       complete: () => {
         post.unsubscribe();
       },
-      error: (err) => console.log(err)
     });
   }
 
   onCloseAlert(): void {
-    this.latestSubmittedInvite_.next('');
+    this._lastInvite$.next(null);
   }
 }