← Back to Registry

confirm_action

Present a yes/no confirmation before proceeding with an action.

confirmationpushAndWait
Display stack

Confirm purchase

You're about to buy 3 items totaling $247.00. Continue?

confirm-action.tsxtsx
import { z } from "zod";
import type { ToolConfig, SlotRenderProps } from "glove-react";

export const confirmAction: ToolConfig = {
  name: "confirm_action",
  description:
    "Present a yes/no confirmation before proceeding with an action. " +
    "Blocks until the user confirms or cancels.",
  inputSchema: z.object({
    title: z.string().describe("What you are asking confirmation for"),
    message: z
      .string()
      .describe("Details about the action to be confirmed"),
  }),
  async do(input, display) {
    const confirmed = await display.pushAndWait({ input });
    return confirmed ? "User confirmed." : "User cancelled.";
  },
  render({ data, resolve }: SlotRenderProps) {
    const { title, message } = data as {
      title: string;
      message: string;
    };
    return (
      <div
        style={{
          padding: 16,
          borderRadius: 12,
          border: "1px dashed var(--warning, #f59e0b)",
          background: "var(--surface, #141414)",
          fontFamily:
            '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
        }}
      >
        <p
          style={{
            fontSize: 14,
            fontWeight: 600,
            marginBottom: 8,
            color: "var(--text, #ededed)",
          }}
        >
          {title}
        </p>
        <p
          style={{
            fontSize: 13,
            color: "var(--text-muted, #888)",
            lineHeight: 1.5,
            marginBottom: 12,
          }}
        >
          {message}
        </p>
        <div style={{ display: "flex", gap: 8 }}>
          <button
            onClick={() => resolve(true)}
            style={{
              padding: "8px 16px",
              border: "none",
              borderRadius: 6,
              background: "var(--success, #22c55e)",
              color: "#fff",
              fontSize: 13,
              fontWeight: 500,
              cursor: "pointer",
            }}
          >
            Confirm
          </button>
          <button
            onClick={() => resolve(false)}
            style={{
              padding: "8px 16px",
              border: "none",
              borderRadius: 6,
              background: "var(--border, #262626)",
              color: "var(--text-muted, #888)",
              fontSize: 13,
              fontWeight: 500,
              cursor: "pointer",
            }}
          >
            Cancel
          </button>
        </div>
      </div>
    );
  },
};
tools.tstypescript
const tools: ToolConfig[] = [
  confirm_action,
  // ...other tools
];