Dashboard cards jump around during refresh causing misclicks #175

New issue

Closed

opened 2026-01-27 14:49:50 +00:00 by mprihoda · 1 comment

mprihoda commented

2026-01-27 14:49:50 +00:00

(Migrated from github.com)

Problem

When the dashboard refreshes, worktree cards reorder unpredictably. This causes a frustrating experience where:

User scans the dashboard looking for a specific issue
User moves cursor to click on the desired card
Dashboard refreshes, cards reorder
User clicks on the wrong card

This is a classic "layout shift" UX problem that makes the dashboard feel unreliable and frustrating to use.

Expected Behavior

Cards should maintain stable positions during refresh. The order should only change when:

User explicitly requests a sort change
A card is removed (others can shift to fill the gap)
A new card is added (can appear at a predictable location, e.g., top or bottom)

Proposed Solutions

Option A: Stable Sort Key

Always sort cards by a stable key that doesn't change during refresh:

Issue ID (alphabetical/numerical)
Creation timestamp of the worktree
Path (alphabetical)

Option B: Preserve Current Order

Keep cards in their current DOM order during refresh, only updating content within each card. New cards appear at a designated position (top or bottom).

Option C: Animated Transitions

If reordering is intentional (e.g., "most recently active" sort), animate the transitions so users can track where cards moved. This at least makes the reorder visible rather than jarring.

Recommendation

Option A (stable sort key) is probably the right default. Users expect dashboards to have predictable ordering. If we want "most recently active" sorting, that should be an explicit user choice, not the default.

Acceptance Criteria

Cards maintain stable positions during automatic refresh
User can predict where a card will be without waiting for refresh
New cards appear at a consistent, predictable location
(Optional) User can choose sort order (by issue ID, by activity, etc.)

#118 - Redesign worktree card for clearer next actions
#119 - Redesign dashboard navigation with persistent worktree sidebar

## Problem When the dashboard refreshes, worktree cards reorder unpredictably. This causes a frustrating experience where: 1. User scans the dashboard looking for a specific issue 2. User moves cursor to click on the desired card 3. Dashboard refreshes, cards reorder 4. User clicks on the wrong card This is a classic "layout shift" UX problem that makes the dashboard feel unreliable and frustrating to use. ## Expected Behavior Cards should maintain stable positions during refresh. The order should only change when: - User explicitly requests a sort change - A card is removed (others can shift to fill the gap) - A new card is added (can appear at a predictable location, e.g., top or bottom) ## Proposed Solutions ### Option A: Stable Sort Key Always sort cards by a stable key that doesn't change during refresh: - Issue ID (alphabetical/numerical) - Creation timestamp of the worktree - Path (alphabetical) ### Option B: Preserve Current Order Keep cards in their current DOM order during refresh, only updating content within each card. New cards appear at a designated position (top or bottom). ### Option C: Animated Transitions If reordering is intentional (e.g., "most recently active" sort), animate the transitions so users can track where cards moved. This at least makes the reorder visible rather than jarring. ## Recommendation Option A (stable sort key) is probably the right default. Users expect dashboards to have predictable ordering. If we want "most recently active" sorting, that should be an explicit user choice, not the default. ## Acceptance Criteria - [ ] Cards maintain stable positions during automatic refresh - [ ] User can predict where a card will be without waiting for refresh - [ ] New cards appear at a consistent, predictable location - [ ] (Optional) User can choose sort order (by issue ID, by activity, etc.) ## Related Issues - #118 - Redesign worktree card for clearer next actions - #119 - Redesign dashboard navigation with persistent worktree sidebar

mprihoda commented

2026-03-14 10:51:19 +00:00

(Migrated from github.com)

Closed by ff74012 fix(dashboard): Dashboard cards jump around during refresh (IW-175) (#179)

Closed by ff74012 fix(dashboard): Dashboard cards jump around during refresh (IW-175) (#179)