fix(frontend): fix login in 'mon-domifa' & register multiple users

Author: pYassine

packages/backend/src/auth/guards/AppUserGuard.guard.ts

@@ -2,7 +2,11 @@ import { UserStructureRole, UserSupervisorRole } from "@domifa/common";
 import { CanActivate, ExecutionContext, Injectable } from "@nestjs/common";
 import { Reflector } from "@nestjs/core";
 import { getCurrentScope } from "@sentry/node";
-import { UserProfile, UserStructureAuthenticated } from "../../_common/model";
+import {
+  UserProfile,
+  UserStructureAuthenticated,
+  UserUsagerAuthenticated,
+} from "../../_common/model";
 import { UserSupervisorAuthenticated } from "../../_common/model/users/user-supervisor";
 import { expiredTokenRepositiory } from "../../database";
 import { addLogContext, appLogger } from "../../util";
@@ -15,6 +19,7 @@ export class AppUserGuard implements CanActivate {
   public async canActivate(context: ExecutionContext): Promise<boolean> {
     const request = context.switchToHttp().getRequest();
     const user = request.user as
+      | UserUsagerAuthenticated
       | UserStructureAuthenticated
       | UserSupervisorAuthenticated;
 
@@ -25,18 +30,29 @@ export class AppUserGuard implements CanActivate {
       },
     });
 
-    let userScope = {
-      email: user.email,
+    let userScope: {
+      id: number;
+      structureId?: number | null;
+      role?: UserSupervisorRole | UserStructureRole;
+      email?: string | null;
+    } = {
       id: user._userId,
-      role: user.role,
       structureId: null,
     };
 
     if (user._userProfile === "structure") {
       userScope = {
         ...userScope,
+        role: user?.role,
+        email: user?.email,
         structureId: user?.structureId,
       };
+    } else if (user._userProfile === "supervisor") {
+      userScope = {
+        ...userScope,
+        role: user?.role,
+        email: user?.email,
+      };
     }
 
     getCurrentScope().setUser(userScope);
@@ -103,6 +119,10 @@ export class AppUserGuard implements CanActivate {
     const isValidProfile = authChecker.checkProfile(user, ...allowUserProfiles);
 
     if (isValidProfile) {
+      if (user._userProfile === "usager") {
+        return true;
+      }
+
       if (
         user._userProfile === "structure" &&
         allowUserStructureRoles?.length

packages/frontend/src/app/modules/manage-users/components/register-user-admin/register-user-admin.component.ts

@@ -44,6 +44,7 @@ export class RegisterUserAdminComponent implements OnInit, OnDestroy {
 
   private subscription = new Subscription();
   private unsubscribe: Subject<void> = new Subject();
+  public me!: UserStructure | null;
 
   @Output() public getUsers = new EventEmitter<void>();
 
@@ -66,7 +67,7 @@ export class RegisterUserAdminComponent implements OnInit, OnDestroy {
   }
 
   public ngOnInit(): void {
-    const user = this.authService.currentUserValue;
+    this.me = this.authService.currentUserValue;
 
     this.userForm = this.formBuilder.group({
       email: [
@@ -83,7 +84,7 @@ export class RegisterUserAdminComponent implements OnInit, OnDestroy {
         this.user.prenom,
         [Validators.required, Validators.minLength(2), NoWhiteSpaceValidator],
       ],
-      structureId: [user?.structureId, []],
+      structureId: [this.me.structureId, []],
     });
   }
 
@@ -97,23 +98,28 @@ export class RegisterUserAdminComponent implements OnInit, OnDestroy {
     } else {
       this.loading = true;
       this.subscription.add(
-        this.usersService.registerUser(this.userForm.value).subscribe({
-          next: () => {
-            this.loading = false;
-            this.submitted = false;
-            this.getUsers.emit();
-            this.form.nativeElement.reset();
-            this.toastService.success(
-              "Le nouveau compte a été créé avec succès, votre collaborateur vient de recevoir un email pour ajouter son mot de passe."
-            );
-          },
-          error: () => {
-            this.loading = false;
-            this.toastService.error(
-              "veuillez vérifier les champs marqués en rouge dans le formulaire"
-            );
-          },
-        })
+        this.usersService
+          .registerUser({
+            ...this.userForm.value,
+            structureId: this.me.structureId,
+          })
+          .subscribe({
+            next: () => {
+              this.loading = false;
+              this.submitted = false;
+              this.getUsers.emit();
+              this.form.nativeElement.reset();
+              this.toastService.success(
+                "Le nouveau compte a été créé avec succès, votre collaborateur vient de recevoir un email pour ajouter son mot de passe."
+              );
+            },
+            error: () => {
+              this.loading = false;
+              this.toastService.error(
+                "veuillez vérifier les champs marqués en rouge dans le formulaire"
+              );
+            },
+          })
       );
     }
   }

packages/portail-usagers/src/app/modules/shared/components/custom-toastr/custom-toastr.component.ts

@@ -6,8 +6,10 @@ import { CustomToast } from "../../types/CustomToast.type";
 
 import { CustomToastClass } from "../../types";
 import { IconName } from "@fortawesome/fontawesome-svg-core";
+import { fadeIn } from "../../../../shared";
 
 @Component({
+  animations: [fadeIn],
   selector: "app-custom-toastr",
   templateUrl: "./custom-toastr.component.html",
   styleUrls: ["./custom-toastr.component.css"],

packages/portail-usagers/src/app/shared/animations.ts

@@ -0,0 +1,57 @@
+import {
+  animate,
+  animation,
+  keyframes,
+  style,
+  transition,
+  trigger,
+  useAnimation,
+} from "@angular/animations";
+
+export const fadeIn = trigger("fadeIn", [
+  transition(":enter", [
+    style({ opacity: 0 }),
+    animate("0.3s ease-in", style({ opacity: 1 })),
+  ]),
+]);
+
+export const fadeInOut = trigger("fadeInOut", [
+  transition(":enter", [
+    style({ opacity: 0 }),
+    animate("0.3s ease-in", style({ opacity: 1 })),
+  ]),
+  transition(":leave", [
+    style({ opacity: 1 }),
+    animate("0.5s ease-in-out", style({ opacity: 0 })),
+  ]),
+]);
+
+export const bounce = trigger("bounce", [
+  transition(":leave, * => 0", [
+    style({ opacity: 1 }),
+    animate(100, style({ opacity: 0 })),
+  ]),
+  transition(
+    ":increment, :decrement",
+    useAnimation(
+      animation(
+        animate(
+          "{{ timing }}s {{ delay }}s cubic-bezier(0.215, 0.610, 0.355, 1.000)",
+          keyframes([
+            style({ opacity: 0, transform: "scale3d(.3, .3, .3)", offset: 0 }),
+            style({ transform: "scale3d(1.1, 1.1, 1.1)", offset: 0.2 }),
+            style({ transform: "scale3d(.9, .9, .9)", offset: 0.4 }),
+            style({
+              opacity: 1,
+              transform: "scale3d(1.1, 1.1, 1.1)",
+              offset: 0.6,
+            }),
+            style({ transform: "scale3d(.95, .95, .95)", offset: 0.8 }),
+            style({ opacity: 1, transform: "scale3d(1, 1, 1)", offset: 1 }),
+          ]),
+        ),
+        { params: { timing: 0.5, delay: 0 } },
+      ),
+    ),
+  ),
+]);

packages/portail-usagers/src/app/shared/index.ts

@@ -1,2 +1,3 @@
 //@index('./*', f => `export * from '${f.path}'`)
+export * from "./animations";
 export * from "./MATOMO_INJECTORS.const";