dsh/blog
1
0
Fork 0
Code Issues 3 Pull Requests Actions Packages Projects Releases Wiki Activity

Add the meta to the context renderer

Browse Source
This commit is contained in:
Dave Smith-Hayes 2024-07-03 22:13:04 -04:00
parent f25d9aed56
commit 448c7dad83
4 changed files with 20 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/index.tsx
View File

@ -2,7 +2,14 @@ import { Hono } from 'hono';
import { jsxRenderer, useRequestContext } from 'hono/jsx-renderer'; import { jsxRenderer, useRequestContext } from 'hono/jsx-renderer';
import { Page } from '@blog/templates/Page'; import { Page } from '@blog/templates/Page';
import home from '@blog/routes/home'; 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(); const app = new Hono();
@ -10,8 +17,8 @@ const app = new Hono();
app.get( app.get(
'*', '*',
jsxRenderer( jsxRenderer(
({ children }) => { ({ children, meta }) => {
return (<Page>{children}</Page>); return (<Page meta={meta}>{children}</Page>);
}, },
{ {
docType: true docType: true

2
src/routes/home.tsx
View File

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

6
src/routes/posts.tsx
View File

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

12
src/templates/components/MetaTags.tsx
View File

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