Use frame-based pagination for the activity timeline

app/controllers/cards_controller.rb

@@ -52,8 +52,8 @@ class CardsController < ApplicationController
       @card = Current.user.accessible_cards.find params[:id]
     end
 
-    def suppressing_broadcasts_unless_published(&block)
-      if @card.published?
+    def suppressing_broadcasts_unless_published(card, &block)
+      if card.published?
         yield
       else
         Collection.suppressing_turbo_broadcasts(&block)

app/helpers/events_helper.rb

@@ -52,17 +52,6 @@ module EventsHelper
     tag.div class: "events__time-block", style: "grid-area: #{row}/#{col}", &
   end
 
-  def event_next_page_link(next_day)
-    if next_day
-      tag.div id: "next_page",
-        data: { controller: "fetch-on-visible",
-                fetch_on_visible_url_value: events_days_path(
-                  day: next_day.strftime("%Y-%m-%d"),
-                  **@filter.as_params
-                ) }
-    end
-  end
-
   def event_action_sentence(event)
     if event.action.comment_created?
       comment_event_action_sentence(event)

app/helpers/pagination_helper.rb

@@ -35,6 +35,19 @@ module PaginationHelper
     end
   end
 
+  def day_timeline_pagination_frame_tag(day_timeline, &)
+    turbo_frame_tag day_timeline_pagination_frame_id_for(day_timeline.day), data: { timeline_target: "frame" }, role: "presentation", refresh: :morph, &
+  end
+
+  def day_timeline_pagination_frame_id_for(day)
+    "day-timeline-pagination-contents-#{day.strftime("%Y-%m-%d")}"
+  end
+
+  def day_timeline_pagination_link(day_timeline, filter)
+    link_to "Load more...", events_days_path(day: day_timeline.next_day.strftime("%Y-%m-%d"), **filter.as_params),
+      data: { frame: day_timeline_pagination_frame_id_for(day_timeline.next_day), pagination_target: "paginationLink" }
+  end
+
   private
     def pagination_list(name, tag_element: :div, paginate_on_scroll: false, **properties, &block)
       classes = properties.delete(:class)

app/views/events/days/index.html.erb

@@ -0,0 +1,4 @@
+<%= day_timeline_pagination_frame_tag @day_timeline do %>
+  <%= render "events/day", day_timeline: @day_timeline %>
+  <%= day_timeline_pagination_link(@day_timeline, @filter) %>
+<% end %>

app/views/events/days/index.turbo_stream.erb

@@ -1,7 +0,0 @@
-<%= turbo_stream.append :activity do %>
-  <%= render "events/day", day_timeline: @day_timeline %>
-<% end %>
-
-<%= turbo_stream.replace :next_page do %>
-  <%= event_next_page_link(@day_timeline.next_day) %>
-<% end %>

app/views/events/index.html.erb

@@ -14,7 +14,10 @@
   </h1>
 <% end %>
 
-<div class="events" id="activity">
-  <%= render "events/day", day_timeline: @day_timeline %>
-</div>
-<%= event_next_page_link(@day_timeline.next_day) %>
+<%= tag.div id: "activity", class: "events", data: { controller: "pagination", pagination_paginate_on_intersection_value: true } do %>
+  <%= day_timeline_pagination_frame_tag @day_timeline do %>
+    <%= render "events/day", day_timeline: @day_timeline %>
+
+    <%= day_timeline_pagination_link(@day_timeline, @filter) %>
+  <% end %>
+<% end %>