From 632e9b69e561decdc9967b69a134b7e35c52c56d Mon Sep 17 00:00:00 2001
From: bastien ollier <bastien.ollier@etu.uca.fr>
Date: Fri, 14 Jun 2024 15:09:24 +0200
Subject: [PATCH] add recipe detail

---
 src/app/app.component.ts             |  6 ++++++
 src/app/app.config.ts                |  4 +++-
 src/app/recipe.service.ts            |  4 +++-
 src/app/recipe/recipe.component.html |  5 ++++-
 src/app/recipe/recipe.component.ts   | 11 ++++++++++-
 5 files changed, 26 insertions(+), 4 deletions(-)

diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index 59cc757..8ded56b 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -1,5 +1,6 @@
 import { Component } from '@angular/core';
 import { RouterLink, RouterLinkActive, RouterOutlet } from '@angular/router';
+import { RecipeService } from './recipe.service';
 
 @Component({
   selector: 'app-root',
@@ -7,7 +8,12 @@ import { RouterLink, RouterLinkActive, RouterOutlet } from '@angular/router';
   imports: [RouterOutlet, RouterLink, RouterLinkActive],
   templateUrl: './app.component.html',
   styleUrl: './app.component.css',
+  providers: [RecipeService]
 })
 export class AppComponent {
   title = 'tiramisu';
+
+  constructor(protected recipes: RecipeService){
+  }
+
 }
diff --git a/src/app/app.config.ts b/src/app/app.config.ts
index 7afc797..743104f 100644
--- a/src/app/app.config.ts
+++ b/src/app/app.config.ts
@@ -1,8 +1,10 @@
 import { ApplicationConfig, provideZoneChangeDetection } from '@angular/core';
 import { provideRouter } from '@angular/router';
+import { withComponentInputBinding } from '@angular/router';
+import { provideAnimationsAsync } from '@angular/platform-browser/animations/async';
 
 import { routes } from './app.routes';
 
 export const appConfig: ApplicationConfig = {
-  providers: [provideZoneChangeDetection({ eventCoalescing: true }), provideRouter(routes)],
+  providers: [provideRouter(routes, withComponentInputBinding()), provideAnimationsAsync()]
 };
diff --git a/src/app/recipe.service.ts b/src/app/recipe.service.ts
index ef81924..a8a235a 100644
--- a/src/app/recipe.service.ts
+++ b/src/app/recipe.service.ts
@@ -5,7 +5,9 @@ import { Recipe } from '../cookbook/type';
   providedIn: 'root',
 })
 export class RecipeService {
-  #recipes: Recipe[] = [];
+  #recipes: Recipe[] = [
+    {id: 0, name: 'crepe', description: 'La meilleure recette de pâte à crêpes', image: '', ingredients: []}
+  ];
 
   constructor() {}
 
diff --git a/src/app/recipe/recipe.component.html b/src/app/recipe/recipe.component.html
index 8cab4a7..73c1a8d 100644
--- a/src/app/recipe/recipe.component.html
+++ b/src/app/recipe/recipe.component.html
@@ -1 +1,4 @@
-<p>recipe works!</p>
+<p>{{recipe.id}}</p>
+<p>{{recipe.name}}</p>
+<p>{{recipe.description}}</p>
+
diff --git a/src/app/recipe/recipe.component.ts b/src/app/recipe/recipe.component.ts
index a34cb5a..7b776c6 100644
--- a/src/app/recipe/recipe.component.ts
+++ b/src/app/recipe/recipe.component.ts
@@ -1,5 +1,6 @@
 import { Component, Input } from '@angular/core';
-
+import { Recipe } from '../../cookbook/type';
+import { RecipeService } from '../recipe.service';
 @Component({
   selector: 'app-recipe',
   standalone: true,
@@ -7,7 +8,15 @@ import { Component, Input } from '@angular/core';
   templateUrl: './recipe.component.html',
 })
 export class RecipeComponent {
+  recipe: Recipe = {id: -1, name: '', description: '', image: '', ingredients: []};
+  
   @Input()
   set id(id: string) {
+    console.log('test',this.recipes.get(0));
+    this.recipe = this.recipes.get(parseInt(id))!;
   }
+
+  constructor(protected recipes: RecipeService){
+  } 
+
 }