From 89ab4d1a3452f3eccc44b8d045b442cc49cb8e36 Mon Sep 17 00:00:00 2001
From: George Cushen <gcushen@users.noreply.github.com>
Date: Sat, 15 Nov 2025 16:18:46 +0000
Subject: [PATCH] fix: search not working when site deployed to sub-folder

---
 modules/blox-tailwind/assets/js/hb-head.js             | 10 ++++++++++
 .../layouts/_partials/components/search-modal.html     |  5 +++--
 modules/blox-tailwind/layouts/baseof.html              |  3 ++-
 3 files changed, 15 insertions(+), 3 deletions(-)

diff --git a/modules/blox-tailwind/assets/js/hb-head.js b/modules/blox-tailwind/assets/js/hb-head.js
index 27911ecb..c11d83e5 100644
--- a/modules/blox-tailwind/assets/js/hb-head.js
+++ b/modules/blox-tailwind/assets/js/hb-head.js
@@ -3,10 +3,20 @@ import {applyHugoStyleFixes, initTheme} from "./hb-init.js";
 // Initialize Hugo Blox Builder global object
 const root = document.documentElement;
 const defaultTheme = root.dataset.wcThemeDefault || "system";
+const relBase = root.dataset.hbbRelurl || "/";
+const normalizedRelBase = relBase.endsWith("/") ? relBase : `${relBase}/`;
+const buildAssetPath = (relativePath) => {
+  const sanitizedRelative = relativePath.startsWith("/") ? relativePath.slice(1) : relativePath;
+  return `${normalizedRelBase}${sanitizedRelative}`;
+};
 
 // Create global HBB object with theme functions
 window.hbb = {
   defaultTheme: defaultTheme,
+  relBase: normalizedRelBase,
+  assetPaths: {
+    pagefind: buildAssetPath("pagefind/pagefind.js"),
+  },
   setDarkTheme: () => {
     root.classList.add("dark");
     root.style.colorScheme = "dark";
diff --git a/modules/blox-tailwind/layouts/_partials/components/search-modal.html b/modules/blox-tailwind/layouts/_partials/components/search-modal.html
index 7431520d..57eba11e 100644
--- a/modules/blox-tailwind/layouts/_partials/components/search-modal.html
+++ b/modules/blox-tailwind/layouts/_partials/components/search-modal.html
@@ -269,6 +269,7 @@
       availableFilters: [],
       trendingSearches: {{ site.Params.features.search.trending_searches | default (slice "Search term 1" "Search term 2") | jsonify }},
       pagefind: null,
+      pagefindModulePath: window.hbb?.assetPaths?.pagefind ?? '/pagefind/pagefind.js',
       
       // i18n translations for content types
       typeLabels: {
@@ -280,7 +281,7 @@
       async init() {
         // Initialize Pagefind
         try {
-          this.pagefind = await import('/pagefind/pagefind.js');
+          this.pagefind = await import(this.pagefindModulePath);
           await this.pagefind.init();
           console.log('✓ Pagefind initialized');
           
@@ -520,4 +521,4 @@
 
 <style>
   [x-cloak] { display: none !important; }
-</style>
\ No newline at end of file
+</style>
diff --git a/modules/blox-tailwind/layouts/baseof.html b/modules/blox-tailwind/layouts/baseof.html
index d86fb0c1..aef78bee 100644
--- a/modules/blox-tailwind/layouts/baseof.html
+++ b/modules/blox-tailwind/layouts/baseof.html
@@ -3,7 +3,8 @@
 {{ printf "<!-- Last Published: %s -->" (now | time.Format ":date_long") | safeHTML }}
 {{- $language_code := site.LanguageCode | default "en-us" -}}
 <html lang="{{$language_code}}" {{ if in site.Data.i18n.rtl.rtl $language_code }}dir="rtl"{{else}}dir="ltr"{{end}}
-      data-wc-theme-default="{{ (lower site.Params.appearance.mode) | default "system" }}">
+      data-wc-theme-default="{{ (lower site.Params.appearance.mode) | default "system" }}"
+      data-hbb-relurl="{{ "" | relURL }}">
   {{ partial "site_head" . }}
   <body class="dark:bg-hb-dark dark:text-white page-wrapper" id="top">
     <div id="page-bg"></div>