Sprint: Stories en taken krijgen één voorspelbare volgorde gekoppeld aan hun code; drag-and-drop herordening voor stories/taken verdwijnt, priority wordt puur label. (#201)

* feat(code): add parseCodeNumber helper to lib/code.ts Pure helper that extracts the trailing numeric sequence from a code string (ST-007 → 7, T-42 → 42). Non-conforming codes fall back to Number.MAX_SAFE_INTEGER so they sort to the end. Includes 5 unit tests. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> * feat(tasks): add code field to BacklogTask type and all task selects Adds `code: string | null` to BacklogTask interface and includes it in all Prisma task.findMany selects (backlog API, stories tasks API, page hydration routes). Updates coerceTaskPayload and test fixtures to match. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> * feat(sort-order): derive story/task sort_order from parseCodeNumber(code) All create paths (createStoryAction, saveTask, createTaskAction, materializeIdeaPlanAction) and code-edit paths (updateStoryAction, saveTask update) now set sort_order = parseCodeNumber(code) instead of last+1. Removes stale last-record queries from create paths. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> * fix(sort-order): decouple sprint membership actions from sort_order createSprintAction and addStoryToSprintAction no longer write sort_order when adding stories to a sprint. sort_order is derived from code via parseCodeNumber, so membership should only set sprint_id + status. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> * refactor(ordering): remove priority from all story/task orderBy Story- en taak-ordering is nu puur sort_order asc (created_at als tiebreaker). PBI-ordering (priority + sort_order) blijft ongewijzigd. Gewijzigd: backlog/route, pbis/stories/route, claude-context/route, next-story/route, workspace/route, tasks/route, sprint-runs (query + in-memory sort), solo-workspace-server, page.tsx (app + mobile + sprint), store compareStory, actions/sprints story-query, next-story test. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> * refactor(dnd): remove drag-and-drop reorder for stories and tasks - Remove reorderStoriesAction, reorderTasksAction, reorderSprintStoriesAction - Delete REST route app/api/stories/[id]/tasks/reorder/route.ts - Remove DnD from backlog story-panel and task-panel (flat list) - Remove reorder-within-sprint branch from sprint-board-client handleDragEnd - Switch SortableSprintRow to plain SprintRow using useDraggable (membership drag kept) - Remove all DnD from task-list (status toggle + edit kept) - Remove story-order/task-order/sprint-story-order/sprint-task-order mutation types and store handlers - Remove related tests for deleted reorder route; fix sprint store tests * feat(backlog): toon code-badge op backlog-taakkaarten Geeft code={task.code} door aan <BacklogCard> in TaskCard (task-panel.tsx). BacklogCard rendert de CodeBadge al conditionally — alleen de prop ontbrak. * feat(migration): backfill story/task sort_order from code numeric suffix One-time Prisma migration that sets sort_order = trailing numeric part of code for all existing stories and tasks, consistent with parseCodeNumber (fallback = Number.MAX_SAFE_INTEGER for non-conforming codes). PBIs are intentionally excluded. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> * docs+tests(sort-order): update for code-binding order on stories/tasks - Rewrite docs/patterns/sort-order.md: float-insertion PBI only; story/task sort_order = parseCodeNumber(code), never drag/membership mutated - Update plan-to-pbi-flow.md: sort_order auto, sprint_id param, priority=label - Update make-plan.md: priority=label, array order = execution order - Update rest-contract.md: fix sprint-tasks ordering, remove reorder endpoint - Add ADR-0011: code is bindende volgordesleutel voor stories/taken - Regenerate docs/INDEX.md via npm run docs - Remove reorderStoriesAction/reorderTasksAction mocks from backlog tests - Remove dnd-kit mocks from task-panel test (panel no longer uses dnd) - Extend materializeIdeaPlanAction test: assert sort_order=parseCodeNumber(code) Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> --------- Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-14 19:02:36 +02:00 · 2026-05-14 19:02:36 +02:00 · ff22196714
commit ff22196714
parent b6249a41c0
43 changed files with 296 additions and 951 deletions
--- a/components/backlog/story-panel.tsx
+++ b/components/backlog/story-panel.tsx
@ -1,26 +1,6 @@
 'use client'

-import { useState, useTransition } from 'react'
-import {
-  DndContext,
-  DragEndEvent,
-  DragOverlay,
-  DragStartEvent,
-  KeyboardSensor,
-  PointerSensor,
-  useSensor,
-  useSensors,
-  closestCenter,
-} from '@dnd-kit/core'
-import {
-  SortableContext,
-  useSortable,
-  rectSortingStrategy,
-  arrayMove,
-  sortableKeyboardCoordinates,
-} from '@dnd-kit/sortable'
-import { CSS } from '@dnd-kit/utilities'
-import { toast } from 'sonner'
+import { useState } from 'react'
 import { CheckSquare, Square } from 'lucide-react'
 import {
  Tooltip,
@ -40,7 +20,6 @@ import {
  selectStoryIsBlocked,
 } from '@/stores/product-workspace/selectors'
 import type { BacklogStory as WorkspaceStory } from '@/stores/product-workspace/types'
-import { reorderStoriesAction } from '@/actions/stories'
 import { StoryDialog, type StoryDialogState } from './story-dialog'
 import { debugProps } from '@/lib/debug'
 import { BacklogCard } from './backlog-card'
@ -80,8 +59,7 @@ interface StoryPanelProps {
  activeSprintId?: string | null
 }

-// --- Sortable story block ---
-function SortableStoryBlock({
+function StoryBlock({
  story,
  isSelected,
  cherrypick,
@ -98,26 +76,11 @@ function SortableStoryBlock({
  onSelect: () => void
  onEdit: () => void
 }) {
-  const { attributes, listeners, setNodeRef, transform, transition, isDragging } = useSortable({
-    id: story.id,
-  })
-
-  const style = {
-    transform: CSS.Transform.toString(transform),
-    transition,
-    opacity: isDragging ? 0.4 : 1,
-  }
-
  return (
    <BacklogCard
-      ref={setNodeRef}
-      style={style}
-      {...attributes}
-      {...listeners}
      title={story.title}
      code={story.code}
      priority={story.priority}
-      isDragging={isDragging}
      isSelected={isSelected}
      onClick={onSelect}
      badge={
@ -196,8 +159,6 @@ function StoryCherrypickButton({
 }

 // --- Main component ---
-// PBI-74 / T-850: leest stories voor active PBI via selectStoriesForActivePbi
-// (useShallow). DnD via applyOptimisticMutation('story-order').
 export function StoryPanel({ productId, isDemo, activeSprintId = null }: StoryPanelProps) {
  const selectedPbiId = useProductWorkspaceStore((s) => s.context.activePbiId)
  const selectedStoryId = useProductWorkspaceStore((s) => s.context.activeStoryId)
@ -210,14 +171,8 @@ export function StoryPanel({ productId, isDemo, activeSprintId = null }: StoryPa
  const setPref = useUserSettingsStore((s) => s.setPref)
  const setSortMode = (v: SortMode) => void setPref(['views', 'storyPanel', 'sort'], v)
  const [storyDialogState, setStoryDialogState] = useState<StoryDialogState | null>(null)
-  const [activeDragId, setActiveDragId] = useState<string | null>(null)
-  const [, startTransition] = useTransition()

-  // rawStories komt al gesorteerd binnen via selectStoriesForActivePbi.
-  const storyMap = Object.fromEntries(rawStories.map(s => [s.id, s]))
-  const orderedStories = rawStories
-
-  const base = orderedStories
+  const base = rawStories
    .filter(s => !filterStatus || s.status === filterStatus)
    .filter(s => !filterPriority || s.priority === filterPriority)

@ -231,74 +186,6 @@ export function StoryPanel({ productId, isDemo, activeSprintId = null }: StoryPa
    return a.priority !== b.priority ? a.priority - b.priority : 0
  })

-  const sensors = useSensors(
-    useSensor(PointerSensor, { activationConstraint: { distance: 5 } }),
-    useSensor(KeyboardSensor, { coordinateGetter: sortableKeyboardCoordinates })
-  )
-
-  function handleDragStart(event: DragStartEvent) {
-    setActiveDragId(event.active.id as string)
-  }
-
-  function handleDragEnd(event: DragEndEvent) {
-    setActiveDragId(null)
-    const { active, over } = event
-    if (!over || active.id === over.id || !selectedPbiId) return
-
-    const activeStory = storyMap[active.id as string]
-    const overStory = storyMap[over.id as string]
-    if (!activeStory || !overStory) return
-
-    const store = useProductWorkspaceStore.getState()
-    const prevOrder = [...(store.relations.storyIdsByPbi[selectedPbiId] ?? [])]
-    const oldIndex = prevOrder.indexOf(active.id as string)
-    const newIndex = prevOrder.indexOf(over.id as string)
-    if (oldIndex === -1 || newIndex === -1) return
-    const newOrder = arrayMove([...prevOrder], oldIndex, newIndex)
-
-    const orderMutationId = store.applyOptimisticMutation({
-      kind: 'story-order',
-      pbiId: selectedPbiId,
-      prevStoryIds: prevOrder,
-    })
-    useProductWorkspaceStore.setState((s) => {
-      s.relations.storyIdsByPbi[selectedPbiId] = newOrder
-    })
-
-    const priorityChanged = activeStory.priority !== overStory.priority
-    let priorityMutationId: string | null = null
-    if (priorityChanged) {
-      priorityMutationId = store.applyOptimisticMutation({
-        kind: 'entity-patch',
-        entity: 'story',
-        id: active.id as string,
-        prev: store.entities.storiesById[active.id as string],
-      })
-      useProductWorkspaceStore.setState((s) => {
-        const story = s.entities.storiesById[active.id as string]
-        if (story) story.priority = overStory.priority
-      })
-    }
-
-    startTransition(async () => {
-      const result = await reorderStoriesAction(
-        selectedPbiId,
-        productId,
-        newOrder,
-        priorityChanged ? overStory.priority : undefined
-      )
-      const st = useProductWorkspaceStore.getState()
-      if (result.success) {
-        if (priorityMutationId) st.settleMutation(priorityMutationId)
-        st.settleMutation(orderMutationId)
-      } else {
-        if (priorityMutationId) st.rollbackMutation(priorityMutationId)
-        st.rollbackMutation(orderMutationId)
-        toast.error('Volgorde opslaan mislukt')
-      }
-    })
-  }
-
  const hasActiveFilters = filterStatus !== null || filterPriority !== null

  return (
@ -361,39 +248,19 @@ export function StoryPanel({ productId, isDemo, activeSprintId = null }: StoryPa
            action={{ label: 'Maak je eerste story aan', onClick: () => setStoryDialogState({ mode: 'create', pbiId: selectedPbiId, productId, defaultPriority: 2 }), disabled: isDemo }}
          />
        ) : (
-          <DndContext
-            id="story-panel"
-            sensors={sensors}
-            collisionDetection={closestCenter}
-            onDragStart={handleDragStart}
-            onDragEnd={handleDragEnd}
-          >
-            <SortableContext items={filtered.map(s => s.id)} strategy={rectSortingStrategy}>
-              <div className="grid grid-cols-3 gap-2">
-                {filtered.map(story => (
-                  <StoryBlockWithCherrypick
-                    key={story.id}
-                    story={story}
-                    productId={productId}
-                    activeSprintId={activeSprintId}
-                    isSelected={selectedStoryId === story.id}
-                    onSelect={() => useProductWorkspaceStore.getState().setActiveStory(story.id)}
-                    onEdit={() => setStoryDialogState({ mode: 'edit', story, productId })}
-                  />
-                ))}
-              </div>
-            </SortableContext>
-
-            <DragOverlay>
-              {activeDragId && storyMap[activeDragId] && (
-                <BacklogCard
-                  title={storyMap[activeDragId].title}
-                  priority={storyMap[activeDragId].priority}
-                  className="border-primary shadow-xl opacity-90"
-                />
-              )}
-            </DragOverlay>
-          </DndContext>
+          <div className="grid grid-cols-3 gap-2">
+            {filtered.map(story => (
+              <StoryBlockWithCherrypick
+                key={story.id}
+                story={story}
+                productId={productId}
+                activeSprintId={activeSprintId}
+                isSelected={selectedStoryId === story.id}
+                onSelect={() => useProductWorkspaceStore.getState().setActiveStory(story.id)}
+                onEdit={() => setStoryDialogState({ mode: 'edit', story, productId })}
+              />
+            ))}
+          </div>
        )}
      </div>

@ -406,9 +273,7 @@ export function StoryPanel({ productId, isDemo, activeSprintId = null }: StoryPa
  )
 }

-// PBI-79 / ST-1337: wrapper rond SortableStoryBlock met cherrypick-handling.
-// Subscribed per story zodat enkel de relevante rij re-rendert bij draft- of
-// crossSprintBlocks-mutaties.
+// PBI-79 / ST-1337: wrapper rond StoryBlock met cherrypick-handling.
 function StoryBlockWithCherrypick({
  story,
  productId,
@ -443,7 +308,6 @@ function StoryBlockWithCherrypick({
  } | null = null

  if (draft) {
-    // State A′: muteer draft via per-PBI overrides.
    const intent = draft.pbiIntent[story.pbi_id] ?? 'none'
    const override = draft.storyOverrides[story.pbi_id] ?? {
      add: [],
@ -474,7 +338,6 @@ function StoryBlockWithCherrypick({
      },
    }
  } else if (activeSprintId) {
-    // State B: muteer pending buffer via toggleStorySprintMembership.
    const inSprintDb = story.sprint_id === activeSprintId
    const inAdds = pending.adds.includes(story.id)
    const inRemoves = pending.removes.includes(story.id)
@ -489,7 +352,7 @@ function StoryBlockWithCherrypick({
  }

  return (
-    <SortableStoryBlock
+    <StoryBlock
      story={story}
      isSelected={isSelected}
      cherrypick={cherrypick}
--- a/components/backlog/task-panel.tsx
+++ b/components/backlog/task-panel.tsx
@ -1,27 +1,6 @@
 'use client'

-import { useState, useTransition } from 'react'
 import { useRouter } from 'next/navigation'
-import {
-  DndContext,
-  DragEndEvent,
-  DragOverlay,
-  DragStartEvent,
-  KeyboardSensor,
-  PointerSensor,
-  useSensor,
-  useSensors,
-  closestCenter,
-} from '@dnd-kit/core'
-import {
-  SortableContext,
-  useSortable,
-  rectSortingStrategy,
-  arrayMove,
-  sortableKeyboardCoordinates,
-} from '@dnd-kit/sortable'
-import { CSS } from '@dnd-kit/utilities'
-import { toast } from 'sonner'
 import { Badge } from '@/components/ui/badge'
 import { Button } from '@/components/ui/button'
 import { PanelNavBar } from '@/components/shared/panel-nav-bar'
@ -33,7 +12,6 @@ import type {
  BacklogTask,
  TaskDetail,
 } from '@/stores/product-workspace/types'
-import { reorderTasksAction } from '@/actions/tasks'
 import { BacklogCard } from './backlog-card'
 import { debugProps } from '@/lib/debug'
 import { EmptyPanel } from './empty-panel'
@ -52,32 +30,18 @@ const STATUS_LABELS: Record<string, string> = {
  DONE: 'Klaar',
 }

-function SortableTaskCard({
+function TaskCard({
  task,
-  isDemo,
  onClick,
 }: {
  task: BacklogTask | TaskDetail
-  isDemo: boolean
  onClick: () => void
 }) {
-  const { attributes, listeners, setNodeRef, transform, transition, isDragging } =
-    useSortable({ id: task.id })
-
-  const style = {
-    transform: CSS.Transform.toString(transform),
-    transition,
-  }
-
  return (
    <BacklogCard
-      ref={setNodeRef}
-      style={style}
-      {...attributes}
-      {...(isDemo ? {} : listeners)}
      title={task.title}
      priority={task.priority}
-      isDragging={isDragging}
+      code={task.code}
      onClick={onClick}
      badge={
        <Badge
@ -99,64 +63,17 @@ interface TaskPanelProps {
  closePath: string
 }

-// PBI-74 / T-851: leest tasks voor active story via selectTasksForActiveStory
-// (useShallow). DnD via applyOptimisticMutation('task-order'). Detail-view
-// (ensureTaskLoaded + isDetail()) zit in de task-dialog, niet in deze lijst.
+// PBI-74 / T-851: leest tasks voor active story via selectTasksForActiveStory.
 export function TaskPanel({ isDemo, closePath }: TaskPanelProps) {
  const router = useRouter()
-  const [, startTransition] = useTransition()
  const selectedStoryId = useProductWorkspaceStore((s) => s.context.activeStoryId)
  const rawTasks = useProductWorkspaceStore(useShallow(selectTasksForActiveStory)) as
    | (BacklogTask | TaskDetail)[]
-  const [activeDragId, setActiveDragId] = useState<string | null>(null)

  const tasks: (BacklogTask | TaskDetail)[] | null = selectedStoryId
    ? rawTasks
    : null

-  const sensors = useSensors(
-    useSensor(PointerSensor, { activationConstraint: { distance: 5 } }),
-    useSensor(KeyboardSensor, { coordinateGetter: sortableKeyboardCoordinates }),
-  )
-
-  function handleDragStart(event: DragStartEvent) {
-    setActiveDragId(event.active.id as string)
-  }
-
-  function handleDragEnd(event: DragEndEvent) {
-    setActiveDragId(null)
-    if (!selectedStoryId || !tasks) return
-    const { active, over } = event
-    if (!over || active.id === over.id) return
-
-    const store = useProductWorkspaceStore.getState()
-    const prevOrder = [...(store.relations.taskIdsByStory[selectedStoryId] ?? [])]
-    const oldIndex = prevOrder.indexOf(active.id as string)
-    const newIndex = prevOrder.indexOf(over.id as string)
-    if (oldIndex === -1 || newIndex === -1) return
-    const newOrder = arrayMove([...prevOrder], oldIndex, newIndex)
-
-    const orderMutationId = store.applyOptimisticMutation({
-      kind: 'task-order',
-      storyId: selectedStoryId,
-      prevTaskIds: prevOrder,
-    })
-    useProductWorkspaceStore.setState((s) => {
-      s.relations.taskIdsByStory[selectedStoryId] = newOrder
-    })
-
-    startTransition(async () => {
-      const result = await reorderTasksAction(selectedStoryId, newOrder)
-      const st = useProductWorkspaceStore.getState()
-      if (result?.error) {
-        st.rollbackMutation(orderMutationId)
-        toast.error(result.error)
-      } else {
-        st.settleMutation(orderMutationId)
-      }
-    })
-  }
-
  const navActions = (
    <DemoTooltip show={isDemo}>
      <Button
@ -201,42 +118,19 @@ export function TaskPanel({ isDemo, closePath }: TaskPanelProps) {
    )
  }

-  const activeTask = activeDragId ? tasks.find((t) => t.id === activeDragId) : null
-
  return (
    <div className="flex flex-col h-full" {...dp}>
      <PanelNavBar title="Taken" actions={navActions} />
      <div className="flex-1 overflow-y-auto p-3">
-        <DndContext
-          id="task-panel"
-          sensors={sensors}
-          collisionDetection={closestCenter}
-          onDragStart={handleDragStart}
-          onDragEnd={handleDragEnd}
-        >
-          <SortableContext items={tasks.map((t) => t.id)} strategy={rectSortingStrategy}>
-            <div className="grid grid-cols-2 gap-2">
-              {tasks.map((task) => (
-                <SortableTaskCard
-                  key={task.id}
-                  task={task}
-                  isDemo={isDemo}
-                  onClick={() => router.push(`${closePath}?editTask=${task.id}`)}
-                />
-              ))}
-            </div>
-          </SortableContext>
-
-          <DragOverlay>
-            {activeTask && (
-              <BacklogCard
-                title={activeTask.title}
-                priority={activeTask.priority}
-                className="border-primary shadow-xl opacity-90"
-              />
-            )}
-          </DragOverlay>
-        </DndContext>
+        <div className="grid grid-cols-2 gap-2">
+          {tasks.map((task) => (
+            <TaskCard
+              key={task.id}
+              task={task}
+              onClick={() => router.push(`${closePath}?editTask=${task.id}`)}
+            />
+          ))}
+        </div>
      </div>
    </div>
  )
--- a/components/sprint/sprint-backlog.tsx
+++ b/components/sprint/sprint-backlog.tsx
@ -3,8 +3,6 @@
 import { useMemo, useState, useTransition } from 'react'
 import { Trash2, MoreHorizontal, ChevronsUp, ChevronsDown, Pencil } from 'lucide-react'
 import { useDroppable, useDraggable } from '@dnd-kit/core'
-import { SortableContext, useSortable, verticalListSortingStrategy } from '@dnd-kit/sortable'
-import { CSS } from '@dnd-kit/utilities'
 import { toast } from 'sonner'
 import { useShallow } from 'zustand/react/shallow'
 import { Badge } from '@/components/ui/badge'
@ -76,7 +74,7 @@ export interface PbiWithStories {

 // --- Left panel: Sprint Backlog ---

-function SortableSprintRow({
+function SprintRow({
  story, isDemo, onRemove, onSelect, onEdit, isSelected,
  currentUserId, productId, members, onAssigneeChange,
 }: {
@ -91,8 +89,8 @@ function SortableSprintRow({
  members: ProductMember[]
  onAssigneeChange: (storyId: string, id: string | null, username: string | null) => void
 }) {
-  const { attributes, listeners, setNodeRef, transform, transition, isDragging } = useSortable({ id: story.id })
-  const style = { transform: CSS.Transform.toString(transform), transition, opacity: isDragging ? 0.4 : 1 }
+  const { attributes, listeners, setNodeRef, isDragging } = useDraggable({ id: story.id })
+  const style = { opacity: isDragging ? 0.4 : 1 }
  const [, startTransition] = useTransition()

  function handleClaim(e: React.MouseEvent) {
@ -312,9 +310,9 @@ export function SprintBacklogLeft({
            {isOver ? 'Loslaten om toe te voegen aan Sprint' : 'Geen stories in de Sprint. Sleep stories vanuit het linkerpaneel.'}
          </p>
        ) : (
-          <SortableContext items={orderedStories.map(s => s.id)} strategy={verticalListSortingStrategy}>
+          <>
            {orderedStories.map(story => (
-              <SortableSprintRow
+              <SprintRow
                key={story.id}
                story={story}
                isDemo={isDemo}
@ -328,7 +326,7 @@ export function SprintBacklogLeft({
                onAssigneeChange={onAssigneeChange}
              />
            ))}
-          </SortableContext>
+          </>
        )}
      </div>
      <StoryDialog
--- a/components/sprint/sprint-board-client.tsx
+++ b/components/sprint/sprint-board-client.tsx
@ -5,7 +5,7 @@ import {
  DndContext, DragEndEvent, DragStartEvent, DragOverlay,
  KeyboardSensor, PointerSensor, useSensor, useSensors, closestCenter,
 } from '@dnd-kit/core'
-import { sortableKeyboardCoordinates, arrayMove } from '@dnd-kit/sortable'
+import { sortableKeyboardCoordinates } from '@dnd-kit/sortable'
 import { toast } from 'sonner'
 import { useShallow } from 'zustand/react/shallow'
 import { SplitPane } from '@/components/split-pane/split-pane'
@ -18,7 +18,6 @@ import type { SprintWorkspaceStory } from '@/stores/sprint-workspace/types'
 import {
  addStoryToSprintAction,
  removeStoryFromSprintAction,
-  reorderSprintStoriesAction,
 } from '@/actions/sprints'
 import { debugProps } from '@/lib/debug'

@ -106,11 +105,6 @@ export function SprintBoardClient({
      handleRemove(activeId)
      return
    }
-
-    // Reorder within sprint
-    if (activeId !== overId && !activeId.startsWith('pb:')) {
-      handleReorder(activeId, overId)
-    }
  }

  function handleAdd(storyId: string, storyData: SprintStory) {
@ -173,35 +167,6 @@ export function SprintBoardClient({
    })
  }

-  function handleReorder(activeId: string, overId: string) {
-    const store = useSprintWorkspaceStore.getState()
-    const order = store.relations.storyIdsBySprint[sprintId] ?? []
-    const prevOrder = [...order]
-    const newOrder = order.includes(overId)
-      ? arrayMove([...order], order.indexOf(activeId), order.indexOf(overId))
-      : [...order.filter(id => id !== activeId), activeId]
-
-    const mutationId = store.applyOptimisticMutation({
-      kind: 'sprint-story-order',
-      sprintId,
-      prevStoryIds: prevOrder,
-    })
-    useSprintWorkspaceStore.setState((s) => {
-      s.relations.storyIdsBySprint[sprintId] = newOrder
-    })
-
-    startTransition(async () => {
-      const result = await reorderSprintStoriesAction(sprintId, newOrder)
-      const st = useSprintWorkspaceStore.getState()
-      if (result.success) {
-        st.settleMutation(mutationId)
-      } else {
-        st.rollbackMutation(mutationId)
-        toast.error('Volgorde opslaan mislukt')
-      }
-    })
-  }
-
  function handleAssigneeChange(storyId: string, assigneeId: string | null, assigneeUsername: string | null) {
    useSprintWorkspaceStore.setState((s) => {
      const story = s.entities.storiesById[storyId]
--- a/components/sprint/task-list.tsx
+++ b/components/sprint/task-list.tsx
@ -1,18 +1,8 @@
 'use client'

-import { useState, useTransition } from 'react'
+import { useTransition } from 'react'
 import { useRouter, usePathname } from 'next/navigation'
-import {
-  DndContext, DragEndEvent, DragOverlay,
-  KeyboardSensor, PointerSensor, useSensor, useSensors, closestCenter,
-} from '@dnd-kit/core'
-import {
-  SortableContext, useSortable, verticalListSortingStrategy, arrayMove,
-  sortableKeyboardCoordinates,
-} from '@dnd-kit/sortable'
-import { CSS } from '@dnd-kit/utilities'
 import { Pencil } from 'lucide-react'
-import { toast } from 'sonner'
 import { useShallow } from 'zustand/react/shallow'
 import { Button } from '@/components/ui/button'
 import { Badge } from '@/components/ui/badge'
@ -25,7 +15,7 @@ import type {
  SprintWorkspaceTask,
  SprintWorkspaceTaskDetail,
 } from '@/stores/sprint-workspace/types'
-import { updateTaskStatusAction, reorderTasksAction } from '@/actions/tasks'
+import { updateTaskStatusAction } from '@/actions/tasks'
 import { DemoTooltip } from '@/components/shared/demo-tooltip'
 import { debugProps } from '@/lib/debug'
 import { cn } from '@/lib/utils'
@ -53,7 +43,6 @@ const STATUS_LABELS: Record<string, string> = {
  EXCLUDED: 'Uitgesloten',
 }

-
 // Behouden voor type-compat met SprintBoardClient props (verdwijnt zodra
 // SprintBoardClient ook geen tasks-prop meer doorgeeft — T-883).
 export interface Task {
@ -75,7 +64,7 @@ interface TaskListProps {
  isDemo: boolean
 }

-function SortableTaskRow({
+function TaskRow({
  task, code, isDemo, onStatusToggle, onEdit,
 }: {
  task: WorkspaceTask
@ -84,11 +73,8 @@ function SortableTaskRow({
  onStatusToggle: () => void
  onEdit: () => void
 }) {
-  const { attributes, listeners, setNodeRef, transform, transition, isDragging } = useSortable({ id: task.id })
-  const style = { transform: CSS.Transform.toString(transform), transition, opacity: isDragging ? 0.4 : 1 }
-
  return (
-    <div ref={setNodeRef} style={style} className="group px-2 py-1">
+    <div className="group px-2 py-1">
      <div
        className={cn(
          'flex items-start gap-2 rounded border border-border px-3 py-2 transition-colors bg-surface-container hover:bg-surface-container-high cursor-pointer',
@ -105,17 +91,6 @@ function SortableTaskRow({
          }
        }}
      >
-        {!isDemo && (
-          <span
-            {...attributes}
-            {...listeners}
-            onClick={(e) => e.stopPropagation()}
-            className="text-muted-foreground cursor-grab active:cursor-grabbing shrink-0 text-sm select-none mt-0.5"
-            aria-hidden="true"
-          >
-            ⠿
-          </span>
-        )}
        <div className="flex-1 min-w-0">
          <div className="flex items-start justify-between gap-2">
            <p className={cn(
@ -162,55 +137,12 @@ export function TaskList({ sprintId: _sprintId, productId: _productId, isDemo }:
  const orderedTasks = useSprintWorkspaceStore(
    useShallow(selectTasksForActiveStory),
  )
-  const [activeDragId, setActiveDragId] = useState<string | null>(null)
  const [, startTransition] = useTransition()
  const router = useRouter()
  const pathname = usePathname()

-  const taskMap: Record<string, WorkspaceTask> = {}
-  for (const t of orderedTasks) taskMap[t.id] = t
-
  const doneCount = orderedTasks.filter(t => t.status === 'DONE').length

-  const sensors = useSensors(
-    useSensor(PointerSensor, { activationConstraint: { distance: 5 } }),
-    useSensor(KeyboardSensor, { coordinateGetter: sortableKeyboardCoordinates }),
-  )
-
-  function handleDragEnd(event: DragEndEvent) {
-    const { active, over } = event
-    if (!storyId) return
-    if (!over || active.id === over.id) return
-    const store = useSprintWorkspaceStore.getState()
-    const prevOrder = [...(store.relations.taskIdsByStory[storyId] ?? [])]
-    const newOrder = arrayMove(
-      [...prevOrder],
-      prevOrder.indexOf(active.id as string),
-      prevOrder.indexOf(over.id as string),
-    )
-
-    const mutationId = store.applyOptimisticMutation({
-      kind: 'sprint-task-order',
-      storyId,
-      prevTaskIds: prevOrder,
-    })
-    useSprintWorkspaceStore.setState((s) => {
-      s.relations.taskIdsByStory[storyId] = newOrder
-    })
-    setActiveDragId(null)
-
-    startTransition(async () => {
-      const result = await reorderTasksAction(storyId, newOrder)
-      const st = useSprintWorkspaceStore.getState()
-      if (result.success) {
-        st.settleMutation(mutationId)
-      } else {
-        st.rollbackMutation(mutationId)
-        toast.error('Volgorde opslaan mislukt')
-      }
-    })
-  }
-
  function handleStatusToggle(task: WorkspaceTask) {
    startTransition(async () => {
      await updateTaskStatusAction(task.id, STATUS_CYCLE[task.status] ?? 'TO_DO')
@ -263,36 +195,18 @@ export function TaskList({ sprintId: _sprintId, productId: _productId, isDemo }:
            </DemoTooltip>
          </div>
        ) : (
-          <DndContext
-            id="task-list"
-            sensors={sensors}
-            collisionDetection={closestCenter}
-            onDragStart={e => setActiveDragId(e.active.id as string)}
-            onDragEnd={handleDragEnd}
-          >
-            <SortableContext items={orderedTasks.map(t => t.id)} strategy={verticalListSortingStrategy}>
-              {orderedTasks.map((task) => (
-                <SortableTaskRow
-                  key={task.id}
-                  task={task}
-                  code={task.code}
-                  isDemo={isDemo}
-                  onStatusToggle={() => handleStatusToggle(task)}
-                  onEdit={() => openEditDialog(task.id)}
-                />
-              ))}
-            </SortableContext>
-            <DragOverlay>
-              {activeDragId && taskMap[activeDragId] && (
-                <div className={cn(
-                  'rounded border border-primary px-3 py-2 bg-surface-container shadow-lg opacity-90 text-sm',
-                  PRIORITY_BORDER[taskMap[activeDragId].priority],
-                )}>
-                  {taskMap[activeDragId].title}
-                </div>
-              )}
-            </DragOverlay>
-          </DndContext>
+          <>
+            {orderedTasks.map((task) => (
+              <TaskRow
+                key={task.id}
+                task={task}
+                code={task.code}
+                isDemo={isDemo}
+                onStatusToggle={() => handleStatusToggle(task)}
+                onEdit={() => openEditDialog(task.id)}
+              />
+            ))}
+          </>
        )}
      </div>
    </div>