Merge pull request #2249 from redis/DOC-5826

Enable keyword search in integration summaries

Author: mich-elle-luna

layouts/integrate/list.html

@@ -46,9 +46,10 @@ <h1>{{ .Title }}</h1>
         {{ $labelColors := (dict "library" "bg-redis-yellow-500" "framework" "bg-violet-300" "observability" "bg-blue-300" "provisioning" "bg-redis-red-500" "mig" "bg-pink-300" "di" "bg-teal-300" "cloud-service" "bg-rose-300") }}
         {{ $labelText := (dict "mig" "data migration" "di" "data integration" "cloud-service" "cloud service") }}
         {{ range .CurrentSection.Sections }}
-          <article 
-            class="flex flex-col gap-2 relative transition h-full text-redis-ink-900 hover:text-red-900 focus-within:text-red-900 bg-white hover:bg-red-50/50 focus-within:bg-red-50/50 border border-redis-pen-800 focus-within:ring-red-200 focus-within:ring-[3px] focus-within:outline-none bg-clip-padding rounded-md group" 
-            data-name="{{ .Title }}" 
+          <article
+            class="flex flex-col gap-2 relative transition h-full text-redis-ink-900 hover:text-red-900 focus-within:text-red-900 bg-white hover:bg-red-50/50 focus-within:bg-red-50/50 border border-redis-pen-800 focus-within:ring-red-200 focus-within:ring-[3px] focus-within:outline-none bg-clip-padding rounded-md group"
+            data-name="{{ .Title }}"
+            data-summary="{{ .Params.summary }}"
             data-group="{{ .Params.group }}"
             data-version
             data-top

static/js/integrations-filters.js

@@ -23,16 +23,17 @@ function filterGridItems() {
     // Loop through each grid item
     gridItems.forEach(item => {
         const itemName = item.dataset.name.toLowerCase(); // Get the value of data-name attribute
+        const itemSummary = (item.dataset.summary || '').toLowerCase(); // Get the value of data-summary attribute
         const itemGroup = item.dataset.group; // Get the value of data-group attribute
         const firstLetter = itemName.charAt(0); // Get the first letter of the item name
-      
+
         // Check if the item matches the selected group (or if no group is selected), the name query, and the command query
         const matchesGroup = selectedGroup === '' || selectedGroup === itemGroup;
-        const matchesName = itemName.includes(nameQuery);
+        const matchesName = itemName.includes(nameQuery) || itemSummary.includes(nameQuery);
         const matchesAlpha = !selectedAlpha || firstLetter === selectedAlpha;
 
         console.log(selectedGroup)
-      
+
         // Show the item if it matches the selected group (or no group selected), the name query, and the command query, otherwise hide it
         item.style.display = matchesGroup && matchesName && matchesAlpha ? 'flex' : 'none';
     });