36 lines
1.1 KiB
TypeScript
36 lines
1.1 KiB
TypeScript
import { Show } from 'solid-js'
|
|
import StreamableText from '../StreamableText'
|
|
import type { Accessor } from 'solid-js'
|
|
import type { MessageInstance } from '@/types/message'
|
|
|
|
interface Props {
|
|
// conversationId: string
|
|
messages: Accessor<MessageInstance[]>
|
|
// fetching: boolean
|
|
}
|
|
|
|
export default (props: Props) => {
|
|
const messageInput = () => props.messages().length > 0 ? props.messages()[0] : null
|
|
const messageOutput = () => props.messages().length > 1 ? props.messages()[1] : null
|
|
return (
|
|
<div class="flex flex-col h-full">
|
|
<div class="min-h-16 max-h-40 fi px-6 py-4 border-b border-base break-words overflow-y-scroll">
|
|
<StreamableText
|
|
class="w-full"
|
|
text={messageInput()?.content || ''}
|
|
/>
|
|
</div>
|
|
<div class="flex-1 fcc overflow-y-auto px-6">
|
|
<Show when={messageOutput()?.content}>
|
|
<img
|
|
class="w-full max-w-[400px] aspect-1"
|
|
src={messageOutput()?.content}
|
|
alt={messageInput()?.content || ''}
|
|
onError={e => e.currentTarget.classList.add('hidden')}
|
|
/>
|
|
</Show>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|