Skip to content

Fix dashboard scrollbar freezing when documents arrive during a drag - #621

Open
MeshanKhosla wants to merge 1 commit into
convex:mainfrom
MeshanKhosla:fix/table-scrollbar-drag
Open

MeshanKhosla wants to merge 1 commit into
convex:mainfrom
MeshanKhosla:fix/table-scrollbar-drag

Conversation

@MeshanKhosla

Copy link
Copy Markdown

Summary

On the dashboard's Data page, the scrollbar can stop responding while you're dragging it if a new document arrives. This requires users to release the mouse and grab the scrollbar again to keep scrolling.

This happens because when the row count changes, the scrollbar cancels its pending animation frame but doesn't clear the stored frame ID in rafIdRef. So when the mouse moves again, it thinks there's already a frame scheduled and doesn't start a new one.

This change:

  1. Clears the stored ID after cancellation so the next mouse movement can resume scrolling.
  2. Uses null consistently for no pending frame, as MDN recommends, since a valid frame ID can be 0.

Testing

Tested this with production builds of the self-hosted dashboard and a local Convex backend:

  1. Opened a table with enough documents to show the scrollbar.
  2. Started dragging the scrollbar and kept the mouse held.
  3. Inserted one document from another client, then continued dragging.

Videos are below.

Before the fix, the table stopped scrolling after the document arrived. After the fix, it kept scrolling without needing to release the mouse.

Also tested row-count and viewport changes during a drag, repeated updates, release and restart, mouseleave, unmounting, replacing the list, and a valid frame ID of zero. All passed with the fix.

dashboard-common lint, build, and typechecking passed, along with the dprint check for the changed file.

I haven't included automated tests since this component and the adjacent files don't have tests in the public checkout. Happy to add tests if you'd prefer.

Videos

Before:

convex-scroll-before-github.mp4

After:

convex-scroll-after-github.mp4

Note: I also noticed that, when the scrollbar handle uses its minimum size, it stays at the top until its calculated position exceeds 64px. This comes from subtracting MIN_SCROLLBAR_SIZE from its position. This is existing behavior and changing that is out of scope of this PR.

By submitting this pull request, I confirm that you can use, modify, copy, and redistribute this contribution, under the terms of your choice.

@cubic-dev-ai cubic-dev-ai Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

No issues found across 1 file

Confidence score: 5/5

  • Automated review surfaced no issues in the provided summaries.
  • No files require special attention.

Re-trigger cubic

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