mirrors/hermes-agent
1
0
Fork 0
mirror of https://github.com/NousResearch/hermes-agent.git synced 2026-04-25 00:51:20 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

tui updates for rendering pipeline

Browse source
This commit is contained in:
Brooklyn Nicholson 2026-04-07 20:10:33 -05:00
parent dcb97f7465
commit 29f2610e4b
12 changed files with 896 additions and 1030 deletions
Download patch file Download diff file Expand all files Collapse all files

47
ui-tui/src/components/messageLine.tsx
View file

@ -5,47 +5,52 @@ import { LONG_MSG, ROLE } from '../constants.js'
import { hasAnsi, userDisplay } from '../lib/text.js'
import type { Theme } from '../theme.js'
import type { Msg } from '../types.js'
import { Md } from './markdown.js'
export const MessageLine = memo(function MessageLine({ compact, msg, t }: { compact?: boolean; msg: Msg; t: Theme }) {
export const MessageLine = memo(function MessageLine({ cols, compact, msg, t }: { cols: number; compact?: boolean; msg: Msg; t: Theme }) {
const { body, glyph, prefix } = ROLE[msg.role](t)
const contentWidth = Math.max(20, cols - 5)
if (msg.role === 'tool') {
return (
<Text color={t.color.dim} wrap="wrap">
{' '}{msg.text}
</Text>
)
}
const content = (() => {
if (msg.role === 'assistant') {
if (hasAnsi(msg.text)) {
return <Text>{msg.text}</Text>
}
return <Md compact={compact} t={t} text={msg.text} />
}
if (msg.role === 'assistant')
return hasAnsi(msg.text) ? <Text wrap="wrap">{msg.text}</Text> : <Md compact={compact} t={t} text={msg.text} />
if (msg.role === 'user' && msg.text.length > LONG_MSG) {
const displayed = userDisplay(msg.text)
const [head, ...rest] = displayed.split('[long message]')
const [head, ...rest] = userDisplay(msg.text).split('[long message]')
return (
<Text color={body}>
{head}
<Text color={t.color.dim} dimColor>
[long message]
</Text>
<Text color={t.color.dim} dimColor>[long message]</Text>
{rest.join('')}
</Text>
)
}
return <Text color={body}>{msg.text}</Text>
return <Text {...(body ? { color: body } : {})}>{msg.text}</Text>
})()
return (
<Box>
<Box width={3}>
<Text bold={msg.role === 'user'} color={prefix}>
{glyph}{' '}
</Text>
<Box flexDirection="column">
{(msg.role === 'user' || msg.role === 'assistant') && <Text>{' '}</Text>}
<Box>
<Box flexShrink={0} width={3}>
<Text bold={msg.role === 'user'} color={prefix}>{glyph} </Text>
</Box>
<Box width={contentWidth}>
{content}
</Box>
</Box>
{content}
</Box>
)
})