Fix/thread sorted and drag drop (#5046)

Modified the `onDragEnd` handler in `ThreadList.tsx` to use the complete global thread list from the `useThreads` store. This resolves a bug where dragging and dropping threads could lead to items disappearing from "Favorites" or "Recents" sections by ensuring the reordering logic operates on the full dataset.

Additionally, the default `order: 1` initialization for new threads in `useThreads.ts` and `services/threads.ts` has been commented out this make thread sorted by newest to oldest

web-app/src/containers/ThreadList.tsx

@@ -256,7 +256,7 @@ type ThreadListProps = {
   isFavoriteSection?: boolean
 }
 
-function ThreadList({ threads, isFavoriteSection = false }: ThreadListProps) {
+function ThreadList({ threads }: ThreadListProps) {
   const { setThreads } = useThreads()
 
   const sortedThreads = useMemo(() => {
@@ -284,28 +284,20 @@ function ThreadList({ threads, isFavoriteSection = false }: ThreadListProps) {
       collisionDetection={closestCenter}
       onDragEnd={(event) => {
         const { active, over } = event
-        if (active.id !== over?.id) {
+        if (active.id !== over?.id && over) {
-          const oldIndex = threads.findIndex((t) => t.id === active.id)
+          // Access Global State
-          const newIndex = threads.findIndex((t) => t.id === over?.id)
+          const allThreadsMap = useThreads.getState().threads;
+          const allThreadsArray = Object.values(allThreadsMap);
 
-          // Create a new array with the reordered threads from this section only
+          // Calculate Global Indices
-          const reorderedSectionThreads = arrayMove(threads, oldIndex, newIndex)
+          const oldIndexInGlobal = allThreadsArray.findIndex((t) => t.id === active.id);
+          const newIndexInGlobal = allThreadsArray.findIndex((t) => t.id === over.id);
 
-          // Split all threads into favorites and non-favorites
+          // Reorder Globally and Update State
-          const favThreads = sortedThreads.filter((t) => t.isFavorite)
+          if (oldIndexInGlobal !== -1 && newIndexInGlobal !== -1) {
-          const nonFavThreads = sortedThreads.filter((t) => !t.isFavorite)
+            const reorderedGlobalThreads = arrayMove(allThreadsArray, oldIndexInGlobal, newIndexInGlobal);
-
+            setThreads(reorderedGlobalThreads);
-          // Replace the appropriate section with the reordered threads
-          let updatedThreads
-          if (isFavoriteSection) {
-            // If we're in the favorites section, update favorites and keep non-favorites as is
-            updatedThreads = [...reorderedSectionThreads, ...nonFavThreads]
-          } else {
-            // If we're in the non-favorites section, update non-favorites and keep favorites as is
-            updatedThreads = [...favThreads, ...reorderedSectionThreads]
           }
-
-          setThreads(updatedThreads)
         }
       }}
     >

web-app/src/hooks/useThreads.ts

@@ -162,7 +162,7 @@ export const useThreads = create<ThreadState>()(
           id: ulid(),
           title: title ?? 'New Thread',
           model,
-          order: 1,
+          // order: 1,
           updated: Date.now() / 1000,
           assistants: assistant ? [assistant] : [],
         }

web-app/src/services/threads.ts

@@ -57,7 +57,7 @@ export const createThread = async (thread: Thread): Promise<Thread> => {
           },
         ],
         metadata: {
-          order: 1,
+          // order: 1,
         },
       })
       .then((e) => {
@@ -68,7 +68,7 @@ export const createThread = async (thread: Thread): Promise<Thread> => {
             id: e.assistants?.[0]?.model?.id,
             provider: e.assistants?.[0]?.model?.engine,
           },
-          order: 1,
+          // order: 1,
           assistants: e.assistants ?? [defaultAssistant],
         } as Thread
       })