diff --git a/app/assets/stylesheets/filters.css b/app/assets/stylesheets/filters.css index 85721621e..a2141bbc6 100644 --- a/app/assets/stylesheets/filters.css +++ b/app/assets/stylesheets/filters.css @@ -138,5 +138,13 @@ display: block; } } + + .filters__manage { + display: none; + } + + .filters--has-filters-set .filters__manage { + display: inline-flex; + } } diff --git a/app/javascript/controllers/combobox_controller.js b/app/javascript/controllers/combobox_controller.js index 054f44c2f..7b6ab78ff 100644 --- a/app/javascript/controllers/combobox_controller.js +++ b/app/javascript/controllers/combobox_controller.js @@ -2,7 +2,10 @@ import { Controller } from "@hotwired/stimulus" export default class extends Controller { static targets = [ "label", "item", "hiddenField" ] - static values = { selectPropertyName: { type: String, default: "aria-checked" } } + static values = { + selectPropertyName: { type: String, default: "aria-checked" }, + defaultValue: String + } connect() { this.labelTarget.textContent = this.#selectedLabel diff --git a/app/javascript/controllers/filter_settings_controller.js b/app/javascript/controllers/filter_settings_controller.js new file mode 100644 index 000000000..ad7a709c0 --- /dev/null +++ b/app/javascript/controllers/filter_settings_controller.js @@ -0,0 +1,36 @@ +import { Controller } from "@hotwired/stimulus" + +export default class extends Controller { + static classes = ["filtersSet"] + static targets = ["field"] + + connect() { + this.change() + } + + change() { + this.#toggleFiltersSetClass() + } + + #toggleFiltersSetClass(shouldAdd) { + this.element.classList.toggle(this.filtersSetClass, this.#hasFiltersSet) + } + + get #hasFiltersSet() { + return this.fieldTargets.some(field => this.#isFieldSet(field)) + } + + #isFieldSet(field) { + const value = field.value?.trim() + + if (!value) return false + + const defaultValue = this.#defaultValueForField(field) + return defaultValue ? value !== defaultValue : true + } + + #defaultValueForField(field) { + const comboboxContainer = field.closest("[data-combobox-default-value]") + return comboboxContainer?.dataset?.comboboxDefaultValue + } +} diff --git a/app/models/user/filtering.rb b/app/models/user/filtering.rb index d0fddc962..9aecb8a24 100644 --- a/app/models/user/filtering.rb +++ b/app/models/user/filtering.rb @@ -3,7 +3,7 @@ class User::Filtering attr_reader :user, :filter, :expanded - delegate :as_params, :any?, :single_collection, to: :filter + delegate :as_params, :single_collection, to: :filter delegate :only_closed?, to: :filter def initialize(user, filter, expanded: false) diff --git a/app/views/filters/_settings.html.erb b/app/views/filters/_settings.html.erb index 6b2278817..66e856160 100644 --- a/app/views/filters/_settings.html.erb +++ b/app/views/filters/_settings.html.erb @@ -1,7 +1,7 @@ <% cache user_filtering do %> <%= tag.aside id: "filter-settings", class: class_names("filters flex align-center gap-half justify-center center margin-block-end", { "filters--expanded": user_filtering.expanded? }), - data: { controller: "toggle-class", toggle_class_toggle_class: "filters--expanded" } do %> + data: { controller: "toggle-class filter-settings", toggle_class_toggle_class: "filters--expanded", filter_settings_filters_set_class: "filters--has-filters-set" } do %>