From c9aa6b90b705824f0c62c80abe413b26a9b1ccfe Mon Sep 17 00:00:00 2001
From: Andy Smith <andy@37signals.com>
Date: Tue, 28 Oct 2025 16:44:48 -0500
Subject: [PATCH 1/2] Hide filters when empty

---
 app/assets/stylesheets/filters.css        | 15 +++++++
 app/views/filters/_settings.html.erb      |  2 +-
 app/views/filters/settings/_tags.html.erb | 53 +++++++++++------------
 3 files changed, 42 insertions(+), 28 deletions(-)

diff --git a/app/assets/stylesheets/filters.css b/app/assets/stylesheets/filters.css
index b72f91cfd..8aea3362e 100644
--- a/app/assets/stylesheets/filters.css
+++ b/app/assets/stylesheets/filters.css
@@ -19,6 +19,14 @@
     }
   }
 
+  .filters__list {
+    align-items: center;
+    display: flex;
+    flex-wrap: wrap;
+    gap: var(--inline-space-half);
+    justify-content: center;
+  }
+
   .filter {
     &[aria-selected] {
       display: flex;
@@ -133,12 +141,19 @@
   }
 
   .quick-filter {
+    position: relative;
+
     &:has([aria-checked="true"]):not(.quick-filter--with-default) {
       .input--select {
         --input-background: var(--color-selected);
       }
     }
 
+    /* Hide a quick filter if there's nothing in it to filter by */
+    &:not(:has(.popup__list li)) {
+      display: none !important;
+    }
+
     @media (max-width: 80ch) {
       display: none;
     }
diff --git a/app/views/filters/_settings.html.erb b/app/views/filters/_settings.html.erb
index e17e0847d..560856a66 100644
--- a/app/views/filters/_settings.html.erb
+++ b/app/views/filters/_settings.html.erb
@@ -18,7 +18,7 @@
 
     <%= yield form if block_given? %>
 
-    <div class="flex-inline center align-center gap-half" data-controller="toggle-enable">
+    <div class="filters__list" data-controller="toggle-enable">
       <%= render "filters/settings/terms", filter: user_filtering.filter, form: form do %>
         <%= yield form if block_given? %>
       <% end %>
diff --git a/app/views/filters/settings/_tags.html.erb b/app/views/filters/settings/_tags.html.erb
index 9ce332673..6d355327f 100644
--- a/app/views/filters/settings/_tags.html.erb
+++ b/app/views/filters/settings/_tags.html.erb
@@ -1,39 +1,38 @@
 <% filter = user_filtering.filter %>
 
-<%= tag.div class: "quick-filter position-relative",
+<%= tag.div class: "quick-filter",
       data: {
         controller: "dialog multi-selection-combobox",
         action: "keydown.esc->dialog#close click@document->dialog#closeOnClickOutside",
         filter_show: user_filtering.show_tags?,
         multi_selection_combobox_no_selection_label_value: "Tagged…" } do %>
-    <button type="button" class="btn input input--select flex-inline txt-x-small" data-action="click->dialog#toggle:stop">
-      <span class="overflow-ellipsis" data-multi-selection-combobox-target="label">
-      </span>
-    </button>
+  <button type="button" class="btn input input--select flex-inline txt-x-small" data-action="click->dialog#toggle:stop">
+    <span class="overflow-ellipsis" data-multi-selection-combobox-target="label"></span>
+  </button>
 
-    <template data-multi-selection-combobox-target="hiddenFieldTemplate">
-      <%= hidden_field_tag "tag_ids[]", nil, data: { filter_settings_target: "field" } %>
-    </template>
+  <template data-multi-selection-combobox-target="hiddenFieldTemplate">
+    <%= hidden_field_tag "tag_ids[]", nil, data: { filter_settings_target: "field" } %>
+  </template>
 
-    <%= filter_dialog "Tagged…" do %>
-      <strong class="popup__title">Tagged…</strong>
+  <%= filter_dialog "Tagged…" do %>
+    <strong class="popup__title">Tagged…</strong>
 
-      <% if user_filtering.tags.many? %>
-        <%= text_field_tag nil, nil, id: nil, placeholder: "Filter…", class: "input input--transparent txt-small", autofocus: true,
-              type: "search", autocorrect: "off", autocomplete: "off", data: { "1p-ignore": "true", filter_target: "input", action: "input->filter#filter" } %>
-      <% end %>
-
-      <ul class="popup__list" data-filter-target="list" role="listbox">
-        <% user_filtering.tags.each do |tag| %>
-          <%= 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 filter-settings#change form#submit">
-              <span class="overflow-ellipsis flex-item-grow"><%= tag.hashtag %></span>
-              <%= icon_tag "check", class: "checked flex-item-justify-end" %>
-            </button>
-          <% end %>
-        <% end %>
-      </ul>
+    <% if user_filtering.tags.many? %>
+      <%= text_field_tag nil, nil, id: nil, placeholder: "Filter…", class: "input input--transparent txt-small", autofocus: true,
+            type: "search", autocorrect: "off", autocomplete: "off", data: { "1p-ignore": "true", filter_target: "input", action: "input->filter#filter" } %>
     <% end %>
+
+    <ul class="popup__list" data-filter-target="list" role="listbox">
+      <% user_filtering.tags.each do |tag| %>
+        <%= 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 filter-settings#change form#submit">
+            <span class="overflow-ellipsis flex-item-grow"><%= tag.hashtag %></span>
+            <%= icon_tag "check", class: "checked flex-item-justify-end" %>
+          </button>
+        <% end %>
+      <% end %>
+    </ul>
+  <% end %>
 <% end %>

From 7ce10b3dcf5ef5d8957bf6640d64a6566a4211fa Mon Sep 17 00:00:00 2001
From: Andy Smith <andy@37signals.com>
Date: Tue, 28 Oct 2025 16:46:03 -0500
Subject: [PATCH 2/2] Better selector

---
 app/assets/stylesheets/filters.css | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/assets/stylesheets/filters.css b/app/assets/stylesheets/filters.css
index 8aea3362e..a5236e378 100644
--- a/app/assets/stylesheets/filters.css
+++ b/app/assets/stylesheets/filters.css
@@ -150,7 +150,7 @@
     }
 
     /* Hide a quick filter if there's nothing in it to filter by */
-    &:not(:has(.popup__list li)) {
+    &:not(:has(.popup__item)) {
       display: none !important;
     }