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

This commit is contained in:
Sam Hoang Van 2025-06-18 00:23:53 +07:00 committed by GitHub
parent 3f07358125
commit 1160ea140b
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 3 additions and 76 deletions

View File

@ -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
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)
}
}
}}
>
<DndContext sensors={sensors} collisionDetection={closestCenter}>
<SortableContext
items={sortedThreads.map((t) => t.id)}
strategy={verticalListSortingStrategy}

View File

@ -32,11 +32,9 @@ export const useThreads = create<ThreadState>()((set, get) => ({
threads: {},
searchIndex: null,
setThreads: (threads) => {
threads.forEach((thread, index) => {
thread.order = index + 1
threads.forEach((thread) => {
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