diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 01910f8..545b8e3 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -23,6 +23,7 @@ import { AddRestauComponent } from './admin-component/add-restau/add-restau.comp
 import { UpdateDelRestauComponent } from './admin-component/update-del-restau/update-del-restau.component';
 import { HeaderLogoComponent } from './header/components/header-logo/header-logo.component';
 import { AuthInterceptor } from './services/auth.interceptor';
+import { FavorisUserComponent } from './pages/favoris-user/favoris-user.component';
 
 @NgModule({
   declarations: [
@@ -44,7 +45,9 @@ import { AuthInterceptor } from './services/auth.interceptor';
     AdminPageComponent,
     AddRestauComponent,
     UpdateDelRestauComponent,
-    HeaderLogoComponent
+    HeaderLogoComponent,
+    FavorisUserComponent
+
   ],
   imports: [
     BrowserModule,
diff --git a/src/app/pages/favoris-user/favoris-user.component.html b/src/app/pages/favoris-user/favoris-user.component.html
index 427f2ac..aaadff3 100644
--- a/src/app/pages/favoris-user/favoris-user.component.html
+++ b/src/app/pages/favoris-user/favoris-user.component.html
@@ -1,8 +1,6 @@
-<h2 class="titre ">Mes favoris :</h2>
-<div class="separation"></div>
-<div class="parent d-flex justify-content-center align-items-center">
-    <div class="card">
-        <h3>Mon top</h3>
+<app-template-page [title]="'Favoris :'">
+    <div *ngFor="let pref of restaurantData">
+        <app-card-resto [restaurant]= "pref"></app-card-resto>
     </div>
-    
-</div>
+</app-template-page>
+
diff --git a/src/app/pages/favoris-user/favoris-user.component.ts b/src/app/pages/favoris-user/favoris-user.component.ts
index 5aa64f1..625a625 100644
--- a/src/app/pages/favoris-user/favoris-user.component.ts
+++ b/src/app/pages/favoris-user/favoris-user.component.ts
@@ -11,26 +11,28 @@ export class FavorisUserComponent implements OnInit {
 
 
   personneConnectee : any;
-  listRestoFav: any;
+  listPref: any;
+  restaurantData : any[];
 
-  constructor(private apiBackService : ApiBackService,private tokenService : TokenService) { 
+  constructor(private apiBackService : ApiBackService, private tokenService : TokenService) { 
+
+this.restaurantData = []
   }
 
   ngOnInit(): void {
 
-    
+
     this.apiBackService.getPersonneById(this.tokenService.getCurrentUserId()).subscribe(
-      resp =>{
-        console.log(resp);
-        
-        this.personneConnectee = resp;
+      user =>{
+
+        this.listPref = user.preference;
+         console.log(this.listPref);
+
+         for (let i = 0; i < this.listPref.length; i++) {
+         this.restaurantData.push(this.listPref[i]['preferencePK']['restau']);
+        }
+
       }
     );
-    console.log(this.personneConnectee);
-    
-
-
   }
-
-}
-
+}
\ No newline at end of file
diff --git a/src/app/services/api-back.service.ts b/src/app/services/api-back.service.ts
index bf10a0c..e821706 100644
--- a/src/app/services/api-back.service.ts
+++ b/src/app/services/api-back.service.ts
@@ -34,14 +34,12 @@ export class ApiBackService {
   }
 
   setListRestau(listRestau: any[], routeParam?: string): void {
-
     this.restoFilter = listRestau;
     this.routeParam = routeParam;
 
   }
 
   setDistance(lat1: number, lon1: number, lat2: number, lon2: number) {
-
     let R = 6371; // Radius of the earth in km
     let dLat = this.deg2rad(lat2 - lat1);  // deg2rad below
     let dLon = this.deg2rad(lon2 - lon1);
@@ -65,12 +63,11 @@ export class ApiBackService {
   }
 
   deleteRestau(idRestau: number | undefined): Observable<any> {
-
     return this.httpClient.delete<Restaurant>(`${environment.apiUrl}/delete-restaurant/${idRestau}`);
 
   }
 
   getPersonneById(id: any) {
-    return this.httpClient.get<any[]>(`${environment.apiUrl}/user/${id}`);
+    return this.httpClient.get<any>(`${environment.apiUrl}/user/${id}`);
   }
 }