Human Component
The<Human> component pauses the workflow to request human input or approval.
Basic Usage
Copy
Ask AI
import { Human } from "smithers-orchestrator";
<Human
message="Review the implementation"
onApprove={() => setPhase("continue")}
onReject={() => setPhase("cancelled")}
>
The agent has implemented the feature.
Please review the changes before continuing.
</Human>
Props
Short message shown to the human.
Copy
Ask AI
<Human message="Approve deployment?">
Called when human approves.
Called when human rejects.
Detailed content shown to the human.
Approval Workflow
Copy
Ask AI
import { useState } from "react";
function ApprovalWorkflow() {
const [phase, setPhase] = useState("implement");
return (
<SmithersProvider db={db} executionId={executionId} maxIterations={10}>
<If condition={phase === "implement"}>
<Claude onFinished={() => setPhase("review")}>
Implement the feature.
</Claude>
</If>
<If condition={phase === "review"}>
<Human
message="Review Implementation"
onApprove={() => setPhase("deploy")}
onReject={() => setPhase("implement")}
>
The feature has been implemented.
Please review the changes in the diff.
</Human>
</If>
<If condition={phase === "deploy"}>
<Claude
allowedTools={["Bash"]}
onFinished={() => setPhase("done")}
>
Deploy the changes.
</Claude>
</If>
<If condition={phase === "cancelled"}>
<Stop reason="Human rejected changes" />
</If>
</SmithersProvider>
);
}
Multi-Checkpoint Workflow
Copy
Ask AI
import { useState } from "react";
function StrictWorkflow() {
const [phase, setPhase] = useState("prompt-input");
return (
<SmithersProvider db={db} executionId={executionId} maxIterations={20}>
<If condition={phase === "prompt-input"}>
<Human
message="Confirm Feature Request"
onApprove={() => setPhase("research")}
onReject={() => setPhase("cancelled")}
>
Feature: Add user authentication
Are you sure you want to proceed?
</Human>
</If>
<If condition={phase === "research"}>
<Claude onFinished={() => setPhase("plan-review")}>
Research the implementation approach.
</Claude>
</If>
<If condition={phase === "plan-review"}>
<Human
message="Approve Plan"
onApprove={() => setPhase("implement")}
onReject={() => setPhase("research")}
>
Review the implementation plan.
</Human>
</If>
<If condition={phase === "implement"}>
<Claude onFinished={() => setPhase("final-review")}>
Implement the feature.
</Claude>
</If>
<If condition={phase === "final-review"}>
<Human
message="Final Review"
onApprove={() => setPhase("done")}
onReject={() => setPhase("implement")}
>
Final review before completion.
</Human>
</If>
<If condition={phase === "cancelled"}>
<Stop reason="Workflow cancelled by human" />
</If>
</SmithersProvider>
);
}