Skip to content

Replace the global 'Show done' kanban toggle with per-column collapse#157

Merged
ramonski merged 2 commits into
masterfrom
feat-kanban-per-user-collapsed-columns
Jun 9, 2026
Merged

Replace the global 'Show done' kanban toggle with per-column collapse#157
ramonski merged 2 commits into
masterfrom
feat-kanban-per-user-collapsed-columns

Conversation

@ramonski

@ramonski ramonski commented Jun 9, 2026

Copy link
Copy Markdown
Member

First of the three PRs scoped in the kanban-scheduling discussion. Pure UI / per-profile state, no schema change.

Before

A single "Show done" toggle in the board toolbar globally hid every state with done=true. No way to hide WAIT without losing DONE too, no way to let one profile prefer different visibility than another.

After

Each column header has its own collapse chevron. Collapsed columns shrink to a 40 px strip showing the rotated label, count chip, and an expand chevron. The choice persists per profile under the localStorage key board_collapsed_columns (JSON array of state names) using the existing profileGet/profileSet helpers — switching profiles gives each its own layout, reloads keep it.

The global toolbar toggle, its showDone translation key (en/de/es/ru), and the showDone arg threaded through useTasks are removed. useTasks now always fetches every state — per-column collapse is purely render-time hiding, so re-expanding is instant with no extra round-trip.

Notable design choices

  • Compact strip, not full hide. A collapsed column stays visible as a 40 px strip with the rotated label so the user can find it without scrolling through a menu.
  • No drop on collapsed columns. The compact strip omits the drop zone, so cards can't vanish into an invisible target. Drag-to-reorder of the column itself still works — the rotated label doubles as the drag handle.
  • No backend changes. The state is local UI preference, not synced to the cloud, matches the existing profileGet/Set pattern.

Test plan

  • Collapse a column, reload the page — still collapsed.
  • Switch profile, the new profile starts with everything expanded.
  • Switch back — the original profile remembers its collapsed columns.
  • Drag a column header (collapsed or expanded) — column reorder still works.
  • Try to drop a card on a collapsed column — drop should fail gracefully (no zone).
  • Expand the column — cards reappear instantly with no spinner.

Up next

PR 2: add scheduled + deadline date columns to the task model across all four backends. PR 3: card icons + auto-surface cron job.

ramonski added 2 commits June 9, 2026 20:45
… so each user picks which columns to hide and the choice persists per profile

The old board had a single 'Show done' toggle in the
toolbar that hid every state marked done=true. That was a
global on/off and could not distinguish DONE from
CANCELLED, nor let a user hide e.g. WAIT without losing
DONE too.

Each column now has its own chevron in the header. A
collapsed column shrinks to a 40px strip showing the
rotated label, count chip, and an expand chevron;
re-expanding restores the full column. State is stored
per-profile under the localStorage key
board_collapsed_columns (JSON array of state names), so
switching profiles gives each its own layout and the
choice survives reloads.

The 'show done' toolbar toggle, its translation key, and
the showDone arg threaded into useTasks are removed.
useTasks now always fetches all states; per-column
collapse is purely a render-time hide, so re-expanding a
column is instant with no extra network round-trip.

Drag and drop into a collapsed column is intentionally
blocked: the compact strip has no drop zone, so a card
cannot vanish into an invisible target. Drag-to-reorder
of the column itself still works -- the rotated label is
the drag handle.
…by mirroring the open column's header/body split

The first iteration wrapped the whole collapsed column in a
single dashed-border box with py-2 padding, which pushed the
expand chevron ~8px below the collapse chevrons on the open
columns next to it. The eye picks that misalignment up
immediately when collapsed and open columns sit side by side.

Split the collapsed column into the same two-section layout
the open column uses: a top header row (flex items-center
mb-3 px-1) holding the expand chevron, and a bordered body
below (rounded-lg border border-dashed border-border-subtle
bg-surface-card/30) holding the dot, count chip, and rotated
label. The header row geometry matches the open column's
exactly, so the chevron lines up regardless of how many of
each kind sit beside each other. The body inherits the
open column's drop-zone styling, which also makes the
visual transition between expanded and collapsed states
look like one shape changing rather than two unrelated
boxes.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant