[Bug]: Dragging a sidebar thread from the lower part of the list auto-scrolls the sidebar to the bottom

Aperta Adatta ai principianti
  • Qualcosa non va?
#27,669 0 commenti 0 reazioni 0 assegnatari Vedi su GitHub

I maintainer di solito rispondono entro 1 giorno

@juliusmarminge ci sta già lavorando.

Dal 30/10/2026.

  • #27691 di @juliusmarminge — aperta

Valutazione

Difficoltà
2/5
Tempo stimato
1-3 ore
Idoneità per principianti
78/100
Tipo di issue
Bug
Chiarezza
Specificata chiaramente
Stato di attività
Attiva
Stack tecnologico
react, typescript
Ambito
frontend

Direzione di ricerca

Inizia da apps/web/src/components/Sidebar.tsx, vicino alla prop autoScroll intorno alla riga 3169, poi controlla le impostazioni di scorrimento automatico di dnd-kit 6.3.1 e riproduci il trascinamento segnalato da una riga inferiore. Regola la zona e la velocità di scorrimento automatico in modo che l’elenco resti fermo finché il puntatore non si avvicina al bordo della barra laterale, continuando però a scorrere quando si trascina sul bordo. Verifica nell’app i gesti segnalati, soprattutto il trascinamento di un thread fissato dalle righe visibili più in basso.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

Before submitting
  • I searched existing issues and did not find a duplicate. Closest: #27586 (a row jumps down the list on pickup, same build). It may be the same cause, but it doesn't mention the list scrolling, so I'm filing this separately. #26392 fixed a similar jump when settling a thread, through a different path (focus restore).
  • I included enough detail to reproduce or investigate the problem.
Area

apps/web

Steps to reproduce
  1. Have enough threads that the sidebar list is taller than the sidebar, and scroll it to the top.
  2. Press a thread in the lower part of the visible list. A pinned thread shows it best when Pinned fills most of the sidebar.
  3. Move the pointer a few pixels to start the drag. A small wobble downward is enough, even if you mean to drag up.
Expected behavior

The list stays put until the pointer reaches the edge of the sidebar, then scrolls at a speed you can control. You can move a pinned thread to the top of Pinned without losing sight of Pinned.

Actual behavior

As soon as the drag starts, the sidebar scrolls to the bottom of the list, even with the pointer held still. The pinned threads leave the screen, so you have to drag all the way back up.

Likely cause

The sidebar uses dnd-kit's default auto-scroll settings, which are too aggressive for a list this narrow and tall:

  • Sidebar.tsx:3169 passes autoScroll={!isContextDrag}, so dnd-kit 6.3.1's defaults apply.
  • The default zone is 20% of the scroller's height (getScrollDirectionAndSpeed). In an 800px sidebar that's the bottom 160px, about two thread rows, so a row can start inside it.
  • The default speed is up to 10px every 5ms at the edge, or 2,000px/s (useAutoScroller).
  • Scroll intent is sticky (useScrollIntent). One pixel of downward movement allows forward scrolling for the rest of the drag.
  • The scroll interval keeps running while the pointer is still, so the list runs to the end.
What I checked

Confirmed in the source, and with a simulation that runs the real dnd-kit 6.3.1 and an unmodified Sidebar.pointer.ts in jsdom with fake geometry (800px viewport, 82px rows, 3,280px list):

Gesture Pressed row Scrolled after holding 1.5s
8px down Top or middle of the viewport 0px
8px down In the bottom 20% 1,143px, still moving
8px up only In the bottom 20% 0px
8px up, then 1px down In the bottom 20% 816px, still moving

Not confirmed: I haven't reproduced this in a running app with this explanation, and the simulation has no real layout. I saw the jump in the app, but didn't measure where the pointer was. In the simulation, rows above the bottom 20% never scroll, so if this happens from the top of the list there is a second cause.

Ruled out by reading the code: the focus restore from #26392 now uses preventScroll, the drag labels and placeholders don't change layout height (h-0), and the sidebar's other scrollIntoView calls only run for keyboard navigation and route reveals.

Suggested fix

A smaller zone and a lower speed, keeping the current on/off behavior:

autoScroll={{ enabled: !isContextDrag, threshold: { x: 0, y: 0.05 }, acceleration: 3 }}

With these values in the same simulation, the row that ran away above stays at 0px, in both the 8px-down and 1px-wobble gestures. Dragging to the edge still scrolls, at about 500px/s. A row pressed in the last 5% still scrolls, at about 400px/s. The values need a real feel test.

Impact

Minor bug or occasional failure

Version or commit

T3 Code (Beta) 0.1.5 (6d450a428485). Source references are from main at 616c426f5f.

Environment

macOS 26.6.2, desktop app.

Workaround

Scroll the list so the row sits higher in the sidebar before picking it up. Based on the simulation, not tested in the app.

Investigated and drafted by Claude Code (Claude Opus 5.5).

Lingua principale
TypeScript
Stelle
24.8k
Fork
6.4k
Merge medio
13h 49m
PR unite (30g)
179

Preparare l'ambiente

Apri in Codespaces

Avvia il container di sviluppo del progetto nel browser, con il tuo account GitHub.

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di pingdotgg/t3code

Tutte le issue di pingdotgg/t3code

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.