Merge pull request #2654 from plind-dm/fix/kanban-collapse-empty-columns

fix(ui): collapse empty kanban columns to save horizontal space
This commit is contained in:
Dotta 2026-04-06 08:54:30 -05:00 committed by GitHub
commit ed97432fae
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -63,16 +63,22 @@ function KanbanColumn({
}) {
const { setNodeRef, isOver } = useDroppable({ id: status });
const isEmpty = issues.length === 0;
return (
<div className="flex flex-col min-w-[260px] w-[260px] shrink-0">
<div className="flex items-center gap-2 px-2 py-2 mb-1">
<div className={`flex flex-col shrink-0 transition-[width,min-width] ${isEmpty && !isOver ? "min-w-[48px] w-[48px]" : "min-w-[260px] w-[260px]"}`}>
<div className={`flex items-center gap-2 px-2 py-2 mb-1 ${isEmpty && !isOver ? "justify-center" : ""}`}>
<StatusIcon status={status} />
<span className="text-xs font-semibold uppercase tracking-wide text-muted-foreground">
{statusLabel(status)}
</span>
<span className="text-xs text-muted-foreground/60 ml-auto tabular-nums">
{issues.length}
</span>
{(!isEmpty || isOver) && (
<>
<span className="text-xs font-semibold uppercase tracking-wide text-muted-foreground">
{statusLabel(status)}
</span>
<span className="text-xs text-muted-foreground/60 ml-auto tabular-nums">
{issues.length}
</span>
</>
)}
</div>
<div
ref={setNodeRef}