fred/recipe_app
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

ingredients and steps on recipe page

Browse source
This commit is contained in:
fred 2025-07-09 11:02:23 -07:00
parent 5898ac7779
commit 925135d08c
4 changed files with 43 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

10
frontend/src/pages/RecipePage.tsx
View file

@ -5,7 +5,11 @@ import { getRecipeById } from "../services/frontendApi.js";
import { type Recipe } from "../types/Recipe"
function RecipePage() {
const [recipe, setRecipe] = useState<Recipe>({});
const [recipe, setRecipe] = useState<Recipe>({
details: {},
ingredients: [],
steps: {}
});
const [error, setError] = useState<string | null>(null);
const [loading, setLoading] = useState(true);
const { id } = useParams();
@ -24,7 +28,7 @@ function RecipePage() {
}
};
loadRecipe();
}, []);
}, [id]);
return (
<div className="recipe">
@ -35,7 +39,7 @@ function RecipePage() {
<div className="loading">Loading...</div>
) : (
<div className="recipe-card">
<RecipeCard recipe={recipe} key={recipe.id} />
<RecipeCard recipe={recipe} key={recipe.details.id} />
</div>
)}
</div>