Coveo: Fix coveo filtering clearing in URL on refresh (#428)

Author: lamATnginx

assets/css/v2/style.css

@@ -1423,6 +1423,7 @@ atomic-search-interface#search-v2 {
   }
 }
 
+atomic-external#search-standalone-header,
 atomic-search-interface#search-standalone-header {
   height: fit-content;
 

assets/js/coveo.js

@@ -85,7 +85,9 @@ async function atomicCoveo() {
         return request;
       },
     });
-    await el.executeFirstSearch();
+
+    // No standalone searchboxes should be getting executing first search.
+    if (el.id === 'search-v2') await el.executeFirstSearch();
   });
 
   const headerSearchBar = document.querySelector('#search-standalone-header');

layouts/partials/coveo-atomic-search.html

@@ -1,6 +1,6 @@
 {{ $redirectionUrl := .redirectionUrl | default .Site.Params.coveo_search_redirect | default "/search.html" }}
 {{ $id := .id | default "search-standalone-header"}}
 <atomic-search-interface id={{ $id }}>
-    <atomic-search-box redirection-url={{ $redirectionUrl }} class="header-search-box">
-    </atomic-search-box>
+  <atomic-search-box redirection-url={{ $redirectionUrl }} class="header-search-box">
+  </atomic-search-box>
 </atomic-search-interface>

layouts/partials/header.html

@@ -19,8 +19,16 @@
             </label>
           {{ end }}
           <div class="header__search" data-testid="header__search">
+            {{ if in .RelPermalink "search.html" }}
+              <!-- Detached search box -->
+              <atomic-external selector="#search-v2" id="search-standalone-header">
+                {{ $redirectUrl := default .Site.Params.coveo_search_redirect "/search.html" }}
+                <atomic-search-box redirection-url={{ $redirectUrl }} class="header-search-box"></atomic-search-box>
+              </atomic-external>
+            {{ else }}
               <!-- Standalone search box. -->
               {{ partial "coveo-atomic-search.html" (dict "id" "search-standalone-header") }}
+            {{ end }}
           </div>
           {{ end }}
       </div>
@@ -35,10 +43,16 @@
 
   </div>
   <div class="header-search-dropdown" data-testid="header-search-dropdown-mobile">
-    <atomic-external selector="#search-standalone-header">
-      {{ $redirectUrl := default .Site.Params.coveo_search_redirect "/search.html" }}
-      <atomic-search-box redirection-url={{ $redirectUrl }}></atomic-search-box>
-    </atomic-external>
+    {{ if in .RelPermalink "search.html" }}
+      <!-- Detached search box -->
+      <atomic-external selector="#search-v2">
+        {{ $redirectUrl := default .Site.Params.coveo_search_redirect "/search.html" }}
+        <atomic-search-box redirection-url={{ $redirectUrl }} class="header-search-box"></atomic-search-box>
+      </atomic-external>
+    {{ else }}
+      <!-- Standalone search box. -->
+      {{ partial "coveo-atomic-search.html" (dict "id" "search-standalone-header-dropdown") }}
+    {{ end }}
   </div>
 </div>
 {{ end }}