From e9794f96338ae8795d3749c0865dd026c2829c5f Mon Sep 17 00:00:00 2001
From: cstns <cstn.serban@gmail.com>
Date: Tue, 13 May 2025 16:20:58 +0300
Subject: [PATCH 1/3] Add a load more button to algolia search bars

---
 src/_includes/layouts/common-js.njk | 30 +++++++++++++++++++++++++++--
 src/css/algolia-theme.css           |  9 +++++++++
 2 files changed, 37 insertions(+), 2 deletions(-)

diff --git a/src/_includes/layouts/common-js.njk b/src/_includes/layouts/common-js.njk
index a7ec709142..20bdb51554 100644
--- a/src/_includes/layouts/common-js.njk
+++ b/src/_includes/layouts/common-js.njk
@@ -39,8 +39,14 @@
             'webinars': 'Webinars',
         }
         const placeholder = Object.prototype.hasOwnProperty.call(scopeTitles, searchScope) ? `Search in ${scopeTitles[searchScope]}...` : 'Search...'
-
+        const initialHitsPerPage = 5;
+        
+        let hitsPerPage = initialHitsPerPage
+        let initialQuery = '';
+        
         const searchQuery = (searchClient, query, scope) => {
+            initialQuery = query
+            
             return {
                 sourceId : scope,
                 getItems : () => getAlgoliaResults({
@@ -50,7 +56,7 @@
                             indexName            : 'netlify_00f8cf60-997f-4c4d-9427-a97924358648_live_all',
                             params               : {
                                 query,
-                                hitsPerPage: 5,
+                                hitsPerPage
                             },
                             attributesToHighlight: '*',
                             filters: scope.length === 0 ?  undefined : `category:${scope}`
@@ -104,6 +110,9 @@
                                 </div>
                             </a>`;
                     },
+                    footer({html}) {
+                        return html`<button id="load-more" class="aa-LoadMore">Load more...</button>`;
+                    }
                 }
             };
         }
@@ -127,6 +136,23 @@
                 document.querySelectorAll('.aa-Panel img').forEach(img => {
                     img.src = img.getAttribute('data-src');
                 });
+
+                // reset the number of results per page if the query changes
+                if (state.query !== initialQuery) {
+                    hitsPerPage = initialHitsPerPage
+                }
+                
+                const loadMoreBtn = document.querySelector('#load-more');
+                if (loadMoreBtn) {
+                    loadMoreBtn.onclick = () => {
+                        hitsPerPage += initialHitsPerPage;
+
+                        const input = document.querySelector('#algolia-search input');
+
+                        // Trick Autocomplete into refreshing and retrieving more hits per page
+                        input.dispatchEvent(new Event('input', { bubbles: true }));
+                    };
+                }
             }
         });
     }
diff --git a/src/css/algolia-theme.css b/src/css/algolia-theme.css
index 7eb13eca28..7ad0f75d4e 100644
--- a/src/css/algolia-theme.css
+++ b/src/css/algolia-theme.css
@@ -80,3 +80,12 @@
 .aa-Panel .aa-ItemContent .aa-ItemContentBody .aa-ItemContentDescription {
     color: #777;
 }
+
+.aa-Panel .aa-SourceFooter #load-more {
+    display: block;
+    width: 100%;
+    text-align: center;
+    color: #777;
+    padding: 10px 0 5px;
+    font-size: 12px;
+}

From 314464d4bbe64790768375d94268d97e0a5f2588 Mon Sep 17 00:00:00 2001
From: cstns <cstn.serban@gmail.com>
Date: Tue, 13 May 2025 17:10:14 +0300
Subject: [PATCH 2/3] Fix algolia's autocomplete left on debug mode and not
 auto-closing

---
 src/_includes/layouts/common-js.njk | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/_includes/layouts/common-js.njk b/src/_includes/layouts/common-js.njk
index 20bdb51554..3b311856b8 100644
--- a/src/_includes/layouts/common-js.njk
+++ b/src/_includes/layouts/common-js.njk
@@ -118,7 +118,7 @@
         }
 
         autocomplete({
-            debug: true,
+            debug: false,
             container: '#algolia-search',
             placeholder,
             getSources({query}) {

From e0087e502badb473eb191cad53fb9ad9a3fc9e3d Mon Sep 17 00:00:00 2001
From: Joe Pavitt <joepavitt@flowforge.com>
Date: Mon, 2 Jun 2025 10:27:49 +0100
Subject: [PATCH 3/3] Add hover behaviour on the "Load More" button

---
 src/css/algolia-theme.css | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/src/css/algolia-theme.css b/src/css/algolia-theme.css
index 7ad0f75d4e..0d13ff27c0 100644
--- a/src/css/algolia-theme.css
+++ b/src/css/algolia-theme.css
@@ -89,3 +89,8 @@
     padding: 10px 0 5px;
     font-size: 12px;
 }
+
+.aa-Panel .aa-SourceFooter #load-more:hover {
+    cursor: pointer;
+    color: #2563eb;
+}