🐛 fix: disable sorting for threads in SortableItem and clean up thread order handling (#5326)

web-app/src/containers/ThreadList.tsx

@@ -9,7 +9,6 @@ import {
 import {
   SortableContext,
   verticalListSortingStrategy,
-  arrayMove,
   useSortable,
 } from '@dnd-kit/sortable'
 import { CSS } from '@dnd-kit/utilities'
@@ -54,7 +53,7 @@ const SortableItem = memo(({ thread }: { thread: Thread }) => {
     transform,
     transition,
     isDragging,
-  } = useSortable({ id: thread.id })
+  } = useSortable({ id: thread.id, disabled: true })
 
   const style = {
     transform: CSS.Transform.toString(transform),
@@ -263,18 +262,8 @@ type ThreadListProps = {
 }
 
 function ThreadList({ threads }: ThreadListProps) {
-  const { setThreads } = useThreads()
-
   const sortedThreads = useMemo(() => {
     return threads.sort((a, b) => {
-      // If both have order, sort by order (ascending, so lower order comes first)
-      if (a.order != null && b.order != null) {
-        return a.order - b.order
-      }
-      // If only one has order, prioritize the one with order (order comes first)
-      if (a.order != null) return -1
-      if (b.order != null) return 1
-      // If neither has order, sort by updated time (newer threads first)
       return (b.updated || 0) - (a.updated || 0)
     })
   }, [threads])
@@ -290,36 +279,7 @@ function ThreadList({ threads }: ThreadListProps) {
   )
 
   return (
-    <DndContext
+    <DndContext sensors={sensors} collisionDetection={closestCenter}>
-      sensors={sensors}
-      collisionDetection={closestCenter}
-      onDragEnd={(event) => {
-        const { active, over } = event
-        if (active.id !== over?.id && over) {
-          // Access Global State
-          const allThreadsMap = useThreads.getState().threads
-          const allThreadsArray = Object.values(allThreadsMap)
-
-          // Calculate Global Indices
-          const oldIndexInGlobal = allThreadsArray.findIndex(
-            (t) => t.id === active.id
-          )
-          const newIndexInGlobal = allThreadsArray.findIndex(
-            (t) => t.id === over.id
-          )
-
-          // Reorder Globally and Update State
-          if (oldIndexInGlobal !== -1 && newIndexInGlobal !== -1) {
-            const reorderedGlobalThreads = arrayMove(
-              allThreadsArray,
-              oldIndexInGlobal,
-              newIndexInGlobal
-            )
-            setThreads(reorderedGlobalThreads)
-          }
-        }
-      }}
-    >
       <SortableContext
         items={sortedThreads.map((t) => t.id)}
         strategy={verticalListSortingStrategy}

web-app/src/hooks/useThreads.ts

@@ -32,11 +32,9 @@ export const useThreads = create<ThreadState>()((set, get) => ({
   threads: {},
   searchIndex: null,
   setThreads: (threads) => {
-    threads.forEach((thread, index) => {
+    threads.forEach((thread) => {
-      thread.order = index + 1
       updateThread({
         ...thread,
-        order: index + 1,
       })
     })
     const threadMap = threads.reduce(
@@ -159,7 +157,6 @@ export const useThreads = create<ThreadState>()((set, get) => ({
       id: ulid(),
       title: title ?? 'New Thread',
       model,
-      // order: 1, // Will be set properly by setThreads
       updated: Date.now() / 1000,
       assistants: assistant ? [assistant] : [],
     }
@@ -244,44 +241,14 @@ export const useThreads = create<ThreadState>()((set, get) => ({
       const thread = state.threads[threadId]
       if (!thread) return state
 
-      // If the thread is already at order 1, just update the timestamp
-      if (thread.order === 1) {
-        const updatedThread = {
-          ...thread,
-          updated: Date.now() / 1000,
-        }
-        updateThread(updatedThread)
-
-        return {
-          threads: {
-            ...state.threads,
-            [threadId]: updatedThread,
-          },
-        }
-      }
-
       // Update the thread with new timestamp and set it to order 1 (top)
       const updatedThread = {
         ...thread,
         updated: Date.now() / 1000,
-        order: 1,
       }
 
       // Update all other threads to increment their order by 1
       const updatedThreads = { ...state.threads }
-      Object.keys(updatedThreads).forEach((id) => {
-        if (id !== threadId) {
-          const otherThread = updatedThreads[id]
-          updatedThreads[id] = {
-            ...otherThread,
-            order: (otherThread.order || 1) + 1,
-          }
-          // Update the backend for other threads
-          updateThread(updatedThreads[id])
-        }
-      })
-
-      // Set the updated thread
       updatedThreads[threadId] = updatedThread
 
       // Update the backend for the main thread