From 7af1a0f052ace730d6d6bd2a0de457a8901bc61c Mon Sep 17 00:00:00 2001
From: Tomas Cohen Arazi <tomascohen@theke.io>
Date: Tue, 2 Nov 2021 16:57:49 -0300
Subject: [PATCH] Bug 29404: Add infinite scrolling to pickup location
 dropdowns

This patch adds infinite scrolling to the pickup locations select2
dropdowns on the staff interface.

It does so by adding a new transport function (in select2.js) to read
the response headers Koha's API sends back, and converting to the right
data structure Select2 expects for the feature to work.

This is manually used in the different pickup locations dropdowns.
There's a separate bug that will introduce a select2 wrapper that will probably embed this function in it.

To test:
1. Run the [DO NOT PUSH] script inside koha-shell to generate random
   pickup locations:
   $ kshell
  k$ perl generate_pickup_locations.pl
2. Try placing holds. Notice the visible pickup locations dropdowns
   display some pickup locations based on the matches you got. They are
   all fetched once
=> SUCCESS: It works
3. Repeat for the current holds page and the patron holds listing
=> SUCCESS: Same behavior
4. Apply this patch
5. Repeat 2 and 3
=> SUCCESS: Things work, but pickup locations are retrieved as needed,
while you scroll.
6. Sign off :-D

Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>

Signed-off-by: Nick Clemens <nick@bywatersolutions.com>

Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
---
 .../prog/en/modules/reserve/request.tt        | 47 +++++++------------
 koha-tmpl/intranet-tmpl/prog/js/holds.js      | 41 ++++++++--------
 koha-tmpl/intranet-tmpl/prog/js/select2.js    | 20 ++++++++
 3 files changed, 59 insertions(+), 49 deletions(-)

diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/reserve/request.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/reserve/request.tt
index 794bb6fafa..7fc53d3d1c 100644
--- a/koha-tmpl/intranet-tmpl/prog/en/modules/reserve/request.tt
+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/reserve/request.tt
@@ -1131,6 +1131,7 @@
     [% Asset.js("lib/hc-sticky.js") | $raw %]
     [% Asset.js("js/circ-patron-search-results.js") | $raw %]
     [% INCLUDE 'select2.inc' %]
+    [% Asset.js("js/holds.js") | $raw%]
     <script>
         var Sticky;
         var biblionumber = "[% biblionumber | $raw %]";
@@ -1290,22 +1291,6 @@
                 });
             [% END %]
 
-            function display_pickup_location (state) {
-                var $text;
-                if ( state.needs_override === true ) {
-                    $text = $(
-                        '<span>' + state.text + '</span> <span style="float:right;" title="' +
-                        _("This pickup location is not allowed according to circulation rules") +
-                        '"><i class="fa fa-exclamation-circle" aria-hidden="true"></i></span>'
-                    );
-                }
-                else {
-                    $text = $('<span>'+state.text+'</span>');
-                }
-
-                return $text;
-            };
-
             $(".pickup_location_dropdown").each( function () {
                 var this_dropdown = $(this);
                 var hold_id = $(this).data('hold_id');
@@ -1321,13 +1306,14 @@
                             var query = {
                                 "q": JSON.stringify({"name":{"-like":'%'+search_term+'%'}}),
                                 "_order_by": "name",
-                                "_per_page": -1
+                                "_page": params.page
                             };
+
                             return query;
                         },
-                        processResults: function (data) {
+                        processResults: function (data, params) {
                             var results = [];
-                            data.forEach( function ( pickup_location ) {
+                            data.results.forEach( function ( pickup_location ) {
                                 results.push(
                                     {
                                         "id": pickup_location.library_id.escapeHtml(),
@@ -1336,8 +1322,9 @@
                                     }
                                 );
                             });
-                            return { "results": results };
-                        }
+                            return { "results": results, "pagination": { "more": data.pagination.more } };
+                        },
+                        transport: kohaSelect2Transport
                     },
                     templateResult: display_pickup_location
                 });
@@ -1384,13 +1371,13 @@
                                 "q": JSON.stringify({"name":{"-like":'%'+search_term+'%'}}),
                                 "_order_by": "name",
                                 "patron_id": patron_id,
-                                "_per_page": -1
+                                "_page": params.page
                             };
                             return query;
                         },
                         processResults: function (data) {
                             var results = [];
-                            data.forEach( function ( pickup_location ) {
+                            data.results.forEach( function ( pickup_location ) {
                                 results.push(
                                     {
                                         "id": pickup_location.library_id.escapeHtml(),
@@ -1399,8 +1386,9 @@
                                     }
                                 );
                             });
-                            return { "results": results };
-                        }
+                            return { "results": results, "pagination": { "more": data.pagination.more } };
+                        },
+                        transport: kohaSelect2Transport,
                     },
                     templateResult: display_pickup_location
                 });
