improve model footer

This commit is contained in:
Dax Raad 2025-11-22 12:53:08 -05:00
parent c96923d2c9
commit 78a6325b64
2 changed files with 37 additions and 8 deletions

View file

@ -860,6 +860,11 @@ export function Session() {
</Match>
<Match when={message.role === "assistant"}>
<AssistantMessage
user={
messages().findLast(
(item) => item.id === (message as AssistantMessage).parentID,
) as UserMessage
}
last={lastAssistant()?.id === message.id}
message={message as AssistantMessage}
parts={sync.data.part[message.id] ?? []}
@ -993,7 +998,7 @@ function UserMessage(props: {
)
}
function AssistantMessage(props: { message: AssistantMessage; parts: Part[]; last: boolean }) {
function AssistantMessage(props: { message: AssistantMessage; parts: Part[]; last: boolean; user: UserMessage }) {
const local = useLocal()
const { theme } = useTheme()
const ctx = use()
@ -1038,13 +1043,15 @@ function AssistantMessage(props: { message: AssistantMessage; parts: Part[]; las
>
<box paddingLeft={3}>
<text marginTop={1}>
<span style={{ fg: local.agent.color(props.message.mode) }}>{Locale.titlecase(props.message.mode)}</span>{" "}
<span style={{ fg: theme.textMuted }}>
{props.message.modelID}
{ctx.showTimestamps() &&
props.message.time.completed &&
` · ${Locale.todayTimeOrDateTime(props.message.time.completed)}`}
</span>
<span style={{ fg: local.agent.color(props.message.mode) }}></span>{" "}
<span style={{ fg: theme.text }}>{Locale.titlecase(props.message.mode)}</span>{" "}
<span style={{ fg: theme.textMuted }}>{props.message.modelID}</span>
<Show when={props.message.time.completed}>
<span style={{ fg: theme.textMuted }}>
{" "}
{Locale.duration(props.message.time.completed! - props.user.time.created)}
</span>
</Show>
</text>
</box>
</Match>

View file

@ -37,6 +37,28 @@ export namespace Locale {
return num.toString()
}
export function duration(input: number) {
if (input < 1000) {
return `${input}ms`
}
if (input < 60000) {
return `${(input / 1000).toFixed(1)}s`
}
if (input < 3600000) {
const minutes = Math.floor(input / 60000)
const seconds = Math.floor((input % 60000) / 1000)
return `${minutes}m ${seconds}s`
}
if (input < 86400000) {
const hours = Math.floor(input / 3600000)
const minutes = Math.floor((input % 3600000) / 60000)
return `${hours}h ${minutes}m`
}
const hours = Math.floor(input / 3600000)
const days = Math.floor((input % 3600000) / 86400000)
return `${days}d ${hours}h`
}
export function truncate(str: string, len: number): string {
if (str.length <= len) return str
return str.slice(0, len - 1) + "…"