Create meta tags components

This commit is contained in:
Dave Smith-Hayes 2024-07-03 21:30:11 -04:00
parent a70e461a94
commit 76066ddae1
4 changed files with 58 additions and 23 deletions

View File

@ -1,4 +1,5 @@
export type SiteMeta = {
description: string,
tags: string[]
tags: string[],
author?: string,
};

View File

@ -1,11 +1,11 @@
import { css, Style } from 'hono/css';
improt { SiteMeta } from '@blog/model/SiteMeta';
import { SiteMeta } from '@blog/model/SiteMeta';
const logoClass = css`
font-size: 16pt;
`;
export function Page({ children, meta }: { children: any, meta: Record<string, any> }) {
export function Page({ children, meta }: { children: any, meta: SiteMeta }) {
return (
<html lang="en">
<head>

View File

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

View File

@ -8,34 +8,34 @@ export async function openPostMarkdownFile(filename: string): Promise<string> {
return file.text();
}
export function parsePostMetadata(post: string): PostMeta {
type PostMetaWithRawContent = {
meta: PostMeta,
content: string
};
export function parsePostMetadata(post: string): PostMetaWithRawContent {
const parsedData = yamlFront.loadFront(post);
return {
title: parsedData.title,
description: parsedData.description,
date: new Date(parsedData.date),
draft: parsedData?.draft || false,
tags: parsedData.tags
};
}
export async function readPostMarkdown(filename: string): Promise<Post> {
const file = Bun.file(filename);
const contents = await file.text();
const parsedData = yamlFront.loadFront(contents);
const parsedPost = await marked.parse(parsedData.__content);
return {
meta: {
title: parsedData.title,
slug: filename.slice(0, -3),
description: parsedData.description,
date: new Date(parsedData.date),
tags: parsedData.tags,
draft: parsedData?.draft || false,
tags: parsedData.tags
},
content: parsedData.__content,
content: parsedData.__content
};
}
export async function readPostMarkdown(filename: string): Promise<Post> {
const contents = await openPostMarkdownFile(filename);
const post = parsePostMetadata(contents);
const parsedPost = await marked.parse(post.content);
return {
meta: post.meta,
content: post.content,
html: parsedPost
};
}