Skip to content

feat(ui): notebook loading skeleton for daemon-owned doc population (#599)#611

Merged
rgbkrk merged 1 commit intomainfrom
feat/loading-state
Mar 8, 2026
Merged

feat(ui): notebook loading skeleton for daemon-owned doc population (#599)#611
rgbkrk merged 1 commit intomainfrom
feat/loading-state

Conversation

@rgbkrk
Copy link
Member

@rgbkrk rgbkrk commented Mar 8, 2026

Closes #599.

Builds on #607 (external store + awaitingInitialSyncRef loading detection).

What changed

CellSkeleton now renders three skeleton cells with varying heights instead of one, giving a more realistic "notebook is loading" appearance. Staggered animationDelay on the pulse creates a subtle wave effect.

Before After
Single 2rem skeleton cell Three cells: 2.5rem, 5rem, 2rem
Looks sparse during load Looks like a notebook with cells

How loading works (from #607)

  1. isLoading starts true
  2. bootstrap() fetches doc bytes from daemon via GetDocBytes request
  3. If doc has cells → isLoading = false immediately
  4. If doc is empty (daemon still syncing) → stays loading until first automerge:from-daemon message
  5. NotebookViewContent shows <CellSkeleton /> when cells.length === 0 && isLoading
  6. Once cells materialize via sync → external store updates → React re-renders with real cells

Follow-ups

  • DaemonReadyPayload { cell_count } is emitted but not consumed yet — could size the skeleton to match the actual notebook
  • Per-cell output loading indicators (outputs arrive via broadcast after cells sync)

Replace the single CellSkeleton placeholder with three skeleton cells
of varying heights (2.5rem, 5rem, 2rem) to better mimic a real notebook
loading. Staggered animation delays (0/75/150ms) give a subtle wave
effect on the pulse animation.

The loading state infrastructure from #607 handles detection:
- isLoading=true until bootstrap finds cells or first sync message
- CellSkeleton shows when cells.length===0 && isLoading
- Transition to real cells is automatic via useSyncExternalStore
@rgbkrk rgbkrk merged commit 6eae37e into main Mar 8, 2026
19 of 20 checks passed
@rgbkrk rgbkrk deleted the feat/loading-state branch March 8, 2026 13:17
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.

feat: notebook loading state for daemon-owned doc population

1 participant