Qihan/MyBlog-Next
1
0
Fork 0
mirror of https://github.com/ChenQihan666/MyBlog-Next.git synced 2026-08-14 07:33:07 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: hide posts in Prod with future pubDatetime (#234)

Browse Source 
* Hide posts when PubDateTime is not reached

* refactor: extract filter logic into a file

* docs: update SITE config docs

---------

Co-authored-by: satnaing <satnaingdev@gmail.com>
This commit is contained in:
David Legrand
2024-01-15 14:10:02 +01:00
committed by GitHub
parent 742baff2c9
commit 3efa05cc10
7 changed files with 34 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/config.ts
+1
View File
@@ -8,6 +8,7 @@ export const SITE: Site = {
ogImage: "astropaper-og.jpg",
lightAndDarkMode: true,
postPerPage: 3,
scheduledPostMargin: 15 * 60 * 1000, // 15 minutes
};
export const LOCALE = {
src/content/blog/how-to-configure-astropaper-theme.md
+12 -9
View File
@@ -1,6 +1,7 @@
---
author: Sat Naing
pubDatetime: 2022-09-23T04:58:53Z
modDatetime: 2024-01-15T13:05:56.066Z
title: How to configure AstroPaper theme
slug: how-to-configure-astropaper-theme
featured: true
@@ -31,20 +32,22 @@ export const SITE = {
ogImage: "astropaper-og.jpg",
lightAndDarkMode: true,
postPerPage: 3,
scheduledPostMargin: 15 * 60 * 1000, // 15 minutes
};
```
Here are SITE configuration options
| Options | Description |
| ------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| `website` | Your deployed website url |
| `author` | Your name |
| `desc` | Your site description. Useful for SEO and social media sharing. |
| `title` | Your site name |
| `ogImage` | Your default OG image for the site. Useful for social media sharing. OG images can be an external image url or they can be placed under `/public` directory. |
| `lightAndDarkMode` | Enable or disable `light & dark mode` for the website. If disabled, primary color scheme will be used. This option is enabled by default. |
| `postPerPage` | You can specify how many posts will be displayed in each posts page. (eg: if you set SITE.postPerPage to 3, each page will only show 3 posts per page) |
| Options | Description |
| --------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `website` | Your deployed website url |
| `author` | Your name |
| `desc` | Your site description. Useful for SEO and social media sharing. |
| `title` | Your site name |
| `ogImage` | Your default OG image for the site. Useful for social media sharing. OG images can be an external image url or they can be placed under `/public` directory. |
| `lightAndDarkMode` | Enable or disable `light & dark mode` for the website. If disabled, primary color scheme will be used. This option is enabled by default. |
| `postPerPage` | You can specify how many posts will be displayed in each posts page. (eg: if you set SITE.postPerPage to 3, each page will only show 3 posts per page) |
| `scheduledPostMargin` | In Production mode, posts with a future `pubDatetime` will not be visible. However, if a post's `pubDatetime` is within the next 15 minutes, it will be visible. You can set `scheduledPostMargin` if you don't like the default 15 minutes margin. |
## Configuring locale
src/pages/search.astro
+4 -2
View File
@@ -6,12 +6,14 @@ import Main from "@layouts/Main.astro";
import Header from "@components/Header.astro";
import Footer from "@components/Footer.astro";
import SearchBar from "@components/Search";
import getSortedPosts from "@utils/getSortedPosts";
// Retrieve all articles
// Retrieve all published articles
const posts = await getCollection("blog", ({ data }) => !data.draft);
const sortedPosts = getSortedPosts(posts);
// List of items to search in
const searchList = posts.map(({ data, slug }) => ({
const searchList = sortedPosts.map(({ data, slug }) => ({
title: data.title,
description: data.description,
data,
src/types.ts
+1
View File
@@ -8,6 +8,7 @@ export type Site = {
ogImage?: string;
lightAndDarkMode: boolean;
postPerPage: number;
scheduledPostMargin: number;
};
export type SocialObjects = {
src/utils/getSortedPosts.ts
+2 -1
View File
@@ -1,8 +1,9 @@
import type { CollectionEntry } from "astro:content";
import postFilter from "./postFilter";
const getSortedPosts = (posts: CollectionEntry<"blog">[]) => {
return posts
.filter(({ data }) => !data.draft)
.filter(postFilter)
.sort(
(a, b) =>
Math.floor(
src/utils/getUniqueTags.ts
+3 -2
View File
@@ -1,5 +1,6 @@
import { slugifyStr } from "./slugify";
import type { CollectionEntry } from "astro:content";
import postFilter from "./postFilter";
interface Tag {
tag: string;
@@ -7,8 +8,8 @@ interface Tag {
}
const getUniqueTags = (posts: CollectionEntry<"blog">[]) => {
const filteredPosts = posts.filter(({ data }) => !data.draft);
const tags: Tag[] = filteredPosts
const tags: Tag[] = posts
.filter(postFilter)
.flatMap(post => post.data.tags)
.map(tag => ({ tag: slugifyStr(tag), tagName: tag }))
.filter(
src/utils/postFilter.ts
+11
View File
@@ -0,0 +1,11 @@
import { SITE } from "@config";
import type { CollectionEntry } from "astro:content";
const postFilter = ({ data }: CollectionEntry<"blog">) => {
const isPublishTimePassed =
Date.now() >
new Date(data.pubDatetime).getTime() - SITE.scheduledPostMargin;
return !data.draft && (import.meta.env.DEV || isPublishTimePassed);
};
export default postFilter;