From 6352e7d21f5edaefb451c571804f8fa88ea5bc07 Mon Sep 17 00:00:00 2001 From: Reda El Issati Date: Wed, 27 Aug 2025 12:46:30 +0200 Subject: [PATCH] fix: prevent auto-expanding of grouded listing collapses --- .../components/grouped-item-listings.js | 36 +++++++++---------- go.mod | 2 +- go.sum | 4 +-- layouts/actioncatalog/list.html | 2 +- layouts/partials/grouped-item-listings.html | 2 +- 5 files changed, 21 insertions(+), 25 deletions(-) diff --git a/assets/scripts/components/grouped-item-listings.js b/assets/scripts/components/grouped-item-listings.js index 2bbdce93f5c68..4849942bd4184 100644 --- a/assets/scripts/components/grouped-item-listings.js +++ b/assets/scripts/components/grouped-item-listings.js @@ -11,10 +11,10 @@ export function initializeGroupedListings() { const searchKeywords = url.searchParams.get('search'); const form = document.getElementById('rules'); let keyupTimeout; - let filters; + let filterButtons; if (controls) { - filters = controls.querySelectorAll('[data-ref="filter"]'); + filterButtons = controls.querySelectorAll('[data-ref="filter"]'); } // Returns array of results filtered by category and/or user search value @@ -35,17 +35,12 @@ export function initializeGroupedListings() { return results; } - const activateButton = (activeButton, siblings) => { - if (activeButton && siblings) { - for (let i = 0; i < siblings.length; i++) { - const button = siblings[i]; - button.classList[button.dataset.filter === activeButton.dataset.filter ? 'add' : 'remove']('active'); - } - } - - // enable all - allGroupHeaders.forEach(elm => { - elm.classList.add('active'); + const setActiveCategoryFilterButton = (newCategoryFilter) => { + if (!filterButtons?.length) return; + + filterButtons.forEach(button => { + const isActive = button.dataset.filter === newCategoryFilter; + button.classList.toggle('active', isActive); }); } @@ -103,11 +98,13 @@ export function initializeGroupedListings() { return; const searchValue = inputSearch.value.length >= 2 ? inputSearch.value.toLowerCase().trim() : ''; - url.searchParams.set('category', event.target.dataset.filter) + const selectedCategory = event.target.dataset.filter; + + url.searchParams.set('category', selectedCategory) window.history.pushState(null,'', url.toString()) - const filtered = filterResults(event.target.dataset.filter, searchValue); - activateButton(event.target, filters); + const filtered = filterResults(selectedCategory, searchValue); + setActiveCategoryFilterButton(selectedCategory); showResults(filtered); } @@ -154,10 +151,9 @@ export function initializeGroupedListings() { inputSearch.value = searchKeywords; } - const activeCategoryFilter = url.searchParams.get('category') || 'all'; - const activeFilterButton = document.querySelector(`[data-filter="${activeCategoryFilter}"]`); - const filtered = filterResults(activeCategoryFilter, searchKeywords); - activateButton(activeFilterButton, filters); + const categoryFromUrl = url.searchParams.get('category') || 'all'; + const filtered = filterResults(categoryFromUrl, searchKeywords); + setActiveCategoryFilterButton(categoryFromUrl); showResults(filtered); diff --git a/go.mod b/go.mod index 14ee396d6e844..422f8cb38e4d7 100644 --- a/go.mod +++ b/go.mod @@ -4,7 +4,7 @@ go 1.24.4 require ( github.com/DataDog/websites-modules v1.4.253 // indirect - github.com/DataDog/websites-sources v0.0.0-20250821174838-1950c6e17096 // indirect + github.com/DataDog/websites-sources v0.0.0-20250826202848-b1166170e449 // indirect ) // replace github.com/DataDog/websites-modules => /Users/lisiane.turlure/guac/websites-modules diff --git a/go.sum b/go.sum index fe759e02ceada..02aa03aef2698 100644 --- a/go.sum +++ b/go.sum @@ -1,4 +1,4 @@ github.com/DataDog/websites-modules v1.4.253 h1:Sd+5ILFUVOyagh3oUMyc0onM7bykJy0asO9ObLgx4ms= github.com/DataDog/websites-modules v1.4.253/go.mod h1:CcQxAmCXoiFr3hNw6Q+1si65C3uOP1gB+7aX4S3h+CQ= -github.com/DataDog/websites-sources v0.0.0-20250821174838-1950c6e17096 h1:2hC1uZObqOzw6N3kflWxYvysBov71qGB4bj4IhFkDBM= -github.com/DataDog/websites-sources v0.0.0-20250821174838-1950c6e17096/go.mod h1:DlDYkYoR/nhKYRur0+2jmGGc7ydk8Q0ybWkS6oaLVuo= +github.com/DataDog/websites-sources v0.0.0-20250826202848-b1166170e449 h1:7/gA9fYaZJT+GE7HnI7u7gKn+arQPKVy5EdGqAFVazs= +github.com/DataDog/websites-sources v0.0.0-20250826202848-b1166170e449/go.mod h1:DlDYkYoR/nhKYRur0+2jmGGc7ydk8Q0ybWkS6oaLVuo= diff --git a/layouts/actioncatalog/list.html b/layouts/actioncatalog/list.html index fa6c4ebc9d920..8fc9fdcca3b22 100644 --- a/layouts/actioncatalog/list.html +++ b/layouts/actioncatalog/list.html @@ -93,7 +93,7 @@

{{ .Title }}

{{ $logo_path := partialCached "integrations-logo.html" (dict "context" $dot "basename" $icon_id "variant" "avatar" "fallback" "cloud") $icon_id "avatar" }} {{ $default_dd_logo_path := partialCached "integrations-logo.html" (dict "context" $dot "basename" "_datadog" "variant" "avatar" "fallback" "cloud") "_datadog" "avatar" }}
-
+
{{ partial "get-action-catalog-icon" (dict "page_ctx" $dot "icon_name" $icon_name "icon_type" $icon_type "logo_path" $logo_path "workflow_title" $workflow_title "dd_logo_path" $default_dd_logo_path) }}
diff --git a/layouts/partials/grouped-item-listings.html b/layouts/partials/grouped-item-listings.html index f48146bb1d734..4d86a31459274 100644 --- a/layouts/partials/grouped-item-listings.html +++ b/layouts/partials/grouped-item-listings.html @@ -21,7 +21,7 @@
{{ range $i, $v := $listGroups }}
-
+
{{ range last 1 $v.Pages }} {{ $basename := .Params.integration_id | default .Params.icon.integration_id | default .Params.source }}