Changeset 5190152 in Klonkt for src/views

Timestamp:

07/19/2026 05:38:25 PM (7 weeks ago)

Author:

Robin <roboburr@…>

Branches:

main

Children:

e9c9ae1

Parents:

feced2c

git-author:

Robin <roboburr@…> (07/19/2026 05:38:00 PM)

git-committer:

Robin <roboburr@…> (07/19/2026 05:38:25 PM)

Message:

Feature: rich editor on the edit forms too (klonkt-demo-c7f, last slice)

Editing a sent reply (Messages + the interact page's manage list) now opens the
same shared editor as new replies, instead of a bare textarea. Prutter stays
plain on purpose (Robin: not part of this).

• reply-editor partial: initialHtml/initialText prefill for edit mode, and a noAttach flag that omits the media UI (an edit never touches attachments). JS grew canAttach guards so the component runs without the attach elements; pasted files are still swallowed there rather than becoming base64 blobs.
• deliverOutboxUpdate(site, id, text, {html, language}): rich path with the same sanitize + enrichment + mention-first-paragraph logic as deliverReply; language updated via COALESCE (bogus codes keep the old one); attachments survive untouched. Plain path unchanged.
• /fediverse/:id/edit passes content + language; listOutbox and the Messages sent-projection carry language so the select preselects correctly.
• The interact page's edit-toggle focuses the rich editor when present.

2 new tests (93 green). Browser-verified on /messages: prefilled editor
(mention-stripped HTML + plain fallback + language preselected, no paperclip),
edit saved -> content replaced with markup, mention re-attached inline,
language nl->en, no console errors.

Co-Authored-By: Claude Opus 4.8 <noreply@…>

Location:

src/views

Files:

• pages/authorize-interaction.ejs (modified) (2 diffs)
• pages/messages.ejs (modified) (1 diff)
• partials/reply-editor.ejs (modified) (2 diffs)

src/views/pages/authorize-interaction.ejs

@@ -41 +41 @@
               </form>
             </div>
-            <form method="post" action="/fediverse/<%= m.id %>/edit" class="fedi-edit-form">
-              <textarea name="text" rows="3" maxlength="2000" class="fedi-edit-ta"><%= m.editable %></textarea>
-              <div class="fedi-edit-actions"><button type="submit" class="fedi-edit-save"><%= t('fedi.save_edit') %></button></div>
-            </form>
+            <div class="fedi-edit-form">
+              <%- include('../partials/reply-editor', {
+                action: '/fediverse/' + m.id + '/edit',
+                placeholder: t('fedi.reply_ph'),
+                submitLabel: t('fedi.save_edit'),
+                rows: 3,
+                initialHtml: m.content,
+                initialText: m.editable,
+                defaultLang: m.language,
+                noAttach: true,
+              }) %>
+            </div>
           </li>
         <% }); %>
@@ -59 +67 @@
           b.classList.toggle('is-open', open);
           b.setAttribute('aria-expanded', open ? 'true' : 'false');
-          if (open) { var ta = form.querySelector('textarea'); if (ta) ta.focus(); }
+          if (open) { var ed = form.querySelector('.re-editor') || form.querySelector('textarea'); if (ed) ed.focus(); }
         });
       })();

src/views/pages/messages.ejs

@@ -78 +78 @@
                 <details class="msg-edit">
                   <summary><%= t('fedi.edit') %></summary>
-                  <form method="post" action="/fediverse/<%= n.outboxId %>/edit" class="msg-edit-form">
-                    <textarea name="text" rows="2" required><%= n.editable %></textarea>
-                    <button type="submit" class="btn"><%= t('fedi.save_edit') %></button>
-                  </form>
+                  <div class="msg-edit-form">
+                    <%- include('../partials/reply-editor', {
+                      action: '/fediverse/' + n.outboxId + '/edit',
+                      placeholder: t('fedi.reply_ph'),
+                      submitLabel: t('fedi.save_edit'),
+                      rows: 2,
+                      initialHtml: n.content,
+                      initialText: n.editable,
+                      defaultLang: n.language,
+                      noAttach: true,
+                    }) %>
+                  </div>
                 </details>
                 <form method="post" action="/fediverse/<%= n.outboxId %>/delete" data-confirm="<%= t('fedi.delete_confirm') %>">

src/views/partials/reply-editor.ejs

@@ -16 +16 @@
     rows          textarea rows for the no-JS fallback (default 3)
     defaultLang   preselected reply language (default: UI lang)
+    initialHtml   prefill for EDIT mode (our own sanitized HTML) (optional)
+    initialText   plain-text prefill for the no-JS textarea (optional)
+    noAttach      true hides the media button (edits do not touch attachments)
 %>
+<% var _reInitHtml = (typeof initialHtml !== 'undefined' && initialHtml) || ''; %>
+<% var _reInitText = (typeof initialText !== 'undefined' && initialText) || ''; %>
+<% var _reNoAttach = (typeof noAttach !== 'undefined' && noAttach); %>
 <% var _reLang = (typeof defaultLang !== 'undefined' && defaultLang) || (typeof lang !== 'undefined' ? lang : 'en'); %>
 <form method="post" action="<%= action %>" class="re-form" data-re
@@ -36 +42 @@
     <button type="button" data-cmd="list" title="<%= t('re.list') %>" aria-label="<%= t('re.list') %>">•≡</button>
     <button type="button" data-cmd="quote" title="<%= t('re.quote') %>" aria-label="<%= t('re.quote') %>">❝</button>
-    <button type="button" data-cmd="attach" title="<%= t('re.attach') %>" aria-label="<%= t('re.attach') %>">📎</button>
-    <input type="file" class="re-file" accept="image/*,audio/*,video/*" multiple hidden>
+    <% if (!_reNoAttach) { %>
+      <button type="button" data-cmd="attach" title="<%= t('re.attach') %>" aria-label="<%= t('re.attach') %>">📎</button>
+      <input type="file" class="re-file" accept="image/*,audio/*,video/*" multiple hidden>
+    <% } %>
   </div>
-  <input type="hidden" name="attachments" value="">
-  <div class="re-attachments" hidden></div>
-  <textarea name="text" rows="<%= typeof rows !== 'undefined' ? rows : 3 %>" required placeholder="<%= placeholder %>"></textarea>
+  <% if (!_reNoAttach) { %>
+    <input type="hidden" name="attachments" value="">
+    <div class="re-attachments" hidden></div>
+  <% } %>
+  <textarea name="text" rows="<%= typeof rows !== 'undefined' ? rows : 3 %>" required placeholder="<%= placeholder %>"><%= _reInitText %></textarea>
   <div class="re-editor" contenteditable="true" role="textbox" aria-multiline="true"
-       data-ph="<%= placeholder %>" aria-label="<%= placeholder %>" hidden></div>
+       data-ph="<%= placeholder %>" aria-label="<%= placeholder %>" hidden><%- _reInitHtml %></div>
   <div class="re-foot">
     <select name="language" class="re-lang" aria-label="<%= t('re.lang') %>" hidden>