DocsReact CorehooksUseToolApproval
Package: @hexos/react-core

Hook for managing human-in-the-loop tool approval workflows.

Provides access to pending ToolApprovalRequests and methods to approve or reject them. Sends ApprovalDecisions to the server via the AgentTransport stored in transportAtom, and removes resolved requests from pendingToolCallsAtom.

Includes batch operations (approveAll, rejectAll) and submission state tracking.

Related: ToolApprovalDialog renders the approval UI, pendingToolCallsAtom stores pending requests, SSETransport.sendApproval() transmits decisions, AgentRuntime.submitApproval() processes them server-side.

Example

function ApprovalDialog() {
  const { pending, approve, reject, isSubmitting } = useToolApproval();
 
  return (
    <>
      {pending.map((request) => (
        <Dialog key={request.toolCallId}>
          <p>Allow {request.toolName}?</p>
          <button
            onClick={() => approve(request.toolCallId)}
            disabled={isSubmitting}
          >
            Allow
          </button>
          <button
            onClick={() => reject(request.toolCallId, 'User denied')}
            disabled={isSubmitting}
          >
            Deny
          </button>
        </Dialog>
      ))}
    </>
  );
}
function useToolApproval(): UseToolApprovalReturn
UseFrontendToolsUseToolApprovalReturn