@@ -1422,13 +1410,13 @@
                                 "q": JSON.stringify({"name":{"-like":'%'+search_term+'%'}}),
                                 "_order_by": "name",
                                 "patron_id": patron_id,
-                                "_per_page": -1
+                                "_page": params.page
                             };
                             return query;
                         },
                         processResults: function (data) {
                             var results = [];
-                            data.forEach( function ( pickup_location ) {
+                            data.results.forEach( function ( pickup_location ) {
                                 results.push(
                                     {
                                         "id": pickup_location.library_id.escapeHtml(),
@@ -1437,8 +1425,9 @@
                                     }
                                 );
                             });
-                            return { "results": results };
-                        }
+                            return { "results": results, "pagination": { "more": data.pagination.more } };
+                        },
+                        transport: kohaSelect2Transport
                     },
                     templateResult: display_pickup_location
                 });
diff --git a/koha-tmpl/intranet-tmpl/prog/js/holds.js b/koha-tmpl/intranet-tmpl/prog/js/holds.js
index a18b2641ed..b03c9b388b 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/holds.js
+++ b/koha-tmpl/intranet-tmpl/prog/js/holds.js
@@ -1,3 +1,19 @@
+function display_pickup_location (state) {
+    var $text;
+    if ( state.needs_override === true ) {
+        $text = $(
+            '<span>' + state.text + '</span> <span style="float:right;" title="' +
+            _("This pickup location is not allowed according to circulation rules") +
+            '"><i class="fa fa-exclamation-circle" aria-hidden="true"></i></span>'
+        );
+    }
+    else {
+        $text = $('<span>'+state.text+'</span>');
+    }
+
+    return $text;
+};
+
 /* global __ dataTablesDefaults borrowernumber SuspendHoldsIntranet */
 $(document).ready(function() {
     var holdsTable;
@@ -219,22 +235,6 @@ $(document).ready(function() {
                     });
                 });
 
-                function display_pickup_location (state) {
-                    var $text;
-                    if ( state.needs_override === true ) {
-                        $text = $(
-                            '<span>' + state.text + '</span> <span style="float:right;" title="' +
-                            _("This pickup location is not allowed according to circulation rules") +
-                            '"><i class="fa fa-exclamation-circle" aria-hidden="true"></i></span>'
-                        );
-                    }
-                    else {
-                        $text = $('<span>'+state.text+'</span>');
-                    }
-
-                    return $text;
-                };
-
                 $(".hold_location_select").each( function () {
                     var this_dropdown = $(this);
                     var hold_id = $(this).data('hold-id');
@@ -251,13 +251,13 @@ $(document).ready(function() {
                                 var query = {
                                     "q": JSON.stringify({"name":{"-like":'%'+search_term+'%'}}),
                                     "_order_by": "name",
-                                    "_per_page": -1
+                                    "_page": params.page
                                 };
                                 return query;
                             },
                             processResults: function (data) {
                                 var results = [];
-                                data.forEach( function ( pickup_location ) {
+                                data.results.forEach( function ( pickup_location ) {
                                     results.push(
                                         {
                                             "id": pickup_location.library_id.escapeHtml(),
@@ -266,8 +266,9 @@ $(document).ready(function() {
                                         }
                                     );
                                 });
-                                return { "results": results };
-                            }
+                                return { "results": results, "pagination": { "more": data.pagination.more } };
+                            },
+                            transport: kohaSelect2Transport
                         },
                         templateResult: display_pickup_location
                     });
diff --git a/koha-tmpl/intranet-tmpl/prog/js/select2.js b/koha-tmpl/intranet-tmpl/prog/js/select2.js
index 42383dd547..1d78e0a0a2 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/select2.js
+++ b/koha-tmpl/intranet-tmpl/prog/js/select2.js
@@ -37,3 +37,23 @@ $(document).ready(function(){
         });
     });
 });
+
+function kohaSelect2Transport(params, success, failure) {
+    var read_headers = function (data, textStatus, jqXHR) {
+        var more = false;
+        var link = jqXHR.getResponseHeader('Link') || '';
+        if (link.search(/<([^>]+)>;\s*rel\s*=\s*['"]?next['"]?\s*(,|$)/i) > -1) {
+            more = true;
+        }
+
+        return {
+            results: data,
+            pagination: {
+                more: more
+            }
+        };
+    };
+    var $request = $.ajax(params);
+    $request.then(read_headers).then(success);
+    $request.fail(failure);
+}
-- 
2.39.5