Make "new topics count" async

We had a "there are X new topics" notification already, but it was only
refreshed during page load - so unless a user started scrolling, never.

We also calculated this for every request, which could be constly for
some search queries, greatly increasing page load time.

This commit extracts it to work asynchronously, polling regularly, which
decouples it from the main page load time and also makes it more useful.

Author: dutow

app/controllers/topics_controller.rb

@@ -4,10 +4,10 @@ class TopicsController < ApplicationController
 
   def index
     @search_query = nil
-    base_query = Topic.includes(:creator)
-    base_query = apply_filters(base_query)
+    base_query = apply_filters(Topic.includes(:creator))
 
     apply_cursor_pagination(base_query)
+    @new_topics_count = 0
 
     preload_topic_states if user_signed_in?
     preload_note_counts if user_signed_in?
@@ -20,6 +20,15 @@ def index
     end
   end
 
+  def new_topics_count
+    @viewing_since = viewing_since_param
+    base_query = topics_base_query(search_query: params[:q])
+    @new_topics_count = count_new_topics(base_query, @viewing_since)
+    refresh_path = params[:q].present? ? search_topics_path(q: params[:q]) : topics_path
+
+    render partial: "new_topics_banner", locals: { count: @new_topics_count, viewing_since: @viewing_since, refresh_path: refresh_path }
+  end
+
   def show
     messages_scope = @topic.messages.includes(:sender, reply_to: :sender)
 
@@ -81,20 +90,10 @@ def read_all
   def search
     @search_query = params[:q].to_s.strip
 
-    base_query = if @search_query.present?
-                   search_pattern = "%#{ActiveRecord::Base.sanitize_sql_like(@search_query)}%"
-
-                   title_sql = Topic.select(:id).where("title ILIKE ?", search_pattern).to_sql
-                   message_sql = Message.select(:topic_id).where("body ILIKE ?", search_pattern).to_sql
-                   union_sql = "(#{title_sql}) UNION (#{message_sql})"
-
-                   Topic.where("topics.id IN (#{union_sql})")
-                        .includes(:creator)
-                 else
-                   Topic.none
-                 end
+    base_query = topics_base_query(search_query: @search_query)
 
     apply_cursor_pagination(base_query)
+    @new_topics_count = 0
 
     preload_participation_flags if user_signed_in?
 
@@ -220,11 +219,7 @@ def assign_branch_segments!
   end
 
   def apply_cursor_pagination(base_query)
-    @viewing_since = if params[:viewing_since].present?
-                       Time.zone.parse(params[:viewing_since])
-                     else
-                       Time.current
-                     end
+    @viewing_since = viewing_since_param
 
     query_with_window = base_query.joins(:messages)
                                    .group('topics.id')
@@ -242,12 +237,6 @@ def apply_cursor_pagination(base_query)
     @topics = @topics.order('MAX(messages.created_at) DESC, topics.id DESC')
                      .limit(25)
                      .load
-
-    @new_topics_count = base_query.joins(:messages)
-                                   .group('topics.id')
-                                   .having('MAX(messages.created_at) > ?', @viewing_since)
-                                   .count
-                                   .size
   end
 
   def preload_topic_states
@@ -551,6 +540,45 @@ def filter_team_readers(topic, team_id:)
     readers.select { |r| r[:team_id] == team_id }
   end
 
