Content collections

[jbmoelker]

As a website visitor,
I want content pages organised in collections,
so I can easily find similar / related content

• A content editor must be able to organise pages in collections (or tags?)
• A Collection Route must use dynamic (server-side) rendering, so that it supports pagination, filtering (incl searching) and sorting
• A Collection Block can show items from a collection (or multiple) with filters and sorting applied and a limit on the number of items. A layout property can define its appearance

[jbmoelker]

Collection routes can take advantage of Astro's built-in pagination feature:

---
// pages/collections/[slug]/[page].astro

export async function getStaticPaths({ paginate }) {
  const records = await datocmsCollection(/* ... */); // filter on `slug`
  return paginate(records, { pageSize: 10 });
}

// All paginated data is passed on the "page" prop
const records = Astro.props.page.data; // subset of all records, based on pageSize above
const { total, start, end, currentPage, ...andMoreProps } = Astro.props.page;

* I now see nested pagination requires a bit more work in getStaticPaths as it should return all paths for all slug collections.