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:
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user