Show most recent 4 posts on homepage by default, allowing `home: fals…

…e` to opt out or `home: pin` to make sticky.

content/_includes/post.macros.njk

@@ -787,7 +787,7 @@ params:
   banner_title='Featured Posts',
   class=none
 ) %}
-  {%- set featured = collections.all | isHome | pageYears | reverse | onlyShow(limit) -%}
+  {%- set featured = collections._post | isHome(limit) -%}
   {%- if featured | length -%}
     {{ list(
       featured,

content/blog/2021/containerqueries.md

@@ -17,7 +17,6 @@ summary: |
   and proposing for years, has finally made its debut in a browser. Well, sort
   of. Here we'll explain what container queries are, how they work, and what
   other features they might come with once fully supported in browsers.
-home: true
 ---
 
 {% import 'embed.macros.njk' as embed %}

content/blog/2022/headed-playwright-in-docker.md

@@ -14,7 +14,6 @@ image:
 summary: |
   Learn how to run Playwright in headed mode to interact with the browser's user
   interface from outside Docker containers.
-home: true
 ---
 
 [Playwright](https://playwright.dev/) is a test runner that uses real browsers

content/blog/2023/when-to-choose-a-responsive-web-app.md

@@ -30,7 +30,6 @@ summary: |
   one platform over another.
   Let's start with responsive web apps.
 card: large
-home: true
 ---
 
 {% import 'embed.macros.njk' as embed %}

content/blog/wingingit/winging-it-01.md

@@ -18,7 +18,6 @@ summary: |
   If you've ever found yourself in a specificity war, you'll understand how
   important having control over style priority can be. During our conversation,
   we discussed what CSS Layers are and how you can use them in your project.
-home: true
 ---
 
 {% import "embed.macros.njk" as embed %}

src/filters/pages.cjs

@@ -357,14 +357,36 @@ const isType = (collection, type) =>
 label: isHome
 category: Filter
 note: |
-  Filters collection by `home` data
+  Filters collection by `home` data.
+  Posts are included if `home` is not `false`.
+  If `limit` is set, only the first `limit` posts are included,
+  plus any posts with `home` set to `pin` or `pinned`.
 params:
   collection:
     type: array
     note: containing 11ty page objects
+  limit:
+    type: number
 */
-const isHome = (collection) =>
-  collection.filter((page) => Boolean(page.data.home));
+const isHome = (collection, limit) => {
+  const posts = pageYears(
+    collection.filter((page) => page.data.home !== false),
+  ).reverse();
+  if (!limit) {
+    return posts;
+  }
+  const pinned = posts.filter((page) =>
+    ['pin', 'pinned'].includes(page.data.home),
+  );
+  if (pinned.length >= limit) {
+    return pinned.slice(0, limit);
+  }
+  const nonPinnedLimit = limit - pinned.length;
+  return posts.filter(
+    (page, index) =>
+      ['pin', 'pinned'].includes(page.data.home) || index < nonPinnedLimit,
+  );
+};
 
 module.exports = {
   isPublic,

test/js/pages.test.js

@@ -166,9 +166,9 @@ describe('page filters', () => {
   });
 
   test('isHome', () => {
-    const filtered = isHome(collection4);
+    const filtered = isHome(collection4, 1);
 
     expect(collection4).toHaveLength(3);
-    expect(filtered).toHaveLength(2);
+    expect(filtered).toHaveLength(1);
   });
 });

test/js/utils.js

@@ -243,7 +243,7 @@ export const collection4 = [
     data: {
       title: 'Draft Title',
       tags: ['Article'],
-      home: true,
+      home: false,
     },
     templateContent: '<h1>This is my title</h1>\n\n<p>This is content…',
   },
@@ -256,7 +256,7 @@ export const collection4 = [
     data: {
       title: 'Draft Title',
       tags: ['Link', 'Article'],
-      home: true,
+      home: 'pinned',
       events: [
         {
           foo: 'bar',