Publish the first trust story collection

src/pages/index.astro

@@ -2,7 +2,6 @@
 import { getCollection } from 'astro:content';
 import FrontCard from '../components/FrontCard.astro';
 import BaseLayout from '../layouts/BaseLayout.astro';
-import { guidesByReview, newestFirst } from '../lib/content';
 import { site } from '../site.config';
 
 interface FrontPageItem {
@@ -17,99 +16,23 @@ interface FrontPageItem {
   tone: 'paper' | 'blue' | 'ink' | 'soft' | 'amend';
 }
 
-const stories = newestFirst(await getCollection('stories', ({ data }) => !data.draft));
-const briefings = newestFirst(await getCollection('briefings', ({ data }) => !data.draft));
-const guides = guidesByReview(await getCollection('guides', ({ data }) => !data.draft));
-const episodes = newestFirst(await getCollection('episodes', ({ data }) => !data.draft));
-
-const featured = stories.find(({ data }) => data.featured) ?? stories[0];
-const latestBriefing = briefings[0];
-
-const frontPageItems: FrontPageItem[] = [];
-
-if (featured) {
-  frontPageItems.push({
-    kind: 'Story',
-    title: featured.data.title,
-    description: featured.data.description,
-    href: `/stories/${featured.id}`,
-    date: featured.data.published,
-    meta: `By ${featured.data.author} · ${featured.data.status}`,
-    image: featured.data.image,
-    imageAlt: featured.data.imageAlt,
-    tone: featured.data.image ? 'paper' : 'blue',
-  });
-}
-
-if (latestBriefing) {
-  frontPageItems.push({
-    kind: `Briefing ${String(latestBriefing.data.issue).padStart(3, '0')}`,
-    title: latestBriefing.data.title,
-    description: latestBriefing.data.description,
-    href: `/briefing/${latestBriefing.id}`,
-    date: latestBriefing.data.published,
-    meta: 'This Week in Trust',
-    tone: 'paper',
-  });
-}
-
-const remainingItems: FrontPageItem[] = [
-  ...stories
-    .filter((entry) => entry.id !== featured?.id)
-    .map((entry, index): FrontPageItem => ({
-      kind: 'Story',
-      title: entry.data.title,
-      description: entry.data.description,
-      href: `/stories/${entry.id}`,
-      date: entry.data.published,
-      meta: `By ${entry.data.author} · ${entry.data.status}`,
-      image: entry.data.image,
-      imageAlt: entry.data.imageAlt,
-      tone: entry.data.image ? 'paper' : index % 2 === 0 ? 'soft' : 'paper',
-    })),
-  ...briefings.slice(1).map((entry): FrontPageItem => ({
-    kind: `Briefing ${String(entry.data.issue).padStart(3, '0')}`,
+const stories = (await getCollection('stories', ({ data }) => !data.draft))
+  .sort((a, b) => a.data.editorialOrder - b.data.editorialOrder);
+const toneCycle = ['blue', 'paper', 'ink', 'soft', 'amend', 'paper'] as const;
+const frontPageItems: FrontPageItem[] = stories
+  .filter(({ data }) => data.homepage)
+  .slice(0, 9)
+  .map((entry, index) => ({
+    kind: entry.data.section,
     title: entry.data.title,
     description: entry.data.description,
-    href: `/briefing/${entry.id}`,
-    date: entry.data.published,
-    meta: 'This Week in Trust',
-    tone: 'paper',
-  })),
-  ...episodes.map((entry): FrontPageItem => ({
-    kind: `Podcast ${String(entry.data.episode).padStart(2, '0')}`,
-    title: entry.data.title,
-    description: entry.data.description,
-    href: `/podcast/${entry.id}`,
-    date: entry.data.published,
-    meta: [entry.data.duration, ...entry.data.guests].filter(Boolean).join(' · '),
-    tone: 'ink',
-  })),
-  ...guides.map((entry): FrontPageItem => ({
-    kind: 'Field guide',
-    title: entry.data.title,
-    description: entry.data.description,
-    href: `/guides/${entry.id}`,
-    date: entry.data.reviewed,
-    meta: `Reviewed · ${entry.data.status}`,
-    tone: 'soft',
-  })),
-].sort((a, b) => (b.date?.valueOf() ?? 0) - (a.date?.valueOf() ?? 0));
-
-if (site.book.enabled) {
-  remainingItems.unshift({
-    kind: 'Book',
-    title: site.book.title,
-    description: site.book.description,
-    href: '/book',
-    meta: site.book.sampleUrl ? 'Sample available' : undefined,
-    image: site.book.cover || undefined,
-    imageAlt: site.book.cover ? `${site.book.title} cover` : undefined,
-    tone: site.book.cover ? 'paper' : 'amend',
-  });
-}
-
-frontPageItems.push(...remainingItems);
+    href: `/stories/${entry.id}`,
+    date: index === 0 ? entry.data.published : undefined,
+    meta: entry.data.tags.slice(0, 2).join(' · '),
+    image: entry.data.image,
+    imageAlt: entry.data.imageAlt,
+    tone: entry.data.frontTone ?? (entry.data.image ? 'paper' : toneCycle[index % toneCycle.length]),
+  }));
 
 const sizeCycle = ['wide', 'standard', 'compact', 'compact', 'compact'] as const;
 ---
@@ -117,7 +40,7 @@ const sizeCycle = ['wide', 'standard', 'compact', 'compact', 'compact'] as const
 <BaseLayout>
   <section class="front-grid shell" aria-labelledby="front-page-title">
     <h1 class="visually-hidden" id="front-page-title">{site.title}</h1>
-    {frontPageItems.slice(0, 12).map((item, index) => (
+    {frontPageItems.map((item, index) => (
       <FrontCard
         kind={item.kind}
         title={item.title}
@@ -132,6 +55,9 @@ const sizeCycle = ['wide', 'standard', 'compact', 'compact', 'compact'] as const
       />
     ))}
   </section>
+  <div class="more-stories shell">
+    <a href="/stories">Read more <span>{Math.max(0, stories.length - frontPageItems.length)} more stories</span></a>
+  </div>
 </BaseLayout>
 
 <style>
@@ -144,6 +70,43 @@ const sizeCycle = ['wide', 'standard', 'compact', 'compact', 'compact'] as const
     background: var(--rule);
   }
 
+  .more-stories {
+    display: flex;
+    justify-content: center;
+    padding: clamp(1.5rem, 4vw, 3rem) 0 0;
+  }
+
+  .more-stories a {
+    display: inline-flex;
+    min-width: min(100%, 320px);
+    align-items: center;
+    justify-content: space-between;
+    gap: 2rem;
+    padding: 0.9rem 1rem;
+    border: 1px solid var(--ink);
+    font-size: 0.84rem;
+    font-weight: 650;
+    text-decoration: none;
+  }
+
+  .more-stories a:hover {
+    background: var(--ink);
+    color: var(--paper);
+  }
+
+  .more-stories span {
+    color: var(--muted);
+    font-family: 'IBM Plex Mono', monospace;
+    font-size: 0.62rem;
+    font-weight: 400;
+    letter-spacing: 0.04em;
+    text-transform: uppercase;
+  }
+
+  .more-stories a:hover span {
+    color: inherit;
+  }
+
   :global(#main + footer) {
     margin-top: clamp(2.5rem, 6vw, 5rem);
   }