Add back support for filtering for all enteprise connectors in query …

…strings (#75) * Add back support for filtering for all enteprise connectors in query strings * modify yaml to display cloud * Update macros/rp-connect-components.js * Update rp-connect-components.js * Ignore support params for the cloud catalog --------- Co-authored-by: Paulo Borges <[email protected]>
redpanda-data · Sep 11, 2024 · 1759a70 · 1759a70
1 parent 92e09f6
commit 1759a70
Show file tree

Hide file tree

Showing 4 changed files with 41 additions and 43 deletions.
diff --git a/local-antora-playbook.yml b/local-antora-playbook.yml
@@ -17,7 +17,7 @@ content:
   - url: https://github.com/redpanda-data/rp-connect-docs
     branches: main
   - url: https://github.com/redpanda-data/cloud-docs
-    branches: feature-2540_RPCN_Cloud_docs
+    branches: main
 ui:
   bundle:
     url: https://github.com/redpanda-data/docs-ui/releases/latest/download/ui-bundle.zip

diff --git a/macros/rp-connect-components.js b/macros/rp-connect-components.js
@@ -2,51 +2,46 @@
 
 module.exports.register = function (registry, context) {
   function filterComponentTable() {
-    // Retrieve and standardize filter inputs
     const nameInput = document.getElementById('componentTableSearch').value.trim().toLowerCase();
     const typeFilter = Array.from(document.querySelector('#typeFilter').selectedOptions).map(option => option.value);
 
-    // Check if the supportFilter element exists
+    // Check for the existence of support and enterprise license filters (optional)
     const supportFilterElement = document.querySelector('#supportFilter');
     const supportFilter = supportFilterElement
       ? Array.from(supportFilterElement.selectedOptions).map(option => option.value)
       : [];
 
+    // Get the 'support=enterprise' query parameter from the URL
+    const params = getQueryParams();
+    const enterpriseSupportFilter = params.support === 'enterprise';  // Check if 'support=enterprise' is in the URL
+
     const table = document.getElementById('componentTable');
     const trs = table.getElementsByTagName('tr');
 
     for (let i = 1; i < trs.length; i++) {
       const row = trs[i];
       const nameTd = row.querySelector('td[id^="componentName-"]');
       const typeTd = row.querySelector('td[id^="componentType-"]');
-      const supportTd = row.querySelector('td[id^="componentSupport-"]');
-      const typeDropdown = typeTd ? typeTd.querySelector('.type-dropdown') : null;
+      const supportTd = row.querySelector('td[id^="componentSupport-"]'); // Support column, if present
+      const enterpriseSupportTd = row.querySelector('td[id^="componentLicense-"]'); // Enterprise License column, if present
 
-      if (nameTd && typeTd) {
-        const nameText = nameTd.textContent.trim().toLowerCase();
+      if (typeTd) {  // Ensure that at least the Type column is present
+        const nameText = nameTd ? nameTd.textContent.trim().toLowerCase() : '';
         const typeText = typeTd.textContent.trim().toLowerCase().split(', ').map(item => item.trim());
         const supportText = supportTd ? supportTd.textContent.trim().toLowerCase() : '';
+        const enterpriseSupportText = enterpriseSupportTd ? enterpriseSupportTd.textContent.trim().toLowerCase() : '';  // Yes or No
 
         // Determine if the row should be shown
         const showRow =
-          ((!nameInput || nameText.includes(nameInput)) &&
-            (typeFilter.length === 0 || typeFilter.some(value => typeText.includes(value))) &&
-            (!supportTd || supportFilter.length === 0 || supportFilter.some(value => supportText.includes(value)))
+          ((!nameInput || nameText.includes(nameInput)) &&  // Filter by name if present
+           (typeFilter.length === 0 || typeFilter.some(value => typeText.includes(value))) &&  // Filter by type
+           (!supportTd || supportFilter.length === 0 || supportFilter.some(value => supportText.includes(value))) &&  // Filter by support if present
+           (!enterpriseSupportFilter || !enterpriseSupportTd || supportText.includes('enterprise') || enterpriseSupportText === 'yes') // Filter by enterprise support if 'support=enterprise' is in the URL
           );
 
         row.style.display = showRow ? '' : 'none';
-
-        if (showRow && typeFilter.length > 0 && typeDropdown) {
-          const matchingOption = Array.from(typeDropdown.options).find(option =>
-            typeFilter.includes(option.text.toLowerCase())
-          );
-          if (matchingOption) {
-            typeDropdown.value = matchingOption.value;
-            updateComponentUrl(typeDropdown, false);
-          }
-        }
       } else {
-        row.style.display = 'none'; // Hide row if essential cells are missing
+        row.style.display = 'none'; // Hide row if the Type column is missing
       }
     }
   }
@@ -289,8 +284,9 @@ function generateConnectorsHTMLTable(connectors, isCloud) {
           const params = {};
           const searchParams = new URLSearchParams(window.location.search);
           searchParams.forEach((value, key) => {
-            params[key] = value;
+            params[key] = value.toLowerCase();
           });
+
           return params;
         }
 
@@ -304,24 +300,26 @@ function generateConnectorsHTMLTable(connectors, isCloud) {
 
         // Initialize Choices.js for type dropdowns
         document.addEventListener('DOMContentLoaded', function() {
-        const params = getQueryParams();
-        if (params.search) {
-          document.getElementById('componentTableSearch').value = params.search;
-        }
-        if (params.type) {
-          document.getElementById('typeFilter').value = params.type;
-        }
-          if (params.support) {
-            document.getElementById('supportFilter').value = params.support;
+          const params = getQueryParams();
+          const search = document.getElementById('componentTableSearch');
+          const typeFilter = document.getElementById('typeFilter');
+          const supportFilter = document.getElementById('supportFilter');
+          if (params.search && search) {
+            search.value = params.search;
+          }
+          if (params.type && typeFilter) {
+            typeFilter.value = params.type;
           }
-        
-        filterComponentTable();
-        const typeDropdowns = document.querySelectorAll('.type-dropdown');
-        typeDropdowns.forEach(dropdown => {
-          new Choices(dropdown, { 
-            searchEnabled: false, 
-            allowHTML: true,
-            removeItemButton: true });
+          if (params.support && supportFilter) {
+            supportFilter.value = params.support;
+          }
+          filterComponentTable();
+          const typeDropdowns = document.querySelectorAll('.type-dropdown');
+          typeDropdowns.forEach(dropdown => {
+            new Choices(dropdown, {
+              searchEnabled: false,
+              allowHTML: true,
+              removeItemButton: true });
           });
         });
         </script>`;
@@ -410,4 +408,4 @@ function generateConnectorsHTMLTable(connectors, isCloud) {
       return self.createBlock(parent, 'pass', typeDropdown + enterpriseAdmonition);
     });
   });
-};
+};
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@redpanda-data/docs-extensions-and-macros",
-  "version": "3.6.4",
+  "version": "3.6.5",
   "description": "Antora extensions and macros developed for Redpanda documentation.",
   "keywords": [
     "antora",