Add some styles, use some post service methods for easily getting post data.
This commit is contained in:
parent
c035bfec8a
commit
5ea1aa9c5b
14
src/assets/static/main.css
Normal file
14
src/assets/static/main.css
Normal 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;
|
||||
}
|
@ -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: {
|
||||
|
@ -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);
|
||||
|
||||
|
@ -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 {
|
||||
|
@ -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}
|
||||
|
@ -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>
|
||||
);
|
||||
|
Loading…
Reference in New Issue
Block a user