Add some styles, use some post service methods for easily getting post data.

This commit is contained in:
Dave Smith-Hayes 2024-07-31 22:02:55 -04:00
parent c035bfec8a
commit 5ea1aa9c5b
6 changed files with 32 additions and 15 deletions

View File

@ -0,0 +1,14 @@
header, footer, main {
max-width: 800px;
margin: 0 auto;
padding: 1em;
box-sizing: border-box;
}
header {
border-bottom: 1px solid #ccc;
}
footer {
border-top: 1px solid #ccc;
}

View File

@ -12,11 +12,8 @@ const app = new Hono<{ Variables: Posts }>();
app.get("/", async (c) => {
const postService: PostFileService = c.get('postService');
const posts = postService.getPosts();
const postList: PostMeta[] = Array.from(posts.values())
.map((p: Post) => p.meta)
.sort((p1: Post, p2: Post) => p1.meta.date - p2.meta.date);
const postList: PostMeta[] = Array.from(postService.getPublishedPosts())
.map((p: Post) => p.meta);
return c.render(<Home posts={postList} />, {
meta: {

View File

@ -7,7 +7,6 @@ import posts from '@blog/handlers/posts';
import type { SiteMeta } from '@blog/models/SiteMeta';
import { postFileMiddleware } from '@blog/middleware/post-service';
import { logger } from 'hono/logger';
import { STATIC_PATH } from '@blog/config';
declare module 'hono' {
interface ContextRenderer {
@ -36,7 +35,6 @@ app.use('/static/*', serveStatic({
}
}));
console.log(JSON.stringify({ message: "Bootstrapping the routes..." }));
app.route('/', home);
app.route('/posts', posts);

View File

@ -57,13 +57,19 @@ export class PostFileService {
}
public getPostsSortedByDate(desc: boolean = true): Post[] {
return Array.from(this.posts.entries()).sort((p1: Post, p2: Post) => {
if (desc) {
return p1.meta.date - p2.meta.date;
}
return Array.from(this.posts.values())
.sort((p1: Post, p2: Post) => {
if (desc) {
return p1.meta.date.getTime() - p2.meta.date.getTime();
}
return p2.meta.date - p1.meta.date;
})
return p2.meta.date.getTime() - p1.meta.date.getTime();
});
}
public getPublishedPosts(): Post[] {
return this.getPostsSortedByDate()
.filter((p: Post) => p.meta.draft == false);
}
public getPost(slug: string): Post {

View File

@ -17,7 +17,9 @@ export function Page({ children, meta }: { children: any, meta: SiteMeta }) {
</head>
<body>
<header>
<div class={logoClass}>davesmithhayes.com</div>
<div class={logoClass}>
<a href="/">davesmithhayes.com</a>
</div>
</header>
<main>
{children}

View File

@ -4,7 +4,7 @@ import { PostMeta } from '@blog/models/PostMeta';
export function Home({ posts }: { posts: PostMeta[] }) {
return (
<div class="main">
<h1>davesmithhayes.com</h1>
<h1>Posts</h1>
{posts.length ? <PostList posts={posts} /> : <div>No posts.</div>}
</div>
);