mirror of
https://github.com/rjNemo/meal_planner
synced 2026-06-12 05:16:47 +00:00
31 lines
594 B
Vue
31 lines
594 B
Vue
<script setup lang="ts">
|
|
import { idSchema } from "~/types/id";
|
|
|
|
const { params } = useRoute();
|
|
const routeParam = params.id;
|
|
|
|
const parsed = idSchema.safeParse(routeParam);
|
|
|
|
if (!parsed.success) {
|
|
throw createError({
|
|
statusCode: 400,
|
|
statusMessage: "Invalid recipe id",
|
|
});
|
|
}
|
|
|
|
const {
|
|
data: recipe,
|
|
pending,
|
|
error,
|
|
} = await useFetch(`/api/recipes/${id}`, {
|
|
lazy: true,
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<div v-if="pending">Loading</div>
|
|
<div v-else-if="error">Failed: {{ error.statusMessage }}</div>
|
|
<section v-else>
|
|
<Recipe :recipe="recipe" />
|
|
</section>
|
|
</template>
|