96dba2690d
chore: add facades refactor: core module export refactor: inference plugin - deprecate function registering (#537) * refactor: revamp inference plugin as class - deprecate function registering * refactor: monitoring plugin - deprecate service registering (#538) refactor: revamp inference plugin as class - deprecate function registering chore: update import refactor: plugin revamp - model management chore: update build steps and remove experimental plugins refactor: remove pluggable electron chore: add sorting for conversations chore: build plugins for testing chore: consistent plugin directory name chore: docs chore: fix CI chore: update conversation prefix
96 lines
2.6 KiB
TypeScript
96 lines
2.6 KiB
TypeScript
import React from 'react'
|
|
import { useAtomValue, useSetAtom } from 'jotai'
|
|
import {
|
|
getActiveConvoIdAtom,
|
|
setActiveConvoIdAtom,
|
|
} from '@helpers/atoms/Conversation.atom'
|
|
import {
|
|
setMainViewStateAtom,
|
|
MainViewState,
|
|
} from '@helpers/atoms/MainView.atom'
|
|
import { displayDate } from '@utils/datetime'
|
|
import { twMerge } from 'tailwind-merge'
|
|
import { activeModelAtom } from '@helpers/atoms/Model.atom'
|
|
import useStartStopModel from '@hooks/useStartStopModel'
|
|
import { downloadedModelAtom } from '@helpers/atoms/DownloadedModel.atom'
|
|
|
|
type Props = {
|
|
conversation: Conversation
|
|
name: string
|
|
summary?: string
|
|
updatedAt?: string
|
|
}
|
|
|
|
const HistoryItem: React.FC<Props> = ({
|
|
conversation,
|
|
name,
|
|
summary,
|
|
updatedAt,
|
|
}) => {
|
|
const activeConvoId = useAtomValue(getActiveConvoIdAtom)
|
|
const isSelected = activeConvoId === conversation._id
|
|
const activeModel = useAtomValue(activeModelAtom)
|
|
const { startModel } = useStartStopModel()
|
|
|
|
const setMainViewState = useSetAtom(setMainViewStateAtom)
|
|
const setActiveConvoId = useSetAtom(setActiveConvoIdAtom)
|
|
const models = useAtomValue(downloadedModelAtom)
|
|
|
|
const onClick = async () => {
|
|
if (conversation.modelId == null) {
|
|
console.debug('modelId is undefined')
|
|
return
|
|
}
|
|
|
|
const model = models.find((e) => e._id === conversation.modelId)
|
|
if (model != null) {
|
|
if (activeModel == null) {
|
|
// if there's no active model, we simply load conversation's model
|
|
startModel(model._id)
|
|
} else if (activeModel._id !== model._id) {
|
|
// display confirmation modal
|
|
// TODO: temporarily disabled
|
|
// setConfirmationModalProps({
|
|
// replacingModel: model,
|
|
// })
|
|
}
|
|
}
|
|
|
|
if (activeConvoId !== conversation._id) {
|
|
setMainViewState(MainViewState.Conversation)
|
|
setActiveConvoId(conversation._id)
|
|
}
|
|
}
|
|
|
|
const backgroundColor = isSelected ? 'bg-background/80' : 'bg-background/20'
|
|
const description = conversation?.lastMessage ?? 'No new message'
|
|
|
|
return (
|
|
<li
|
|
role="button"
|
|
className={twMerge(
|
|
'flex flex-row rounded-md border border-border p-3',
|
|
backgroundColor
|
|
)}
|
|
onClick={onClick}
|
|
>
|
|
<div className="flex flex-1 flex-col">
|
|
{/* title */}
|
|
|
|
<span className="mb-1 line-clamp-1 leading-5 text-muted-foreground">
|
|
{updatedAt && displayDate(new Date(updatedAt).getTime())}
|
|
</span>
|
|
|
|
<span className="line-clamp-1">{summary ?? name}</span>
|
|
|
|
{/* description */}
|
|
<span className="mt-1 line-clamp-2 text-muted-foreground">
|
|
{description}
|
|
</span>
|
|
</div>
|
|
</li>
|
|
)
|
|
}
|
|
|
|
export default HistoryItem
|