@rmdes/indiekit-endpoint-activitypub 1.1.14 → 1.1.16

package/assets/reader.css

@@ -746,6 +746,37 @@
    Notifications
    ========================================================================== */
 
+/* Notifications Toolbar */
+.ap-notifications__toolbar {
+  display: flex;
+  gap: var(--space-s);
+  margin-bottom: var(--space-m);
+}
+
+.ap-notifications__btn {
+  background: var(--color-offset);
+  border: var(--border-width-thin) solid var(--color-outline);
+  border-radius: var(--border-radius-small);
+  color: var(--color-on-background);
+  cursor: pointer;
+  font-size: var(--font-size-s);
+  padding: var(--space-xs) var(--space-m);
+  transition: all 0.2s ease;
+}
+
+.ap-notifications__btn:hover {
+  background: var(--color-offset-variant);
+  border-color: var(--color-outline-variant);
+}
+
+.ap-notifications__btn--danger {
+  color: var(--color-red45);
+}
+
+.ap-notifications__btn--danger:hover {
+  border-color: var(--color-red45);
+}
+
 .ap-notification {
   align-items: flex-start;
   background: var(--color-offset);
@@ -754,6 +785,7 @@
   display: flex;
   gap: var(--space-s);
   padding: var(--space-m);
+  position: relative;
 }
 
 .ap-notification--unread {
@@ -761,9 +793,34 @@
   box-shadow: 0 0 8px 0 hsl(var(--tint-yellow) 50% / 0.3);
 }
 
