fix: photo grid never rendered due to Nunjucks slice misuse

Nunjucks slice(0, 4) creates 0 chunks (not Array.slice behavior),
producing an empty array. Photos and categories were never rendered
in item-card and actor views. Also add image proxying to reader
controller matching the Microsub API.

lib/controllers/reader.js

@@ -35,6 +35,7 @@ import {
   validateExcludeTypes,
   validateExcludeRegex,
 } from "../utils/validation.js";
+import { proxyItemImages } from "../media/proxy.js";
 
 /**
  * Reader index - redirect to channels
@@ -119,6 +120,14 @@ export async function channel(request, response) {
     showRead: showReadItems,
   });
 
+  // Proxy images through media endpoint for privacy
+  const proxyBaseUrl = application.url;
+  if (proxyBaseUrl && timeline.items) {
+    timeline.items = timeline.items.map((item) =>
+      proxyItemImages(item, proxyBaseUrl),
+    );
+  }
+
   // Count read items to show "View read items" button
   const readCount = await countReadItems(
     application,

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rmdes/indiekit-endpoint-microsub",
-  "version": "1.0.36",
+  "version": "1.0.37",
   "description": "Microsub endpoint for Indiekit. Enables subscribing to feeds and reading content using the Microsub protocol.",
   "keywords": [
     "indiekit",

views/actor.njk

@@ -121,8 +121,10 @@
           {# Tags #}
           {% if item.category and item.category.length > 0 %}
           <div class="item-card__categories">
-            {% for cat in item.category | slice(0, 5) %}
+            {% for cat in item.category %}
+            {% if loop.index0 < 5 %}
             <span class="item-card__category">#{{ cat }}</span>
+            {% endif %}
             {% endfor %}
           </div>
           {% endif %}
@@ -131,9 +133,11 @@
           {% if item.photo and item.photo.length > 0 %}
           {% set photoCount = item.photo.length if item.photo.length <= 4 else 4 %}
           <div class="item-card__photos item-card__photos--{{ photoCount }}">
-            {% for photo in item.photo | slice(0, 4) %}
+            {% for photo in item.photo %}
+            {% if loop.index0 < 4 %}
             <img src="{{ photo }}" alt="" class="item-card__photo" loading="lazy"
                  onerror="this.parentElement.removeChild(this)">
+            {% endif %}
             {% endfor %}
           </div>
           {% endif %}

views/partials/item-card.njk

@@ -111,8 +111,10 @@
     {# Categories/Tags #}
     {% if item.category and item.category.length > 0 %}
     <div class="item-card__categories">
-      {% for cat in item.category | slice(0, 5) %}
+      {% for cat in item.category %}
+      {% if loop.index0 < 5 %}
       <span class="item-card__category">#{{ cat | replace("#", "") }}</span>
+      {% endif %}
       {% endfor %}
     </div>
     {% endif %}
@@ -121,12 +123,14 @@
     {% if item.photo and item.photo.length > 0 %}
     {% set photoCount = item.photo.length if item.photo.length <= 4 else 4 %}
     <div class="item-card__photos item-card__photos--{{ photoCount }}">
-      {% for photo in item.photo | slice(0, 4) %}
+      {% for photo in item.photo %}
+      {% if loop.index0 < 4 %}
       <img src="{{ photo }}"
            alt=""
            class="item-card__photo"
            loading="lazy"
            onerror="this.parentElement.removeChild(this)">
+      {% endif %}
       {% endfor %}
     </div>
     {% endif %}