feat: wire public posts api

src/pages/Home.tsx

@@ -1,7 +1,7 @@
 import { ChevronRight } from "lucide-react";
 import { Link } from "react-router-dom";
 import { useEffect, useRef, useState } from "react";
-import { getJSON, itemsOrEmpty, type Category, type Resource } from "../api";
+import { getJSON, itemsOrEmpty, type Category } from "../api";
 import { CategoryIcon } from "../components/CategoryIcon";
 import { FigmaBanner } from "../components/FigmaBanner";
 import {
@@ -12,12 +12,17 @@ import { RecommendedCard } from "../components/RecommendedCard";
 import { SectionHeader } from "../components/SectionHeader";
 import { langQuery, useI18n } from "../i18n";
 import { categoryCardLines } from "../utils/categoryDisplay";
+import {
+  postToResource,
+  type PostBackedResource,
+} from "../utils/postResourceAdapter";
+import type { Post } from "../types/post";
 
 export function Home() {
   const { t, lang } = useI18n();
   const [cats, setCats] = useState<Category[]>([]);
-  const [rec, setRec] = useState<Resource[]>([]);
-  const [latest, setLatest] = useState<Resource[]>([]);
+  const [rec, setRec] = useState<PostBackedResource[]>([]);
+  const [latest, setLatest] = useState<PostBackedResource[]>([]);
   const [err, setErr] = useState<string | null>(null);
   const recRowRef = useRef<HTMLDivElement>(null);
   const [canScrollRec, setCanScrollRec] = useState(false);
@@ -26,18 +31,26 @@ export function Home() {
     const q = `?lang=${encodeURIComponent(langQuery(lang))}`;
     Promise.all([
       getJSON<Category[]>(`/api/categories${q}`),
-      getJSON<{ items: Resource[] }>(`/api/resources/recommended${q}&limit=12`),
-      getJSON<{ items: Resource[] }>(`/api/resources/latest${q}&limit=8`),
+      getJSON<{ items: Post[] }>(`/api/posts/recommended${q}&limit=12`),
+      getJSON<{ items: Post[] }>(`/api/posts/latest${q}&limit=8`),
     ])
       .then(([c, r, l]) => {
         setCats(itemsOrEmpty(c));
-        setRec(itemsOrEmpty(r.items));
-        setLatest(itemsOrEmpty(l.items));
+        setRec(
+          itemsOrEmpty(r.items).map((post) =>
+            postToResource(post, lang, itemsOrEmpty(c)),
+          ),
+        );
+        setLatest(
+          itemsOrEmpty(l.items).map((post) =>
+            postToResource(post, lang, itemsOrEmpty(c)),
+          ),
+        );
       })
       .catch((e) => setErr(String(e)));
   }, [lang]);
 
-  const iconKeyForResource = (r: Resource) =>
+  const iconKeyForResource = (r: PostBackedResource) =>
     cats.find((c) => c.id === r.categoryId)?.iconKey ?? "folder";
 
   useEffect(() => {