From 506c750eeea69083ee8ea22dea7c3e9355ddc82a Mon Sep 17 00:00:00 2001
From: sboursen-scinote <soufiane@scinote.net>
Date: Thu, 9 Mar 2023 21:59:14 +0100
Subject: [PATCH] Use datatable ajax to send version param [SCI-8007]

---
 app/assets/javascripts/protocols/index.js     | 59 +++++++++----------
 .../protocol_linked_children_datatable.rb     | 15 ++++-
 2 files changed, 43 insertions(+), 31 deletions(-)

diff --git a/app/assets/javascripts/protocols/index.js b/app/assets/javascripts/protocols/index.js
index 65a96f6ed..86c2690f9 100644
--- a/app/assets/javascripts/protocols/index.js
+++ b/app/assets/javascripts/protocols/index.js
@@ -5,6 +5,7 @@
 
 // Global variables
 var ProtocolsIndex = (function() {
+  const ALL_VERSIONS_VALUE = 'All';
   var PERMISSIONS = ['archivable', 'restorable', 'copyable'];
   var rowsSelected = [];
   var protocolsTableEl = null;
@@ -566,10 +567,27 @@ var ProtocolsIndex = (function() {
             modal.modal('show');
 
             let childrenTableEl = modalBody.find('#linked-children-table');
+            let versionFromDropdown = ALL_VERSIONS_VALUE;
+
+            const initVersionsDropdown = (childrenDatatable) => {
+              const versionSelector = $('#version-selector');
+              dropdownSelector.init(versionSelector, {
+                noEmptyOption: true,
+                singleSelect: true,
+                selectAppearance: 'simple',
+                closeOnSelect: true,
+                onSelect: function() {
+                  versionFromDropdown = dropdownSelector.getValues(versionSelector);
+                  childrenDatatable.ajax.reload();
+                }
+              });
+            };
+
+            let childrenDatatable;
 
             if (childrenTableEl) {
               // Only initialize table if it's present
-              childrenTableEl.DataTable({
+              childrenDatatable = childrenTableEl.DataTable({
                 autoWidth: false,
                 dom: 'RBtpl',
                 stateSave: false,
@@ -578,7 +596,14 @@ var ProtocolsIndex = (function() {
                 serverSide: true,
                 ajax: {
                   url: childrenTableEl.data('source'),
-                  type: 'POST'
+                  type: 'POST',
+                  data: function(d) {
+                    if (versionFromDropdown !== ALL_VERSIONS_VALUE) {
+                      d.version = versionFromDropdown;
+                    }
+
+                    return d;
+                  }
                 },
                 colReorder: {
                   fixedColumnsLeft: 1000000 // Disable reordering
@@ -595,34 +620,6 @@ var ProtocolsIndex = (function() {
                 language: {
                   lengthMenu: '_MENU_'
                 },
-                initComplete: function() {
-                  const versionSelector = $('#version-selector');
-                  const table = childrenTableEl.DataTable();
-                  dropdownSelector.init(versionSelector, {
-                    noEmptyOption: true,
-                    singleSelect: true,
-                    selectAppearance: 'simple',
-                    closeOnSelect: true,
-                    onSelect: function() {
-                      const selectedValue = dropdownSelector.getValues(versionSelector);
-                      if (selectedValue === 'All') {
-                        table.rows().eq(0).each(index => {
-                          const row = table.row(index);
-                          row.nodes().to$().show();
-                        });
-                      } else {
-                        table.rows().eq(0).each(index => {
-                          const row = table.row(index);
-                          if (Number(row.data().version) === Number(selectedValue)) {
-                            row.nodes().to$().show();
-                          } else {
-                            row.nodes().to$().hide();
-                          }
-                        });
-                      }
-                    }
-                  });
-                },
                 fnDrawCallback: function() {
                   animateSpinner(this, false);
                 },
@@ -631,6 +628,8 @@ var ProtocolsIndex = (function() {
                 }
               });
             }
+
+            initVersionsDropdown(childrenDatatable);
           },
           error: function() {
             // TODO
diff --git a/app/datatables/protocol_linked_children_datatable.rb b/app/datatables/protocol_linked_children_datatable.rb
index 333f7c8f4..9b3c01e10 100644
--- a/app/datatables/protocol_linked_children_datatable.rb
+++ b/app/datatables/protocol_linked_children_datatable.rb
@@ -32,7 +32,6 @@ class ProtocolLinkedChildrenDatatable < CustomDatatable
     records.map do |record|
       {
         'DT_RowId' => record.id,
-        'version' => record.parent.version_number,
         '1' => record_html(record)
       }
     end
@@ -46,11 +45,15 @@ class ProtocolLinkedChildrenDatatable < CustomDatatable
       .includes(my_module: { experiment: :project })
       .references(my_module: { experiment: :project })
       .where(protocol_type: Protocol.protocol_types[:linked])
+
     records = linked_protocols
       .where(parent: @protocol)
       .or(
         linked_protocols.where(parent: Protocol.where(parent: @protocol))
       )
+
+    records = filter_child_records(records)
+
     records.distinct
   end
 
@@ -80,4 +83,14 @@ class ProtocolLinkedChildrenDatatable < CustomDatatable
     res += '</ol>'
     res
   end
+
+  def filter_child_records(records)
+    if params[:version].present?
+      version = params[:version]
+      records = records.joins("LEFT JOIN protocols protocol_parents " \
+                "ON protocols.parent_id = protocol_parents.id ")
+                .where("protocol_parents.version_number = #{version}")
+    end
+    records
+  end
 end