jan/web/helpers/atoms/ChatMessage.atom.ts
Faisal Amir 2394c13065
ui: standalone UIKit and refactor (#557)
* Eslint import order

* Initial Uikit

* Rename file with camelCase

* Remove unused code

* Remove unused code

* Set position traficlight mac

* Grouping Ribbon, Topbar and Bottombar as layout

* Added image brand

* Moving feature toggle into context folder

* Fix active state of setting menu

* Cleanup downloadModel atom helper

* Cleanup useGetConfigureModel

* Added wave animation

* Create useMainViewState intead of import helper atom

* Remove unused code

* Take a back switch ui

* Toggle using switch component

* Add dynamic primary color

* Cleanup import

* Added uikit scroll area

* Add best practice form

* Added toaster container

* Fix loader container

* Add hooks useDownloadState

* Added tooltip on ribbon menu

* Added case user multiple download model

* Adjust input style with bigger ring

* Restyle my model screen

* Replace useStartStop model with useActiveModel

* Import icon using Icon name

* Fix missing login loading start and stop model

* WIP integrate with cmdk

* Move layout search bar on middle of app

* Added function cancel download

* Cleanup model explore

* Cleanup unused code

* Move app version in bototmbar or footer

* WIP chat screen

* WIP chat screen

* Cleanup style and remove unsed code

* Added command for showing downloaded model

* Fix missing keyframe loader dot animation

* Conditional loader of plugin setting

* WIP history list message

* chore: rebase main

* Adding script ui into root package

* Fix different version react hooks form

* Add close toaster

* Added status model active or not on list of command

* Conditional showing info if user don't have a model

* Disabled toolbar chat when user not yet have convo

* chore: fix state

* fix: get resource atom

* Fix conditional bottom bar

* fix: model download state

* Fix font

* Improve icon my model

* Add toaster delete chat

* Remove test classname

* Fix scroll chat body

* Fix scrolling chat body

* chore: add message update

* Add uikit into depedencies on root package

* Update chat flow

* Fix hot reload ui changes

* Increate background color chat screen light mode

* Added visual conversation active state

* Added build:uikit on gh actions

* chore: attempt to fix CI

* fix: deps

* fix: tests

* chore: attempt to fix CI

---------

Co-authored-by: Louis <louis@jan.ai>
2023-11-07 21:27:11 +07:00

138 lines
3.7 KiB
TypeScript

import { atom } from 'jotai'
import { getActiveConvoIdAtom } from './Conversation.atom'
/**
* Stores all chat messages for all conversations
*/
export const chatMessages = atom<Record<string, ChatMessage[]>>({})
/**
* Return the chat messages for the current active conversation
*/
export const getCurrentChatMessagesAtom = atom<ChatMessage[]>((get) => {
const activeConversationId = get(getActiveConvoIdAtom)
if (!activeConversationId) return []
const messages = get(chatMessages)[activeConversationId]
return messages ?? []
})
export const setCurrentChatMessagesAtom = atom(
null,
(get, set, messages: ChatMessage[]) => {
const currentConvoId = get(getActiveConvoIdAtom)
if (!currentConvoId) return
const newData: Record<string, ChatMessage[]> = {
...get(chatMessages),
}
newData[currentConvoId] = messages
set(chatMessages, newData)
}
)
export const setConvoMessagesAtom = atom(
null,
(get, set, messages: ChatMessage[], convoId: string) => {
const newData: Record<string, ChatMessage[]> = {
...get(chatMessages),
}
newData[convoId] = messages
set(chatMessages, newData)
}
)
/**
* Used for pagination. Add old messages to the current conversation
*/
export const addOldMessagesAtom = atom(
null,
(get, set, newMessages: ChatMessage[]) => {
const currentConvoId = get(getActiveConvoIdAtom)
if (!currentConvoId) return
const currentMessages = get(chatMessages)[currentConvoId] ?? []
const updatedMessages = [...currentMessages, ...newMessages]
const newData: Record<string, ChatMessage[]> = {
...get(chatMessages),
}
newData[currentConvoId] = updatedMessages
set(chatMessages, newData)
}
)
export const addNewMessageAtom = atom(
null,
(get, set, newMessage: ChatMessage) => {
const currentConvoId = get(getActiveConvoIdAtom)
if (!currentConvoId) return
const currentMessages = get(chatMessages)[currentConvoId] ?? []
const updatedMessages = [newMessage, ...currentMessages]
const newData: Record<string, ChatMessage[]> = {
...get(chatMessages),
}
newData[currentConvoId] = updatedMessages
set(chatMessages, newData)
}
)
export const deleteConversationMessage = atom(null, (get, set, id: string) => {
const newData: Record<string, ChatMessage[]> = {
...get(chatMessages),
}
newData[id] = []
set(chatMessages, newData)
})
export const updateMessageAtom = atom(
null,
(get, set, id: string, conversationId: string, text: string) => {
const messages = get(chatMessages)[conversationId] ?? []
const message = messages.find((e) => e.id === id)
if (message) {
message.text = text
const updatedMessages = [...messages]
const newData: Record<string, ChatMessage[]> = {
...get(chatMessages),
}
newData[conversationId] = updatedMessages
set(chatMessages, newData)
}
}
)
/**
* For updating the status of the last AI message that is pending
*/
export const updateLastMessageAsReadyAtom = atom(
null,
(get, set, id, text: string) => {
const currentConvoId = get(getActiveConvoIdAtom)
if (!currentConvoId) return
const currentMessages = get(chatMessages)[currentConvoId] ?? []
const messageToUpdate = currentMessages.find((e) => e.id === id)
// if message is not found, do nothing
if (!messageToUpdate) return
const index = currentMessages.indexOf(messageToUpdate)
const updatedMsg: ChatMessage = {
...messageToUpdate,
status: MessageStatus.Ready,
text: text,
}
currentMessages[index] = updatedMsg
const newData: Record<string, ChatMessage[]> = {
...get(chatMessages),
}
newData[currentConvoId] = currentMessages
set(chatMessages, newData)
}
)