bring back tags and use collections on blog index

This commit is contained in:
2024-07-22 21:11:46 +02:00
parent 3cc883d082
commit 1b9cbfa0a9
2 changed files with 12 additions and 18 deletions
+4 -6
View File
@@ -8,8 +8,6 @@ import { marked } from 'marked';
export async function getStaticPaths() { export async function getStaticPaths() {
const posts = await getCollection('posts'); const posts = await getCollection('posts');
return posts.map(p => ({ return posts.map(p => ({
params: { params: {
slug: p.slug slug: p.slug
@@ -18,7 +16,7 @@ export async function getStaticPaths() {
title: p.data.title, title: p.data.title,
publishDate: p.data.publishDate, publishDate: p.data.publishDate,
slug: p.slug, slug: p.slug,
tags: "test", tags: p.data.tags,
content: marked.parse(p.body), content: marked.parse(p.body),
readingTime: readingTime(p.body).text, readingTime: readingTime(p.body).text,
} }
@@ -35,9 +33,9 @@ const permalink = `${Astro.site.href}blog/${slug}`;
<p>{publishDate} ~ {readingTime}</p> <p>{publishDate} ~ {readingTime}</p>
<h1>{title}</h1> <h1>{title}</h1>
<div class="tags" style="justify-content: center"> <div class="tags" style="justify-content: center">
<!--{tags.map(item => (--> {tags.map(item => (
<!-- <span class="tag">{item}</span>--> <span class="tag">{item}</span>
<!--))}--> ))}
</div> </div>
<hr /> <hr />
</header> </header>
+8 -12
View File
@@ -1,17 +1,13 @@
--- ---
import BaseLayout from '../../layouts/BaseLayout.astro'; import BaseLayout from '../../layouts/BaseLayout.astro';
import {getCollection} from "astro:content";
const title = 'Blog'; const title = 'Blog';
const description = 'Something that\'s supposed to be thoughts'; const description = 'Something that\'s supposed to be thoughts';
const permalink = `${Astro.site.href}blog`; const permalink = `${Astro.site.href}blog`;
let allPosts = [];
try {
allPosts = await Astro.glob('../../content/posts/*.md');
} catch (error) {
console.error('No blog posts found');
}
allPosts = allPosts.sort((a, b) => new Date(b.frontmatter.publishDate).valueOf() - new Date(a.frontmatter.publishDate).valueOf()); const posts= await getCollection('posts');
const allPosts= posts.sort((a, b) => new Date(b.data.publishDate).valueOf() - new Date(a.data.publishDate).valueOf());
--- ---
<BaseLayout title={title} description={description} permalink={permalink} current="blog"> <BaseLayout title={title} description={description} permalink={permalink} current="blog">
@@ -19,22 +15,22 @@ allPosts = allPosts.sort((a, b) => new Date(b.frontmatter.publishDate).valueOf()
<h1>Blog</h1> <h1>Blog</h1>
{allPosts.length === 0 && <p>No posts as of yet, hop back later!</p>} {allPosts.length === 0 && <p>No posts as of yet, hop back later!</p>}
{allPosts.map((post, index) => { {allPosts.map((post, index) => {
const href = `/blog/${post.file.split('/').pop().split('.').shift()}`; const href = `/blog/${post.slug}`;
return ( return (
<div> <div>
{ index !== 0 && <hr /> } { index !== 0 && <hr /> }
<div class="post-item"> <div class="post-item">
<h2> <h2>
<a href={href}>{post.frontmatter.title}</a> <a href={href}>{post.data.title}</a>
</h2> </h2>
<div class="tags"> <div class="tags">
{post.frontmatter.tags.map(item => ( {post.data.tags.map(item => (
<span class="tag">{item}</span> <span class="tag">{item}</span>
))} ))}
</div> </div>
<p>{post.frontmatter.description}</p> <p>{post.data.description}</p>
<div class="post-item-footer"> <div class="post-item-footer">
<span class="post-item-date">— {post.frontmatter.publishDate}</span> <span class="post-item-date">— {post.data.publishDate}</span>
</div> </div>
</div> </div>
</div> </div>