Step 9 - views and awareness
2 min read
View modes and swimlanes
Add a view mode switcher to the board toolbar with four modes rendered from the same two streams: (1) "Board" - the existing columns; (2) "List" - a flat sortable table with title, column, tags, assignees, due date; (3) "Grid" - a card gallery; (4) "Tag lanes" - a swimlane matrix where rows are the board's tags (plus a trailing "Untagged" lane) and columns are the status columns, each lane tinted with a translucent version of its tag color.
In Tag lanes, every cell is a drop list with an encoded id like tg|{tagId}|{columnId}: dropping a card in a different column changes columnId; dropping into a different tag row RE-TAGS the card (the target tag becomes the first tag; dropping into the Untagged lane clears tagIds). List and grid views get a column filter dropdown. Persist the chosen view mode per board in localStorage. Keep all drag logic mapping rendered indices onto full arrays.
Unread tracking and "What's new"
Add per-device unread tracking with a small SeenService backed by localStorage - no server writes. Track three things: cardSeen (per card, the last updatedAt/lastCommentAt the user has seen), boardFirst (a first-visit timestamp "floor" per board, so an existing board does not light up entirely on first open), and boardAck (per board, when the user last opened it - drives an unread dot on the board list tiles via lastActivityAt).
Rules: a card is unread if it was created or received a comment after the floor and after the user last saw it; your OWN actions never mark anything unread for you. UI: an unread dot on card faces, a red badge with the unread count on each column header that toggles a per-column "unread only" filter (auto-clears when the column runs out of unread cards), and a "What's new" panel listing unread items (kind: new card vs new comment) newest first with relative timestamps, click-to-open, and a "Mark all as read" button.
Discussion
0 commentsNo comments yet. Start the discussion.