feat: dynamic feature posts.

This commit is contained in:
Yufan Sheng 2024-10-16 02:17:58 +08:00
parent 3a4808001e
commit 360c9d5c1a
Signed by: syhily
GPG Key ID: DEB186763C308C31
2 changed files with 42 additions and 20 deletions

View File

@ -46,7 +46,7 @@ const Options = z
.readonly(),
post: z.object({
sort: z.enum(['asc', 'desc']),
feature: z.array(z.string()).optional(),
feature: z.array(z.string()).min(3).optional(),
category: z.array(z.string()).optional(),
}),
pagination: z.object({
@ -163,7 +163,6 @@ const options: z.input<typeof Options> = {
assetPrefix: 'https://cat.yufan.me',
post: {
sort: 'desc',
feature: ['we-are-stranger', 'secret-of-boys-mind', 'my-darling'],
category: ['article', 'think', 'gossip', 'coding'],
},
pagination: {

View File

@ -8,29 +8,52 @@ interface Props {
}
const { posts } = Astro.props;
const historicalPosts = (): Post[] => {
if (posts.length <= options.settings.pagination.posts * 2) {
// No need to reviews the historial posts.
return [];
}
const now = new Date();
const radical = now.getMonth() + now.getDate();
const offset = Math.floor(posts.length / radical);
if (offset >= 3) {
return [posts[radical * (offset - 2) - 1], posts[radical * (offset - 1) - 1], posts[radical * offset - 1]];
}
return [];
};
const featurePosts = options.settings.post.feature ?? [];
const metas: Post[] = featurePosts
.map((slug) => posts.find((post) => post.slug === slug))
.flatMap((post) => (post == null ? [] : [post]))
.slice(0, 3);
const metas: Post[] =
featurePosts.length < 3
? historicalPosts()
: featurePosts
.map((slug) => posts.find((post) => post.slug === slug))
.flatMap((post) => (post == null ? [] : [post]))
.slice(0, 3);
---
<div class="list-top-pushes mb-3 mb-md-4 mb-lg-5">
<div class="container">
<div class="row gx-2 gx-md-3 list-grouped">
<div class="col-lg-8">
<FeaturePost post={metas[0]} />
</div>
<div class="col-lg-4 d-flex flex-column mt-2 mt-md-3 mt-lg-0">
<div class="row g-2 g-md-3">
<div class="col-6 col-lg-12">
<FeaturePost post={metas[1]} />
{
metas.length === 3 && (
<div class="list-top-pushes mb-3 mb-md-4 mb-lg-5">
<div class="container">
<div class="row gx-2 gx-md-3 list-grouped">
<div class="col-lg-8">
<FeaturePost post={metas[0]} />
</div>
<div class="col-6 col-lg-12">
<FeaturePost post={metas[2]} />
<div class="col-lg-4 d-flex flex-column mt-2 mt-md-3 mt-lg-0">
<div class="row g-2 g-md-3">
<div class="col-6 col-lg-12">
<FeaturePost post={metas[1]} />
</div>
<div class="col-6 col-lg-12">
<FeaturePost post={metas[2]} />
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
)
}