Add projects navigation buttons and fix sidebar reload on sorting [SCI-5357][SCI-5331] (#3048)

* Add projects navigation buttons and fix sidebar reload on sorting [SCI-5357][SCI-5331]

app/assets/javascripts/projects/index.js

@@ -7,7 +7,7 @@
 // - refresh project users tab after manage user modal is closed
 // - refactor view handling using library, ex. backbone.js
 
-/* global Comments CounterBadge animateSpinner initFormSubmitLinks HelperModule
+/* global Comments Promise CounterBadge animateSpinner initFormSubmitLinks HelperModule
    dropdownSelector Sidebar Turbolinks */
 
 (function(global) {
@@ -435,7 +435,10 @@
 
   function refreshCurrentView() {
     loadCardsView();
-    Sidebar.reload();
+    Sidebar.reload({
+      sort: projectsCurrentSort,
+      view_mode: $('.projects-index').data('mode')
+    });
   }
 
   function initEditButton() {
@@ -475,13 +478,12 @@
   function loadCardsView() {
     var viewContainer = $('#cardsWrapper');
     // animateSpinner(viewContainer, true);
-
     $.ajax({
       url: viewContainer.data('projects-cards-url'),
       type: 'GET',
       dataType: 'json',
       data: {
-        filter: $('.projects-index').data('mode'),
+        view_mode: $('.projects-index').data('mode'),
         sort: projectsCurrentSort,
         search: projectsViewSearch,
         members: membersFilter,
@@ -537,7 +539,7 @@
       if (projectsCurrentSort !== $(this).data('sort')) {
         $('#sortMenuDropdown a').removeClass('selected');
         projectsCurrentSort = $(this).data('sort');
-        loadCardsView();
+        refreshCurrentView();
         $(this).addClass('selected');
         $('#sortMenu').dropdown('toggle');
       }

app/assets/javascripts/sidebar.js

@@ -10,9 +10,9 @@ var Sidebar = (function() {
     branchSelectors.removeClass('collapsed fa-caret-right').addClass('fa-caret-down');
   }
 
-  function reloadSidebar() {
+  function reloadSidebar(params) {
     let url = $(SIDEBAR_CONTAINER).data('sidebar-url');
-    $.get(url, function(result) {
+    $.get(url, params, function(result) {
       $(SIDEBAR_CONTAINER).find('.sidebar-body').html(result.html);
       showSelectedLeaf();
       $(SIDEBAR_CONTAINER).data('scrollBar').update();
@@ -40,8 +40,8 @@ var Sidebar = (function() {
       }
     },
 
-    reload: () => {
-      reloadSidebar();
+    reload: (params = {}) => {
+      reloadSidebar(params);
     }
   };
 }());

app/controllers/projects_controller.rb

@@ -21,9 +21,8 @@ class ProjectsController < ApplicationController
   def index
     if current_team
       view_state = current_team.current_view_state(current_user)
-      @current_filter = view_state.state.dig('projects', 'filter')
       @current_view_mode = params[:mode] || :active
-      @current_sort = view_state.state.dig('projects', @current_view_mode, 'sort')
+      @current_sort = view_state.state.dig('projects', @current_view_mode.to_s, 'sort') || 'atoz'
     end
   end
 

app/controllers/teams_controller.rb

@@ -13,7 +13,12 @@ class TeamsController < ApplicationController
       format.json do
         render json: {
           html: render_to_string(
-            partial: 'shared/sidebar/projects.html.erb', locals: { team: current_team }
+            partial: 'shared/sidebar/projects.html.erb',
+            locals: {
+              team: current_team,
+              sort: params[:sort],
+              view_mode: params[:view_mode]
+            }
           )
         }
       end

app/helpers/projects_helper.rb

@@ -21,10 +21,16 @@ module ProjectsHelper
     conns.to_s[1..-2]
   end
 
-  def sidebar_folders_tree(team, user)
-    records = team.projects.active.visible_to(user, team) + ProjectFolder.inner_folders(team)
-    view_state = team.current_view_state(user)
-    records = case view_state.state.dig('projects', 'active', 'sort')
+  def sidebar_folders_tree(team, user, sort, view_mode)
+    records = if view_mode == 'archived'
+                team.projects.archived.visible_to(user, team) +
+                  ProjectFolder.archived.inner_folders(team)
+              else
+                team.projects.active.visible_to(user, team) +
+                  ProjectFolder.active.inner_folders(team)
+              end
+    sort ||= team.current_view_state(user).state.dig('projects', 'active', 'sort')
+    records = case sort
               when 'new'
                 records.sort_by(&:created_at).reverse!
               when 'old'

app/services/projects_overview_service.rb

@@ -7,7 +7,7 @@ class ProjectsOverviewService
     @current_folder = folder
     @params = params
     @view_state = @team.current_view_state(@user)
-    @view_mode = @view_state.state.dig('projects', 'view_mode')
+    @view_mode = params[:view_mode]
 
     # Update sort if chanhed
     @sort = @view_state.state.dig('projects', @view_mode, 'sort') || 'atoz'
@@ -98,8 +98,8 @@ class ProjectsOverviewService
   end
 
   def filter_project_records(records)
-    records = records.where(archived: true) if @params[:filter] == 'archived'
-    records = records.where(archived: false) if @params[:filter] == 'active'
+    records = records.where(archived: true) if @params[:view_mode] == 'archived'
+    records = records.where(archived: false) if @params[:view_mode] == 'active'
     records = records.where_attributes_like('projects.name', @params[:search]) if @params[:search].present?
     records = records.where_attributes_like('projects.name', @params[:search]) if @params[:search].present?
     records = records.where('user_projects.user_id IN (?)', @params[:members]) if @params[:members]&.any?
@@ -113,8 +113,8 @@ class ProjectsOverviewService
   end
 
   def filter_project_folder_records(records)
-    records = records.where(archived: true) if @params[:filter] == 'archived'
-    records = records.where(archived: false) if @params[:filter] == 'active'
+    records = records.where(archived: true) if @params[:view_mode] == 'archived'
+    records = records.where(archived: false) if @params[:view_mode] == 'active'
     records = records.where_attributes_like('project_folders.name', @params[:search]) if @params[:search].present?
     records
   end

app/views/projects/index.html.erb

@@ -4,7 +4,7 @@
 <% provide(:container_class, 'no-second-nav-container') %>
 
 <%= content_for :sidebar do %>
-  <%= render partial: 'shared/sidebar/projects', locals: { team: current_team } if current_team %>
+  <%= render partial: 'shared/sidebar/projects', locals: { team: current_team, sort: nil, view_mode: @current_view_mode } if current_team %>
 <% end %>
 
 <% content_for :breadcrumbs do %>

app/views/shared/sidebar/_projects.html.erb

@@ -1,3 +1,18 @@
  <ul class="sidebar-branch">
-  <%= render partial: 'shared/sidebar/projects_tree_branch.html.erb', locals: { records: sidebar_folders_tree(team, current_user) } %>
+  <% if view_mode == 'archived' %>
+    <li class="sidebar-leaf">
+      <%= link_to projects_path, class: "sidebar-link back-button" do %>
+        <%= t("projects.index.back_to_active_projects") %>
+      <% end %>
+    </li>
+  <% end %>
+  <%= render partial: 'shared/sidebar/projects_tree_branch.html.erb', locals: { records: sidebar_folders_tree(team, current_user, sort, view_mode) } %>
+  <% if view_mode != 'archived' %>
+    <li class="sidebar-leaf">
+      <%= link_to projects_path(mode: :archived), class: "sidebar-link" do %>
+        <span class="fas fa-archive"></span>
+        <%= t("projects.index.navigation_archived_projects") %>
+      <% end %>
+    </li>
+  <% end %>
 </ul>

config/locales/en.yml

@@ -314,6 +314,8 @@ en:
         archived_projects: "Go to Archived projects"
       head_title: "Projects"
       navigation_title: "PROJECTS"
+      navigation_archived_projects: "Archived projects"
+      back_to_active_projects: "Back to active projects"
       breadcrumbs_root: "Projects"
       archive: "Archive"
       archived: "Archived"