feat: Removed unneeded JS + moved to CSS

Author: lamATnginx

assets/css/v2/style.css

@@ -55,6 +55,9 @@
   --codeblock-line-box-side-length: 4px;
   --component-gap: 3.5rem;
   --overflow-gutter-extension: 1rem;
+
+  --hide-sidebar-breakpoint: 1184px;
+  --hide-facet-breakpoint: 1023px;
 }
 body {
   margin: 0;
@@ -308,7 +311,7 @@ nav {
     column-gap: var(--component-gap);
   }
 }
-@media (max-width: 1184px) {
+@media (max-width: var(--hide-sidebar-breakpoint)) {
   .sidebar-layout {
     display: none;
   }
@@ -505,6 +508,30 @@ atomic-search-layout atomic-layout-section[section="search"] {
   z-index: 9999;
 }
 
+header atomic-search-interface {
+  /* Hide by default */
+  display: none;
+}
+
+body:not(:has(.main-layout)) header atomic-search-interface {
+  /* Show on landing pages */
+  display: block;
+}
+
+@media (max-width: var(--hide-sidebar-breakpoint)) {
+  /* Show on pages with sidebar if it is hidden */
+  body:has(.sidebar-layout) header atomic-search-interface {
+    display: block;
+  }
+}
+
+@media (max-width: var(--hide-facet-breakpoint)) {
+  /* Show on pages with sidebar if it is hidden */
+  body:has(atomic-search-layout) header atomic-search-interface {
+    display: block;
+  }
+}
+
 /* Sidebar */
 .sidebar {
   display: flex;

assets/js/coveo.js

@@ -23,8 +23,9 @@ async function getsearchObj() {
 async function atomicCoveo() {
   /* Fetch the credentials */
   await customElements.whenDefined('atomic-search-interface');
-  const token = localStorage.getItem('coveo_jwt_v1');
-  const org_id = localStorage.getItem('coveo_org_id_v1');
+  const token =
+    'eyJhbGciOiJIUzI1NiJ9.eyJzZWFyY2hIdWIiOiJIVUJfRVNfTmdpbnhfRG9jc19BbmRfT3JnIiwidjgiOnRydWUsInRva2VuSWQiOiJ0NnMzdWt4Mng3dnNjbGVka2dxNWszMmZkbSIsIm9yZ2FuaXphdGlvbiI6ImY1bmV0d29ya3gxaDE2MDdoIiwidXNlcklkcyI6W3sidHlwZSI6IlVzZXIiLCJuYW1lIjoiYW5vbnltb3VzIiwicHJvdmlkZXIiOiJFbWFpbCBTZWN1cml0eSBQcm92aWRlciJ9XSwicm9sZXMiOlsicXVlcnlFeGVjdXRvciJdLCJpc3MiOiJTZWFyY2hBcGkiLCJleHAiOjE3NDMyMDgzMTEsImlhdCI6MTc0MzEyMTkxMX0.hc24F59yGngqAzrh4PyXpcPRN7hVN6Dpeg6BoiF1v-E';
+  const org_id = 'f5networkx1h1607h';
   let searchObj = { token, org_id };
 
   if (token === null || org_id === null || isJwtExpired(token)) {
@@ -85,8 +86,6 @@ async function atomicCoveo() {
     },
   });
 
-  searchBarHeader.style.display =
-    sidebar || searchPageInterface ? 'none' : 'block';
   await searchBarHeader.executeFirstSearch();
 }
 
@@ -158,26 +157,3 @@ document.addEventListener('DOMContentLoaded', async () => {
     legacyCoveo();
   }
 });
-
-window.addEventListener('resize', (event) => {
-  const searchBarHeader = document.querySelector('#search-standalone-header');
-  const searchPageInterface = document.querySelector('#search-v2');
-  const searchPageSearchbar = document.querySelector(
-    '#search-standalone-searchpage'
-  );
-  const sidebar = document.querySelector('#sidebar-layout');
-
-  if (!sidebar && !searchPageInterface) {
-    // Show when there is no sidebar or on the search page
-    searchBarHeader.style.display = 'block';
-  } else if (sidebar && sidebar.offsetWidth === 0) {
-    // Show when there is a sidebar but is hidden due to resizing
-    searchBarHeader.style.display = 'block';
-  } else if (searchPageInterface && searchPageSearchbar.offsetWidth === 0) {
-    // Show when on the search page but is "sidebar" searchbar is hidden
-    searchBarHeader.style.display = 'block';
-  } else {
-    // Go back to default state
-    searchBarHeader.style.display = 'none';
-  }
-});