Add top blog

README.md

@@ -42,7 +42,7 @@ A static blog template built with [Astro](https://astro.build).
 
 ### Top Blog
 
-
+In [config](./src/config.ts), set the `topBlog` to the title of the desired top blog
 
 ## 🚀 How to Use
 

src/components/PostPage.astro

@@ -1,19 +1,14 @@
 ---
 import { getPostUrlBySlug } from '@utils/url-utils'
 import PostCard from './PostCard.astro'
-import { siteConfig } from '../config'
 
 const { page } = Astro.props
 
 let delay = 0
 const interval = 50
-
-const topBlogEntry = page.data.filter(entry => entry.title == siteConfig.topBlog)[0]
-const orderedData = [topBlogEntry].concat(page.data.filter(entry => entry.title != siteConfig.topBlog))
-
 ---
 <div class="transition flex flex-col rounded-[var(--radius-large)] bg-[var(--card-bg)] py-1 md:py-0 md:bg-transparent md:gap-4 mb-4">
-    {orderedData.map((entry: {
+    {page.data.map((entry: {
         data: {
             draft: boolean;
             title: string;

src/utils/content-utils.ts

@@ -2,6 +2,7 @@ import { getCollection } from 'astro:content'
 import type { BlogPostData } from '@/types/config'
 import I18nKey from '@i18n/i18nKey'
 import { i18n } from '@i18n/translation'
+import { siteConfig } from '../config'
 
 export async function getSortedPosts(): Promise<
   { body: string, data: BlogPostData; slug: string }[]
@@ -12,6 +13,13 @@ export async function getSortedPosts(): Promise<
 
   const sorted = allBlogPosts.sort(
     (a: { data: BlogPostData }, b: { data: BlogPostData }) => {
+      if (a.data.title == siteConfig.topBlog) {
+        return -1
+      }
+      if (b.data.title == siteConfig.topBlog) {
+        return 1
+      }
+
       const dateA = new Date(a.data.published)
       const dateB = new Date(b.data.published)
       return dateA > dateB ? -1 : 1