@rmdes/indiekit-endpoint-microsub 1.0.9 → 1.0.11

package/assets/styles.css

@@ -679,6 +679,43 @@
   text-align: right;
 }
 
+.compose__syndication {
+  background: var(--color-offset);
+  border: none;
+  border-radius: var(--border-radius);
+  margin: var(--space-m) 0;
+  padding: var(--space-m);
+}
+
+.compose__syndication legend {
+  font-weight: 600;
+  margin-bottom: var(--space-xs);
+}
+
+.compose__syndication .hint {
+  color: var(--color-text-muted);
+  font-size: var(--font-size-small);
+  margin-bottom: var(--space-s);
+}
+
+.syndication-target {
+  align-items: center;
+  cursor: pointer;
+  display: flex;
+  gap: var(--space-s);
+  padding: var(--space-xs) 0;
+}
+
+.syndication-target input[type="checkbox"] {
+  flex-shrink: 0;
+  height: 1.25rem;
+  width: 1.25rem;
+}
+
+.syndication-target__name {
+  flex: 1;
+}
+
 /* ==========================================================================
    Settings
    ========================================================================== */

package/lib/controllers/reader.js

@@ -21,6 +21,7 @@ import {
   getTimelineItems,
   getItemById,
   markItemsRead,
+  countReadItems,
 } from "../storage/items.js";
 import { getUserId } from "../utils/auth.js";
 import {
@@ -95,24 +96,37 @@ export async function channel(request, response) {
   const { application } = request.app.locals;
   const userId = getUserId(request);
   const { uid } = request.params;
-  const { before, after } = request.query;
+  const { before, after, showRead } = request.query;
 
   const channelDocument = await getChannel(application, uid, userId);
   if (!channelDocument) {
     return response.status(404).render("404");
   }
 
+  // Check if showing read items
+  const showReadItems = showRead === "true";
+
   const timeline = await getTimelineItems(application, channelDocument._id, {
     before,
     after,
     userId,
+    showRead: showReadItems,
   });
 
+  // Count read items to show "View read items" button
+  const readCount = await countReadItems(
+    application,
+    channelDocument._id,
+    userId,
+  );
+
   response.render("channel", {
     title: channelDocument.name,
     channel: channelDocument,
     items: timeline.items,
     paging: timeline.paging,
+    readCount,
+    showRead: showReadItems,
     baseUrl: request.baseUrl,
   });
 }
@@ -346,6 +360,38 @@ function ensureString(value) {
   return String(value);
 }
 
+/**
+ * Fetch syndication targets from Micropub config
+ * @param {object} application - Indiekit application
+ * @param {string} token - Auth token
+ * @returns {Promise<Array>} Syndication targets
+ */
+async function getSyndicationTargets(application, token) {
+  try {
+    const micropubEndpoint = application.micropubEndpoint;
+    if (!micropubEndpoint) return [];
+
+    const micropubUrl = micropubEndpoint.startsWith("http")
+      ? micropubEndpoint
+      : new URL(micropubEndpoint, application.url).href;
+
+    const configUrl = `${micropubUrl}?q=config`;
+    const configResponse = await fetch(configUrl, {
+      headers: {
+        Authorization: `Bearer ${token}`,
+        Accept: "application/json",
+      },
+    });
+
+    if (!configResponse.ok) return [];
+
+    const config = await configResponse.json();
+    return config["syndicate-to"] || [];
+  } catch {
+    return [];
+  }
+}
+
 /**
  * Compose response form
  * @param {object} request - Express request
@@ -353,6 +399,8 @@ function ensureString(value) {
  * @returns {Promise<void>}
  */
 export async function compose(request, response) {
+  const { application } = request.app.locals;
+
   // Support both long-form (replyTo) and short-form (reply) query params
   const {
     replyTo,
@@ -365,12 +413,19 @@ export async function compose(request, response) {
     bookmark,
   } = request.query;
 
+  // Fetch syndication targets if user is authenticated
+  const token = request.session?.access_token;
+  const syndicationTargets = token
+    ? await getSyndicationTargets(application, token)
+    : [];
+
   response.render("compose", {
     title: request.__("microsub.compose.title"),
     replyTo: ensureString(replyTo || reply),
     likeOf: ensureString(likeOf || like),
     repostOf: ensureString(repostOf || repost),
     bookmarkOf: ensureString(bookmarkOf || bookmark),
+    syndicationTargets,
     baseUrl: request.baseUrl,
   });
 }
@@ -388,6 +443,7 @@ export async function submitCompose(request, response) {
   const likeOf = request.body["like-of"];
   const repostOf = request.body["repost-of"];
   const bookmarkOf = request.body["bookmark-of"];
+  const syndicateTo = request.body["mp-syndicate-to"];
 
   // Debug logging
   console.info(
@@ -400,6 +456,7 @@ export async function submitCompose(request, response) {
     likeOf,
     repostOf,
     bookmarkOf,
+    syndicateTo,
   });
 
   // Get Micropub endpoint
@@ -427,16 +484,22 @@ export async function submitCompose(request, response) {
   micropubData.append("h", "entry");
 
   if (likeOf) {
-    // Like post (no content needed)
+    // Like post - content is optional comment
     micropubData.append("like-of", likeOf);
+    if (content && content.trim()) {
+      micropubData.append("content", content.trim());
+    }
   } else if (repostOf) {
-    // Repost (no content needed)
+    // Repost - content is optional comment
     micropubData.append("repost-of", repostOf);
+    if (content && content.trim()) {
+      micropubData.append("content", content.trim());
+    }
   } else if (bookmarkOf) {
-    // Bookmark (content optional)
+    // Bookmark - content is optional comment
     micropubData.append("bookmark-of", bookmarkOf);
-    if (content) {
-      micropubData.append("content", content);
+    if (content && content.trim()) {
+      micropubData.append("content", content.trim());
     }
   } else if (inReplyTo) {
     // Reply
@@ -447,6 +510,14 @@ export async function submitCompose(request, response) {
     micropubData.append("content", content || "");
   }
 
+  // Add syndication targets
+  if (syndicateTo) {
+    const targets = Array.isArray(syndicateTo) ? syndicateTo : [syndicateTo];
+    for (const target of targets) {
+      micropubData.append("mp-syndicate-to", target);
+    }
+  }
+
   // Debug: log what we're sending
   console.info("[Microsub] Sending to Micropub:", {
     url: micropubUrl,

package/lib/storage/items.js

@@ -78,6 +78,7 @@ export async function addItem(application, { channelId, feedId, uid, item }) {
  * @param {string} [options.after] - After cursor
  * @param {number} [options.limit] - Items per page
  * @param {string} [options.userId] - User ID for read state
+ * @param {boolean} [options.showRead] - Whether to show read items (default: false)
  * @returns {Promise<object>} Timeline with items and paging
  */
 export async function getTimelineItems(application, channelId, options = {}) {
@@ -86,7 +87,12 @@ export async function getTimelineItems(application, channelId, options = {}) {
     typeof channelId === "string" ? new ObjectId(channelId) : channelId;
   const limit = parseLimit(options.limit);
 
+  // Base query - filter out read items unless showRead is true
   const baseQuery = { channelId: objectId };
+  if (options.userId && !options.showRead) {
+    baseQuery.readBy = { $ne: options.userId };
+  }
+
   const query = buildPaginationQuery({
     before: options.before,
     after: options.after,
@@ -256,6 +262,24 @@ export async function getItemsByUids(application, uids, userId) {
   return items.map((item) => transformToJf2(item, userId));
 }
 
+/**
+ * Count read items in a channel for a user
+ * @param {object} application - Indiekit application
+ * @param {ObjectId|string} channelId - Channel ObjectId
+ * @param {string} userId - User ID
+ * @returns {Promise<number>} Count of read items
+ */
+export async function countReadItems(application, channelId, userId) {
+  const collection = getCollection(application);
+  const objectId =
+    typeof channelId === "string" ? new ObjectId(channelId) : channelId;
+
+  return collection.countDocuments({
+    channelId: objectId,
+    readBy: userId,
+  });
+}
+
 /**
  * Mark items as read
  * @param {object} application - Indiekit application

package/locales/en.json

@@ -4,6 +4,9 @@
       "title": "Reader",
       "empty": "No items to display",
       "markAllRead": "Mark all as read",
+      "showRead": "Show read ({{count}})",
+      "hideRead": "Hide read items",
+      "allRead": "All caught up!",
       "newer": "Newer",
       "older": "Older"
     },
@@ -43,12 +46,16 @@
     "compose": {
       "title": "Compose",
       "content": "What's on your mind?",
+      "comment": "Add a comment (optional)",
+      "commentHint": "Your comment will be included with the syndicated post",
       "submit": "Post",
       "cancel": "Cancel",
       "replyTo": "Replying to",
       "likeOf": "Liking",
       "repostOf": "Reposting",
-      "bookmarkOf": "Bookmarking"
+      "bookmarkOf": "Bookmarking",
+      "syndicateTo": "Syndicate to",
+      "syndicateHint": "Also share this to your connected accounts"
     },
     "settings": {
       "title": "{{channel}} settings",

package/package.json

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

package/views/channel.njk

@@ -7,6 +7,7 @@
         {{ icon("previous") }} {{ __("microsub.channels.title") }}
       </a>
       <div class="channel__actions">
+        {% if not showRead and items.length > 0 %}
         <form action="{{ baseUrl }}/api/mark-read" method="POST" style="display: inline;">
           <input type="hidden" name="channel" value="{{ channel.uid }}">
           <input type="hidden" name="entry" value="last-read-entry">
@@ -14,6 +15,16 @@
             {{ icon("checkboxChecked") }} {{ __("microsub.reader.markAllRead") }}
           </button>
         </form>
+        {% endif %}
+        {% if showRead %}
+        <a href="{{ baseUrl }}/channels/{{ channel.uid }}" class="button button--secondary button--small">
+          {{ icon("hide") }} {{ __("microsub.reader.hideRead") }}
+        </a>
+        {% elif readCount > 0 %}
+        <a href="{{ baseUrl }}/channels/{{ channel.uid }}?showRead=true" class="button button--secondary button--small">
+          {{ icon("show") }} {{ __("microsub.reader.showRead", { count: readCount }) }}
+        </a>
+        {% endif %}
         <a href="{{ baseUrl }}/channels/{{ channel.uid }}/feeds" class="button button--secondary button--small">
           {{ icon("syndicate") }} {{ __("microsub.feeds.title") }}
         </a>
@@ -48,11 +59,19 @@
     {% endif %}
     {% else %}
     <div class="reader__empty">
+      {% if readCount > 0 and not showRead %}
+      {{ icon("checkboxChecked") }}
+      <p>{{ __("microsub.reader.allRead") }}</p>
+      <a href="{{ baseUrl }}/channels/{{ channel.uid }}?showRead=true" class="button button--secondary">
+        {{ icon("show") }} {{ __("microsub.reader.showRead", { count: readCount }) }}
+      </a>
+      {% else %}
       {{ icon("syndicate") }}
       <p>{{ __("microsub.timeline.empty") }}</p>
       <a href="{{ baseUrl }}/channels/{{ channel.uid }}/feeds" class="button button--primary">
         {{ __("microsub.feeds.subscribe") }}
       </a>
+      {% endif %}
     </div>
     {% endif %}
   </div>

package/views/compose.njk

@@ -71,6 +71,32 @@
       <div class="compose__counter">
         <span id="char-count">0</span> characters
       </div>
+      {% else %}
+      {# Comment field for likes/reposts/bookmarks #}
+      {{ textarea({
+        label: __("microsub.compose.comment"),
+        id: "content",
+        name: "content",
+        rows: 3,
+        hint: __("microsub.compose.commentHint")
+      }) }}
+      <div class="compose__counter">
+        <span id="char-count">0</span> characters
+      </div>
+      {% endif %}
+
+      {# Syndication targets #}
+      {% if syndicationTargets and syndicationTargets.length %}
+      <fieldset class="compose__syndication">
+        <legend>{{ __("microsub.compose.syndicateTo") }}</legend>
+        <p class="hint">{{ __("microsub.compose.syndicateHint") }}</p>
+        {% for target in syndicationTargets %}
+        <label class="syndication-target">
+          <input type="checkbox" name="mp-syndicate-to" value="{{ target.uid }}"{% if target.checked %} checked{% endif %}>
+          <span class="syndication-target__name">{{ target.name }}</span>
+        </label>
+        {% endfor %}
+      </fieldset>
       {% endif %}
 
       <div class="button-group">
@@ -84,7 +110,6 @@
     </form>
   </div>
 
-  {% if not isAction %}
   <script type="module">
     const textarea = document.getElementById('content');
     const counter = document.getElementById('char-count');
@@ -94,5 +119,4 @@
       });
     }
   </script>
-  {% endif %}
 {% endblock %}