fix: reduce unnessary rerender due to current thread retrieval

This commit is contained in:
Louis 2025-09-18 17:54:22 +07:00
parent 2a2bc40dfe
commit 6342956cd6
3 changed files with 46 additions and 33 deletions

View File

@ -117,9 +117,11 @@ export const useAssistant = create<AssistantState>((set, get) => ({
}
},
setCurrentAssistant: (assistant, saveToStorage = true) => {
set({ currentAssistant: assistant })
if (saveToStorage) {
setLastUsedAssistantId(assistant.id)
if (assistant !== get().currentAssistant) {
set({ currentAssistant: assistant })
if (saveToStorage) {
setLastUsedAssistantId(assistant.id)
}
}
},
setAssistants: (assistants) => {

View File

@ -46,7 +46,10 @@ export const useThreads = create<ThreadState>()((set, get) => ({
id:
thread.model.provider === 'llama.cpp' ||
thread.model.provider === 'llamacpp'
? thread.model?.id.split(':').slice(0, 2).join(getServiceHub().path().sep())
? thread.model?.id
.split(':')
.slice(0, 2)
.join(getServiceHub().path().sep())
: thread.model?.id,
}
: undefined,
@ -94,10 +97,12 @@ export const useThreads = create<ThreadState>()((set, get) => ({
},
toggleFavorite: (threadId) => {
set((state) => {
getServiceHub().threads().updateThread({
...state.threads[threadId],
isFavorite: !state.threads[threadId].isFavorite,
})
getServiceHub()
.threads()
.updateThread({
...state.threads[threadId],
isFavorite: !state.threads[threadId].isFavorite,
})
return {
threads: {
...state.threads,
@ -168,7 +173,9 @@ export const useThreads = create<ThreadState>()((set, get) => ({
{} as Record<string, Thread>
)
Object.values(updatedThreads).forEach((thread) => {
getServiceHub().threads().updateThread({ ...thread, isFavorite: false })
getServiceHub()
.threads()
.updateThread({ ...thread, isFavorite: false })
})
return { threads: updatedThreads }
})
@ -180,7 +187,7 @@ export const useThreads = create<ThreadState>()((set, get) => ({
return get().threads[threadId]
},
setCurrentThreadId: (threadId) => {
set({ currentThreadId: threadId })
if (threadId !== get().currentThreadId) set({ currentThreadId: threadId })
},
createThread: async (model, title, assistant) => {
const newThread: Thread = {
@ -190,33 +197,38 @@ export const useThreads = create<ThreadState>()((set, get) => ({
updated: Date.now() / 1000,
assistants: assistant ? [assistant] : [],
}
return await getServiceHub().threads().createThread(newThread).then((createdThread) => {
set((state) => {
// Get all existing threads as an array
const existingThreads = Object.values(state.threads)
return await getServiceHub()
.threads()
.createThread(newThread)
.then((createdThread) => {
set((state) => {
// Get all existing threads as an array
const existingThreads = Object.values(state.threads)
// Create new array with the new thread at the beginning
const reorderedThreads = [createdThread, ...existingThreads]
// Create new array with the new thread at the beginning
const reorderedThreads = [createdThread, ...existingThreads]
// Use setThreads to handle proper ordering (this will assign order 1, 2, 3...)
get().setThreads(reorderedThreads)
// Use setThreads to handle proper ordering (this will assign order 1, 2, 3...)
get().setThreads(reorderedThreads)
return {
currentThreadId: createdThread.id,
}
return {
currentThreadId: createdThread.id,
}
})
return createdThread
})
return createdThread
})
},
updateCurrentThreadAssistant: (assistant) => {
set((state) => {
if (!state.currentThreadId) return { ...state }
const currentThread = state.getCurrentThread()
if (currentThread)
getServiceHub().threads().updateThread({
...currentThread,
assistants: [{ ...assistant, model: currentThread.model }],
})
getServiceHub()
.threads()
.updateThread({
...currentThread,
assistants: [{ ...assistant, model: currentThread.model }],
})
return {
threads: {
...state.threads,
@ -233,7 +245,10 @@ export const useThreads = create<ThreadState>()((set, get) => ({
set((state) => {
if (!state.currentThreadId) return { ...state }
const currentThread = state.getCurrentThread()
if (currentThread) getServiceHub().threads().updateThread({ ...currentThread, model })
if (currentThread)
getServiceHub()
.threads()
.updateThread({ ...currentThread, model })
return {
threads: {
...state.threads,

View File

@ -30,7 +30,6 @@ function ThreadDetail() {
const serviceHub = useServiceHub()
const { threadId } = useParams({ from: Route.id })
const setCurrentThreadId = useThreads((state) => state.setCurrentThreadId)
const currentThreadId = useThreads((state) => state.currentThreadId)
const setCurrentAssistant = useAssistant((state) => state.setCurrentAssistant)
const assistants = useAssistant((state) => state.assistants)
const setMessages = useMessages((state) => state.setMessages)
@ -49,16 +48,13 @@ function ThreadDetail() {
const scrollContainerRef = useRef<HTMLDivElement>(null)
useEffect(() => {
if (currentThreadId !== threadId) {
setCurrentThreadId(threadId)
const assistant = assistants.find(
(assistant) => assistant.id === thread?.assistants?.[0]?.id
)
if (assistant) setCurrentAssistant(assistant)
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [threadId, currentThreadId, assistants])
}, [threadId, assistants])
useEffect(() => {
serviceHub