Changeset c6cdce6 in Klonkt for src/views

Timestamp:

06/28/2026 10:25:40 AM (2 months ago)

Author:

Robin Genis <roboburr@…>

Branches:

main

Children:

0596945

Parents:

37a297d

Message:

feat(news): show boosts from followed accounts in the News feed

An Announce (boost) from an account you follow, of a REMOTE post, was dropped — only Creates
and boosts of YOUR own posts were handled. Now such a boost resolves the boosted note and
stores it in ap_timeline (marked with who boosted it) so it appears in News with a 'X boosted'
label. We only store it for display and NEVER auto-Announce it onward (anti-feedback-loop);
published = now so it surfaces as fresh activity.

• config/database.js — ap_timeline.reblog_name/reblog_handle/reblog_icon
• services/ActivityPubService.js — handleInbox Announce branch stores remote boosts from followed accounts
• views/pages/news.ejs — 'boosted by' label; renamed the page-header div to tl-titlebar to avoid clashing with the card's tl-head class
• services/i18n.js — tl.boosted (nl/en/de)

File:

• src/views/pages/news.ejs (modified) (3 diffs)

src/views/pages/news.ejs

@@ -1 +1 @@
 <div class="tl-wrap">
   <%- include('../partials/fedi-tabs', { active: 'feed' }) %>
-  <div class="tl-head">
+  <div class="tl-titlebar">
     <h1 class="tl-title"><%= t('tl.title') %></h1>
     <button type="button" id="tl-paste-btn" class="tl-paste-btn" title="<%= t('fedi.remote_interact') %>" aria-label="<%= t('fedi.remote_interact') %>">
@@ -21 +21 @@
   </div>
   <style>
-    .tl-head { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
+    .tl-titlebar { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
+    .tl-boost-by { display: flex; align-items: center; gap: .35rem; font-size: .8rem; color: var(--ink-soft); margin: 0 0 .45rem .2rem; }
+    .tl-boost-by svg { color: #16a34a; flex: 0 0 auto; }
+    .tl-boost-by strong { color: var(--ink); font-weight: 600; }
     .tl-paste-btn { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px;
       border: 1px solid var(--rule); border-radius: 999px; background: var(--paper-2); color: var(--ink-soft); cursor: pointer; transition: color .15s, border-color .15s, background .15s; }
@@ -88 +91 @@
       <% timeline.forEach(function(p){ %>
         <li class="tl-item">
+          <% if (p.reblog_name) { %><div class="tl-boost-by"><svg viewBox="0 0 24 24" width="14" height="14" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><polyline points="17 1 21 5 17 9"/><path d="M3 11V9a4 4 0 0 1 4-4h14"/><polyline points="7 23 3 19 7 15"/><path d="M21 13v2a4 4 0 0 1-4 4H3"/></svg> <strong><%= p.reblog_name %></strong> <%= t('tl.boosted') %></div><% } %>
           <div class="tl-head">
             <span class="tl-avatar"><% if (p.author_icon) { %><img src="<%= p.author_icon %>" alt="" loading="lazy"><% } else { %><%= (p.author_name || '?').charAt(0).toUpperCase() %><% } %></span>