Enable Turbo Drive with morphing for Messages#{destroy,mark}

diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js
index 0bfff869ebcc87186c1aec12c4a0ff75949a923f..e9cc08606d0702075f6a2e293cfc1a1215d61edd 100644 (file)
--- a/app/assets/javascripts/application.js
+++ b/app/assets/javascripts/application.js
@@ -69,6 +69,10 @@ window.updateLinks = function (loc, zoom, layers, object) {
 };
 
 $(document).ready(function () {
+  // NB: Turns Turbo Drive off by default. Turbo Drive must be opt-in on a per-link and per-form basis
+  // See https://turbo.hotwired.dev/reference/drive#turbo.session.drive
+  Turbo.session.drive = false;
+
   var headerWidth = 0,
       compactWidth = 0;
 

diff --git a/app/assets/javascripts/messages.js b/app/assets/javascripts/messages.js
index cc86da05ea38365abaaa39a75f7dd25f94007dc6..eef06457b3f8e70e43eaa87d07ef55d6eab1f351 100644 (file)
--- a/app/assets/javascripts/messages.js
+++ b/app/assets/javascripts/messages.js
@@ -1,36 +1,16 @@
 $(document).ready(function () {
-  $(".inbox-mark-unread").on("ajax:success", function (event, data) {
-    updateHtml(data);
-    updateReadState(this, false);
+  $(".messages-table .destroy-message").on("turbo:submit-end", function (event) {
+    if (event.detail.success) {
+      event.target.dataset.isDestroyed = true;
+    }
   });
 
-  $(".inbox-mark-read").on("ajax:success", function (event, data) {
-    updateHtml(data);
-    updateReadState(this, true);
+  $(".messages-table .message-summary").on("turbo:before-morph-element", function (event) {
+    if ($(event.target).find("[data-is-destroyed]").length > 0) {
+      event.preventDefault(); // NB: prevent Turbo from morhping/removing this element
+      $(event.target).fadeOut(800, "linear", function () {
+        $(this).remove();
+      });
+    }
   });
-
-  $(".inbox-destroy").on("ajax:success", function (event, data) {
-    updateHtml(data);
-
-    $(this).closest("tr").fadeOut(800, "linear", function () {
-      $(this).remove();
-    });
-  });
-
-  function updateHtml(data) {
-    $("#inboxanchor").remove();
-    $(".user-button").before(data.inboxanchor);
-
-    $("#inbox-count").replaceWith(data.inbox_count);
-    $("#outbox-count").replaceWith(data.outbox_count);
-    $("#muted-count").replaceWith(data.muted_count);
-  }
-
-  function updateReadState(target, isRead) {
-    $(target).closest("tr")
-      .toggleClass("inbox-row", isRead)
-      .toggleClass("inbox-row-unread", !isRead)
-      .find(".inbox-mark-unread").prop("hidden", !isRead).end()
-      .find(".inbox-mark-read").prop("hidden", isRead);
-  }
 });

diff --git a/app/controllers/messages_controller.rb b/app/controllers/messages_controller.rb
index 2ca86fc028dca2dbe9af4c0a8ec14b71665c3ca9..d231fddde32945eff8a7454e3d7a09d37318bfc6 100644 (file)
--- a/app/controllers/messages_controller.rb
+++ b/app/controllers/messages_controller.rb
@@ -60,12 +60,12 @@ class MessagesController < ApplicationController
     @message = Message.where(:recipient => current_user).or(Message.where(:sender => current_user.id)).find(params[:id])
     @message.from_user_visible = false if @message.sender == current_user
     @message.to_user_visible = false if @message.recipient == current_user
-    if @message.save && !request.xhr?
+    if @message.save
       flash[:notice] = t ".destroyed"
 
       referer = safe_referer(params[:referer]) if params[:referer]
 
-      redirect_to referer || { :action => :inbox }
+      redirect_to referer || { :action => :inbox }, :status => :see_other
     end
   rescue ActiveRecord::RecordNotFound
     @title = t "messages.no_such_message.title"
@@ -125,9 +125,9 @@ class MessagesController < ApplicationController
       notice = t ".as_read"
     end
     @message.message_read = message_read
-    if @message.save && !request.xhr?
+    if @message.save
       flash[:notice] = notice
-      redirect_to :action => :inbox
+      redirect_back_or_to inbox_messages_path, :status => :see_other
     end
   rescue ActiveRecord::RecordNotFound
     @title = t "messages.no_such_message.title"

diff --git a/app/views/layouts/_head.html.erb b/app/views/layouts/_head.html.erb
index 34046bcab85ecac58481bfb6d0dcaf07911697b6..724ca552635e4582313d043070a85b3077a5faa7 100644 (file)
--- a/app/views/layouts/_head.html.erb
+++ b/app/views/layouts/_head.html.erb
@@ -2,6 +2,7 @@
   <meta http-equiv="X-UA-Compatible" content="IE=edge" />
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <%= javascript_include_tag "es6" unless browser.es6? %>
+  <%= javascript_include_tag "turbo", :type => "module" %>
   <%= javascript_include_tag "application" %>
   <%= javascript_include_tag "i18n/#{I18n.locale}" %>
   <%= stylesheet_link_tag "screen-#{dir}", :media => "screen" %>

diff --git a/app/views/layouts/_meta.html.erb b/app/views/layouts/_meta.html.erb
index 3517673ac6ba085624da2f3ce0a26b01d98a3b87..2352ad0b6931993eb488bb5e5e257b869241d7e9 100644 (file)
--- a/app/views/layouts/_meta.html.erb
+++ b/app/views/layouts/_meta.html.erb
@@ -13,6 +13,8 @@
 <%= tag.meta :name => "msapplication-TileColor", :content => "#00a300" %>
 <%= tag.meta :name => "msapplication-TileImage", :content => image_path("mstile-144x144.png") %>
 <%= tag.meta :name => "theme-color", :content => "#ffffff" %>
+<%= turbo_refresh_method_tag :morph %>
+<%= turbo_refresh_scroll_tag :preserve %>
 <%= canonical_tag %>
 <% if Settings.key?(:publisher_url) -%>
 <%= tag.link :rel => "publisher", :href => Settings.publisher_url %>

diff --git a/app/views/messages/_message_summary.html.erb b/app/views/messages/_message_summary.html.erb
index cb85a62ba6edfc01d6474811cd88999ccaca9c08..91c3785a3139f505d9b07786d0315f9821e07785 100644 (file)
--- a/app/views/messages/_message_summary.html.erb
+++ b/app/views/messages/_message_summary.html.erb
@@ -1,13 +1,13 @@
-<tr id="inbox-<%= message.id %>" class="inbox-row<%= "-unread" unless message.message_read? %>">
-  <td><%= link_to message.sender.display_name, message.sender %></td>
-  <td><%= link_to message.title, message %></td>
+<tr id="inbox-<%= message.id %>" class="message-summary inbox-row<%= "-unread" unless message.message_read? %>">
+  <td><%= link_to message.sender.display_name, user_path(message.sender) %></td>
+  <td><%= link_to message.title, message_path(message) %></td>
   <td class="text-nowrap"><%= l message.sent_on, :format => :friendly %></td>
   <td class="text-nowrap d-flex justify-content-end gap-1">
-    <%= button_to t(".unread_button"), message_mark_path(message, :mark => "unread"), :remote => true, :class => "btn btn-sm btn-primary", :form => { :class => "inbox-mark-unread", :hidden => !message.message_read? } %>
-    <%= button_to t(".read_button"), message_mark_path(message, :mark => "read"), :remote => true, :class => "btn btn-sm btn-primary", :form => { :class => "inbox-mark-read", :hidden => message.message_read? } %>
-    <%= button_to t(".destroy_button"), message_path(message, :referer => request.fullpath), :method => :delete, :remote => true, :class => "btn btn-sm btn-danger", :form_class => "inbox-destroy" %>
+    <%= button_to t(".unread_button"), message_mark_path(message, :mark => "unread"), :class => "btn btn-sm btn-primary", :form => { :"data-turbo" => true, :class => "inbox-mark-unread", :hidden => !message.message_read? } %>
+    <%= button_to t(".read_button"), message_mark_path(message, :mark => "read"), :class => "btn btn-sm btn-primary", :form => { :"data-turbo" => true, :class => "inbox-mark-read", :hidden => message.message_read? } %>
+    <%= button_to t(".destroy_button"), message_path(message, :referer => request.fullpath), :method => :delete, :class => "btn btn-sm btn-danger", :form => { :"data-turbo" => true, :class => "destroy-message" } %>
     <% if message.muted? %>
-      <%= button_to t(".unmute_button"), message_unmute_path(message), :method => :patch, :class => "btn btn-sm btn-secondary" %>
+      <%= button_to t(".unmute_button"), message_unmute_path(message), :method => :patch, :class => "btn btn-sm btn-secondary", :form => { :"data-turbo" => true } %>
     <% end %>
   </td>
 </tr>

diff --git a/app/views/messages/_messages_table.html.erb b/app/views/messages/_messages_table.html.erb
index ce222dfab9b2ef84ebc67d62a946d475db1a3859..f11fe3f628c0dc58d6968217164173786565cdcf 100644 (file)
--- a/app/views/messages/_messages_table.html.erb
+++ b/app/views/messages/_messages_table.html.erb
@@ -1,4 +1,4 @@
-<table class="table table-sm align-middle">
+<table class="table table-sm align-middle messages-table">
   <thead>
     <tr>
       <% columns.each do |column| %>

diff --git a/app/views/messages/_sent_message_summary.html.erb b/app/views/messages/_sent_message_summary.html.erb
index a9f011f5e431629847f930a3f42fa4bbb2da2d58..8b9056dee38649620df25b24ace757808dfd0e74 100644 (file)
--- a/app/views/messages/_sent_message_summary.html.erb
+++ b/app/views/messages/_sent_message_summary.html.erb
@@ -1,8 +1,8 @@
-<tr class="inbox-row">
-  <td><%= link_to message.recipient.display_name, message.recipient %></td>
-  <td><%= link_to message.title, message %></td>
+<tr id="outbox-<%= message.id %>" class="message-summary inbox-row">
+  <td><%= link_to message.recipient.display_name, user_path(message.recipient) %></td>
+  <td><%= link_to message.title, message_path(message) %></td>
   <td class="text-nowrap"><%= l message.sent_on, :format => :friendly %></td>
   <td class="text-nowrap d-flex justify-content-end gap-1">
-    <%= button_to t(".destroy_button"), message_path(message, :referer => request.fullpath), :method => :delete, :remote => true, :class => "btn btn-sm btn-danger", :form_class => "inbox-destroy" %>
+    <%= button_to t(".destroy_button"), message_path(message, :referer => request.fullpath), :method => :delete, :class => "btn btn-sm btn-danger", :form => { :"data-turbo" => true, :class => "destroy-message" } %>
   </td>
 </tr>

diff --git a/app/views/messages/destroy.json.jbuilder b/app/views/messages/destroy.json.jbuilder
deleted file mode 100644 (file)
index 65bfd6a..0000000
--- a/app/views/messages/destroy.json.jbuilder
+++ /dev/null
@@ -1,4 +0,0 @@
-json.inboxanchor render(:partial => "layouts/inbox")
-json.inbox_count render(:partial => "inbox_count")
-json.outbox_count render(:partial => "outbox_count")
-json.muted_count render(:partial => "muted_count")

diff --git a/app/views/messages/mark.json.jbuilder b/app/views/messages/mark.json.jbuilder
deleted file mode 100644 (file)
index 65bfd6a..0000000
--- a/app/views/messages/mark.json.jbuilder
+++ /dev/null
@@ -1,4 +0,0 @@
-json.inboxanchor render(:partial => "layouts/inbox")
-json.inbox_count render(:partial => "inbox_count")
-json.outbox_count render(:partial => "outbox_count")
-json.muted_count render(:partial => "muted_count")

diff --git a/config/eslint.json b/config/eslint.json
index 3b878d48a8cb813955fb399243ed01af1e892fef..397615d1a13f0f13a23afb89b8e7e67464b65bc1 100644 (file)
--- a/config/eslint.json
+++ b/config/eslint.json
@@ -13,7 +13,8 @@
     "OSM": "writable",
     "Matomo": "readonly",
     "Qs": "readonly",
-    "updateLinks": "readonly"
+    "updateLinks": "readonly",
+    "Turbo": "readonly"
   },
   "rules": {
     "accessor-pairs": "error",

diff --git a/test/controllers/messages_controller_test.rb b/test/controllers/messages_controller_test.rb
index df7146ad645686f6575c91561e3199cf5c7982f6..40581993fc6a7b6d648e9cc2928a863fbfe36959 100644 (file)
--- a/test/controllers/messages_controller_test.rb
+++ b/test/controllers/messages_controller_test.rb
@@ -408,15 +408,13 @@ class MessagesControllerTest < ActionDispatch::IntegrationTest
     assert_not Message.find(unread_message.id).message_read
 
     # Check that the marking a message read via XHR works
-    post message_mark_path(:message_id => unread_message, :mark => "read"), :xhr => true
-    assert_response :success
-    assert_template "mark"
+    post message_mark_path(:message_id => unread_message, :mark => "read")
+    assert_response :see_other
     assert Message.find(unread_message.id).message_read
 
     # Check that the marking a message unread via XHR works
-    post message_mark_path(:message_id => unread_message, :mark => "unread"), :xhr => true
-    assert_response :success
-    assert_template "mark"
+    post message_mark_path(:message_id => unread_message, :mark => "unread")
+    assert_response :see_other
     assert_not Message.find(unread_message.id).message_read
 
     # Asking to mark a message with no ID should fail

diff --git a/test/system/messages_test.rb b/test/system/messages_test.rb
index dea0d2208f32e04f9779cda321c892ba22f800c6..b78568314166ab4e357f16841008a970848290ad 100644 (file)
--- a/test/system/messages_test.rb
+++ b/test/system/messages_test.rb
@@ -36,6 +36,7 @@ class MessagesTest < ApplicationSystemTestCase
     assert_text "1 muted message"
 
     click_on "Delete"
-    assert_text "0 muted messages"
+    refute_text "1 muted message"
+    assert_text "You have 0 new messages and 0 old messages"
   end
 end