Improve global activities pagination and fetching [SCI-3292]

app/assets/javascripts/global_activities/index.js

@@ -30,16 +30,35 @@
       var filters = GlobalActivitiesFilterPrepareArray();
       ev.preventDefault();
       animateSpinner(null, true);
-      filters.from_date = moreButton.data('next-date');
+      filters.from_id = moreButton.data('next-id');
       $.ajax({
         url: $('.ga-activities-list').data('activities-url'),
         data: filters,
         dataType: 'json',
         type: 'POST',
         success: function(json) {
-          $(json.activities_html).appendTo('.ga-activities-list');
+          var newFirstDay;
+          var existingLastDay;
+
+          // Attach newly fetched activities to temporary placeholder
+          $(json.activities_html).appendTo('#ga-more-activities-placeholder');
+
+          newFirstDay = $('#ga-more-activities-placeholder').find('.activities-day').first();
+          existingLastDay = $('.ga-activities-list').find('.activities-day').last();
+
+          if (newFirstDay.data('date') === existingLastDay.data('date')) {
+            let newNumber;
+            existingLastDay.find('.activities-group').append(newFirstDay.find('.activities-group').html());
+            newNumber = existingLastDay.find('.activity-card').length;
+            existingLastDay.find('.activities-counter-label strong').html(newNumber);
+            newFirstDay.remove();
+          }
+
+          $('.ga-activities-list').append($('#ga-more-activities-placeholder').html());
+          $('#ga-more-activities-placeholder').html('');
+
           if (json.more_activities === true) {
-            moreButton.data('next-date', json.from);
+            moreButton.data('next-id', json.next_id);
           } else {
             moreButton.addClass('hidden');
           }

app/controllers/global_activities_controller.rb

@@ -43,8 +43,9 @@ class GlobalActivitiesController < ApplicationController
                      .distinct
                      .order(full_name: :asc)
                      .pluck(:full_name, :id)
-    @grouped_activities, @more_activities =
+    @grouped_activities, @next_id =
       ActivitiesService.load_activities(current_user, selected_teams, activity_filters)
+    @more_activities = @next_id.present?
     last_day = @grouped_activities.keys.last
     @next_date = (Date.parse(last_day) - 1.day).strftime('%Y-%m-%d') if last_day
     respond_to do |format|
@@ -53,7 +54,7 @@ class GlobalActivitiesController < ApplicationController
           activities_html: render_to_string(
             partial: 'activity_list.html.erb'
           ),
-          from: @next_date,
+          next_id: @next_id,
           more_activities: @more_activities
         }
       end
@@ -98,7 +99,7 @@ class GlobalActivitiesController < ApplicationController
 
   def activity_filters
     params.permit(
-      :from_date, :to_date, types: [], subjects: {}, users: [], teams: []
+      :from_id, :from_date, :to_date, types: [], subjects: {}, users: [], teams: []
     )
   end
 

app/services/activities_service.rb

@@ -22,6 +22,7 @@ class ActivitiesService
       query = query.where(where_condition, *where_arguments)
     end
 
+    query = query.where('id <= ?', filters[:from_id].to_i) if filters[:from_id]
     query = query.where(owner_id: filters[:users]) if filters[:users]
     query = query.where(type_of: filters[:types]) if filters[:types]
 
@@ -36,29 +37,18 @@ class ActivitiesService
         query
       end
 
-    activities = activities.order(created_at: :desc)
-                           .limit(Constants::ACTIVITY_AND_NOTIF_SEARCH_LIMIT)
-    loaded = activities.length
+    activities = activities.order(id: :desc).limit(Constants::ACTIVITY_AND_NOTIF_SEARCH_LIMIT + 1).to_a
+
+    if activities.length > Constants::ACTIVITY_AND_NOTIF_SEARCH_LIMIT
+      next_id = activities.last.id
+      activities.pop
+    end
+
     results = activities.group_by do |activity|
       Time.zone.at(activity.created_at).to_date.to_s
     end
 
-    return results if loaded < Constants::ACTIVITY_AND_NOTIF_SEARCH_LIMIT
-
-    last_date = results.keys.last
-    activities = query.where(
-      'created_at <= :from AND created_at >= :to',
-      from: Time.zone.parse(last_date).end_of_day.utc,
-      to: Time.zone.parse(last_date).beginning_of_day.utc
-    ).order(created_at: :desc)
-
-    more_left = query.where(
-      'created_at < :from',
-      from: Time.zone.parse(last_date).prev_day.end_of_day.utc
-    ).exists?
-
-    results[last_date] = activities.to_a
-    [results, more_left]
+    [results, next_id]
   end
 
   def self.load_subjects_children(subjects = {})

app/views/global_activities/_activity.html.erb

@@ -1,22 +1,20 @@
-<div class="activity-card">
-  <div class="row">
-    <div class="col-xs-12">
-      <% if activity.old_activity?  %>
-        <%= sanitize_input(activity.message) %>
-      <% else %>
-        <%= generate_activity_content(activity) %>
-      <% end %>
-    </div>
-  </div>
-  <div class="pull-left activity-timestamp">
-    <%= activity.created_at.strftime('%H:%M') %>
-  </div>
-  <div class="row navigational-breadcrumbs">
-  <% unless activity.old_activity? %>
-    <% if activity.subject_type.present? %>
-      <%= render partial: "global_activities/references/#{activity.subject_type.underscore}.html.erb",
-                 locals: { team: activity.team, subject: activity.subject, breadcrumbs: activity.breadcrumbs } %>
+<div class="row">
+  <div class="col-xs-12">
+    <% if activity.old_activity?  %>
+      <%= sanitize_input(activity.message) %>
+    <% else %>
+      <%= generate_activity_content(activity) %>
     <% end %>
-  <% end %>
   </div>
 </div>
+<div class="pull-left activity-timestamp">
+  <%= activity.created_at.strftime('%H:%M') %>
+</div>
+<div class="row navigational-breadcrumbs">
+<% unless activity.old_activity? || !activity.subject_type.present?%>
+  <%= render partial: "global_activities/references/#{activity.subject_type.underscore}.html.erb",
+             locals: { team: activity.team, subject: activity.subject, breadcrumbs: activity.breadcrumbs } %>
+<% else %>
+  <div class="row">&nbsp;</div>
+<% end %>
+</div>

app/views/global_activities/_activity_list.html.erb

@@ -1,5 +1,5 @@
 <% @grouped_activities.each do |date, activities| %>
-  <div class="row activities-day">
+  <div class="row activities-day" data-date="<%= date %>">
     <div class="col-sm-4 col-md-2 date-container">
       <a class="activities-group-expand-button"
          href="javascript:void(0);"

app/views/global_activities/index.html.erb

@@ -19,17 +19,18 @@
       </div>
       <div class="text-center">
         <a class="btn btn-default btn-more-activities <%= 'hidden' unless @more_activities %>"
-           data-next-date="<%= @next_date %>">
+           data-next-id="<%= @next_id %>">
           <%= t'activities.index.more_activities' %>
         </a>
       </div>
+      <div id="ga-more-activities-placeholder" class="hidden"></div>
     </div>
 
   </div>
 </div>
 
 <script>
-  var gaUrlQueryParams= <%= raw @filters.to_json %> 
+  var gaUrlQueryParams= <%= raw @filters.to_json %>
 </script>
 <%= javascript_include_tag 'global_activities/index.js' %>
 <%= javascript_include_tag 'global_activities/side_pane.js' %>