dodo: implement dodo_get_project_config
Change-Id: I8167f83d776d43d97c5b2a744524f88e517c2107
diff --git a/webui/src/web-components/sketch-tool-calls.ts b/webui/src/web-components/sketch-tool-calls.ts
index 2d25953..4b78d7b 100644
--- a/webui/src/web-components/sketch-tool-calls.ts
+++ b/webui/src/web-components/sketch-tool-calls.ts
@@ -11,6 +11,7 @@
import "./sketch-tool-card-read-image";
import "./sketch-tool-card-browser-recent-console-logs";
import "./sketch-tool-card-browser-clear-console-logs";
+import "./sketch-tool-card-dodo-get-project-config";
@customElement("sketch-tool-calls")
export class SketchToolCalls extends SketchTailwindElement {
@@ -107,6 +108,11 @@
.open=${open}
.toolCall=${toolCall}
></sketch-tool-card-browser-clear-console-logs>`;
+ case "dodo_get_project_config":
+ return html`<sketch-tool-card-dodo-get-project-config
+ .open=${open}
+ .toolCall=${toolCall}
+ ></sketch-tool-card-dodo>`;
}
return html`<sketch-tool-card-generic
.open=${open}
diff --git a/webui/src/web-components/sketch-tool-card-dodo-get-project-config.ts b/webui/src/web-components/sketch-tool-card-dodo-get-project-config.ts
new file mode 100644
index 0000000..23df1b3
--- /dev/null
+++ b/webui/src/web-components/sketch-tool-card-dodo-get-project-config.ts
@@ -0,0 +1,85 @@
+import { css, html, LitElement } from "lit";
+import { customElement, property } from "lit/decorators.js";
+import { ToolCall } from "../types";
+
+type DodoOutput = {
+ config: string;
+};
+
+@customElement("sketch-tool-card-dodo-get-project-config")
+export class SketchToolCardDodoGetProjectConfig extends LitElement {
+ @property()
+ toolCall: ToolCall;
+
+ @property()
+ open: boolean;
+
+ static styles = css`
+ .summary-text {
+ font-family: monospace;
+ color: #444;
+ word-break: break-all;
+ }
+
+ .selector-input {
+ font-family: monospace;
+ background: rgba(0, 0, 0, 0.05);
+ padding: 4px 8px;
+ border-radius: 4px;
+ display: inline-block;
+ word-break: break-all;
+ }
+ `;
+
+ render() {
+ // Parse the input to get selector
+ console.log(this.toolCall);
+ let apiBaseAddress = "";
+ let projectId = "";
+ try {
+ if (this.toolCall?.input) {
+ const inp = JSON.parse(this.toolCall.input);
+ apiBaseAddress = inp.apiBaseAddress || "";
+ projectId = inp.projectId || "";
+ }
+ } catch (e) {
+ console.error("Error parsing dodo input:", e);
+ }
+
+ let output: DodoOutput | null = null;
+ try {
+ if (this.toolCall?.result_message?.tool_result) {
+ output = JSON.parse(this.toolCall.result_message.tool_result);
+ }
+ } catch (e) {
+ console.error("Error parsing dodo output:", e);
+ }
+
+ if (output == null) {
+ throw new Error("No output from dodo tool call");
+ }
+
+ return html`
+ <sketch-tool-card .open=${this.open} .toolCall=${this.toolCall}>
+ <span slot="summary" class="summary-text"> 🖱️ ${projectId} </span>
+ <div slot="input">
+ <div>
+ API Base Address: <span class="selector-input">${apiBaseAddress}</span>
+ </div>
+ <div>
+ Project ID: <span class="selector-input">${projectId}</span>
+ </div>
+ </div>
+ <div slot="result">
+ <pre>${output.config}</pre>
+ </div>
+ </sketch-tool-card>
+ `;
+ }
+}
+
+declare global {
+ interface HTMLElementTagNameMap {
+ "sketch-tool-card-dodo-get-project-config": SketchToolCardDodoGetProjectConfig;
+ }
+}