Improved tagging

src/pages/hobby/[id].astro

@@ -1,17 +1,18 @@
 ---
-import { getCollection, render } from 'astro:content';
+import {getCollection, render} from 'astro:content';
+import BaseLayout from "../../layouts/BaseLayout.astro";
 // 1. Generate a new path for every collection entry
 export async function getStaticPaths() {
     const hobbies = await getCollection('hobbies');
     return hobbies.map(hobby => ({
-        params: { id: hobby.id },
-        props: { hobby: hobby },
+        params: {id: hobby.id},
+        props: {hobby: hobby, title: hobby.id},
     }));
 }
 // 2. For your template, you can get the entry directly from the prop
-const { hobby } = Astro.props;
-const { Content } = await render(hobby);
-
+const {hobby} = Astro.props;
+const {Content} = await render(hobby);
 ---
-<h1>{hobby.id}</h1>
-<Content />
+<BaseLayout title={hobby.id}>
+    <Content/>
+</BaseLayout>