jan/web/helpers/atoms/ChatMessage.atom.ts
Faisal Amir 424b00338e
feat: revamp thread screen (#802)
* Make thread screen as default screen

* Blank state when user have not any model

* Cleanup topbar thread screen

* Improve style right panel

* Add instructions right panel

* Styling thread list history

* Resolve conflict

* Default title new thread

* Fix trigger panel sidebar

* Make default right panel false when no activethread

* Fix CI test

* chore: assistant instruction with system prompt

* Fix title and blank state explore the hub

* Claenup style thread screen and add buble message for assitant

* Remove unused import

* Styling more menus on thread list and right panel, and make max height textarea 400 pixel

* Finished revamp ui thread

* Finished system monitor UI

* Style box running models

* Make animate right panel more smooth

* Add status arround textarea for starting model info

* Temporary disable hide left panel

* chore: system resource monitoring update

* copy nits

* chore: typo

* Reverse icon chevron accordion

* Move my models into setting page

---------

Co-authored-by: Louis <louis@jan.ai>
Co-authored-by: 0xSage <n@pragmatic.vc>
2023-12-04 10:55:47 +07:00

133 lines
3.5 KiB
TypeScript

import {
ChatCompletionRole,
MessageStatus,
ThreadContent,
ThreadMessage,
} from '@janhq/core'
import { atom } from 'jotai'
import {
getActiveThreadIdAtom,
updateThreadStateLastMessageAtom,
} from './Conversation.atom'
/**
* Stores all chat messages for all threads
*/
export const chatMessages = atom<Record<string, ThreadMessage[]>>({})
/**
* Return the chat messages for the current active conversation
*/
export const getCurrentChatMessagesAtom = atom<ThreadMessage[]>((get) => {
const activeThreadId = get(getActiveThreadIdAtom)
if (!activeThreadId) return []
const messages = get(chatMessages)[activeThreadId]
return messages ?? []
})
export const setConvoMessagesAtom = atom(
null,
(get, set, threadId: string, messages: ThreadMessage[]) => {
const newData: Record<string, ThreadMessage[]> = {
...get(chatMessages),
}
newData[threadId] = messages
set(chatMessages, newData)
}
)
/**
* Used for pagination. Add old messages to the current conversation
*/
export const addOldMessagesAtom = atom(
null,
(get, set, newMessages: ThreadMessage[]) => {
const currentConvoId = get(getActiveThreadIdAtom)
if (!currentConvoId) return
const currentMessages = get(chatMessages)[currentConvoId] ?? []
const updatedMessages = [...currentMessages, ...newMessages]
const newData: Record<string, ThreadMessage[]> = {
...get(chatMessages),
}
newData[currentConvoId] = updatedMessages
set(chatMessages, newData)
}
)
export const addNewMessageAtom = atom(
null,
(get, set, newMessage: ThreadMessage) => {
const threadId = get(getActiveThreadIdAtom)
if (!threadId) return
const currentMessages = get(chatMessages)[threadId] ?? []
const updatedMessages = [...currentMessages, newMessage]
const newData: Record<string, ThreadMessage[]> = {
...get(chatMessages),
}
newData[threadId] = updatedMessages
set(chatMessages, newData)
// Update thread last message
set(updateThreadStateLastMessageAtom, threadId, newMessage.content)
}
)
export const deleteConversationMessage = atom(null, (get, set, id: string) => {
const newData: Record<string, ThreadMessage[]> = {
...get(chatMessages),
}
newData[id] = []
set(chatMessages, newData)
})
export const cleanConversationMessages = atom(null, (get, set, id: string) => {
const newData: Record<string, ThreadMessage[]> = {
...get(chatMessages),
}
newData[id] = newData[id]?.filter((e) => e.role === ChatCompletionRole.System)
set(chatMessages, newData)
})
export const deleteMessageAtom = atom(null, (get, set, id: string) => {
const newData: Record<string, ThreadMessage[]> = {
...get(chatMessages),
}
const threadId = get(getActiveThreadIdAtom)
if (threadId) {
newData[threadId] = newData[threadId].filter((e) => e.id !== id)
set(chatMessages, newData)
}
})
export const updateMessageAtom = atom(
null,
(
get,
set,
id: string,
conversationId: string,
text: ThreadContent[],
status: MessageStatus
) => {
const messages = get(chatMessages)[conversationId] ?? []
const message = messages.find((e) => e.id === id)
if (message) {
message.content = text
message.status = status
const updatedMessages = [...messages]
const newData: Record<string, ThreadMessage[]> = {
...get(chatMessages),
}
newData[conversationId] = updatedMessages
set(chatMessages, newData)
// Update thread last message
set(updateThreadStateLastMessageAtom, conversationId, text)
}
}
)