fix(filters): builder UX round one — incomplete rules, group removal, field menu (user report)

- Root bug: incomplete rules (the ready rule, every new group's first
  rule) were sent to the server — the live-count fetch toasted a 400
  and every suggestion fetch failed silently (why author typing showed
  no dropdown). Fix: completedTree() prunes incomplete rules and empty
  groups; the count fetch skips when nothing is complete, suggestion
  fetches send only the other COMPLETED rules, and serialization wires
  only completed rules (an unfinished rule was never a filter).
- Group remove button was x-show'd away on depth-0 groups — exactly
  where user groups live. Always visible now.
- Field menu: filter input at the top (Enter prevented), no-match
  state; group headers restyled as flush-left tinted sticky bands with
  options tabbed in beneath (user's layout pick).
- toast.ts: filter-count fetches join the suggestion-fetch exemption
  (a failed background hint never interrupts).
This commit is contained in:
John O'Keefe committed 2026-10-20 15:04:19 -04:00
1 parent 4ee24e7152
commit 04b36f0563
6 files changed
+134 -23

No files matched your search

+35 -4
View File
@@ -1965,11 +1965,41 @@
}
.fb-menu-group {
font-size: 0.65rem;
font-weight: 700;
font-weight: 800;
text-transform: uppercase;
letter-spacing: 0.05em;
letter-spacing: 0.09em;
color: var(--text-secondary);
padding: 0.5rem 0.75rem 0.15rem;
padding: 0.4rem 0.75rem 0.3rem;
margin-top: 0.3rem;
background-color: color-mix(in srgb, var(--text-primary) 5%, transparent);
border-top: 1px solid var(--border);
border-bottom: 1px solid var(--border);
position: sticky;
top: 0;
z-index: 1;
}
.fb-menu-filter-wrap {
padding: 0.4rem 0.5rem;
border-bottom: 1px solid var(--border);
background-color: var(--bg-primary);
}
.fb-menu-filter {
width: 100%;
font-size: 0.8rem;
padding: 0.3rem 0.5rem;
border-radius: 0.4rem;
border: 1px solid var(--border);
background-color: var(--bg-primary);
color: var(--text-primary);
outline: none;
}
.fb-menu-filter:focus {
border-color: color-mix(in srgb, var(--accent) 45%, var(--border));
}
.fb-menu-empty {
font-size: 0.78rem;
color: var(--text-secondary);
padding: 0.6rem 0.75rem;
}
.fb-menu-item {
display: flex;
@@ -1979,7 +2009,8 @@
gap: 0.5rem;
text-align: left;
font-size: 0.8rem;
padding: 0.35rem 0.75rem;
/* tabbed in under the flush-left group headers */
padding: 0.35rem 0.75rem 0.35rem 1.7rem;
color: var(--text-primary);
cursor: pointer;
}