fix: use onDragEnd on Reorder.Item instead of onPointerUp on Group

The previous approach used onPointerUp on the Reorder.Group which
fired unreliably — triggering on non-drag clicks and sometimes not
at all after a drag. Moving to onDragEnd on each Reorder.Item gives
clean, predictable drag-to-reorder behavior.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-04-03 18:42:16 +02:00
parent 3fc737c872
commit 52751ae9d4
2 changed files with 8 additions and 6 deletions

View File

@@ -36,12 +36,11 @@ function ThreadDetailPage() {
thread?.categoryId ?? 0,
);
const [tempItems, setTempItems] =
useState<typeof thread extends { candidates: infer C } ? C : never | null>(
null,
);
const [tempItems, setTempItems] = useState<
NonNullable<typeof thread>["candidates"] | null
>(null);
// Clear tempItems when server data changes (biome-ignore: thread?.candidates is intentional dep)
// Clear tempItems when server data changes
// biome-ignore lint/correctness/useExhaustiveDependencies: thread?.candidates is the intended trigger
useEffect(() => {
setTempItems(null);
@@ -227,7 +226,6 @@ function ThreadDetailPage() {
axis="y"
values={displayItems}
onReorder={setTempItems}
onPointerUp={handleDragEnd}
className="flex flex-col gap-2"
>
{displayItems.map((candidate, index) => (
@@ -243,6 +241,7 @@ function ThreadDetailPage() {
})
}
delta={deltas[candidate.id]}
onDragEnd={handleDragEnd}
/>
))}
</Reorder.Group>