mirror of
				https://github.com/valentineus/popov.link.git
				synced 2025-11-04 06:49:45 +03:00 
			
		
		
		
	refactor: remove Pagination component and restructure blog page
- Deleted the Pagination component as it is no longer needed. - Refactored the blog page to directly display posts without pagination. - Introduced a new index page to list all blog posts in a single view.
This commit is contained in:
		@@ -1,35 +0,0 @@
 | 
			
		||||
---
 | 
			
		||||
type Props = {
 | 
			
		||||
	readonly nextUrl?: string;
 | 
			
		||||
	readonly prevUrl?: string;
 | 
			
		||||
};
 | 
			
		||||
 | 
			
		||||
const { nextUrl, prevUrl } = Astro.props;
 | 
			
		||||
---
 | 
			
		||||
 | 
			
		||||
<style lang="scss">
 | 
			
		||||
	div {
 | 
			
		||||
		text-align: center;
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	span {
 | 
			
		||||
		margin: 0 2em;
 | 
			
		||||
	}
 | 
			
		||||
</style>
 | 
			
		||||
 | 
			
		||||
<div>
 | 
			
		||||
	{
 | 
			
		||||
		prevUrl && (
 | 
			
		||||
			<span>
 | 
			
		||||
				<a href={prevUrl}>< Prev</a>
 | 
			
		||||
			</span>
 | 
			
		||||
		)
 | 
			
		||||
	}
 | 
			
		||||
	{
 | 
			
		||||
		nextUrl && (
 | 
			
		||||
			<span>
 | 
			
		||||
				<a href={nextUrl}>Next ></a>
 | 
			
		||||
			</span>
 | 
			
		||||
		)
 | 
			
		||||
	}
 | 
			
		||||
</div>
 | 
			
		||||
@@ -1,33 +0,0 @@
 | 
			
		||||
---
 | 
			
		||||
import type { GetStaticPaths, InferGetStaticPropsType } from "astro";
 | 
			
		||||
import { getCollection } from "astro:content";
 | 
			
		||||
import Layout from "../layouts/BaseLayout.astro";
 | 
			
		||||
import Pagination from "../components/Pagination.astro";
 | 
			
		||||
import PostSummary from "../components/PostSummary.astro";
 | 
			
		||||
 | 
			
		||||
type Props = InferGetStaticPropsType<typeof getStaticPaths>;
 | 
			
		||||
 | 
			
		||||
export const getStaticPaths = (async ({ paginate }) => {
 | 
			
		||||
	const posts = await getCollection("blog", ({ data }) => {
 | 
			
		||||
		return data.draft !== true;
 | 
			
		||||
	});
 | 
			
		||||
 | 
			
		||||
	posts.sort((a, b) => b.data.pubDate.getTime() - a.data.pubDate.getTime());
 | 
			
		||||
 | 
			
		||||
	return paginate(posts, {
 | 
			
		||||
		pageSize: 10,
 | 
			
		||||
	});
 | 
			
		||||
}) satisfies GetStaticPaths;
 | 
			
		||||
 | 
			
		||||
const { page } = Astro.props;
 | 
			
		||||
---
 | 
			
		||||
 | 
			
		||||
<Layout>
 | 
			
		||||
	<section style={{ "margin-top": "3rem" }}>
 | 
			
		||||
		{page.data.map((post) => <PostSummary post={post} />)}
 | 
			
		||||
	</section>
 | 
			
		||||
 | 
			
		||||
	<section>
 | 
			
		||||
		<Pagination nextUrl={page.url.next} prevUrl={page.url.prev} />
 | 
			
		||||
	</section>
 | 
			
		||||
</Layout>
 | 
			
		||||
							
								
								
									
										17
									
								
								src/pages/index.astro
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										17
									
								
								src/pages/index.astro
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,17 @@
 | 
			
		||||
---
 | 
			
		||||
import { getCollection } from "astro:content";
 | 
			
		||||
import Layout from "../layouts/BaseLayout.astro";
 | 
			
		||||
import PostSummary from "../components/PostSummary.astro";
 | 
			
		||||
 | 
			
		||||
const posts = await getCollection("blog", ({ data }) => {
 | 
			
		||||
	return data.draft !== true;
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
posts.sort((a, b) => b.data.pubDate.getTime() - a.data.pubDate.getTime());
 | 
			
		||||
---
 | 
			
		||||
 | 
			
		||||
<Layout>
 | 
			
		||||
	<section style={{ "margin-top": "3rem" }}>
 | 
			
		||||
		{posts.map((post) => <PostSummary post={post} />)}
 | 
			
		||||
	</section>
 | 
			
		||||
</Layout>
 | 
			
		||||
		Reference in New Issue
	
	Block a user