blog/src/index.tsx

import { Hono } from 'hono';
import { jsxRenderer, useRequestContext } from 'hono/jsx-renderer';
import { Page } from '@blog/templates/Page';
import { Home } from '@blog/templates/Pages/Home';
import { FourOhFour } from '@blog/templates/Pages/FourOhFour';
import { readdir } from 'node:fs/promises';

const app = new Hono();

app.get(
  '*',
  jsxRenderer(
    ({ children }) => {
      return (<Page>{children}</Page>);
    },
    {
      docType: true
    }
  )
);

// read all posts
// create listing of posts


app.get('/', async (c) => {
  const files = await readdir('../posts', { recursive: true });
  const posts = files.filter(f => f === '.' || f === '..');
  return c.render(<Home posts={posts}/>);
});

app.get('/posts/:slug', async (c) => {
  const postSlug: string = c.req.param("slug");
  const fileName: string = postSlug + '.md';
  const files = await readdir(__dirname + "/../posts");

  const postFile = files.find(f => f === fileName);
  if (!postFile) {
    c.status(404);
    return c.render(<FourOhFour />);
  }

  // render post
  // send to Post layout
});

export default app;