Add the meta to the context renderer

src/index.tsx

@@ -2,7 +2,14 @@ import { Hono } from 'hono';
 import { jsxRenderer, useRequestContext } from 'hono/jsx-renderer';
 import { Page } from '@blog/templates/Page';
 import home from '@blog/routes/home';
-import posts from '@blog/routes/post';
+import posts from '@blog/routes/posts';
+import type { SiteMeta } from '@blog/model/SiteMeta';
+
+declare module 'hono' {
+  interface ContextRenderer {
+    (content: string|Promise<string>, props: { meta: SiteMeta }): Response;
+  }
+}
 
 const app = new Hono();
 
@@ -10,8 +17,8 @@ const app = new Hono();
 app.get(
   '*',
   jsxRenderer(
-    ({ children }) => {
-      return (<Page>{children}</Page>);
+    ({ children, meta }) => {
+      return (<Page meta={meta}>{children}</Page>);
     },
     {
       docType: true

src/routes/home.tsx

@@ -5,7 +5,7 @@ import { Home } from '@blog/templates/Pages/Home';
 const app = new Hono();
 
 app.get('/', async (c) => {
-  const files: string[] = await readdir(__dirname + '/../posts', { recursive: true });
+  const files: string[] = await readdir(__dirname + '/../../posts', { recursive: true });
   const posts: string[] = files.map(f => f.slice(0, -3));
   return c.render(<Home posts={posts}/>);
 });

src/routes/posts.tsx

@@ -7,10 +7,10 @@ import { readPostMarkdown } from '@blog/util/post-reader';
 
 const app = new Hono();
 
-app.get('/posts/:slug', async (c) => {
+app.get('/:slug', async (c) => {
   const postSlug: string = c.req.param("slug");
   const fileName: string = postSlug + '.md';
-  const files = await readdir(__dirname + "/../posts");
+  const files = await readdir(__dirname + "/../../posts");
 
   const postFile = files.find(f => f === fileName);
   if (!postFile) {
@@ -18,7 +18,7 @@ app.get('/posts/:slug', async (c) => {
     return c.render(<FourOhFour />);
   }
 
-  const post = await readPostMarkdown(postFile);
+  const post = await readPostMarkdown(__dirname + "/../../posts/" + postFile);
   const meta = {
     description: post.meta.description,
     tags: post.meta.tags,

src/templates/components/MetaTags.tsx

@@ -1,24 +1,24 @@
 import { SiteMeta } from '@blog/model/SiteMeta';
 
 export function Description({ meta }: { meta: SiteMeta }) {
-  if (!meta.description) {
-    return null;
+  if (!meta?.description) {
+    return (<></>);
   }
 
   return (<meta name="description" content={meta.description} />);
 }
 
 export function Tags({ meta }: { meta: SiteMeta }) {
-  if (!meta.tags) {
-    return null;
+  if (!meta?.tags) {
+    return (<></>);
   }
 
   return (<meta name="keywords" content={meta.tags.join(', ')} />);
 }
 
 export function Author({ meta }: { meta: SiteMeta }) {
-  if (!meta.author) {
-    return null;
+  if (!meta?.author) {
+    return (<></>);
   }
 
   return (<meta name="author" content={meta.author} />);