From 4b77548eb9fdd0d84bf5704ab58408ce0cde5384 Mon Sep 17 00:00:00 2001
From: Sam Hoang Van <samhv.ict@gmail.com>
Date: Wed, 21 May 2025 12:42:29 +0700
Subject: [PATCH] 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 | 32 ++++++++++-----------------
 web-app/src/hooks/useThreads.ts       |  2 +-
 web-app/src/services/threads.ts       |  4 ++--
 3 files changed, 15 insertions(+), 23 deletions(-)

diff --git a/web-app/src/containers/ThreadList.tsx b/web-app/src/containers/ThreadList.tsx
index 4a4492ff2..56dc61294 100644
--- a/web-app/src/containers/ThreadList.tsx
+++ b/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) {
-          const oldIndex = threads.findIndex((t) => t.id === active.id)
-          const newIndex = threads.findIndex((t) => t.id === over?.id)
+        if (active.id !== over?.id && over) {
+          // Access Global State
+          const allThreadsMap = useThreads.getState().threads;
+          const allThreadsArray = Object.values(allThreadsMap);
 
-          // Create a new array with the reordered threads from this section only
-          const reorderedSectionThreads = arrayMove(threads, oldIndex, newIndex)
+          // Calculate Global Indices
+          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
-          const favThreads = sortedThreads.filter((t) => t.isFavorite)
-          const nonFavThreads = sortedThreads.filter((t) => !t.isFavorite)
-
-          // 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]
+          // Reorder Globally and Update State
+          if (oldIndexInGlobal !== -1 && newIndexInGlobal !== -1) {
+            const reorderedGlobalThreads = arrayMove(allThreadsArray, oldIndexInGlobal, newIndexInGlobal);
+            setThreads(reorderedGlobalThreads);
           }
-
-          setThreads(updatedThreads)
         }
       }}
     >
diff --git a/web-app/src/hooks/useThreads.ts b/web-app/src/hooks/useThreads.ts
index a88f3ce4d..dbc979596 100644
--- a/web-app/src/hooks/useThreads.ts
+++ b/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] : [],
         }
diff --git a/web-app/src/services/threads.ts b/web-app/src/services/threads.ts
index 4b26779ce..e50692b2d 100644
--- a/web-app/src/services/threads.ts
+++ b/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
       })