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

View File

@ -8,29 +8,52 @@ interface Props {
} }
const { posts } = Astro.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 featurePosts = options.settings.post.feature ?? [];
const metas: Post[] = featurePosts
.map((slug) => posts.find((post) => post.slug === slug)) const metas: Post[] =
.flatMap((post) => (post == null ? [] : [post])) featurePosts.length < 3
.slice(0, 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"> metas.length === 3 && (
<div class="row gx-2 gx-md-3 list-grouped"> <div class="list-top-pushes mb-3 mb-md-4 mb-lg-5">
<div class="col-lg-8"> <div class="container">
<FeaturePost post={metas[0]} /> <div class="row gx-2 gx-md-3 list-grouped">
</div> <div class="col-lg-8">
<div class="col-lg-4 d-flex flex-column mt-2 mt-md-3 mt-lg-0"> <FeaturePost post={metas[0]} />
<div class="row g-2 g-md-3">
<div class="col-6 col-lg-12">
<FeaturePost post={metas[1]} />
</div> </div>
<div class="col-6 col-lg-12"> <div class="col-lg-4 d-flex flex-column mt-2 mt-md-3 mt-lg-0">
<FeaturePost post={metas[2]} /> <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>
</div> </div>
</div> )
</div> }