{post.data.title}

- < Home - • Posted {formattedDate} by {post.data.author} @@ -46,10 +48,6 @@ const formattedDate = dayjs(post.data.pubDate.toString()).format("MMMM DD, YYYY"

{post.data.title}

-- cgit v1.2.3 From 6a47cb4165e317721d0ebb7ff8bc33c53fa265dd Mon Sep 17 00:00:00 2001 From: Valentin Popov Date: Tue, 10 Jun 2025 14:01:27 +0000 Subject: 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. --- src/components/Pagination.astro | 35 ----------------------------------- src/pages/[...page].astro | 33 --------------------------------- src/pages/index.astro | 17 +++++++++++++++++ 3 files changed, 17 insertions(+), 68 deletions(-) delete mode 100644 src/components/Pagination.astro delete mode 100644 src/pages/[...page].astro create mode 100644 src/pages/index.astro (limited to 'src') diff --git a/src/components/Pagination.astro b/src/components/Pagination.astro deleted file mode 100644 index 0d656df..0000000 --- a/src/components/Pagination.astro +++ /dev/null @@ -1,35 +0,0 @@ ---- -type Props = { - readonly nextUrl?: string; - readonly prevUrl?: string; -}; - -const { nextUrl, prevUrl } = Astro.props; ---- - - - -

- { - prevUrl && ( - - < Prev - - ) - } - { - nextUrl && ( - - Next > - - ) - } -

diff --git a/src/pages/[...page].astro b/src/pages/[...page].astro deleted file mode 100644 index 6d513b2..0000000 --- a/src/pages/[...page].astro +++ /dev/null @@ -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; - -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; ---- - - -

- {page.data.map((post) => )} -

- -

- diff --git a/src/pages/index.astro b/src/pages/index.astro new file mode 100644 index 0000000..56ccdff --- /dev/null +++ b/src/pages/index.astro @@ -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()); +--- + + +

+ {posts.map((post) => )} +

+ -- cgit v1.2.3 From 4e8c17a6eadebf847e497752a6f0bda25cd29f49 Mon Sep 17 00:00:00 2001 From: Valentin Popov Date: Tue, 10 Jun 2025 14:05:48 +0000 Subject: chore: update blog routing and header link - Removed the redirects for the blog route in the configuration. - Updated the blog link in the Header component to include a trailing slash. - Added a new index page for the blog to display all posts. --- astro.config.mjs | 6 ------ src/components/Header.astro | 2 +- src/pages/blog/index.astro | 17 +++++++++++++++++ 3 files changed, 18 insertions(+), 7 deletions(-) create mode 100644 src/pages/blog/index.astro (limited to 'src') diff --git a/astro.config.mjs b/astro.config.mjs index d8e7708..07e5d30 100644 --- a/astro.config.mjs +++ b/astro.config.mjs @@ -15,10 +15,4 @@ export default defineConfig({ theme: "vitesse-dark", }, }, - redirects: { - "/blog": { - destination: "/", - status: 301, - }, - }, }); diff --git a/src/components/Header.astro b/src/components/Header.astro index b371be6..4571a5c 100644 --- a/src/components/Header.astro +++ b/src/components/Header.astro @@ -18,5 +18,5 @@

Home - Blog + Blog

diff --git a/src/pages/blog/index.astro b/src/pages/blog/index.astro new file mode 100644 index 0000000..210a7a1 --- /dev/null +++ b/src/pages/blog/index.astro @@ -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()); +--- + + +

+ {posts.map((post) => )} +

+ -- cgit v1.2.3 From 9ebcd40f60ffa393a56db850b6a6d0cf15ef4211 Mon Sep 17 00:00:00 2001 From: Valentin Popov Date: Tue, 10 Jun 2025 14:17:48 +0000 Subject: feat: create PostElement component for blog post display - Added a new PostElement component to render individual blog posts with title, publication date, and reading time. - Updated the blog index page to utilize PostElement instead of PostSummary for improved post presentation. --- src/components/PostElement.astro | 32 ++++++++++++++++++++++++++++++++ src/pages/blog/index.astro | 6 ++++-- 2 files changed, 36 insertions(+), 2 deletions(-) create mode 100644 src/components/PostElement.astro (limited to 'src') diff --git a/src/components/PostElement.astro b/src/components/PostElement.astro new file mode 100644 index 0000000..703189e --- /dev/null +++ b/src/components/PostElement.astro @@ -0,0 +1,32 @@ +--- +import { type CollectionEntry } from "astro:content"; +import dayjs from "dayjs"; + +type Props = { + readonly post: CollectionEntry<"blog">; +}; + +const { post } = Astro.props; +const { remarkPluginFrontmatter } = await post.render(); +const formattedDate = dayjs(post.data.pubDate.toString()).format("MMMM DD, YYYY"); +--- + + + +

+ {post.data.title} +

+ + {formattedDate} + • + {remarkPluginFrontmatter.minutesRead} + +

diff --git a/src/pages/blog/index.astro b/src/pages/blog/index.astro index 210a7a1..48d33e8 100644 --- a/src/pages/blog/index.astro +++ b/src/pages/blog/index.astro @@ -1,7 +1,7 @@ --- import { getCollection } from "astro:content"; import Layout from "../../layouts/BaseLayout.astro"; -import PostSummary from "../../components/PostSummary.astro"; +import PostElement from "../../components/PostElement.astro"; const posts = await getCollection("blog", ({ data }) => { return data.draft !== true; @@ -12,6 +12,8 @@ posts.sort((a, b) => b.data.pubDate.getTime() - a.data.pubDate.getTime());

- {posts.map((post) => )} +

)} +

-- cgit v1.2.3