added blog

app/blog/[slug]/layout.tsx

@@ -0,0 +1,33 @@
+import type { Metadata } from "next";
+import { ProjectProvider } from "@/app/context/ProjectContext";
+import { getBlogDetails, BLOG_POSTS } from "@/data/content";
+
+export async function generateMetadata({ params }: { params: Promise<{ slug: string }> }): Promise<Metadata> {
+  const { slug } = await params;
+  const post = BLOG_POSTS.find((p) => p.slug === slug);
+  if (!post) return { title: "Post not found" };
+  return { title: `${post.title} | Blog`, description: post.description };
+}
+
+/**
+ * Layout for all paths caught under blog/[slug].
+ * Mirrors app/project/[slug]/layout.tsx: the rendered markdown is resolved
+ * here on the server and handed to the client page via the shared context.
+ * (ProjectContext is a generic `any` context despite its name; its value
+ * contract is `string | null` = rendered HTML.)
+ */
+export default async function BlogSlugLayout({ children, params }: {
+  children: React.ReactNode;
+  params: Promise<{ slug: string }>;
+}) {
+
+  const { slug } = await params;
+  const postData = await getBlogDetails(slug);
+  return (
+    <ProjectProvider value={postData}>
+      <main>
+        {children}
+      </main>
+    </ProjectProvider>
+  );
+}