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

* 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
+1
View File
@@ -8,6 +8,7 @@ export const SITE: Site = {
ogImage: "astropaper-og.jpg", ogImage: "astropaper-og.jpg",
lightAndDarkMode: true, lightAndDarkMode: true,
postPerPage: 3, postPerPage: 3,
scheduledPostMargin: 15 * 60 * 1000, // 15 minutes
}; };
export const LOCALE = { export const LOCALE = {
@@ -1,6 +1,7 @@
--- ---
author: Sat Naing author: Sat Naing
pubDatetime: 2022-09-23T04:58:53Z pubDatetime: 2022-09-23T04:58:53Z
modDatetime: 2024-01-15T13:05:56.066Z
title: How to configure AstroPaper theme title: How to configure AstroPaper theme
slug: how-to-configure-astropaper-theme slug: how-to-configure-astropaper-theme
featured: true featured: true
@@ -31,20 +32,22 @@ export const SITE = {
ogImage: "astropaper-og.jpg", ogImage: "astropaper-og.jpg",
lightAndDarkMode: true, lightAndDarkMode: true,
postPerPage: 3, postPerPage: 3,
scheduledPostMargin: 15 * 60 * 1000, // 15 minutes
}; };
``` ```
Here are SITE configuration options Here are SITE configuration options
| Options | Description | | Options | Description |
| ------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------ | | --------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `website` | Your deployed website url | | `website` | Your deployed website url |
| `author` | Your name | | `author` | Your name |
| `desc` | Your site description. Useful for SEO and social media sharing. | | `desc` | Your site description. Useful for SEO and social media sharing. |
| `title` | Your site name | | `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. | | `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. | | `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) | | `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 ## Configuring locale
+4 -2
View File
@@ -6,12 +6,14 @@ import Main from "@layouts/Main.astro";
import Header from "@components/Header.astro"; import Header from "@components/Header.astro";
import Footer from "@components/Footer.astro"; import Footer from "@components/Footer.astro";
import SearchBar from "@components/Search"; 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 posts = await getCollection("blog", ({ data }) => !data.draft);
const sortedPosts = getSortedPosts(posts);
// List of items to search in // List of items to search in
const searchList = posts.map(({ data, slug }) => ({ const searchList = sortedPosts.map(({ data, slug }) => ({
title: data.title, title: data.title,
description: data.description, description: data.description,
data, data,
+1
View File
@@ -8,6 +8,7 @@ export type Site = {
ogImage?: string; ogImage?: string;
lightAndDarkMode: boolean; lightAndDarkMode: boolean;
postPerPage: number; postPerPage: number;
scheduledPostMargin: number;
}; };
export type SocialObjects = { export type SocialObjects = {
+2 -1
View File
@@ -1,8 +1,9 @@
import type { CollectionEntry } from "astro:content"; import type { CollectionEntry } from "astro:content";
import postFilter from "./postFilter";
const getSortedPosts = (posts: CollectionEntry<"blog">[]) => { const getSortedPosts = (posts: CollectionEntry<"blog">[]) => {
return posts return posts
.filter(({ data }) => !data.draft) .filter(postFilter)
.sort( .sort(
(a, b) => (a, b) =>
Math.floor( Math.floor(
+3 -2
View File
@@ -1,5 +1,6 @@
import { slugifyStr } from "./slugify"; import { slugifyStr } from "./slugify";
import type { CollectionEntry } from "astro:content"; import type { CollectionEntry } from "astro:content";
import postFilter from "./postFilter";
interface Tag { interface Tag {
tag: string; tag: string;
@@ -7,8 +8,8 @@ interface Tag {
} }
const getUniqueTags = (posts: CollectionEntry<"blog">[]) => { const getUniqueTags = (posts: CollectionEntry<"blog">[]) => {
const filteredPosts = posts.filter(({ data }) => !data.draft); const tags: Tag[] = posts
const tags: Tag[] = filteredPosts .filter(postFilter)
.flatMap(post => post.data.tags) .flatMap(post => post.data.tags)
.map(tag => ({ tag: slugifyStr(tag), tagName: tag })) .map(tag => ({ tag: slugifyStr(tag), tagName: tag }))
.filter( .filter(
+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;