3 files changed, 112 insertions, 0 deletions
diff --git a/src/pages/notes/[...page].astro b/src/pages/notes/[...page].astro
new file mode 100644
index 0000000..fdc5af9
--- /dev/null
+++ b/src/pages/notes/[...page].astro
@@ -0,0 +1,63 @@
+---
+import { type CollectionEntry, getCollection } from "astro:content";
+import Pagination from "@/components/Paginator.astro";
+import Note from "@/components/note/Note.astro";
+import PageLayout from "@/layouts/Base.astro";
+import { collectionDateSort } from "@/utils/date";
+import type { GetStaticPaths, Page } from "astro";
+import { Icon } from "astro-icon/components";
+
+export const getStaticPaths = (async ({ paginate }) => {
+	const MAX_NOTES_PER_PAGE = 10;
+	const allNotes = await getCollection("note");
+	return paginate(allNotes.sort(collectionDateSort), { pageSize: MAX_NOTES_PER_PAGE });
+}) satisfies GetStaticPaths;
+
+interface Props {
+	page: Page<CollectionEntry<"note">>;
+	uniqueTags: string[];
+}
+
+const { page } = Astro.props;
+
+const meta = {
+	description: "Read my collection of notes",
+	title: "Notes",
+};
+
+const paginationProps = {
+	...(page.url.prev && {
+		prevUrl: {
+			text: "← Previous Page",
+			url: page.url.prev,
+		},
+	}),
+	...(page.url.next && {
+		nextUrl: {
+			text: "Next Page →",
+			url: page.url.next,
+		},
+	}),
+};
+---
+
+<PageLayout meta={meta}>
+	<section>
+		<h1 class="title mb-6 flex items-center gap-3">
+			Notes <a class="text-accent" href="/notes/rss.xml" target="_blank">
+				<span class="sr-only">RSS feed</span>
+				<Icon aria-hidden="true" class="h-6 w-6" focusable="false" name="mdi:rss" />
+			</a>
+		</h1>
+		<ul class="mt-6 space-y-8 text-start">
+			{
+				page.data.map((note) => (
+					<li class="">
+						<Note note={note} as="h2" isPreview />
+					</li>
+				))
+			}
+		</ul>
+		<Pagination {...paginationProps} />
+	</section>
+</PageLayout>
diff --git a/src/pages/notes/[...slug].astro b/src/pages/notes/[...slug].astro
new file mode 100644
index 0000000..2ce847d
--- /dev/null
+++ b/src/pages/notes/[...slug].astro
@@ -0,0 +1,31 @@
+---
+import { getCollection } from "astro:content";
+
+import Note from "@/components/note/Note.astro";
+import PageLayout from "@/layouts/Base.astro";
+import type { GetStaticPaths, InferGetStaticPropsType } from "astro";
+
+// if you're using an adaptor in SSR mode, getStaticPaths wont work -> https://docs.astro.build/en/guides/routing/#modifying-the-slug-example-for-ssr
+export const getStaticPaths = (async () => {
+	const allNotes = await getCollection("note");
+	return allNotes.map((note) => ({
+		params: { slug: note.id },
+		props: { note },
+	}));
+}) satisfies GetStaticPaths;
+
+export type Props = InferGetStaticPropsType<typeof getStaticPaths>;
+
+const { note } = Astro.props;
+
+const meta = {
+	description:
+		note.data.description ||
+		`Read about my note posted on: ${note.data.publishDate.toLocaleDateString()}`,
+	title: note.data.title,
+};
+---
+
+<PageLayout meta={meta}>
+	<Note as="h1" note={note} />
+</PageLayout>
diff --git a/src/pages/notes/rss.xml.ts b/src/pages/notes/rss.xml.ts
new file mode 100644
index 0000000..0f1f945
--- /dev/null
+++ b/src/pages/notes/rss.xml.ts
@@ -0,0 +1,18 @@
+import { getCollection } from "astro:content";
+import { siteConfig } from "@/site.config";
+import rss from "@astrojs/rss";
+
+export const GET = async () => {
+	const notes = await getCollection("note");
+
+	return rss({
+		title: siteConfig.title,
+		description: siteConfig.description,
+		site: import.meta.env.SITE,
+		items: notes.map((note) => ({
+			title: note.data.title,
+			pubDate: note.data.publishDate,
+			link: `notes/${note.id}/`,
+		})),
+	});
+};