Merge pull request 'ttp-14' (#28) from ttp-14 into main

Reviewed-on: #28
Reviewed-by: technostrea <contact@technostrea.fr>

.act.secrets.example

@@ -0,0 +1,2 @@
+ROBOT_TOKEN=fake_gitea_token
+ENV_URL=fake_env_url

.actrc

@@ -1,3 +1,5 @@
---container-architecture linux/amd64
--W .gitea/workflows
--P ubuntu-latest==ghcr.io/catthehacker/ubuntu:act-latest
+--container-architecture linux/arm64
+--workflows .gitea/workflows/
+--platform ubuntu-latest
+--secret-file .act.secrets
+--env-file .env

.env.example

@@ -0,0 +1 @@
+GITEA_SERVER_URL=https://fake-gitea-url.example.com

.gitea/workflows/trigger-deploy.yaml

@@ -0,0 +1,31 @@
+name: Trigger Deploy Repo
+run-name: Trigger deploy
+
+on:
+  push:
+    tags:
+      - '*' # Se déclenche sur n'importe quel tag
+
+jobs:
+  dispatch:
+    runs-on: ubuntu-latest
+
+    env:
+      # ------- À ADAPTER -------
+      CODE_REF: ${{ gitea.ref }}                            # branche/tag/sha à récupérer
+      GITEA_SERVER_URL: https://git.prod.k3s.technostrea.fr # URL du serveur Gitea
+      # --------------------------
+    steps:
+      - name: Dispatch Signal to ttp-deploy
+        run: |
+          # Récupération de la version sans le "refs/tags/"
+          VERSION=${{ env.CODE_REF }}
+
+          echo "Déclenchement du déploiement pour la version $VERSION sur l'instance  ${{ env.GITEA_SERVER_URL }}"
+
+          # Appel API Gitea.
+          # Notez la structure de l'URL : /api/v1/repos/{owner}/{repo}/dispatches
+          curl -X POST "${{ env.GITEA_SERVER_URL }}/api/v1/repos/technostrea/trouvetonprofile-deployment/dispatches" \
+            -H "Authorization: token ${{ secrets.ROBOT_TOKEN }}" \
+            -H "Content-Type: application/json" \
+            -d "{\"event_type\": \"build-release\", \"client_payload\": {\"version\": \"$VERSION\"}}"

.gitignore

@@ -127,3 +127,11 @@ logs/*.log
 
 pb/data/*
 src/environments/environment.development.ts
+
+*.iml
+.idea
+logs/
+*.log
+*.secrets
+.act.secrets
+.env

src/app/app.component.spec.ts

@@ -30,7 +30,7 @@ describe('AppComponent', () => {
       create: jest.fn(),
       list: jest.fn(),
       update: jest.fn(),
-      getByUserId: jest.fn(),
+      getById: jest.fn(),
     };
 
     await TestBed.configureTestingModule({

src/app/app.config.ts

@@ -2,6 +2,7 @@ import { ApplicationConfig } from '@angular/core';
 import {
   PreloadAllModules,
   provideRouter,
+  withComponentInputBinding,
   withInMemoryScrolling,
   withPreloading,
   withViewTransitions,
@@ -21,6 +22,8 @@ import { USER_REPOSITORY_TOKEN } from '@app/infrastructure/users/user-repository
 import { PbUserRepository } from '@app/infrastructure/users/pb-user.repository';
 import { AUTH_REPOSITORY_TOKEN } from '@app/infrastructure/authentification/auth-repository.token';
 import { PbAuthRepository } from '@app/infrastructure/authentification/pb-auth.repository';
+import { WEB_SHARE_SERVICE_TOKEN } from '@app/infrastructure/shareData/web-share.service.token';
+import { WebShareService } from '@app/infrastructure/shareData/web-share.service';
 
 export const appConfig: ApplicationConfig = {
   providers: [
@@ -31,7 +34,8 @@ export const appConfig: ApplicationConfig = {
       withInMemoryScrolling({
         scrollPositionRestoration: 'enabled',
         anchorScrolling: 'enabled',
-      })
+      }),
+      withComponentInputBinding()
     ),
     provideAnimations(),
     provideHttpClient(withFetch()),
@@ -40,6 +44,7 @@ export const appConfig: ApplicationConfig = {
     { provide: SECTOR_REPOSITORY_TOKEN, useExisting: PbSectorRepository },
     { provide: USER_REPOSITORY_TOKEN, useExisting: PbUserRepository },
     { provide: AUTH_REPOSITORY_TOKEN, useExisting: PbAuthRepository },
+    { provide: WEB_SHARE_SERVICE_TOKEN, useExisting: WebShareService },
     provideToastr({
       timeOut: 10000,
       positionClass: 'toast-top-right',

src/app/domain/profiles/profile.repository.ts

@@ -4,7 +4,7 @@ import { SearchFilters } from '@app/domain/search/search-filters';
 
 export interface ProfileRepository {
   list(params?: SearchFilters): Observable<ProfilePaginated>;
-  getByUserId(userId: string): Observable<Profile>;
+  getById(profileId: string): Observable<Profile>;
   create(profile: Profile): Observable<Profile>;
   update(profileId: string, profile: Partial<Profile>): Observable<Profile>;
 }

src/app/domain/shareData/share-data.repository.ts

@@ -0,0 +1,3 @@
+export abstract class ShareDataRepository {
+  abstract share(shareData: ShareData): void;
+}

src/app/domain/shareData/share-data.ts

@@ -0,0 +1,5 @@
+export interface ShareData {
+  title: string;
+  text: string;
+  url: string;
+}

src/app/infrastructure/profiles/pb-profile.repository.ts

@@ -29,9 +29,9 @@ export class PbProfileRepository implements ProfileRepository {
     );
   }
 
-  getByUserId(userId: string): Observable<Profile> {
+  getById(userId: string): Observable<Profile> {
     return from(
-      this.pb.collection('profiles').getFirstListItem<Profile>(`utilisateur="${userId}"`)
+      this.pb.collection('profiles').getOne<Profile>(`${userId}`, { expand: 'utilisateur' })
     );
   }
 

src/app/infrastructure/shareData/web-share.service.token.ts

@@ -0,0 +1,6 @@
+import { InjectionToken } from '@angular/core';
+import { ShareDataRepository } from '@app/domain/shareData/share-data.repository';
+
+export const WEB_SHARE_SERVICE_TOKEN = new InjectionToken<ShareDataRepository>(
+  'ShareDataRepository'
+);

src/app/infrastructure/shareData/web-share.service.ts

@@ -0,0 +1,36 @@
+import { inject, Injectable } from '@angular/core';
+import { DOCUMENT } from '@angular/common';
+import { ShareDataRepository } from '@app/domain/shareData/share-data.repository';
+import { ToastrService } from 'ngx-toastr';
+
+@Injectable({
+  providedIn: 'root',
+})
+export class WebShareService implements ShareDataRepository {
+  private document = inject(DOCUMENT);
+  private toastr = inject(ToastrService);
+
+  async share(shareData: ShareData) {
+    const navigator = this.document.defaultView?.navigator;
+
+    if (navigator && navigator.canShare && navigator.canShare(shareData)) {
+      try {
+        await navigator.share(shareData);
+        return;
+      } catch (error) {
+        return;
+      }
+    }
+    this.copyToClipboard(shareData.url!);
+  }
+
+  private copyToClipboard(text: string) {
+    navigator.clipboard.writeText(text).then(() => {
+      this.toastr.info(`Le lien du profil est copié dans le presse papier !`, `Partage de profil`, {
+        closeButton: true,
+        progressAnimation: 'decreasing',
+        progressBar: true,
+      });
+    });
+  }
+}

src/app/routes/home/home.component.spec.ts

@@ -4,38 +4,25 @@ import { HomeComponent } from './home.component';
 import { provideRouter } from '@angular/router';
 import { ProfileRepository } from '@app/domain/profiles/profile.repository';
 import { SectorRepository } from '@app/domain/sectors/sector.repository';
-import { of } from 'rxjs';
-import { Profile } from '@app/domain/profiles/profile.model';
 import { PROFILE_REPOSITORY_TOKEN } from '@app/infrastructure/profiles/profile-repository.token';
 import { SECTOR_REPOSITORY_TOKEN } from '@app/infrastructure/sectors/sector-repository.token';
-import { Sector } from '@app/domain/sectors/sector.model';
+import { mockSectorRepo } from '@app/testing/sector.mock';
+import { mockProfileRepo } from '@app/testing/profile.mock';
 
 describe('HomeComponent', () => {
   let component: HomeComponent;
   let fixture: ComponentFixture<HomeComponent>;
 
-  let mockProfileRepo: jest.Mocked<Partial<ProfileRepository>>;
-  let mockSectorRepo: jest.Mocked<Partial<SectorRepository>>;
+  let mockProfileRepository: jest.Mocked<Partial<ProfileRepository>> = mockProfileRepo;
+  let mockSectorRepository: jest.Mocked<Partial<SectorRepository>> = mockSectorRepo;
 
   beforeEach(async () => {
-    mockProfileRepo = {
-      create: jest.fn().mockReturnValue(of({} as Profile)),
-      list: jest.fn().mockReturnValue(of([])),
-      getByUserId: jest.fn().mockReturnValue(of({} as Profile)),
-      update: jest.fn().mockReturnValue(of({} as Profile)),
-    };
-
-    mockSectorRepo = {
-      list: jest.fn().mockReturnValue(of([])),
-      getOne: jest.fn().mockReturnValue(of({} as Sector)),
-    };
-
     await TestBed.configureTestingModule({
       imports: [HomeComponent],
       providers: [
         provideRouter([]),
-        { provide: PROFILE_REPOSITORY_TOKEN, useValue: mockProfileRepo },
-        { provide: SECTOR_REPOSITORY_TOKEN, useValue: mockSectorRepo },
+        { provide: PROFILE_REPOSITORY_TOKEN, useValue: mockProfileRepository },
+        { provide: SECTOR_REPOSITORY_TOKEN, useValue: mockSectorRepository },
       ],
     }).compileComponents();
 

src/app/routes/my-profile/my-profile.component.spec.ts

@@ -4,62 +4,33 @@ import { MyProfileComponent } from './my-profile.component';
 import { provideRouter } from '@angular/router';
 import { ProfileRepository } from '@app/domain/profiles/profile.repository';
 import { PROFILE_REPOSITORY_TOKEN } from '@app/infrastructure/profiles/profile-repository.token';
-import { of } from 'rxjs';
-import { Profile } from '@app/domain/profiles/profile.model';
 import { ToastrService } from 'ngx-toastr';
 import { USER_REPOSITORY_TOKEN } from '@app/infrastructure/users/user-repository.token';
 import { UserRepository } from '@app/domain/users/user.repository';
 import { AuthRepository } from '@app/domain/authentification/auth.repository';
 import { AUTH_REPOSITORY_TOKEN } from '@app/infrastructure/authentification/auth-repository.token';
+import { mockProfileRepo } from '@app/testing/profile.mock';
+import { mockToastR } from '@app/testing/toastr.mock';
+import { mockUserRepo } from '@app/testing/user.mock';
+import { mockAuthRepo } from '@app/testing/auth.mock';
 
 describe('MyProfileComponent', () => {
   let component: MyProfileComponent;
   let fixture: ComponentFixture<MyProfileComponent>;
 
-  let mockProfileRepo: ProfileRepository;
-  let mockToastrService: Partial<ToastrService>;
-  let mockUserRepo: Partial<UserRepository>;
-  let mockAuthRepository: jest.Mocked<Partial<AuthRepository>>;
+  let mockProfileRepository: jest.Mocked<Partial<ProfileRepository>> = mockProfileRepo;
+  let mockToastrService: jest.Mocked<Partial<ToastrService>> = mockToastR;
+  let mockUserRepository: jest.Mocked<Partial<UserRepository>> = mockUserRepo;
+  let mockAuthRepository: jest.Mocked<Partial<AuthRepository>> = mockAuthRepo;
 
   beforeEach(async () => {
-    mockProfileRepo = {
-      create: jest.fn(),
-      list: jest.fn(),
-      update: jest.fn(),
-      getByUserId: jest.fn().mockReturnValue(of({} as Profile)),
-    };
-
-    mockUserRepo = {
-      update: jest.fn(),
-      getUserById: jest.fn(),
-    };
-
-    mockToastrService = {
-      warning: jest.fn(),
-      success: jest.fn(),
-      info: jest.fn(),
-      error: jest.fn(),
-    };
-
-    mockAuthRepository = {
-      get: jest.fn(),
-      login: jest.fn(),
-      sendVerificationEmail: jest.fn(),
-      logout: jest.fn(),
-      isAuthenticated: jest.fn(),
-      isEmailVerified: jest.fn(),
-      register: jest.fn(),
-      sendRequestPasswordReset: jest.fn(),
-      confirmPasswordReset: jest.fn(),
-    };
-
     await TestBed.configureTestingModule({
       imports: [MyProfileComponent],
       providers: [
         provideRouter([]),
-        { provide: PROFILE_REPOSITORY_TOKEN, useValue: mockProfileRepo },
+        { provide: PROFILE_REPOSITORY_TOKEN, useValue: mockProfileRepository },
         { provide: AUTH_REPOSITORY_TOKEN, useValue: mockAuthRepository },
-        { provide: USER_REPOSITORY_TOKEN, useValue: mockUserRepo },
+        { provide: USER_REPOSITORY_TOKEN, useValue: mockUserRepository },
         { provide: ToastrService, useValue: mockToastrService },
       ],
     }).compileComponents();

src/app/routes/profile/profile-detail/profile-detail.component.html

@@ -9,11 +9,13 @@
           <!-- Overlay gradient -->
           <div class="absolute inset-0 bg-gradient-to-b from-transparent to-black/30"></div>
 
-          <!-- Bouton retour -->
+          <!-- Boutons en haut -->
           <div class="relative z-10 p-4 flex justify-between items-start">
+            <!-- Bouton retour -->
             <a
               [routerLink]="['/profiles']"
               class="group flex items-center justify-center w-10 h-10 md:w-12 md:h-12 bg-white/20 backdrop-blur-md rounded-full hover:bg-white/30 transition-all duration-300 hover:scale-110"
+              aria-label="Retour à la liste des profils"
             >
               <svg
                 xmlns="http://www.w3.org/2000/svg"
@@ -30,27 +32,53 @@
               </svg>
             </a>
 
-            <!-- Badge vérifié -->
-            @if (profile().estVerifier) {
-              <div
-                class="flex items-center gap-2 bg-purple-500/20 backdrop-blur-md px-3 py-2 rounded-full animate-pulse-slow"
+            <!-- Conteneur pour badge vérifié et bouton partage -->
+            <div class="flex items-center gap-2">
+              <!-- Badge vérifié -->
+              @if (profile()!.estVerifier) {
+                <div
+                  class="flex items-center gap-2 bg-purple-500/20 backdrop-blur-md px-3 py-2 rounded-full animate-pulse-slow"
+                  data-testid="verified-badge"
+                >
+                  <svg
+                    xmlns="http://www.w3.org/2000/svg"
+                    viewBox="0 0 24 24"
+                    fill="currentColor"
+                    class="w-5 h-5 md:w-6 md:h-6 text-purple-300"
+                  >
+                    <title>Profil vérifié</title>
+                    <path
+                      fill-rule="evenodd"
+                      d="M8.603 3.799A4.49 4.49 0 0 1 12 2.25c1.357 0 2.573.6 3.397 1.549a4.49 4.49 0 0 1 3.498 1.307 4.491 4.491 0 0 1 1.307 3.497A4.49 4.49 0 0 1 21.75 12a4.49 4.49 0 0 1-1.549 3.397 4.491 4.491 0 0 1-1.307 3.497 4.491 4.491 0 0 1-3.497 1.307A4.49 4.49 0 0 1 12 21.75a4.49 4.49 0 0 1-3.397-1.549 4.49 4.49 0 0 1-3.498-1.306 4.491 4.491 0 0 1-1.307-3.498A4.49 4.49 0 0 1 2.25 12c0-1.357.6-2.573 1.549-3.397a4.49 4.49 0 0 1 1.307-3.497 4.49 4.49 0 0 1 3.497-1.307Zm7.007 6.387a.75.75 0 1 0-1.22-.872l-3.236 4.53L9.53 12.22a.75.75 0 0 0-1.06 1.06l2.25 2.25a.75.75 0 0 0 1.14-.094l3.75-5.25Z"
+                      clip-rule="evenodd"
+                    />
+                  </svg>
+                  <span class="text-white text-sm font-medium hidden md:inline">Vérifié</span>
+                </div>
+              }
+
+              <!-- Bouton partage -->
+              <button
+                (click)="onShare()"
+                class="group flex items-center justify-center w-10 h-10 md:w-12 md:h-12 bg-indigo-500/20 backdrop-blur-md rounded-full hover:bg-indigo-500/30 transition-all duration-300 hover:scale-110"
+                aria-label="Partager ce profil"
+                data-testid="share-button"
               >
                 <svg
                   xmlns="http://www.w3.org/2000/svg"
                   viewBox="0 0 24 24"
                   fill="currentColor"
-                  class="w-5 h-5 md:w-6 md:h-6 text-purple-300"
+                  class="w-5 h-5 md:w-6 md:h-6 text-white"
                 >
-                  <title>Profil vérifié</title>
+                  <title>Partager</title>
                   <path
                     fill-rule="evenodd"
-                    d="M8.603 3.799A4.49 4.49 0 0 1 12 2.25c1.357 0 2.573.6 3.397 1.549a4.49 4.49 0 0 1 3.498 1.307 4.491 4.491 0 0 1 1.307 3.497A4.49 4.49 0 0 1 21.75 12a4.49 4.49 0 0 1-1.549 3.397 4.491 4.491 0 0 1-1.307 3.497 4.491 4.491 0 0 1-3.497 1.307A4.49 4.49 0 0 1 12 21.75a4.49 4.49 0 0 1-3.397-1.549 4.49 4.49 0 0 1-3.498-1.306 4.491 4.491 0 0 1-1.307-3.498A4.49 4.49 0 0 1 2.25 12c0-1.357.6-2.573 1.549-3.397a4.49 4.49 0 0 1 1.307-3.497 4.49 4.49 0 0 1 3.497-1.307Zm7.007 6.387a.75.75 0 1 0-1.22-.872l-3.236 4.53L9.53 12.22a.75.75 0 0 0-1.06 1.06l2.25 2.25a.75.75 0 0 0 1.14-.094l3.75-5.25Z"
+                    d="M15.75 4.5a3 3 0 11.825 2.066l-8.421 4.679a3.002 3.002 0 010 1.51l8.421 4.679a3 3 0 11-.729 1.31l-8.421-4.678a3 3 0 110-4.132l8.421-4.679a3 3 0 01-.096-.755z"
                     clip-rule="evenodd"
                   />
                 </svg>
-                <span class="text-white text-sm font-medium hidden md:inline">Vérifié</span>
-              </div>
-            }
+              </button>
+            </div>
           </div>
         </div>
 
@@ -103,7 +131,7 @@
               }
 
               <p class="text-lg md:text-xl text-indigo-600 dark:text-indigo-400 font-semibold">
-                {{ profile().profession | uppercase }}
+                {{ profile()!.profession | uppercase }}
               </p>
             </div>
           </div>
@@ -135,9 +163,9 @@
               </svg>
               Biographie
             </h3>
-            @if (profile().bio) {
+            @if (profile()!.bio) {
               <p class="text-gray-600 dark:text-gray-300 text-sm leading-relaxed">
-                {{ profile().bio }}
+                {{ profile()!.bio }}
               </p>
             } @else {
               <p class="text-gray-600 dark:text-gray-300 text-sm leading-relaxed">
@@ -149,7 +177,7 @@
           </div>
 
           <!-- Card Secteur -->
-          @if (profile().secteur) {
+          @if (profile()!.secteur) {
             <div
               class="bg-white dark:bg-gray-800 rounded-xl shadow-lg p-6 hover:shadow-xl transition-shadow duration-300"
             >
@@ -168,12 +196,12 @@
                 </svg>
                 Secteur
               </h3>
-              <app-chips [sectorId]="profile().secteur" />
+              <app-chips [sectorId]="profile()!.secteur" />
             </div>
           }
 
           <!-- Card Réseaux -->
-          @if (profile().reseaux) {
+          @if (profile()!.reseaux) {
             <div
               class="bg-white dark:bg-gray-800 rounded-xl shadow-lg p-6 hover:shadow-xl transition-shadow duration-300"
             >
@@ -195,7 +223,7 @@
                 </svg>
                 Réseaux
               </h3>
-              <app-reseaux [reseaux]="profile().reseaux" />
+              <app-reseaux [reseaux]="profile()!.reseaux" />
             </div>
           }
         </div>
@@ -203,7 +231,7 @@
         <!-- Colonne droite - À propos et Projets -->
         <div class="lg:col-span-2 space-y-6 animate-slide-up animation-delay-300">
           <!-- Card À propos -->
-          @if (profile().apropos) {
+          @if (profile()!.apropos) {
             <div
               class="bg-white dark:bg-gray-800 rounded-xl shadow-lg p-6 md:p-8 hover:shadow-xl transition-shadow duration-300"
             >
@@ -225,7 +253,7 @@
                 À propos
               </h2>
               <p class="text-gray-700 dark:text-gray-300 leading-relaxed text-base">
-                {{ profile().apropos }}
+                {{ profile()!.apropos }}
               </p>
             </div>
           }

src/app/routes/profile/profile-detail/profile-detail.component.spec.ts

@@ -4,37 +4,39 @@ import { ProfileDetailComponent } from './profile-detail.component';
 import { provideRouter } from '@angular/router';
 import { PROJECT_REPOSITORY_TOKEN } from '@app/infrastructure/projects/project-repository.token';
 import { ProjectRepository } from '@app/domain/projects/project.repository';
-import { of } from 'rxjs';
-import { Project } from '@app/domain/projects/project.model';
-import { Sector } from '@app/domain/sectors/sector.model';
 import { SectorRepository } from '@app/domain/sectors/sector.repository';
 import { SECTOR_REPOSITORY_TOKEN } from '@app/infrastructure/sectors/sector-repository.token';
+import { ToastrService } from 'ngx-toastr';
+import { PROFILE_REPOSITORY_TOKEN } from '@app/infrastructure/profiles/profile-repository.token';
+import { ProfileRepository } from '@app/domain/profiles/profile.repository';
+import { USER_REPOSITORY_TOKEN } from '@app/infrastructure/users/user-repository.token';
+import { UserRepository } from '@app/domain/users/user.repository';
+import { mockProfileRepo } from '@app/testing/profile.mock';
+import { mockSectorRepo } from '@app/testing/sector.mock';
+import { mockToastR } from '@app/testing/toastr.mock';
+import { mockUserRepo } from '@app/testing/user.mock';
+import { mockProjectRepo } from '@app/testing/project.mock';
 
 describe('ProfileDetailComponent', () => {
   let component: ProfileDetailComponent;
   let fixture: ComponentFixture<ProfileDetailComponent>;
-  let mockProjectRepository: jest.Mocked<ProjectRepository>;
-  let mockSectorRepo: SectorRepository;
+
+  let mockProjectRepository: jest.Mocked<Partial<ProjectRepository>> = mockProjectRepo;
+  let mockProfileRepository: jest.Mocked<Partial<ProfileRepository>> = mockProfileRepo;
+  let mockSectorRepository: jest.Mocked<Partial<SectorRepository>> = mockSectorRepo;
+  let mockToastr: jest.Mocked<Partial<ToastrService>> = mockToastR;
+  let mockUserRepository: jest.Mocked<Partial<UserRepository>> = mockUserRepo;
 
   beforeEach(async () => {
-    mockProjectRepository = {
-      create: jest.fn().mockReturnValue(of({} as Project)),
-      list: jest.fn().mockReturnValue(of([])),
-      get: jest.fn().mockReturnValue(of({} as Project)),
-      update: jest.fn().mockReturnValue(of({} as Project)),
-    };
-
-    mockSectorRepo = {
-      list: jest.fn(),
-      getOne: jest.fn().mockReturnValue(of({} as Sector)),
-    };
-
     await TestBed.configureTestingModule({
       imports: [ProfileDetailComponent],
       providers: [
         provideRouter([]),
         { provide: PROJECT_REPOSITORY_TOKEN, useValue: mockProjectRepository },
-        { provide: SECTOR_REPOSITORY_TOKEN, useValue: mockSectorRepo },
+        { provide: PROFILE_REPOSITORY_TOKEN, useValue: mockProfileRepository },
+        { provide: SECTOR_REPOSITORY_TOKEN, useValue: mockSectorRepository },
+        { provide: USER_REPOSITORY_TOKEN, useValue: mockUserRepository },
+        { provide: ToastrService, useValue: mockToastr },
       ],
     }).compileComponents();
 

src/app/routes/profile/profile-detail/profile-detail.component.ts

@@ -1,4 +1,4 @@
-import { Component, computed, inject } from '@angular/core';
+import { Component, computed, effect, inject, OnInit } from '@angular/core';
 import { ActivatedRoute, RouterLink } from '@angular/router';
 import { UpperCasePipe } from '@angular/common';
 import { User } from '@app/domain/users/user.model';
@@ -7,29 +7,86 @@ import { ReseauxComponent } from '@app/shared/components/reseaux/reseaux.compone
 import { UntilDestroy } from '@ngneat/until-destroy';
 import { ProjectListComponent } from '@app/shared/components/project-list/project-list.component';
 import { environment } from '@env/environment';
-import { Profile } from '@app/domain/profiles/profile.model';
+import { WebShareService } from '@app/infrastructure/shareData/web-share.service';
+import { ProfileFacade } from '@app/ui/profiles/profile.facade';
+import { ProfileViewModel } from '@app/ui/profiles/profile.presenter.model';
+import { ActionType } from '@app/domain/action-type.util';
+import { UserFacade } from '@app/ui/users/user.facade';
 
 @Component({
   selector: 'app-profile-detail',
   standalone: true,
   imports: [ChipsComponent, ReseauxComponent, RouterLink, UpperCasePipe, ProjectListComponent],
+  providers: [UserFacade],
   templateUrl: './profile-detail.component.html',
   styleUrl: './profile-detail.component.scss',
 })
 @UntilDestroy()
-export class ProfileDetailComponent {
+export class ProfileDetailComponent implements OnInit {
+  private readonly webShare = inject(WebShareService);
+  private readonly profileFacade = inject(ProfileFacade);
+  private readonly userFacade = inject(UserFacade);
   protected readonly environment = environment;
+  protected readonly ActionType = ActionType;
   private readonly route = inject(ActivatedRoute);
 
-  protected extraData: { user: User; profile: Profile } = this.route.snapshot.data['profile'];
+  protected extraData: { user: User; profile: ProfileViewModel } | undefined =
+    this.route.snapshot.data['profile'];
 
-  protected user = computed(() => {
-    if (this.extraData != undefined) return this.extraData.user;
-    return {} as User;
-  });
+  slug = computed(() => this.route.snapshot.params['name'] ?? '');
 
-  protected profile = computed(() => {
-    if (this.extraData != undefined) return this.extraData.profile;
-    return {} as Profile;
-  });
+  protected user = this.userFacade.user;
+  protected readonly userLoading = this.userFacade.loading;
+  protected readonly userError = this.userFacade.error;
+
+  protected profile = this.profileFacade.profile;
+  protected readonly profileLoading = this.profileFacade.loading;
+  protected readonly profileError = this.profileFacade.error;
+
+  constructor() {
+    effect(() => {
+      if (!this.profileLoading().isLoading) {
+        switch (this.profileLoading().action) {
+          case ActionType.READ:
+            if (!this.profileError().hasError) {
+              this.profile = this.profileFacade.profile;
+            }
+            break;
+        }
+      }
+      if (!this.userLoading().isLoading) {
+        switch (this.userLoading().action) {
+          case ActionType.READ:
+            if (!this.userError().hasError) {
+              this.user = this.userFacade.user;
+            }
+            break;
+        }
+      }
+    });
+  }
+
+  ngOnInit() {
+    if (this.extraData === undefined) {
+      const extractSlug = this.slug().split('-');
+      const profileId = extractSlug[extractSlug.length - 1];
+      const userId = extractSlug[extractSlug.length - 2];
+      this.profileFacade.loadOne(profileId);
+      this.userFacade.loadOne(userId);
+    } else {
+      this.profile.set(this.extraData.profile);
+      this.user.set(this.extraData.user);
+    }
+  }
+
+  async onShare() {
+    if (!this.profile) return;
+    const fullUrl = `${window.location.origin}/profiles/${this.slug()}`;
+
+    await this.webShare.share({
+      title: `Découvrez le profil de ${this.profile.name}`,
+      text: `Jette un œil à ce profil intéressant sur notre application !`,
+      url: fullUrl,
+    });
+  }
 }

src/app/routes/profile/profile-list/profile-list.component.spec.ts

@@ -2,33 +2,20 @@ import { ComponentFixture, TestBed } from '@angular/core/testing';
 
 import { ProfileListComponent } from './profile-list.component';
 import { provideRouter } from '@angular/router';
-import { of } from 'rxjs';
 import { ProfileRepository } from '@app/domain/profiles/profile.repository';
 import { PROFILE_REPOSITORY_TOKEN } from '@app/infrastructure/profiles/profile-repository.token';
-import { Profile } from '@app/domain/profiles/profile.model';
 import { SECTOR_REPOSITORY_TOKEN } from '@app/infrastructure/sectors/sector-repository.token';
 import { SectorRepository } from '@app/domain/sectors/sector.repository';
-import { Sector } from '@app/domain/sectors/sector.model';
+import { mockProfileRepo } from '@app/testing/profile.mock';
+import { mockSectorRepo } from '@app/testing/sector.mock';
 
 describe('ProfileListComponent', () => {
   let component: ProfileListComponent;
   let fixture: ComponentFixture<ProfileListComponent>;
-  let mockProfileRepository: jest.Mocked<Partial<ProfileRepository>>;
-  let mockSectorRepository: jest.Mocked<Partial<SectorRepository>>;
+  let mockProfileRepository: jest.Mocked<Partial<ProfileRepository>> = mockProfileRepo;
+  let mockSectorRepository: jest.Mocked<Partial<SectorRepository>> = mockSectorRepo;
 
   beforeEach(async () => {
-    mockProfileRepository = {
-      create: jest.fn().mockReturnValue(of({} as Profile)),
-      list: jest.fn().mockReturnValue(of([])),
-      getByUserId: jest.fn().mockReturnValue(of({} as Profile)),
-      update: jest.fn().mockReturnValue(of({} as Profile)),
-    };
-
-    mockSectorRepository = {
-      list: jest.fn().mockReturnValue(of([])),
-      getOne: jest.fn().mockReturnValue(of({} as Sector)),
-    };
-
     await TestBed.configureTestingModule({
       imports: [ProfileListComponent],
       providers: [

src/app/shared/components/chips/chips.component.spec.ts

@@ -3,27 +3,21 @@ import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { ChipsComponent } from './chips.component';
 import { provideRouter } from '@angular/router';
 import { SECTOR_REPOSITORY_TOKEN } from '@app/infrastructure/sectors/sector-repository.token';
-import { of } from 'rxjs';
-import { Sector } from '@app/domain/sectors/sector.model';
 import { SectorRepository } from '@app/domain/sectors/sector.repository';
+import { mockSectorRepo } from '@app/testing/sector.mock';
 
 describe('ChipsComponent', () => {
   let component: ChipsComponent;
   let fixture: ComponentFixture<ChipsComponent>;
 
-  let mockSectorRepo: SectorRepository;
+  let mockSectorRepository: jest.Mocked<Partial<SectorRepository>> = mockSectorRepo;
 
   beforeEach(async () => {
-    mockSectorRepo = {
-      list: jest.fn(),
-      getOne: jest.fn().mockReturnValue(of({} as Sector)),
-    };
-
     await TestBed.configureTestingModule({
       imports: [ChipsComponent],
       providers: [
         provideRouter([]),
-        { provide: SECTOR_REPOSITORY_TOKEN, useValue: mockSectorRepo },
+        { provide: SECTOR_REPOSITORY_TOKEN, useValue: mockSectorRepository },
       ],
     }).compileComponents();
 

src/app/shared/components/my-profile-project-item/my-profile-project-item.component.spec.ts

@@ -6,21 +6,15 @@ import { Project } from '@app/domain/projects/project.model';
 import { ProjectRepository } from '@app/domain/projects/project.repository';
 import { provideRouter } from '@angular/router';
 import { PROJECT_REPOSITORY_TOKEN } from '@app/infrastructure/projects/project-repository.token';
+import { mockProjectRepo } from '@app/testing/project.mock';
 
 describe('MyProfileProjectItemComponent', () => {
   let component: MyProfileProjectItemComponent;
   let fixture: ComponentFixture<MyProfileProjectItemComponent>;
 
-  let mockProjectRepository: jest.Mocked<ProjectRepository>;
+  let mockProjectRepository: jest.Mocked<Partial<ProjectRepository>> = mockProjectRepo;
 
   beforeEach(async () => {
-    mockProjectRepository = {
-      create: jest.fn().mockReturnValue(of({} as Project)),
-      list: jest.fn().mockReturnValue(of([])),
-      get: jest.fn().mockReturnValue(of({} as Project)),
-      update: jest.fn().mockReturnValue(of({} as Project)),
-    };
-
     await TestBed.configureTestingModule({
       imports: [MyProfileProjectItemComponent],
       providers: [

src/app/shared/components/my-profile-project-list/my-profile-project-list.component.spec.ts

@@ -2,24 +2,16 @@ import { ComponentFixture, TestBed } from '@angular/core/testing';
 
 import { MyProfileProjectListComponent } from './my-profile-project-list.component';
 import { ProjectRepository } from '@app/domain/projects/project.repository';
-import { of } from 'rxjs';
 import { provideRouter } from '@angular/router';
 import { PROJECT_REPOSITORY_TOKEN } from '@app/infrastructure/projects/project-repository.token';
-import { Project } from '@app/domain/projects/project.model';
+import { mockProfileRepo } from '@app/testing/profile.mock';
 
 describe('MyProfileProjectListComponent', () => {
   let component: MyProfileProjectListComponent;
   let fixture: ComponentFixture<MyProfileProjectListComponent>;
-  let mockProjectRepository: jest.Mocked<ProjectRepository>;
+  let mockProjectRepository: jest.Mocked<Partial<ProjectRepository>> = mockProfileRepo;
 
   beforeEach(async () => {
-    mockProjectRepository = {
-      create: jest.fn().mockReturnValue(of({} as Project)),
-      list: jest.fn().mockReturnValue(of([])),
-      get: jest.fn().mockReturnValue(of({} as Project)),
-      update: jest.fn().mockReturnValue(of({} as Project)),
-    };
-
     await TestBed.configureTestingModule({
       imports: [MyProfileProjectListComponent],
       providers: [

src/app/shared/components/my-profile-update-cv-form/my-profile-update-cv-form.component.spec.ts

@@ -3,37 +3,24 @@ import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { MyProfileUpdateCvFormComponent } from './my-profile-update-cv-form.component';
 import { ToastrService } from 'ngx-toastr';
 import { provideRouter } from '@angular/router';
-import { ProfileRepository } from '@app/domain/profiles/profile.repository';
-import { of } from 'rxjs';
-import { Profile } from '@app/domain/profiles/profile.model';
 import { PROFILE_REPOSITORY_TOKEN } from '@app/infrastructure/profiles/profile-repository.token';
+import { ProjectRepository } from '@app/domain/projects/project.repository';
+import { mockProfileRepo } from '@app/testing/profile.mock';
+import { mockToastR } from '@app/testing/toastr.mock';
 
 describe('MyProfileUpdateCvFormComponent', () => {
   let component: MyProfileUpdateCvFormComponent;
   let fixture: ComponentFixture<MyProfileUpdateCvFormComponent>;
 
-  let mockToastrService: Partial<ToastrService>;
-  let mockProfileRepo: ProfileRepository;
+  let mockToastrService: jest.Mocked<Partial<ToastrService>> = mockToastR;
+  let mockProjectRepository: jest.Mocked<Partial<ProjectRepository>> = mockProfileRepo;
 
   beforeEach(async () => {
-    mockToastrService = {
-      success: jest.fn(),
-      error: jest.fn(),
-      warning: jest.fn(),
-    };
-
-    mockProfileRepo = {
-      create: jest.fn(),
-      list: jest.fn(),
-      update: jest.fn().mockReturnValue(of({} as Profile)),
-      getByUserId: jest.fn().mockReturnValue(of({} as Profile)),
-    };
-
     await TestBed.configureTestingModule({
       imports: [MyProfileUpdateCvFormComponent],
       providers: [
         provideRouter([]),
-        { provide: PROFILE_REPOSITORY_TOKEN, useValue: mockProfileRepo },
+        { provide: PROFILE_REPOSITORY_TOKEN, useValue: mockProjectRepository },
         { provide: ToastrService, useValue: mockToastrService },
       ],
     }).compileComponents();

src/app/shared/components/my-profile-update-form/my-profile-update-form.component.spec.ts

@@ -11,14 +11,18 @@ import { Profile } from '@app/domain/profiles/profile.model';
 import { SectorRepository } from '@app/domain/sectors/sector.repository';
 import { Sector } from '@app/domain/sectors/sector.model';
 import { SECTOR_REPOSITORY_TOKEN } from '@app/infrastructure/sectors/sector-repository.token';
+import { mockToastR } from '@app/testing/toastr.mock';
+import { ProjectRepository } from '@app/domain/projects/project.repository';
+import { mockProfileRepo } from '@app/testing/profile.mock';
+import { mockSectorRepo } from '@app/testing/sector.mock';
 
 describe('MyProfileUpdateFormComponent', () => {
   let component: MyProfileUpdateFormComponent;
   let fixture: ComponentFixture<MyProfileUpdateFormComponent>;
 
-  let mockToastrService: Partial<ToastrService>;
-  let mockProfileRepo: ProfileRepository;
-  let mockSectorRepo: SectorRepository;
+  let mockToastrService: jest.Mocked<Partial<ToastrService>> = mockToastR;
+  let mockProfileRepository: jest.Mocked<Partial<ProfileRepository>> = mockProfileRepo;
+  let mockSectorRepository: jest.Mocked<Partial<SectorRepository>> = mockSectorRepo;
 
   const mockProfileData = {
     profession: '',
@@ -29,32 +33,14 @@ describe('MyProfileUpdateFormComponent', () => {
   };
 
   beforeEach(async () => {
-    mockToastrService = {
-      warning: jest.fn(),
-      success: jest.fn(),
-      error: jest.fn(),
-    };
-
-    mockProfileRepo = {
-      create: jest.fn(),
-      list: jest.fn(),
-      update: jest.fn().mockReturnValue(of({} as Profile)),
-      getByUserId: jest.fn().mockReturnValue(of({} as Profile)),
-    };
-
-    mockSectorRepo = {
-      list: jest.fn().mockReturnValue(of([])),
-      getOne: jest.fn().mockReturnValue(of({} as Sector)),
-    };
-
     await TestBed.configureTestingModule({
       imports: [MyProfileUpdateFormComponent],
       providers: [
         FormBuilder,
         provideRouter([]),
         { provide: ToastrService, useValue: mockToastrService },
-        { provide: PROFILE_REPOSITORY_TOKEN, useValue: mockProfileRepo },
-        { provide: SECTOR_REPOSITORY_TOKEN, useValue: mockSectorRepo },
+        { provide: PROFILE_REPOSITORY_TOKEN, useValue: mockProfileRepository },
+        { provide: SECTOR_REPOSITORY_TOKEN, useValue: mockSectorRepository },
       ],
     }).compileComponents();
 

src/app/shared/components/my-profile-update-project-form/my-profile-update-project-form.component.spec.ts

@@ -11,49 +11,22 @@ import { AUTH_REPOSITORY_TOKEN } from '@app/infrastructure/authentification/auth
 import { PROFILE_REPOSITORY_TOKEN } from '@app/infrastructure/profiles/profile-repository.token';
 import { AuthRepository } from '@app/domain/authentification/auth.repository';
 import { ProfileRepository } from '@app/domain/profiles/profile.repository';
+import { mockAuthRepo } from '@app/testing/auth.mock';
+import { mockProfileRepo } from '@app/testing/profile.mock';
+import { mockProjectRepo } from '@app/testing/project.mock';
+import { mockToastR } from '@app/testing/toastr.mock';
 
 describe('MyProfileUpdateProjectFormComponent', () => {
   let component: MyProfileUpdateProjectFormComponent;
   let fixture: ComponentFixture<MyProfileUpdateProjectFormComponent>;
 
-  let mockToastrService: jest.Mocked<Partial<ToastrService>>;
-  let mockProjectRepository: jest.Mocked<Partial<ProjectRepository>>;
+  let mockToastrService: jest.Mocked<Partial<ToastrService>> = mockToastR;
+  let mockProjectRepository: jest.Mocked<Partial<ProjectRepository>> = mockProjectRepo;
 
-  let mockAuthRepository: jest.Mocked<Partial<AuthRepository>>;
-  let mockProfileRepo: jest.Mocked<Partial<ProfileRepository>>;
+  let mockAuthRepository: jest.Mocked<Partial<AuthRepository>> = mockAuthRepo;
+  let mockProfileRepository: jest.Mocked<Partial<ProfileRepository>> = mockProfileRepo;
 
   beforeEach(async () => {
-    mockToastrService = {
-      success: jest.fn(),
-      error: jest.fn(),
-      warning: jest.fn(),
-    };
-
-    mockProjectRepository = {
-      create: jest.fn().mockReturnValue(of({} as Project)),
-      list: jest.fn().mockReturnValue(of([])),
-      get: jest.fn().mockReturnValue(of({} as Project)),
-      update: jest.fn().mockReturnValue(of({} as Project)),
-    };
-    mockAuthRepository = {
-      get: jest.fn(),
-      login: jest.fn(),
-      sendVerificationEmail: jest.fn(),
-      logout: jest.fn(),
-      isAuthenticated: jest.fn(),
-      isEmailVerified: jest.fn(),
-      register: jest.fn(),
-      sendRequestPasswordReset: jest.fn(),
-      confirmPasswordReset: jest.fn(),
-    };
-
-    mockProfileRepo = {
-      create: jest.fn(),
-      list: jest.fn(),
-      update: jest.fn(),
-      getByUserId: jest.fn(),
-    };
-
     await TestBed.configureTestingModule({
       imports: [MyProfileUpdateProjectFormComponent],
       providers: [
@@ -61,7 +34,7 @@ describe('MyProfileUpdateProjectFormComponent', () => {
         { provide: ToastrService, useValue: mockToastrService },
         { provide: PROJECT_REPOSITORY_TOKEN, useValue: mockProjectRepository },
         { provide: AUTH_REPOSITORY_TOKEN, useValue: mockAuthRepository },
-        { provide: PROFILE_REPOSITORY_TOKEN, useValue: mockProfileRepo },
+        { provide: PROFILE_REPOSITORY_TOKEN, useValue: mockProfileRepository },
       ],
     }).compileComponents();
 

src/app/shared/components/nav-bar/nav-bar.component.html

@@ -7,12 +7,12 @@
       <a
         [routerLink]="['/']"
         class="flex items-center space-x-2 group"
-        aria-label="Accueil TrouveTonProfile"
+        aria-label="Accueil TrouveTonProfil"
       >
         <span
           class="text-lg sm:text-xl font-semibold text-gray-900 dark:text-white group-hover:text-indigo-600 dark:group-hover:text-indigo-400 transition-colors"
         >
-          TrouveTonProfile
+          TrouveTonProfil
         </span>
       </a>
 

src/app/shared/components/nav-bar/nav-bar.component.spec.ts

@@ -3,21 +3,22 @@ import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { NavBarComponent } from './nav-bar.component';
 import { ThemeService } from '@app/core/services/theme/theme.service';
 import { provideRouter } from '@angular/router';
-import { signal } from '@angular/core';
-import { AuthModel } from '@app/domain/authentification/auth.model';
 import { User } from '@app/domain/users/user.model';
 import { AUTH_REPOSITORY_TOKEN } from '@app/infrastructure/authentification/auth-repository.token';
 import { AuthRepository } from '@app/domain/authentification/auth.repository';
 import { PROFILE_REPOSITORY_TOKEN } from '@app/infrastructure/profiles/profile-repository.token';
 import { ProfileRepository } from '@app/domain/profiles/profile.repository';
+import { mockProfileRepo } from '@app/testing/profile.mock';
+import { mockAuthRepo } from '@app/testing/auth.mock';
+import { mockThemeService } from '@app/testing/theme.mock';
 
 describe('NavBarComponent', () => {
   let component: NavBarComponent;
   let fixture: ComponentFixture<NavBarComponent>;
-  let mockThemeService: jest.Mocked<Partial<ThemeService>>;
+  let mockTheme: jest.Mocked<Partial<ThemeService>> = mockThemeService;
 
-  let mockAuthRepository: jest.Mocked<Partial<AuthRepository>>;
-  let mockProfileRepo: jest.Mocked<Partial<ProfileRepository>>;
+  let mockAuthRepository: jest.Mocked<Partial<AuthRepository>> = mockAuthRepo;
+  let mockProfileRepository: jest.Mocked<Partial<ProfileRepository>> = mockProfileRepo;
 
   const user: User = {
     id: 'adbc123',
@@ -32,37 +33,13 @@ describe('NavBarComponent', () => {
   };
 
   beforeEach(async () => {
-    mockThemeService = {
-      darkModeSignal: signal<string>('null'),
-      updateDarkMode: jest.fn(),
-    };
-
-    mockAuthRepository = {
-      get: jest.fn(),
-      login: jest.fn(),
-      sendVerificationEmail: jest.fn(),
-      logout: jest.fn(),
-      isAuthenticated: jest.fn(),
-      isEmailVerified: jest.fn(),
-      register: jest.fn(),
-      sendRequestPasswordReset: jest.fn(),
-      confirmPasswordReset: jest.fn(),
-    };
-
-    mockProfileRepo = {
-      create: jest.fn(),
-      list: jest.fn(),
-      update: jest.fn(),
-      getByUserId: jest.fn(),
-    };
-
     await TestBed.configureTestingModule({
       imports: [NavBarComponent],
       providers: [
         provideRouter([]),
-        { provide: ThemeService, useValue: mockThemeService },
+        { provide: ThemeService, useValue: mockTheme },
         { provide: AUTH_REPOSITORY_TOKEN, useValue: mockAuthRepository },
-        { provide: PROFILE_REPOSITORY_TOKEN, useValue: mockProfileRepo },
+        { provide: PROFILE_REPOSITORY_TOKEN, useValue: mockProfileRepository },
       ],
     }).compileComponents();
 

src/app/shared/components/project-list/project-list.component.spec.ts

@@ -2,25 +2,17 @@ import { ComponentFixture, TestBed } from '@angular/core/testing';
 
 import { ProjectListComponent } from './project-list.component';
 import { ProjectRepository } from '@app/domain/projects/project.repository';
-import { of } from 'rxjs';
-import { Project } from '@app/domain/projects/project.model';
 import { provideRouter } from '@angular/router';
 import { PROJECT_REPOSITORY_TOKEN } from '@app/infrastructure/projects/project-repository.token';
+import { mockProjectRepo } from '@app/testing/project.mock';
 
 describe('ProjectListComponent', () => {
   let component: ProjectListComponent;
   let fixture: ComponentFixture<ProjectListComponent>;
 
-  let mockProjectRepository: jest.Mocked<ProjectRepository>;
+  let mockProjectRepository: jest.Mocked<ProjectRepository> = mockProjectRepo;
 
   beforeEach(async () => {
-    mockProjectRepository = {
-      create: jest.fn().mockReturnValue(of({} as Project)),
-      list: jest.fn().mockReturnValue(of([])),
-      get: jest.fn().mockReturnValue(of({} as Project)),
-      update: jest.fn().mockReturnValue(of({} as Project)),
-    };
-
     await TestBed.configureTestingModule({
       imports: [ProjectListComponent],
       providers: [

src/app/shared/components/project-list/project-list.component.ts

@@ -1,4 +1,4 @@
-import { Component, Input, OnInit } from '@angular/core';
+import { Component, Input, OnChanges, SimpleChanges } from '@angular/core';
 import { UntilDestroy } from '@ngneat/until-destroy';
 import { ProjectItemComponent } from '@app/shared/components/project-item/project-item.component';
 import { ProjectFacade } from '@app/ui/projects/project.facade';
@@ -11,14 +11,14 @@ import { ProjectFacade } from '@app/ui/projects/project.facade';
   styleUrl: './project-list.component.scss',
 })
 @UntilDestroy()
-export class ProjectListComponent implements OnInit {
+export class ProjectListComponent implements OnChanges {
   @Input({ required: true }) userProjectId = '';
 
   private readonly projectFacade = new ProjectFacade();
 
   protected projects = this.projectFacade.projects;
 
-  ngOnInit(): void {
+  ngOnChanges(changes: SimpleChanges) {
     this.projectFacade.load(this.userProjectId);
   }
 }

src/app/shared/components/project-picture-form/project-picture-form.component.spec.ts

@@ -4,31 +4,18 @@ import { ProjectPictureFormComponent } from './project-picture-form.component';
 import { provideRouter } from '@angular/router';
 import { ToastrService } from 'ngx-toastr';
 import { PROJECT_REPOSITORY_TOKEN } from '@app/infrastructure/projects/project-repository.token';
-import { of } from 'rxjs';
-import { Project } from '@app/domain/projects/project.model';
 import { ProjectRepository } from '@app/domain/projects/project.repository';
+import { mockToastR } from '@app/testing/toastr.mock';
+import { mockProjectRepo } from '@app/testing/project.mock';
 
 describe('ProjectPictureFormComponent', () => {
   let component: ProjectPictureFormComponent;
   let fixture: ComponentFixture<ProjectPictureFormComponent>;
 
-  let mockToastrService: Partial<ToastrService>;
-  let mockProjectRepository: jest.Mocked<ProjectRepository>;
+  let mockToastrService: jest.Mocked<Partial<ToastrService>> = mockToastR;
+  let mockProjectRepository: jest.Mocked<Partial<ProjectRepository>> = mockProjectRepo;
 
   beforeEach(async () => {
-    mockToastrService = {
-      success: jest.fn(),
-      error: jest.fn(),
-      warning: jest.fn(),
-    };
-
-    mockProjectRepository = {
-      create: jest.fn().mockReturnValue(of({} as Project)),
-      list: jest.fn().mockReturnValue(of([])),
-      get: jest.fn().mockReturnValue(of({} as Project)),
-      update: jest.fn().mockReturnValue(of({} as Project)),
-    };
-
     await TestBed.configureTestingModule({
       imports: [ProjectPictureFormComponent],
       providers: [

src/app/shared/components/user-avatar-form/user-avatar-form.component.spec.ts

@@ -5,31 +5,22 @@ import { provideRouter } from '@angular/router';
 import { ToastrService } from 'ngx-toastr';
 import { UserRepository } from '@app/domain/users/user.repository';
 import { USER_REPOSITORY_TOKEN } from '@app/infrastructure/users/user-repository.token';
+import { mockToastR } from '@app/testing/toastr.mock';
+import { mockUserRepo } from '@app/testing/user.mock';
 
 describe('UserAvatarFormComponent', () => {
   let component: UserAvatarFormComponent;
   let fixture: ComponentFixture<UserAvatarFormComponent>;
 
-  let mockToastrService: Partial<ToastrService>;
-  let mockUserRepo: UserRepository;
+  let mockToastrService: jest.Mocked<Partial<ToastrService>> = mockToastR;
+  let mockUserRepository: jest.Mocked<Partial<UserRepository>> = mockUserRepo;
 
   beforeEach(async () => {
-    mockToastrService = {
-      warning: jest.fn(),
-      success: jest.fn(),
-      error: jest.fn(),
-    };
-
-    mockUserRepo = {
-      update: jest.fn(),
-      getUserById: jest.fn(),
-    };
-
     await TestBed.configureTestingModule({
       imports: [UserAvatarFormComponent],
       providers: [
         provideRouter([]),
-        { provide: USER_REPOSITORY_TOKEN, useValue: mockUserRepo },
+        { provide: USER_REPOSITORY_TOKEN, useValue: mockUserRepository },
         { provide: ToastrService, useValue: mockToastrService },
       ],
     }).compileComponents();

src/app/shared/components/user-form/user-form.component.spec.ts

@@ -6,32 +6,23 @@ import { provideRouter } from '@angular/router';
 import { FormBuilder } from '@angular/forms';
 import { USER_REPOSITORY_TOKEN } from '@app/infrastructure/users/user-repository.token';
 import { UserRepository } from '@app/domain/users/user.repository';
+import { mockToastR } from '@app/testing/toastr.mock';
+import { mockUserRepo } from '@app/testing/user.mock';
 
 describe('UserFormComponent', () => {
   let component: UserFormComponent;
   let fixture: ComponentFixture<UserFormComponent>;
 
-  let mockToastrService: Partial<ToastrService>;
-  let mockUserRepo: UserRepository;
+  let mockToastrService: jest.Mocked<Partial<ToastrService>> = mockToastR;
+  let mockUserRepository: jest.Mocked<Partial<UserRepository>> = mockUserRepo;
 
   beforeEach(async () => {
-    mockToastrService = {
-      warning: jest.fn(),
-      success: jest.fn(),
-      error: jest.fn(),
-    };
-
-    mockUserRepo = {
-      update: jest.fn(),
-      getUserById: jest.fn(),
-    };
-
     await TestBed.configureTestingModule({
       imports: [UserFormComponent],
       providers: [
         provideRouter([]),
         FormBuilder,
-        { provide: USER_REPOSITORY_TOKEN, useValue: mockUserRepo },
+        { provide: USER_REPOSITORY_TOKEN, useValue: mockUserRepository },
         { provide: ToastrService, useValue: mockToastrService },
       ],
     }).compileComponents();

src/app/shared/components/user-password-form/user-password-form.component.spec.ts

@@ -6,34 +6,23 @@ import { AuthFacade } from '@app/ui/authentification/auth.facade';
 import { By } from '@angular/platform-browser';
 import { ActionType } from '@app/domain/action-type.util';
 import { signal, WritableSignal } from '@angular/core';
+import { mockToastR } from '@app/testing/toastr.mock';
+import { mockAuthenticationFacade } from '@app/testing/ui/authentification/auth.facade.mock';
 
 describe('UserPasswordFormComponent', () => {
   let component: UserPasswordFormComponent;
   let fixture: ComponentFixture<UserPasswordFormComponent>;
 
-  let mockToastrService: Partial<ToastrService>;
+  let mockToastrService: jest.Mocked<Partial<ToastrService>> = mockToastR;
 
   // On mocke la Facade car c'est ce que le composant utilise directement
   let mockAuthFacade: {
     sendRequestPasswordReset: jest.Mock;
     loading: WritableSignal<{ isLoading: boolean; action: ActionType }>;
     error: WritableSignal<{ hasError: boolean }>;
-  };
+  } = mockAuthenticationFacade;
 
   beforeEach(async () => {
-    mockToastrService = {
-      warning: jest.fn(),
-      success: jest.fn(),
-      info: jest.fn(),
-      error: jest.fn(),
-    };
-
-    mockAuthFacade = {
-      sendRequestPasswordReset: jest.fn(),
-      loading: signal({ isLoading: false, action: ActionType.NONE }),
-      error: signal({ hasError: false }),
-    };
-
     await TestBed.configureTestingModule({
       imports: [UserPasswordFormComponent],
       providers: [

src/app/shared/components/vertical-profile-item/vertical-profile-item.component.html

@@ -1,5 +1,5 @@
 @if (user() !== undefined) {
-  <a [routerLink]="[user().slug]" [state]="{ user: user(), profile }" class="block group">
+  <a [routerLink]="[slug()]" [state]="{ user: user(), profile }" class="block group">
     <!-- Card du profil -->
     <div
       class="relative bg-white dark:bg-gray-800 rounded-xl shadow-lg overflow-hidden transition-all duration-300 hover:shadow-2xl hover:-translate-y-2"

src/app/shared/components/vertical-profile-item/vertical-profile-item.component.spec.ts

@@ -9,31 +9,23 @@ import { of } from 'rxjs';
 import { SECTOR_REPOSITORY_TOKEN } from '@app/infrastructure/sectors/sector-repository.token';
 import { SectorRepository } from '@app/domain/sectors/sector.repository';
 import { Sector } from '@app/domain/sectors/sector.model';
+import { mockUserRepo } from '@app/testing/user.mock';
+import { mockSectorRepo } from '@app/testing/sector.mock';
 
 describe('VerticalProfileItemComponent', () => {
   let component: VerticalProfileItemComponent;
   let fixture: ComponentFixture<VerticalProfileItemComponent>;
 
-  let mockUserRepo: UserRepository;
-  let mockSectorRepo: SectorRepository;
+  let mockUserRepository: jest.Mocked<Partial<UserRepository>> = mockUserRepo;
+  let mockSectorRepository: jest.Mocked<Partial<SectorRepository>> = mockSectorRepo;
 
   beforeEach(async () => {
-    mockUserRepo = {
-      update: jest.fn().mockReturnValue(of({} as User)),
-      getUserById: jest.fn().mockReturnValue(of({} as User)),
-    };
-
-    mockSectorRepo = {
-      list: jest.fn().mockReturnValue(of({} as Sector)),
-      getOne: jest.fn().mockReturnValue(of({} as Sector)),
-    };
-
     await TestBed.configureTestingModule({
       imports: [VerticalProfileItemComponent],
       providers: [
         provideRouter([]),
-        { provide: USER_REPOSITORY_TOKEN, useValue: mockUserRepo },
-        { provide: SECTOR_REPOSITORY_TOKEN, useValue: mockSectorRepo },
+        { provide: USER_REPOSITORY_TOKEN, useValue: mockUserRepository },
+        { provide: SECTOR_REPOSITORY_TOKEN, useValue: mockSectorRepository },
       ],
     }).compileComponents();
 

src/app/shared/components/vertical-profile-item/vertical-profile-item.component.ts

@@ -1,4 +1,4 @@
-import { Component, inject, Input, OnInit } from '@angular/core';
+import { Component, computed, inject, Input, OnInit } from '@angular/core';
 import { Router, RouterLink } from '@angular/router';
 import { UntilDestroy } from '@ngneat/until-destroy';
 import { environment } from '@env/environment';
@@ -23,6 +23,12 @@ export class VerticalProfileItemComponent implements OnInit {
   protected readonly loading = this.facade.loading;
   protected readonly error = this.facade.error;
 
+  protected slug = computed(() => {
+    const slug = this.user().slug ?? '';
+    const profileId = this.profile.id ? this.profile.id : '';
+    return slug === '' ? profileId : slug.concat('-', profileId);
+  });
+
   ngOnInit(): void {
     this.facade.loadOne(this.profile.utilisateur);
   }

src/app/shared/features/filter/filter.component.spec.ts

@@ -9,26 +9,16 @@ import { of } from 'rxjs';
 import { Profile } from '@app/domain/profiles/profile.model';
 import { ProfileRepository } from '@app/domain/profiles/profile.repository';
 import { Sector } from '@app/domain/sectors/sector.model';
+import { mockProfileRepo } from '@app/testing/profile.mock';
+import { mockSectorRepo } from '@app/testing/sector.mock';
 
 describe('FilterComponent', () => {
   let component: FilterComponent;
   let fixture: ComponentFixture<FilterComponent>;
-  let mockProfileRepository: jest.Mocked<Partial<ProfileRepository>>;
-  let mockSectorRepository: jest.Mocked<Partial<SectorRepository>>;
+  let mockProfileRepository: jest.Mocked<Partial<ProfileRepository>> = mockProfileRepo;
+  let mockSectorRepository: jest.Mocked<Partial<SectorRepository>> = mockSectorRepo;
 
   beforeEach(async () => {
-    mockProfileRepository = {
-      create: jest.fn().mockReturnValue(of({} as Profile)),
-      list: jest.fn().mockReturnValue(of([])),
-      getByUserId: jest.fn().mockReturnValue(of({} as Profile)),
-      update: jest.fn().mockReturnValue(of({} as Profile)),
-    };
-
-    mockSectorRepository = {
-      list: jest.fn().mockReturnValue(of([])),
-      getOne: jest.fn().mockReturnValue(of({} as Sector)),
-    };
-
     await TestBed.configureTestingModule({
       imports: [FilterComponent],
       providers: [

src/app/shared/features/login/login.component.spec.ts

@@ -8,43 +8,20 @@ import { AuthRepository } from '@app/domain/authentification/auth.repository';
 import { AUTH_REPOSITORY_TOKEN } from '@app/infrastructure/authentification/auth-repository.token';
 import { ProfileRepository } from '@app/domain/profiles/profile.repository';
 import { PROFILE_REPOSITORY_TOKEN } from '@app/infrastructure/profiles/profile-repository.token';
+import { mockAuthRepo } from '@app/testing/auth.mock';
+import { mockProfileRepo } from '@app/testing/profile.mock';
+import { mockToastR } from '@app/testing/toastr.mock';
 
 describe('LoginComponent', () => {
   let component: LoginComponent;
   let fixture: ComponentFixture<LoginComponent>;
 
   // Mocks des services
-  let mockToastrService: Partial<ToastrService>;
-  let mockAuthRepository: jest.Mocked<Partial<AuthRepository>>;
-  let mockProfileRepo: jest.Mocked<Partial<ProfileRepository>>;
+  let mockToastrService: Partial<ToastrService> = mockToastR;
+  let mockAuthRepository: jest.Mocked<Partial<AuthRepository>> = mockAuthRepo;
+  let mockProfileRepository: jest.Mocked<Partial<ProfileRepository>> = mockProfileRepo;
 
   beforeEach(async () => {
-    mockToastrService = {
-      warning: jest.fn(),
-      success: jest.fn(),
-      info: jest.fn(),
-      error: jest.fn(),
-    };
-
-    mockAuthRepository = {
-      get: jest.fn(),
-      login: jest.fn(),
-      sendVerificationEmail: jest.fn(),
-      logout: jest.fn(),
-      isAuthenticated: jest.fn(),
-      isEmailVerified: jest.fn(),
-      register: jest.fn(),
-      sendRequestPasswordReset: jest.fn(),
-      confirmPasswordReset: jest.fn(),
-    };
-
-    mockProfileRepo = {
-      create: jest.fn(),
-      list: jest.fn(),
-      update: jest.fn(),
-      getByUserId: jest.fn(),
-    };
-
     await TestBed.configureTestingModule({
       imports: [LoginComponent],
       providers: [
@@ -52,7 +29,7 @@ describe('LoginComponent', () => {
         provideRouter([]),
         { provide: ToastrService, useValue: mockToastrService },
         { provide: AUTH_REPOSITORY_TOKEN, useValue: mockAuthRepository },
-        { provide: PROFILE_REPOSITORY_TOKEN, useValue: mockProfileRepo },
+        { provide: PROFILE_REPOSITORY_TOKEN, useValue: mockProfileRepository },
       ],
     }).compileComponents();
 

src/app/shared/features/register/register.component.spec.ts

@@ -7,47 +7,25 @@ import { ProfileRepository } from '@app/domain/profiles/profile.repository';
 import { PROFILE_REPOSITORY_TOKEN } from '@app/infrastructure/profiles/profile-repository.token';
 import { AUTH_REPOSITORY_TOKEN } from '@app/infrastructure/authentification/auth-repository.token';
 import { AuthRepository } from '@app/domain/authentification/auth.repository';
+import { mockToastR } from '@app/testing/toastr.mock';
+import { mockProfileRepo } from '@app/testing/profile.mock';
+import { mockAuthRepo } from '@app/testing/auth.mock';
 
 describe('RegisterComponent', () => {
   let component: RegisterComponent;
   let fixture: ComponentFixture<RegisterComponent>;
 
-  let mockToastrService: jest.Mocked<Partial<ToastrService>>;
-  let mockProfileRepo: jest.Mocked<Partial<ProfileRepository>>;
-  let mockAuthRepository: jest.Mocked<Partial<AuthRepository>>;
+  let mockToastrService: jest.Mocked<Partial<ToastrService>> = mockToastR;
+  let mockProfileRepository: jest.Mocked<Partial<ProfileRepository>> = mockProfileRepo;
+  let mockAuthRepository: jest.Mocked<Partial<AuthRepository>> = mockAuthRepo;
 
   beforeEach(async () => {
-    mockProfileRepo = {
-      create: jest.fn(),
-      list: jest.fn(),
-      update: jest.fn(),
-      getByUserId: jest.fn(),
-    };
-
-    mockToastrService = {
-      success: jest.fn(),
-      error: jest.fn(),
-      warning: jest.fn(),
-    };
-
-    mockAuthRepository = {
-      get: jest.fn(),
-      login: jest.fn(),
-      sendVerificationEmail: jest.fn(),
-      logout: jest.fn(),
-      isAuthenticated: jest.fn(),
-      isEmailVerified: jest.fn(),
-      register: jest.fn(),
-      sendRequestPasswordReset: jest.fn(),
-      confirmPasswordReset: jest.fn(),
-    };
-
     await TestBed.configureTestingModule({
       imports: [RegisterComponent],
       providers: [
         provideRouter([]),
         { provide: ToastrService, useValue: mockToastrService },
-        { provide: PROFILE_REPOSITORY_TOKEN, useValue: mockProfileRepo },
+        { provide: PROFILE_REPOSITORY_TOKEN, useValue: mockProfileRepository },
         { provide: AUTH_REPOSITORY_TOKEN, useValue: mockAuthRepository },
       ],
     }).compileComponents();

src/app/shared/features/search/search.component.spec.ts

@@ -4,37 +4,25 @@ import { SearchComponent } from './search.component';
 import { provideRouter } from '@angular/router';
 import { PROFILE_REPOSITORY_TOKEN } from '@app/infrastructure/profiles/profile-repository.token';
 import { SECTOR_REPOSITORY_TOKEN } from '@app/infrastructure/sectors/sector-repository.token';
-import { of } from 'rxjs';
-import { Profile } from '@app/domain/profiles/profile.model';
 import { ProfileRepository } from '@app/domain/profiles/profile.repository';
 import { SectorRepository } from '@app/domain/sectors/sector.repository';
-import { Sector } from '@app/domain/sectors/sector.model';
+import { mockProfileRepo } from '@app/testing/profile.mock';
+import { mockSectorRepo } from '@app/testing/sector.mock';
 
 describe('SearchComponent', () => {
   let component: SearchComponent;
   let fixture: ComponentFixture<SearchComponent>;
 
-  let mockProfileRepo: jest.Mocked<Partial<ProfileRepository>>;
-  let mockSectorRepo: jest.Mocked<Partial<SectorRepository>>;
+  let mockProfileRepository: jest.Mocked<Partial<ProfileRepository>> = mockProfileRepo;
+  let mockSectorRepository: jest.Mocked<Partial<SectorRepository>> = mockSectorRepo;
 
   beforeEach(async () => {
-    mockProfileRepo = {
-      create: jest.fn().mockReturnValue(of({} as Profile)),
-      list: jest.fn().mockReturnValue(of([])),
-      getByUserId: jest.fn().mockReturnValue(of({} as Profile)),
-      update: jest.fn().mockReturnValue(of({} as Profile)),
-    };
-
-    mockSectorRepo = {
-      list: jest.fn().mockReturnValue(of([])),
-      getOne: jest.fn().mockReturnValue(of({} as Sector)),
-    };
     await TestBed.configureTestingModule({
       imports: [SearchComponent],
       providers: [
         provideRouter([]),
-        { provide: PROFILE_REPOSITORY_TOKEN, useValue: mockProfileRepo },
-        { provide: SECTOR_REPOSITORY_TOKEN, useValue: mockSectorRepo },
+        { provide: PROFILE_REPOSITORY_TOKEN, useValue: mockProfileRepository },
+        { provide: SECTOR_REPOSITORY_TOKEN, useValue: mockSectorRepository },
       ],
     }).compileComponents();
 

src/app/shared/features/update-user/update-user.component.spec.ts

@@ -5,28 +5,22 @@ import { provideRouter } from '@angular/router';
 import { UserRepository } from '@app/domain/users/user.repository';
 import { USER_REPOSITORY_TOKEN } from '@app/infrastructure/users/user-repository.token';
 import { ToastrService } from 'ngx-toastr';
+import { mockUserRepo } from '@app/testing/user.mock';
+import { mockToastR } from '@app/testing/toastr.mock';
 
 describe('UpdateUserComponent', () => {
   let component: UpdateUserComponent;
   let fixture: ComponentFixture<UpdateUserComponent>;
 
-  let mockUserRepo: jest.Mocked<Partial<UserRepository>>;
-  let mockToastrService: jest.Mocked<Partial<ToastrService>>;
+  let mockUserRepository: jest.Mocked<Partial<UserRepository>> = mockUserRepo;
+  let mockToastrService: jest.Mocked<Partial<ToastrService>> = mockToastR;
 
   beforeEach(async () => {
-    mockUserRepo = {
-      getUserById: jest.fn(),
-    };
-    mockToastrService = {
-      warning: jest.fn(),
-      success: jest.fn(),
-      error: jest.fn(),
-    };
     await TestBed.configureTestingModule({
       imports: [UpdateUserComponent],
       providers: [
         provideRouter([]),
-        { provide: USER_REPOSITORY_TOKEN, useValue: mockUserRepo },
+        { provide: USER_REPOSITORY_TOKEN, useValue: mockUserRepository },
         { provide: ToastrService, useValue: mockToastrService },
       ],
     }).compileComponents();

src/app/testing/auth.mock.ts

@@ -0,0 +1,11 @@
+export const mockAuthRepo = {
+  get: jest.fn(),
+  login: jest.fn(),
+  sendVerificationEmail: jest.fn(),
+  logout: jest.fn(),
+  isAuthenticated: jest.fn(),
+  isEmailVerified: jest.fn(),
+  register: jest.fn(),
+  sendRequestPasswordReset: jest.fn(),
+  confirmPasswordReset: jest.fn(),
+};

src/app/testing/domain/profiles/fake-profile.repository.ts

@@ -8,8 +8,8 @@ export class FakeProfileRepository implements ProfileRepository {
     return of(mockProfilePaginated);
   }
 
-  getByUserId(userId: string): Observable<Profile> {
-    const profile = mockProfiles.find((p) => p.utilisateur === userId) ?? ({} as Profile);
+  getById(profileId: string): Observable<Profile> {
+    const profile = mockProfiles.find((p) => p.utilisateur === profileId) ?? ({} as Profile);
     return of(profile);
   }
 

src/app/testing/infrastructure/profiles/pb-profile.repository.spec.ts

@@ -15,7 +15,7 @@ describe('PbProfileRepository', () => {
     // Création d’un faux client PocketBase avec les méthodes dont on a besoin
     mockCollection = {
       getList: jest.fn(),
-      getFirstListItem: jest.fn(),
+      getOne: jest.fn(),
       create: jest.fn(),
       update: jest.fn(),
     };
@@ -54,13 +54,13 @@ describe('PbProfileRepository', () => {
   // ------------------------------------------
   // 🔹 TEST : getByUserId()
   // ------------------------------------------
-  it('devrait appeler pb.collection("profiles").getFirstListItem() avec le bon filtre utilisateur', () => {
-    const userId = '1';
+  it('devrait appeler pb.collection("profiles").getOne() avec le bon filtre utilisateur', () => {
+    const profileId = '1';
 
-    mockCollection.getFirstListItem.mockResolvedValue(mockProfiles);
+    mockCollection.getOne.mockResolvedValue(mockProfiles);
 
-    repo.getByUserId(userId).subscribe((result) => {
-      expect(mockCollection.getFirstListItem).toHaveBeenCalledWith(`utilisateur="${userId}"`);
+    repo.getById(profileId).subscribe((result) => {
+      expect(mockCollection.getOne).toHaveBeenCalledWith(`${profileId}`, { expand: 'utilisateur' });
       expect(result).toEqual(mockProfiles[0]);
     });
   });

src/app/testing/profile.mock.ts

@@ -1,4 +1,5 @@
 import { Profile, ProfilePaginated } from '@app/domain/profiles/profile.model';
+import { of } from 'rxjs';
 
 export const mockProfiles: Profile[] = [
   {
@@ -38,3 +39,10 @@ export const mockProfilePaginated: ProfilePaginated = {
   totalItems: 1,
   items: mockProfiles,
 };
+
+export const mockProfileRepo = {
+  create: jest.fn().mockReturnValue(of({} as Profile)),
+  list: jest.fn().mockReturnValue(of([])),
+  getById: jest.fn().mockReturnValue(of({} as Profile)),
+  update: jest.fn().mockReturnValue(of({} as Profile)),
+};

src/app/testing/project.mock.ts

@@ -1,4 +1,5 @@
 import { Project } from '@app/domain/projects/project.model';
+import { of } from 'rxjs';
 
 export const fakeProjects: Project[] = [
   {
@@ -57,3 +58,10 @@ export const fakeProjects: Project[] = [
     utilisateur: 'user_001',
   },
 ];
+
+export const mockProjectRepo = {
+  create: jest.fn().mockReturnValue(of({} as Project)),
+  list: jest.fn().mockReturnValue(of([])),
+  get: jest.fn().mockReturnValue(of({} as Project)),
+  update: jest.fn().mockReturnValue(of({} as Project)),
+};

src/app/testing/sector.mock.ts

@@ -1,4 +1,5 @@
 import { Sector } from '@app/domain/sectors/sector.model';
+import { of } from 'rxjs';
 
 export const fakeSectors: Sector[] = [
   {
@@ -32,3 +33,8 @@ export const fakeSectors: Sector[] = [
     nom: 'Ressources humaines',
   },
 ];
+
+export const mockSectorRepo = {
+  list: jest.fn().mockReturnValue(of([])),
+  getOne: jest.fn().mockReturnValue(of({} as Sector)),
+};

src/app/testing/theme.mock.ts

@@ -0,0 +1,6 @@
+import { signal } from '@angular/core';
+
+export const mockThemeService = {
+  darkModeSignal: signal<string>('null'),
+  updateDarkMode: jest.fn(),
+};

src/app/testing/toastr.mock.ts

@@ -0,0 +1,6 @@
+export const mockToastR = {
+  warning: jest.fn(),
+  success: jest.fn(),
+  info: jest.fn(),
+  error: jest.fn(),
+};

src/app/testing/ui/authentification/auth.facade.mock.ts

@@ -0,0 +1,8 @@
+import { signal } from '@angular/core';
+import { ActionType } from '@app/domain/action-type.util';
+
+export const mockAuthenticationFacade = {
+  sendRequestPasswordReset: jest.fn(),
+  loading: signal({ isLoading: false, action: ActionType.NONE }),
+  error: signal({ hasError: false }),
+};

src/app/testing/user.mock.ts

@@ -1,4 +1,5 @@
 import { User } from '@app/domain/users/user.model';
+import { of } from 'rxjs';
 
 export const fakeUsers: User[] = [
   {
@@ -13,3 +14,8 @@ export const fakeUsers: User[] = [
     verified: false,
   },
 ];
+
+export const mockUserRepo = {
+  getUserById: jest.fn().mockReturnValue(of({} as User)),
+  update: jest.fn(),
+};

src/app/ui/profiles/profile.facade.ts

@@ -67,9 +67,9 @@ export class ProfileFacade {
     });
   }
 
-  loadOne(userId: string) {
+  loadOne(profileId: string) {
     this.handleError(ActionType.READ, false, null, true);
-    this.getUseCase.execute(userId).subscribe({
+    this.getUseCase.execute(profileId).subscribe({
       next: (profile: Profile) => {
         this.profile.set(ProfilePresenter.toViewModel(profile));
         this.handleError(ActionType.READ, false, null, false);

src/app/ui/users/user.presenter.ts

@@ -4,8 +4,8 @@ import { User } from '@app/domain/users/user.model';
 export class UserPresenter {
   toViewModel(user: User): UserViewModel {
     const slug = user.name
-      ? user.name.toLowerCase().replace(/\s/g, '-')
-      : user.email.split('@')[0].toLowerCase().trim();
+      ? this.generateProfileSlug(user.name, user.id)
+      : this.generateProfileSlug('Non renséigné');
 
     let userViewModel: UserViewModel = {
       id: user.id,
@@ -30,4 +30,16 @@ export class UserPresenter {
   toViewModels(users: User[]): UserViewModel[] {
     return users.map(this.toViewModel);
   }
+
+  private generateProfileSlug(name: string, id?: string): string {
+    return name
+      .concat(id ? ` ${id}` : '')
+      .toLowerCase()
+      .normalize('NFD')
+      .replace(/[\u0300-\u036f]/g, '') // Enlève les accents
+      .trim()
+      .replace(/[^a-z0-9 -]/g, '') // Enlève les caractères spéciaux
+      .replace(/\s+/g, '-') // Remplace les espaces par des tirets
+      .replace(/-+/g, '-'); // Évite les tirets multiples
+  }
 }

src/app/usecase/profiles/get-profile.usecase.ts

@@ -5,7 +5,7 @@ import { Profile } from '@app/domain/profiles/profile.model';
 export class GetProfileUseCase {
   constructor(private readonly repo: ProfileRepository) {}
 
-  execute(userId: string): Observable<Profile> {
-    return this.repo.getByUserId(userId);
+  execute(profileId: string): Observable<Profile> {
+    return this.repo.getById(profileId);
   }
 }

src/app/usecase/users/get-user.usecase.ts

@@ -1,8 +1,10 @@
 import { UserRepository } from '@app/domain/users/user.repository';
+import { Observable } from 'rxjs';
+import { User } from '@app/domain/users/user.model';
 
 export class GetUserUseCase {
   constructor(private readonly repo: UserRepository) {}
-  execute(userId: string) {
+  execute(userId: string): Observable<User> {
     return this.repo.getUserById(userId);
   }
 }

tsconfig.json

@@ -2,6 +2,7 @@
 {
   "compileOnSave": false,
   "compilerOptions": {
+    "skipLibCheck": true,
     "baseUrl": ".",
     "resolveJsonModule": true,
     "paths": {