Make filters work with the new columns screen

This commit is contained in:
Jorge Manrubia
2025-09-26 18:06:35 +02:00
parent e3e051d4c1
commit 6ec394434c
14 changed files with 46 additions and 22 deletions
@@ -5,7 +5,7 @@ import { post } from "@rails/request.js"
export default class extends Controller {
static classes = ["filtersSet"]
static targets = ["field", "form"]
static values = { refreshUrl: String }
static values = { refreshUrl: String, noFilteringUrl: String }
initialize() {
this.debouncedToggle = debounce(this.#toggle.bind(this), 50)
@@ -15,11 +15,27 @@ export default class extends Controller {
this.#toggle()
}
change() {
change(event) {
this.#toggle()
this.#refreshSaveToggleButton()
}
resetIfBlankAndNoFiltering(event) {
const { target } = event
if (!target.value.trim() && !this.#hasFiltersSet) {
this.#showNoFilteringUrl();
event.stopImmediatePropagation()
}
}
resetIfNoFiltering(event) {
console.debug("CALLED", this.#hasFiltersSet);
if (!this.#hasFiltersSet) {
this.#showNoFilteringUrl()
event.stopImmediatePropagation()
}
}
async fieldTargetConnected(field) {
this.debouncedToggle()
}
@@ -65,4 +81,8 @@ export default class extends Controller {
return formData
}
#showNoFilteringUrl() {
Turbo.visit(this.noFilteringUrlValue, { frame: "cards_container" })
}
}
+2 -2
View File
@@ -23,10 +23,10 @@
</div>
<% end %>
<%= render "filters/settings", user_filtering: @user_filtering %>
<%= render "filters/settings", user_filtering: @user_filtering, no_filtering_url: cards_path %>
<section class="cards">
<%= turbo_frame_tag :card_columns do %>
<%= turbo_frame_tag :cards_container do %>
<%= render partial: "cards/display/preview", collection: @page.records, as: :card, locals: { draggable: true }, cached: ->(card) { cacheable_preview_parts_for(card) } %>
<% end %>
</section>
+1 -1
View File
@@ -1,5 +1,5 @@
<% cache columns do %>
<%= turbo_frame_tag :card_columns do %>
<%= turbo_frame_tag :cards_container do %>
<div class="card-columns" data-controller="collapsible-columns" data-collapsible-columns-collapsed-class="is-collapsed">
<div class="card-columns__left">
<%= render "cards/index/engagement/on_deck", column: columns.on_deck %>
+1 -1
View File
@@ -21,7 +21,7 @@
</div>
<% end %>
<%= render "filters/settings", user_filtering: @user_filtering %>
<%= render "filters/settings", user_filtering: @user_filtering, no_filtering_url: collection_path(@collection) %>
<%= tag.div data: {
controller: "drag-and-drop",
+1 -1
View File
@@ -1,4 +1,4 @@
<%= turbo_frame_tag :card_columns do %>
<%= turbo_frame_tag :cards_container do %>
<div class="card-columns" data-controller="collapsible-columns" data-collapsible-columns-collapsed-class="is-collapsed">
<div class="card-columns__left">
+10 -4
View File
@@ -6,9 +6,15 @@
controller: "toggle-class filter-settings",
toggle_class_toggle_class: "filters--expanded",
filter_settings_filters_set_class: "filters--has-filters-set",
filter_settings_refresh_url_value: settings_refresh_path } do %>
<%= form_with url: cards_path, method: :get, class: "", data: { controller: "form", turbo_frame: "card_columns", filter_settings_target: "form", turbo_action: "advance" } do |form| %>
<%= hidden_field_tag :expand_all, true, disabled: !user_filtering.expanded?, data: { toggle_enable_target: "element" } %>
filter_settings_no_filtering_url_value: no_filtering_url,
filter_settings_refresh_url_value: settings_refresh_path } do %>~
<%= form_with url: cards_path, method: :get, class: "", data: {
controller: "form",
turbo_frame: "cards_container",
filter_settings_target: "form",
action: "turbo:submit-end->filter-settings#resetIfNoFiltering",
turbo_action: "advance" } do |form| %>
<%= hidden_field_tag :expand_all, true, disabled: !user_filtering.expanded?, data: { toggle_enable_target: "element"} %>
<% user_filtering.filter.collections.each do |collection| %>
<%= filter_hidden_field_tag "collection_ids[]", collection.id %>
<% end %>
@@ -20,7 +26,7 @@
<%= render "filters/settings/toggle", user_filtering: user_filtering %>
</div>
<% end %>
<%= render "filters/settings/manage", user_filtering: user_filtering %>
<%= render "filters/settings/manage", user_filtering: user_filtering, no_filtering_url: no_filtering_url %>
<% end %>
<% end %>
@@ -27,7 +27,7 @@
<%= tag.li class: "popup__item", data: {
filter_target: "item", navigable_list_target: "item", multi_selection_combobox_target: "item", multi_selection_combobox_value: "unassigned", multi_selection_combobox_label: "No one" },
role: "checkbox", aria: { checked: filter.assignment_status.unassigned? } do %>
<button type="button" class="btn popup__btn" data-action="dialog#close multi-selection-combobox#clear form#submit filter-settings#change">
<button type="button" class="btn popup__btn" data-action="dialog#close multi-selection-combobox#clear filter-settings#change form#submit">
<span class="overflow-ellipsis flex-item-grow">No one</span>
<%= icon_tag "check", class: "checked flex-item-justify-end", "aria-hidden": true %>
</button>
@@ -37,7 +37,7 @@
<%= tag.li class: "popup__item", data: {
filter_target: "item", navigable_list_target: "item", multi_selection_combobox_target: "item", multi_selection_combobox_value: user.id, multi_selection_combobox_label: user.familiar_name },
role: "checkbox", aria: { checked: filter.assignees.include?(user) } do %>
<button type="button" class="btn popup__btn" data-action="dialog#close multi-selection-combobox#change form#submit filter-settings#change">
<button type="button" class="btn popup__btn" data-action="dialog#close multi-selection-combobox#change filter-settings#change form#submit">
<span class="overflow-ellipsis flex-item-grow"><%= user.name %></span>
<%= icon_tag "check", class: "checked flex-item-justify-end", "aria-hidden": true %>
</button>
+1 -1
View File
@@ -29,7 +29,7 @@
<%= tag.li class: "popup__item", data: {
filter_target: "item", navigable_list_target: "item", multi_selection_combobox_target: "item", multi_selection_combobox_value: user.id, multi_selection_combobox_label: user.familiar_name },
role: "checkbox", aria: { checked: filter.closers.include?(user) } do %>
<button type="button" class="btn popup__btn" data-action="dialog#close multi-selection-combobox#change form#submit filter-settings#change">
<button type="button" class="btn popup__btn" data-action="dialog#close multi-selection-combobox#change filter-settings#change form#submit">
<span class="overflow-ellipsis flex-item-grow"><%= user.name %></span>
<%= icon_tag "check", class: "checked flex-item-justify-end", "aria-hidden": true %>
</button>
@@ -29,7 +29,7 @@
<%= tag.li class: "popup__item", data: {
filter_target: "item", navigable_list_target: "item", multi_selection_combobox_target: "item", multi_selection_combobox_value: user.id, multi_selection_combobox_label: user.familiar_name },
role: "checkbox", aria: { checked: filter.creators.include?(user) } do %>
<button type="button" class="btn popup__btn" data-action="dialog#close multi-selection-combobox#change form#submit filter-settings#change">
<button type="button" class="btn popup__btn" data-action="dialog#close multi-selection-combobox#change filter-settings#change form#submit">
<span class="overflow-ellipsis flex-item-grow"><%= user.name %></span>
<%= icon_tag "check", class: "checked flex-item-justify-end", "aria-hidden": true %>
</button>
@@ -4,7 +4,6 @@
data: { controller: "dialog combobox",
action: "keydown.esc->dialog#close click@document->dialog#closeOnClickOutside",
filter_show: user_filtering.show_indexed_by?,
turbo_action: "advance",
combobox_default_value_value: "all",
combobox_default_label_value: "Status",
combobox_with_default_class: "quick-filter--with-default" } do %>
@@ -23,7 +22,7 @@
<ul class="popup__list" data-filter-target="list" role="listbox">
<% Filter::INDEXES.each do |index| %>
<%= tag.li class: "popup__item", data: { navigable_list_target: "item", combobox_target: "item", combobox_value: index, combobox_label: index.humanize }, role: "checkbox", aria: { checked: filter.indexed_by == index } do %>
<button type="button" class="btn popup__btn" data-action="dialog#close combobox#change form#submit filter-settings#change">
<button type="button" class="btn popup__btn" data-action="dialog#close combobox#change filter-settings#change form#submit">
<span class="overflow-ellipsis flex-item-grow"><%= index == "all" ? "Status" : index.humanize %></span>
<%= icon_tag "check", class: "checked flex-item-justify-end", "aria-hidden": true %>
</button>
+1 -1
View File
@@ -3,7 +3,7 @@
<div class="filters__manage">
<%= render "filters/filter_toggle", filter: filter %>
<%= link_to cards_path(filter.as_params.except(:assignee_ids, :assignment_status, :card_ids, :creator_ids, :closer_ids, :stage_ids, :tag_ids, :terms, :indexed_by, :sorted_by, :creation, :closure)), class: "btn btn--remove txt-x-small" do %>
<%= link_to no_filtering_url, class: "btn btn--remove txt-x-small" do %>
<%= icon_tag "close" %>
<span class="for-screen-reader">Clear all</span>
<% end %>
@@ -5,7 +5,6 @@
controller: "dialog combobox",
action: "keydown.esc->dialog#close click@document->dialog#closeOnClickOutside",
filter_show: user_filtering.show_sorted_by?,
turbo_action: "advance",
combobox_default_value_value: "latest",
combobox_with_default_class: "quick-filter--with-default" } do %>
<button type="button" class="btn input input--select flex-inline txt-x-small" data-action="click->dialog#toggle:stop">
@@ -25,7 +24,7 @@
<%= tag.li class: "popup__item", data: {
navigable_list_target: "item", combobox_target: "item", combobox_value: sort, combobox_label: sorted_by_label(sort) },
role: "checkbox", aria: { checked: filter.sorted_by == sort } do %>
<button type="button" class="btn popup__btn" data-action="dialog#close combobox#change form#submit filter-settings#change">
<button type="button" class="btn popup__btn" data-action="dialog#close combobox#change filter-settings#change form#submit">
<span class="overflow-ellipsis flex-item-grow"><%= sorted_by_label(sort) %></span>
<%= icon_tag "check", class: "checked flex-item-justify-end", "aria-hidden": true %>
</button>
+1 -1
View File
@@ -28,7 +28,7 @@
<%= content_tag(:li, class: "popup__item", data: {
filter_target: "item", navigable_list_target: "item", multi_selection_combobox_target: "item", multi_selection_combobox_value: tag.id, multi_selection_combobox_label: tag.hashtag },
role: "checkbox", aria: { checked: filter.tags.include?(tag) }) do %>
<button type="button" class="btn popup__btn" data-action="dialog#close multi-selection-combobox#change form#submit filter-settings#change">
<button type="button" class="btn popup__btn" data-action="dialog#close multi-selection-combobox#change filter-settings#change form#submit">
<span class="overflow-ellipsis flex-item-grow"><%= tag.hashtag %></span>
<%= icon_tag "check", class: "checked flex-item-justify-end", "aria-hidden": true %>
</button>
+1 -1
View File
@@ -2,7 +2,7 @@
autofocus: false, autocomplete: :off, autocorrect: "off", data: {
"1p-ignore": "true",
filter_settings_target: "field",
action: "input->form#debouncedSubmit keydown.enter->form#submitToTopTarget" } %>
action: "input->filter-settings#resetIfBlankAndNoFiltering input->form#debouncedSubmit keydown.enter->form#submitToTopTarget" } %>
<% if filter.terms.present? %>
<% filter.terms.each do |term| %>