From 582051ba2094aeb7b6ffe497df075439aaf5ebbf Mon Sep 17 00:00:00 2001
From: June <self@breadone.net>
Date: Sat, 22 Nov 2025 17:53:09 +1300
Subject: [PATCH] Add recent albums section at index

---
 web/src/components/index/recentAlbums.astro | 36 +++++++++++++++++++++
 web/src/pages/index.astro                   | 11 +++----
 2 files changed, 41 insertions(+), 6 deletions(-)
 create mode 100644 web/src/components/index/recentAlbums.astro

diff --git a/web/src/components/index/recentAlbums.astro b/web/src/components/index/recentAlbums.astro
new file mode 100644
index 0000000..f94609f
--- /dev/null
+++ b/web/src/components/index/recentAlbums.astro
@@ -0,0 +1,36 @@
+---
+import SummaryCard from "./summaryCard.astro";
+import { authPB } from "@utils/pocketbase";
+import { getFormattedDate } from "@utils/date";
+
+const pb = await authPB()
+
+const albums = await pb.collection('albums').getList(1, 3, {
+	sort: '-created',
+})
+
+const postImages = await Promise.all( albums.items.map(a => pb.files.getURL(a, a.images[0])) )
+
+---
+<SummaryCard
+    title="Recent Albums",
+    titleLink="/albums"
+>
+    <div class="flex flex-col md:flex-row gap-4 md:gap-4">
+        {
+            albums.items.map((p, i) => (
+            <div class="flex md:flex-col flex-row gap-3 md:gap-2 flex-1">
+                <a href={`/albums/${encodeURI(p.title)}`} class="shrink-0">
+                    <img class="w-24 h-24 md:w-full md:h-48 object-cover rounded-sm" src={postImages[i]} alt={p.title}/>
+                </a>
+
+                <div class="flex flex-col justify-start md:justify-start">
+                    <a href={`/albums/${encodeURI(p.title)}`} class="b1-no-underline line-clamp-2 md:line-clamp-none">
+                        {p.title}
+                    </a>
+                </div>
+            </div>
+            ))
+        }
+    </div>
+</SummaryCard>
\ No newline at end of file
diff --git a/web/src/pages/index.astro b/web/src/pages/index.astro
index 371aabd..dae29e1 100644
--- a/web/src/pages/index.astro
+++ b/web/src/pages/index.astro
@@ -1,6 +1,7 @@
 ---
 import Base from "src/layout/Base.astro"
 import RecentPosts from "@components/index/recentPosts"
+import RecentAlbums from "@components/index/recentAlbums"
 
 export const prerender = false
 
@@ -12,15 +13,13 @@ export const prerender = false
 
 		<p>This is the third major iteration of the website, and by far the most flexible and best designed (imo!)</p><br>
 
-		<!-- todo: write this post lmfao -->
-		<!-- <p>If you're interested, I actually wrote <a href="/posts/design-for-purpose">a post</a> about the new design and all that went into it.</p><br> -->
-
-		<p>I'm... really not sure what to put on this landing page, make sure to check out some of the photos and posts I've added recently, I've been totally revamping those too and I'm really proud of this batch.</p><br>
+		<p>I'm... really not sure what else to put on this landing page, make sure to check out some of the photos and posts I've added recently, I've been totally revamping those too and I'm really proud of this batch.</p><br>
 
 		<p>Hope you enjoy your time here :)</p>
 	</div>
 
-	<!-- <div slot="content" class="md:py-10">
+	<div slot="content" class="md:py-10 space-y-4">
+		<RecentAlbums/>
 		<RecentPosts/>
-	</div> -->
+	</div>
 </Base>