ton/pi_harness
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add ToolRenderResult interface for custom tool rendering

Browse Source 
- Changed ToolRenderer return type from TemplateResult to ToolRenderResult
- ToolRenderResult = { content: TemplateResult, isCustom: boolean }
- isCustom: true = no card wrapper, false = wrap in card
- Updated all existing tool renderers to return new format
- Updated Messages.ts to handle custom rendering

This enables tools to render without default card chrome when needed.
This commit is contained in:
Mario Zechner
2025-10-11 04:40:42 +02:00
parent 3db2a6fe2c
commit b129154cc8
23 changed files with 423 additions and 180 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/web-ui/src/tools/renderers/GetCurrentTimeRenderer.ts
+35 -20
View File
@@ -1,9 +1,9 @@
import { html, type TemplateResult } from "@mariozechner/mini-lit";
import { html } from "@mariozechner/mini-lit";
import type { ToolResultMessage } from "@mariozechner/pi-ai";
import { Clock } from "lucide";
import { i18n } from "../../utils/i18n.js";
import { renderHeader } from "../renderer-registry.js";
import type { ToolRenderer } from "../types.js";
import type { ToolRenderer, ToolRenderResult } from "../types.js";
interface GetCurrentTimeParams {
timezone?: string;
@@ -11,7 +11,10 @@ interface GetCurrentTimeParams {
// GetCurrentTime tool has undefined details (only uses output)
export class GetCurrentTimeRenderer implements ToolRenderer<GetCurrentTimeParams, undefined> {
render(params: GetCurrentTimeParams | undefined, result: ToolResultMessage<undefined> | undefined): TemplateResult {
render(
params: GetCurrentTimeParams | undefined,
result: ToolResultMessage<undefined> | undefined,
): ToolRenderResult {
const state = result ? (result.isError ? "error" : "complete") : "inprogress";
// Full params + full result
@@ -23,16 +26,19 @@ export class GetCurrentTimeRenderer implements ToolRenderer<GetCurrentTimeParams
// Error: show header, error below
if (result.isError) {
return html`
<div class="space-y-3">
${renderHeader(state, Clock, headerText)}
<div class="text-sm text-destructive">${output}</div>
</div>
`;
return {
content: html`
<div class="space-y-3">
${renderHeader(state, Clock, headerText)}
<div class="text-sm text-destructive">${output}</div>
</div>
`,
isCustom: false,
};
}
// Success: show time in header
return renderHeader(state, Clock, `${headerText}: ${output}`);
return { content: renderHeader(state, Clock, `${headerText}: ${output}`), isCustom: false };
}
// Full result, no params
@@ -41,29 +47,38 @@ export class GetCurrentTimeRenderer implements ToolRenderer<GetCurrentTimeParams
// Error: show header, error below
if (result.isError) {
return html`
<div class="space-y-3">
${renderHeader(state, Clock, i18n("Getting current date and time"))}
<div class="text-sm text-destructive">${output}</div>
</div>
`;
return {
content: html`
<div class="space-y-3">
${renderHeader(state, Clock, i18n("Getting current date and time"))}
<div class="text-sm text-destructive">${output}</div>
</div>
`,
isCustom: false,
};
}
// Success: show time in header
return renderHeader(state, Clock, `${i18n("Getting current date and time")}: ${output}`);
return {
content: renderHeader(state, Clock, `${i18n("Getting current date and time")}: ${output}`),
isCustom: false,
};
}
// Full params, no result: show timezone info in header
if (params?.timezone) {
return renderHeader(state, Clock, `${i18n("Getting current time in")} ${params.timezone}`);
return {
content: renderHeader(state, Clock, `${i18n("Getting current time in")} ${params.timezone}`),
isCustom: false,
};
}
// Partial params (no timezone) or empty params, no result
if (params) {
return renderHeader(state, Clock, i18n("Getting current date and time"));
return { content: renderHeader(state, Clock, i18n("Getting current date and time")), isCustom: false };
}
// No params, no result
return renderHeader(state, Clock, i18n("Getting time..."));
return { content: renderHeader(state, Clock, i18n("Getting time...")), isCustom: false };
}
}