Saving selected experiment view [SCI-7662] (#4779)

app/assets/stylesheets/shared_styles/elements/dropdown.scss

@@ -75,7 +75,8 @@
     }
 
     .change-projects-view-type-form,
-    .change-experiments-view-type-form {
+    .change-experiments-view-type-form,
+    .change-my-modules-view-type-form {
       .button-to {
         float: unset !important;
         height: 48px;

app/controllers/experiments_controller.rb

@@ -114,6 +114,21 @@ class ExperimentsController < ApplicationController
     render json: Experiments::TableViewService.new(@experiment, my_modules, current_user, params).call
   end
 
+  def list_modules
+    view_state = @experiment.current_view_state(current_user)
+    view_type = view_state.state['my_modules']['view_type'] || 'canvas'
+
+    redirect_to view_mode_redirect_url(view_type)
+  end
+
+  def view_type
+    view_state = @experiment.current_view_state(current_user)
+    view_state.state['my_modules']['view_type'] = view_type_params
+    view_state.save!
+
+    redirect_to view_mode_redirect_url(view_type_params)
+  end
+
   def edit
     respond_to do |format|
       format.json do
@@ -482,6 +497,10 @@ class ExperimentsController < ApplicationController
     params.require(:experiment).require(:project_id)
   end
 
+  def view_type_params
+    params.require(:experiment).require(:view_type)
+  end
+
   def check_read_permissions
     current_team_switch(@experiment.project.team) if current_team != @experiment.project.team
     render_403 unless can_read_experiment?(@experiment) ||
@@ -566,4 +585,15 @@ class ExperimentsController < ApplicationController
             subject: my_module,
             message_items: { my_module: my_module.id })
   end
+
+  def view_mode_redirect_url(view_type)
+    if view_type == 'canvas'
+      return module_archive_experiment_path(@experiment) if @experiment.archived_branch? ||
+                                                            params[:view_mode] == 'archived'
+
+      canvas_experiment_path(@experiment)
+    else
+      table_experiment_path(@experiment, view_mode: params[:view_mode])
+    end
+  end
 end

app/models/experiment.rb

@@ -99,13 +99,15 @@ class Experiment < ApplicationRecord
     {
       my_modules: {
         active: { sort: 'atoz' },
-        archived: { sort: 'atoz' }
+        archived: { sort: 'atoz' },
+        view_type: 'canvas'
       }
     }
   end
 
   def validate_view_state(view_state)
-    if %w(atoz ztoa due_first due_last).exclude?(view_state.state.dig('my_modules', 'active', 'sort')) ||
+    if %w(canvas table).exclude?(view_state.state.dig('my_modules', 'view_type')) ||
+       %w(atoz ztoa due_first due_last).exclude?(view_state.state.dig('my_modules', 'active', 'sort')) ||
        %w(atoz ztoa due_first due_last
           archived_old archived_new).exclude?(view_state.state.dig('my_modules', 'archived', 'sort'))
       view_state.errors.add(:state, :wrong_state)

app/views/experiments/_show_header.html.erb

@@ -22,27 +22,47 @@
     <div class="header-actions experiment-header">
       <%= render layout: 'shared/view_switch', locals: { disabled: false } do %>
           <% if params[:view_mode] == 'archived' || params[:action] == "module_archive" %>
-            <li>
-              <%= link_to module_archive_experiment_path(@experiment), class: ('selected' if action_name == 'module_archive') do %>
+            <li class="form-dropdown-item">
+              <%= button_to(view_type_experiment_path(@experiment, view_mode: 'archived'),
+                            method: :put,
+                            remote: true,
+                            class: "btn btn-light button-to #{ 'selected' if action_name == 'module_archive' }",
+                            form_class: 'change-my-modules-view-type-form',
+                            params: { experiment: { view_type: 'canvas', id: @experiment.id } }) do %>
                 <i class="fas fa-th-large fa-fw"></i>&nbsp;
                 <%= t('experiments.table.view.cards') %>
               <% end %>
             </li>
-            <li>
-              <%= link_to table_experiment_path(@experiment, view_mode: :archived), class: ('selected' if action_name == 'table')  do %>
+            <li class="form-dropdown-item">
+              <%= button_to(view_type_experiment_path(@experiment, view_mode: 'archived'),
+                            method: :put,
+                            remote: true,
+                            class: "btn btn-light button-to #{ 'selected' if action_name == 'table' }",
+                            form_class: 'change-my-modules-view-type-form',
+                            params: { experiment: { view_type: 'table', id: @experiment.id  } }) do %>
                 <i class="fas fa-list fa-fw"></i>&nbsp;
                 <%= t('experiments.table.view.table') %>
               <% end %>
             </li>
           <% else %>
-            <li>
-              <%= link_to canvas_experiment_path(@experiment), class: ('selected' if action_name == 'canvas') do %>
+            <li class="form-dropdown-item">
+            <%= button_to(view_type_experiment_path(@experiment),
+                          method: :put,
+                          remote: true,
+                          class: "btn btn-light button-to #{'selected' if action_name == 'canvas'}",
+                          form_class: 'change-my-modules-view-type-form',
+                          params: { experiment: { view_type: 'canvas', id: @experiment.id } }) do %>
                 <i class="fas fa-dice-four button-icon"></i>
                 <%= t('experiments.table.view.canvas') %>
               <% end %>
             </li>
-            <li>
-              <%= link_to table_experiment_path(@experiment), class: ('selected' if action_name == 'table') do %>
+            <li class="form-dropdown-item">
+              <%= button_to(view_type_experiment_path(@experiment),
+                            method: :put,
+                            remote: true,
+                            class: "btn btn-light button-to #{ 'selected' if action_name == 'table' }",
+                            form_class: 'change-my-modules-view-type-form',
+                            params: { experiment: { view_type: 'table', id: @experiment.id  } }) do %>
                 <i class="fas fa-list button-icon"></i>
                 <%= t('experiments.table.view.table') %>
               <% end %>

app/views/projects/show/_experiment_card.html.erb

@@ -25,9 +25,9 @@
       <%= render partial: 'projects/show/experiment_workflow_image_container', locals: { experiment: experiment } %>
     </div>
     <% if experiment.archived_branch? %>
-      <%= link_to experiment.name, module_archive_experiment_path(experiment), title: experiment.name, class: 'name-link' %>
+      <%= link_to experiment.name, list_modules_experiment_path(experiment, view_mode: 'archived'), title: experiment.name, class: 'name-link' %>
     <% else %>
-      <%= link_to experiment.name, canvas_experiment_path(experiment), title: experiment.name, class: 'name-link' %>
+      <%= link_to experiment.name, list_modules_experiment_path(experiment), title: experiment.name, class: 'name-link' %>
     <% end %>
   </div>
   <div class="dates-and-img-container">

config/routes.rb

@@ -357,10 +357,12 @@ Rails.application.routes.draw do
       member do
         get 'permissions'
         get 'actions_dropdown'
+        put :view_type
         get :table
         get :load_table
         get :move_modules_modal
         post :move_modules
+        get :list_modules
         get 'canvas' # Overview/structure for single experiment
         # AJAX-loaded canvas edit mode (from canvas)
         get 'canvas/edit', to: 'canvas#edit'