website/blog/index.tsx
Foster Hangdaan c41ee1fb96
Minor edits to Blog page
- Changed content of message when there are no posts
- Changed description
- Add null alt value fro decorative image
2023-08-06 11:04:01 -04:00

40 lines
1.2 KiB
TypeScript

export const title = "Blog";
export const description = "Hello, stranger. Stay a while and listen.";
export default function({ nav }) {
const sortPosts = (a,b) => {
if (a.data.date < b.data.date) {
return 1;
} else if (a.data.date > b.data.date) {
return -1;
} else {
return 0;
}
};
if (!nav.menu("/blog/posts")) {
return (
<div className="no-posts">
<img src="https://static.fosterhangdaan.com/icons/tabler-icons/latest/svg/coffee.svg" className="icon" alt=""/>
<h2>No posts yet</h2>
<p>Foster is on a coffee break.<br/>Check back later.</p>
</div>
);
}
return (
<ul className="post-list">
{nav.menu("/blog/posts").children.sort(sortPosts).map(post => (
<li className="post-list-item">
<a href={post.data.url} className="post-list-title">{post.data.title}</a>
<time className="post-list-date">{Intl.DateTimeFormat("en-CA", { dateStyle: "long" }).format(post.data.date)}</time>
<ul className="tag-list">
{post.data.tags.map(tag => <li className="tag">{tag}</li>)}
</ul>
<p className="post-list-description">{post.data.description}</p>
</li>
))}
</ul>
);
}