-.ap-notification__icon {
+.ap-notification__avatar-wrap {
   flex-shrink: 0;
-  font-size: 1.5em;
+  position: relative;
+}
+
+.ap-notification__avatar {
+  border: var(--border-width-thin) solid var(--color-outline);
+  border-radius: 50%;
+  height: 40px;
+  object-fit: cover;
+  width: 40px;
+}
+
+.ap-notification__avatar--default {
+  align-items: center;
+  background: var(--color-offset-variant);
+  color: var(--color-on-offset);
+  display: inline-flex;
+  font-size: 1.1em;
+  font-weight: 600;
+  justify-content: center;
+}
+
+.ap-notification__type-badge {
+  bottom: -2px;
+  font-size: 0.75em;
+  position: absolute;
+  right: -4px;
 }
 
 .ap-notification__body {
@@ -803,6 +860,29 @@
   font-size: var(--font-size-xs);
 }
 
+.ap-notification__dismiss {
+  position: absolute;
+  right: var(--space-xs);
+  top: var(--space-xs);
+}
+
+.ap-notification__dismiss-btn {
+  background: transparent;
+  border: 0;
+  border-radius: var(--border-radius-small);
+  color: var(--color-on-offset);
+  cursor: pointer;
+  font-size: var(--font-size-m);
+  line-height: 1;
+  padding: 2px 6px;
+  transition: all 0.2s ease;
+}
+
+.ap-notification__dismiss-btn:hover {
+  background: var(--color-offset-variant);
+  color: var(--color-red45);
+}
+
 /* ==========================================================================
    Remote Profile
    ========================================================================== */

package/index.js

@@ -12,6 +12,9 @@ import { dashboardController } from "./lib/controllers/dashboard.js";
 import {
   readerController,
   notificationsController,
+  markAllNotificationsReadController,
+  clearAllNotificationsController,
+  deleteNotificationController,
   composeController,
   submitComposeController,
   remoteProfileController,
@@ -79,6 +82,7 @@ const defaults = {
   parallelWorkers: 5,
   actorType: "Person",
   timelineRetention: 1000,
+  notificationRetentionDays: 30,
 };
 
 export default class ActivityPubEndpoint {
@@ -189,6 +193,9 @@ export default class ActivityPubEndpoint {
     router.get("/", dashboardController(mp));
     router.get("/admin/reader", readerController(mp));
     router.get("/admin/reader/notifications", notificationsController(mp));
+    router.post("/admin/reader/notifications/mark-read", markAllNotificationsReadController(mp));
+    router.post("/admin/reader/notifications/clear", clearAllNotificationsController(mp));
+    router.post("/admin/reader/notifications/delete", deleteNotificationController(mp));
     router.get("/admin/reader/compose", composeController(mp, this));
     router.post("/admin/reader/compose", submitComposeController(mp, this));
     router.post("/admin/reader/like", likeController(mp, this));
@@ -835,6 +842,15 @@ export default class ActivityPubEndpoint {
       { background: true },
     );
 
+    // TTL index for notification cleanup
+    const notifRetention = this.options.notificationRetentionDays;
+    if (notifRetention > 0) {
+      this._collections.ap_notifications.createIndex(
+        { createdAt: 1 },
+        { expireAfterSeconds: notifRetention * 86_400 },
+      );
+    }
+
     this._collections.ap_muted.createIndex(
       { url: 1 },
       { unique: true, sparse: true, background: true },

package/lib/controllers/reader.js

@@ -7,8 +7,10 @@ import {
   getNotifications,
   getUnreadNotificationCount,
   markAllNotificationsRead,
+  clearAllNotifications,
+  deleteNotification,
 } from "../storage/notifications.js";
-import { getToken } from "../csrf.js";
+import { getToken, validateToken } from "../csrf.js";
 import {
   getMutedUrls,
   getMutedKeywords,
@@ -188,19 +190,17 @@ export function notificationsController(mountPath) {
       // Get notifications
       const result = await getNotifications(collections, { before, limit });
 
-      // Get unread count before marking as read
       const unreadCount = await getUnreadNotificationCount(collections);
 
-      // Mark all as read when page loads
-      if (result.items.length > 0) {
-        await markAllNotificationsRead(collections);
-      }
+      // CSRF token for action forms
+      const csrfToken = getToken(request.session);
 
       response.render("activitypub-notifications", {
         title: response.locals.__("activitypub.notifications.title"),
         items: result.items,
         before: result.before,
         unreadCount,
+        csrfToken,
         mountPath,
       });
     } catch (error) {
@@ -208,3 +208,92 @@ export function notificationsController(mountPath) {
     }
   };
 }
+
+/**
+ * POST /admin/reader/notifications/mark-read — mark all notifications as read.
+ */
+export function markAllNotificationsReadController(mountPath) {
+  return async (request, response, next) => {
+    try {
+      if (!validateToken(request)) {
+        return response.status(403).redirect(`${mountPath}/admin/reader/notifications`);
+      }
+
+      const { application } = request.app.locals;
+      const collections = {
+        ap_notifications: application?.collections?.get("ap_notifications"),
+      };
+
+      await markAllNotificationsRead(collections);
+
+      return response.redirect(`${mountPath}/admin/reader/notifications`);
+    } catch (error) {
+      next(error);
+    }
+  };
+}
+
+/**
+ * POST /admin/reader/notifications/clear — delete all notifications.
+ */
+export function clearAllNotificationsController(mountPath) {
+  return async (request, response, next) => {
+    try {
+      if (!validateToken(request)) {
+        return response.status(403).redirect(`${mountPath}/admin/reader/notifications`);
+      }
+
+      const { application } = request.app.locals;
+      const collections = {
+        ap_notifications: application?.collections?.get("ap_notifications"),
+      };
+
+      await clearAllNotifications(collections);
+
+      return response.redirect(`${mountPath}/admin/reader/notifications`);
+    } catch (error) {
+      next(error);
+    }
+  };
+}
+
+/**
+ * POST /admin/reader/notifications/delete — delete a single notification.
+ */
+export function deleteNotificationController(mountPath) {
+  return async (request, response, next) => {
+    try {
+      if (!validateToken(request)) {
+        return response.status(403).json({
+          success: false,
+          error: "Invalid CSRF token",
+        });
+      }
+
+      const { uid } = request.body;
+
+      if (!uid) {
+        return response.status(400).json({
+          success: false,
+          error: "Missing notification UID",
+        });
+      }
+
+      const { application } = request.app.locals;
+      const collections = {
+        ap_notifications: application?.collections?.get("ap_notifications"),
+      };
+
+      await deleteNotification(collections, uid);
+
+      // Support both JSON (fetch) and form redirect
+      if (request.headers.accept?.includes("application/json")) {
+        return response.json({ success: true, uid });
+      }
+
+      return response.redirect(`${mountPath}/admin/reader/notifications`);
+    } catch (error) {
+      next(error);
+    }
+  };
+}

package/lib/storage/notifications.js

@@ -66,9 +66,10 @@ export async function getNotifications(collections, options = {}) {
     query.read = false;
   }
 
-  // Cursor pagination
+  // Cursor pagination — published is stored as ISO string, so compare
+  // as strings (lexicographic ISO 8601 comparison is correct for dates)
   if (options.before) {
-    query.published = { $lt: new Date(options.before) };
+    query.published = { $lt: options.before };
   }
 
   const rawItems = await ap_notifications
@@ -85,9 +86,9 @@ export async function getNotifications(collections, options = {}) {
       : item.published,
   }));
 
-  // Generate cursor for next page
+  // Generate cursor for next page (only if full page returned = more may exist)
   const before =
-    items.length > 0
+    items.length === limit
       ? items[items.length - 1].published
       : null;
 
@@ -130,3 +131,24 @@ export async function markAllNotificationsRead(collections) {
   const { ap_notifications } = collections;
   return await ap_notifications.updateMany({}, { $set: { read: true } });
 }
+
+/**
+ * Delete all notifications
+ * @param {object} collections - MongoDB collections
+ * @returns {Promise<object>} Delete result
+ */
+export async function clearAllNotifications(collections) {
+  const { ap_notifications } = collections;
+  return await ap_notifications.deleteMany({});
+}
+
+/**
+ * Delete a single notification by UID
+ * @param {object} collections - MongoDB collections
+ * @param {string} uid - Notification UID
+ * @returns {Promise<object>} Delete result
+ */
+export async function deleteNotification(collections, uid) {
+  const { ap_notifications } = collections;
+  return await ap_notifications.deleteOne({ uid });
+}

package/lib/storage/timeline.js

@@ -94,23 +94,20 @@ export async function getTimelineItems(collections, options = {}) {
     query["author.url"] = options.authorUrl;
   }
 
-  // Cursor pagination — validate dates
+  // Cursor pagination — published is stored as ISO string, so compare
+  // as strings (lexicographic ISO 8601 comparison is correct for dates)
   if (options.before) {
-    const beforeDate = new Date(options.before);
-
-    if (Number.isNaN(beforeDate.getTime())) {
+    if (Number.isNaN(new Date(options.before).getTime())) {
       throw new Error("Invalid before cursor");
     }
 
-    query.published = { $lt: beforeDate };
+    query.published = { $lt: options.before };
   } else if (options.after) {
-    const afterDate = new Date(options.after);
-
-    if (Number.isNaN(afterDate.getTime())) {
+    if (Number.isNaN(new Date(options.after).getTime())) {
       throw new Error("Invalid after cursor");
     }
 
-    query.published = { $gt: afterDate };
+    query.published = { $gt: options.after };
   }
 
   const rawItems = await ap_timeline
@@ -128,13 +125,16 @@ export async function getTimelineItems(collections, options = {}) {
   }));
 
   // Generate cursors for pagination
+  // Items are sorted newest-first, so:
+  // - "before" cursor (for "Older" link) = oldest item's date (last in array)
+  // - "after" cursor (for "Newer" link) = newest item's date (first in array)
   const before =
-    items.length > 0
-      ? items[0].published
+    items.length === limit
+      ? items[items.length - 1].published
       : null;
   const after =
-    items.length > 0
-      ? items[items.length - 1].published
+    items.length > 0 && (options.before || options.after)
+      ? items[0].published
       : null;
 
   return {
@@ -190,7 +190,9 @@ export async function updateTimelineItem(collections, uid, updates) {
  */
 export async function deleteOldTimelineItems(collections, cutoffDate) {
   const { ap_timeline } = collections;
-  const result = await ap_timeline.deleteMany({ published: { $lt: cutoffDate } });
+  // published is stored as ISO string — convert cutoff to string for comparison
+  const cutoff = cutoffDate instanceof Date ? cutoffDate.toISOString() : cutoffDate;
+  const result = await ap_timeline.deleteMany({ published: { $lt: cutoff } });
   return result.deletedCount;
 }
 

package/locales/en.json

@@ -141,7 +141,11 @@
       "boostedPost": "boosted your post",
       "followedYou": "followed you",
       "repliedTo": "replied to your post",
-      "mentionedYou": "mentioned you"
+      "mentionedYou": "mentioned you",
+      "markAllRead": "Mark all read",
+      "clearAll": "Clear all",
+      "clearConfirm": "Delete all notifications? This cannot be undone.",
+      "dismiss": "Dismiss"
     },
     "reader": {
       "title": "Reader",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rmdes/indiekit-endpoint-activitypub",
-  "version": "1.1.14",
+  "version": "1.1.16",
   "description": "ActivityPub federation endpoint for Indiekit via Fedify. Adds full fediverse support: actor, inbox, outbox, followers, following, syndication, and Mastodon migration.",
   "keywords": [
     "indiekit",

package/views/activitypub-activities.njk

@@ -7,7 +7,7 @@
 {% from "pagination/macro.njk" import pagination with context %}
 
 {% block content %}
-  {{ heading({ text: __("activitypub.activities"), level: 1, parent: { text: __("activitypub.title"), href: mountPath } }) }}
+  {{ heading({ text: __("activitypub.activities"), level: 1 }) }}
 
   {% if activities.length > 0 %}
     {% for activity in activities %}

package/views/activitypub-compose.njk

@@ -3,11 +3,7 @@
 {% from "heading/macro.njk" import heading with context %}
 
 {% block readercontent %}
-  {{ heading({
-    text: title,
-    level: 1,
-    parent: { text: __("activitypub.reader.title"), href: mountPath + "/admin/reader" }
-  }) }}
+  {{ heading({ text: title, level: 1 }) }}
 
   {# Reply context — show the post being replied to #}
   {% if replyContext %}

package/views/activitypub-featured-tags.njk

@@ -4,7 +4,7 @@
 {% from "prose/macro.njk" import prose with context %}
 
 {% block content %}
-  {{ heading({ text: title, level: 1, parent: { text: __("activitypub.title"), href: mountPath } }) }}
+  {{ heading({ text: title, level: 1 }) }}
 
   {% if tags.length > 0 %}
     <table class="table">

package/views/activitypub-featured.njk

@@ -4,7 +4,7 @@
 {% from "prose/macro.njk" import prose with context %}
 
 {% block content %}
-  {{ heading({ text: title, level: 1, parent: { text: __("activitypub.title"), href: mountPath } }) }}
+  {{ heading({ text: title, level: 1 }) }}
 
   {% if pinned.length > 0 %}
     <table class="table">

package/views/activitypub-followers.njk

@@ -6,7 +6,7 @@
 {% from "pagination/macro.njk" import pagination with context %}
 
 {% block content %}
-  {{ heading({ text: followerCount + " " + __("activitypub.followers"), level: 1, parent: { text: __("activitypub.title"), href: mountPath } }) }}
+  {{ heading({ text: followerCount + " " + __("activitypub.followers"), level: 1 }) }}
 
   {% if followers.length > 0 %}
     {% for follower in followers %}

package/views/activitypub-following.njk

@@ -7,7 +7,7 @@
 {% from "pagination/macro.njk" import pagination with context %}
 
 {% block content %}
-  {{ heading({ text: followingCount + " " + __("activitypub.following"), level: 1, parent: { text: __("activitypub.title"), href: mountPath } }) }}
+  {{ heading({ text: followingCount + " " + __("activitypub.following"), level: 1 }) }}
 
   {% if following.length > 0 %}
     {% for account in following %}

package/views/activitypub-migrate.njk

@@ -8,7 +8,7 @@
 {% from "prose/macro.njk" import prose with context %}
 
 {% block content %}
-  {{ heading({ text: title, level: 1, parent: { text: __("activitypub.title"), href: mountPath } }) }}
+  {{ heading({ text: title, level: 1 }) }}
 
   {% if result %}
     {{ notificationBanner({ type: result.type, text: result.text }) }}

package/views/activitypub-moderation.njk

@@ -4,11 +4,7 @@
 {% from "prose/macro.njk" import prose with context %}
 
 {% block readercontent %}
-  {{ heading({
-    text: title,
-    level: 1,
-    parent: { text: __("activitypub.reader.title"), href: mountPath + "/admin/reader" }
-  }) }}
+  {{ heading({ text: title, level: 1 }) }}
 
   {# Blocked actors #}
   <section class="ap-moderation__section">

package/views/activitypub-notifications.njk

@@ -4,13 +4,23 @@
 {% from "prose/macro.njk" import prose with context %}
 
 {% block readercontent %}
-  {{ heading({
-    text: __("activitypub.notifications.title"),
-    level: 1,
-    parent: { text: __("activitypub.reader.title"), href: mountPath + "/admin/reader" }
-  }) }}
+  {{ heading({ text: __("activitypub.notifications.title"), level: 1 }) }}
 
   {% if items.length > 0 %}
+    <div class="ap-notifications__toolbar">
+      {% if unreadCount > 0 %}
+        <form method="post" action="{{ mountPath }}/admin/reader/notifications/mark-read">
+          <input type="hidden" name="_csrf" value="{{ csrfToken }}">
+          <button type="submit" class="ap-notifications__btn">{{ __("activitypub.notifications.markAllRead") }}</button>
+        </form>
+      {% endif %}
+      <form method="post" action="{{ mountPath }}/admin/reader/notifications/clear"
+            onsubmit="return confirm('{{ __("activitypub.notifications.clearConfirm") }}')">
+        <input type="hidden" name="_csrf" value="{{ csrfToken }}">
+        <button type="submit" class="ap-notifications__btn ap-notifications__btn--danger">{{ __("activitypub.notifications.clearAll") }}</button>
+      </form>
+    </div>
+
     <div class="ap-timeline">
       {% for item in items %}
         {% include "partials/ap-notification-card.njk" %}

package/views/activitypub-post-detail.njk

@@ -3,11 +3,7 @@
 {% from "heading/macro.njk" import heading with context %}
 
 {% block readercontent %}
-  {{ heading({
-    text: title,
-    level: 1,
-    parent: { text: __("activitypub.reader.title"), href: mountPath + "/admin/reader" }
-  }) }}
+  {{ heading({ text: title, level: 1 }) }}
 
   <div class="ap-post-detail" data-mount-path="{{ mountPath }}">
     {# Back button #}

package/views/activitypub-profile.njk

@@ -10,7 +10,7 @@
 {% from "prose/macro.njk" import prose with context %}
 
 {% block content %}
-  {{ heading({ text: title, level: 1, parent: { text: __("activitypub.title"), href: mountPath } }) }}
+  {{ heading({ text: title, level: 1 }) }}
 
   {% if result %}
     {{ notificationBanner({ type: result.type, text: result.text }) }}

package/views/activitypub-reader.njk

@@ -4,17 +4,10 @@
 {% from "prose/macro.njk" import prose with context %}
 
 {% block readercontent %}
-  {{ heading({
-    text: __("activitypub.reader.title"),
-    level: 1,
-    parent: { text: __("activitypub.title"), href: mountPath }
-  }) }}
+  {{ heading({ text: __("activitypub.reader.title"), level: 1 }) }}
 
   {# Tab navigation #}
   <nav class="ap-tabs" role="tablist">
-    <a href="?tab=all" class="ap-tab{% if tab == 'all' %} ap-tab--active{% endif %}" role="tab">
-      {{ __("activitypub.reader.tabs.all") }}
-    </a>
     <a href="?tab=notes" class="ap-tab{% if tab == 'notes' %} ap-tab--active{% endif %}" role="tab">
       {{ __("activitypub.reader.tabs.notes") }}
     </a>
@@ -30,6 +23,9 @@
     <a href="?tab=media" class="ap-tab{% if tab == 'media' %} ap-tab--active{% endif %}" role="tab">
       {{ __("activitypub.reader.tabs.media") }}
     </a>
+    <a href="?tab=all" class="ap-tab{% if tab == 'all' %} ap-tab--active{% endif %}" role="tab">
+      {{ __("activitypub.reader.tabs.all") }}
+    </a>
   </nav>
 
   {# Timeline items #}

package/views/activitypub-remote-profile.njk

@@ -4,11 +4,7 @@
 {% from "prose/macro.njk" import prose with context %}
 
 {% block readercontent %}
-  {{ heading({
-    text: title,
-    level: 1,
-    parent: { text: __("activitypub.reader.title"), href: mountPath + "/admin/reader" }
-  }) }}
+  {{ heading({ text: title, level: 1 }) }}
 
   <div class="ap-profile"
     x-data="{

package/views/partials/ap-item-card.njk

@@ -24,8 +24,9 @@
   {# Author header #}
   <header class="ap-card__author">
     {% if item.author.photo %}
-      <img src="{{ item.author.photo }}" alt="{{ item.author.name }}" class="ap-card__avatar"
-        onerror="this.replaceWith(Object.assign(document.createElement('span'),{className:'ap-card__avatar ap-card__avatar--default',textContent:'{{ item.author.name[0] | upper if item.author.name else "?" }}'}))">
+      <img src="{{ item.author.photo }}" alt="{{ item.author.name }}" class="ap-card__avatar" loading="lazy" crossorigin="anonymous"
+        onerror="this.style.display='none';this.nextElementSibling.style.display=''">
+      <span class="ap-card__avatar ap-card__avatar--default" style="display:none" aria-hidden="true">{{ item.author.name[0] | upper if item.author.name else "?" }}</span>
     {% else %}
       <span class="ap-card__avatar ap-card__avatar--default" aria-hidden="true">{{ item.author.name[0] | upper if item.author.name else "?" }}</span>
     {% endif %}

package/views/partials/ap-notification-card.njk

@@ -1,19 +1,25 @@
 {# Notification card partial #}
 
 <div class="ap-notification{% if not item.read %} ap-notification--unread{% endif %}">
-  {# Type icon #}
-  <div class="ap-notification__icon">
-    {% if item.type == "like" %}
-      ❤
-    {% elif item.type == "boost" %}
-      🔁
-    {% elif item.type == "follow" %}
-      👤
-    {% elif item.type == "reply" %}
-      💬
-    {% elif item.type == "mention" %}
-      @
+  {# Dismiss button #}
+  <form method="post" action="{{ mountPath }}/admin/reader/notifications/delete" class="ap-notification__dismiss">
+    <input type="hidden" name="_csrf" value="{{ csrfToken }}">
+    <input type="hidden" name="uid" value="{{ item.uid }}">
+    <button type="submit" class="ap-notification__dismiss-btn" title="{{ __('activitypub.notifications.dismiss') }}">&times;</button>
+  </form>
+
+  {# Actor avatar with type badge #}
+  <div class="ap-notification__avatar-wrap">
+    {% if item.actorPhoto %}
+      <img src="{{ item.actorPhoto }}" alt="{{ item.actorName }}" class="ap-notification__avatar" loading="lazy" crossorigin="anonymous"
+        onerror="this.style.display='none';this.nextElementSibling.style.display=''">
+      <span class="ap-notification__avatar ap-notification__avatar--default" style="display:none" aria-hidden="true">{{ item.actorName[0] | upper if item.actorName else "?" }}</span>
+    {% else %}
+      <span class="ap-notification__avatar ap-notification__avatar--default" aria-hidden="true">{{ item.actorName[0] | upper if item.actorName else "?" }}</span>
     {% endif %}
+    <span class="ap-notification__type-badge">
+      {% if item.type == "like" %}❤{% elif item.type == "boost" %}🔁{% elif item.type == "follow" %}👤{% elif item.type == "reply" %}💬{% elif item.type == "mention" %}@{% endif %}
+    </span>
   </div>
 
   {# Notification body #}