+  def topics_base_query(search_query: nil)
+    return apply_filters(Topic.includes(:creator)) if search_query.nil?
+
+    cleaned_query = search_query.to_s.strip
+    return Topic.none if cleaned_query.blank?
+
+    build_search_query(cleaned_query)
+  end
+
+  def build_search_query(query)
+    cleaned_query = query.to_s.strip
+    return Topic.none if cleaned_query.blank?
+
+    search_pattern = "%#{ActiveRecord::Base.sanitize_sql_like(cleaned_query)}%"
+
+    title_sql = Topic.select(:id).where("title ILIKE ?", search_pattern).to_sql
+    message_sql = Message.select(:topic_id).where("body ILIKE ?", search_pattern).to_sql
+    union_sql = "(#{title_sql}) UNION (#{message_sql})"
+
+    Topic.where("topics.id IN (#{union_sql})")
+         .includes(:creator)
+  end
+
+  def viewing_since_param
+    if params[:viewing_since].present?
+      Time.zone.parse(params[:viewing_since])
+    else
+      Time.current
+    end
+  end
+
+  def count_new_topics(base_query, viewing_since)
+    base_query.joins(:messages)
+              .group('topics.id')
+              .having('MAX(messages.created_at) > ?', viewing_since)
+              .count
+              .size
+  end
+
   def load_notes
     notes = Note.active.visible_to(current_user)
                 .where(topic: @topic)

app/javascript/controllers/new_topics_banner_controller.js

@@ -0,0 +1,41 @@
+import { Controller } from "@hotwired/stimulus"
+
+export default class extends Controller {
+  static values = {
+    url: String,
+    intervalMs: { type: Number, default: 180000 },
+  }
+
+  connect() {
+    this.startPolling()
+  }
+
+  disconnect() {
+    this.stopPolling()
+  }
+
+  startPolling() {
+    this.fetchBanner()
+    this.poller = setInterval(() => this.fetchBanner(), this.intervalMsValue)
+  }
+
+  stopPolling() {
+    if (this.poller) {
+      clearInterval(this.poller)
+      this.poller = null
+    }
+  }
+
+  fetchBanner() {
+    if (!this.urlValue) return
+
+    fetch(this.urlValue, { headers: { "Accept": "text/html" } })
+      .then(response => response.ok ? response.text() : Promise.reject(response))
+      .then(html => {
+        this.element.innerHTML = html
+      })
+      .catch(error => {
+        console.warn("Failed to refresh new topics banner", error)
+      })
+  }
+}

app/views/topics/index.html.slim

@@ -2,7 +2,7 @@
 
 = render partial: "sidebar", locals: { available_note_tags: @available_note_tags, search_query: @search_query }
 
-#new-topics-banner
+#new-topics-banner data-controller="new-topics-banner" data-new-topics-banner-url-value=new_topics_count_topics_path(viewing_since: @viewing_since.iso8601, filter: params[:filter], team_id: params[:team_id]) data-new-topics-banner-interval-ms-value="180000"
   = render partial: "new_topics_banner", locals: { count: @new_topics_count, viewing_since: @viewing_since }
 
 - if @active_note_tag.present?

app/views/topics/index.turbo_stream.slim

@@ -1,10 +1,6 @@
 = turbo_stream.append "topics" do
   = render partial: "topics", locals: { topics: @topics }
 
-= turbo_stream.replace "new-topics-banner" do
-  - refresh_path = params[:q].present? ? search_topics_path(q: params[:q]) : topics_path
-  = render partial: "new_topics_banner", locals: { count: @new_topics_count, viewing_since: @viewing_since, refresh_path: refresh_path }
-
 - if @topics.size == 25
   - last_topic = @topics.last
   - cursor = "#{last_topic.last_activity.iso8601}_#{last_topic.id}"

app/views/topics/search.html.slim

@@ -2,7 +2,7 @@
 
 = render partial: "sidebar", locals: { available_note_tags: @available_note_tags, search_query: @search_query }
 
-#new-topics-banner
+#new-topics-banner data-controller="new-topics-banner" data-new-topics-banner-url-value=new_topics_count_topics_path(q: @search_query, viewing_since: @viewing_since.iso8601) data-new-topics-banner-interval-ms-value="180000"
   = render partial: "new_topics_banner", locals: { count: @new_topics_count, viewing_since: @viewing_since, refresh_path: search_topics_path(q: @search_query) }
 
 - if @search_query.present?

config/routes.rb

@@ -24,6 +24,7 @@
   resources :topics, only: [:index, :show] do
     collection do
       get :search
+      get :new_topics_count
       post :aware_bulk
       post :aware_all
     end