Skip to content

Commit c270446

Browse files
committed
Refresh README positioning and skill overview
1 parent db38e78 commit c270446

File tree

1 file changed

+73
-67
lines changed

1 file changed

+73
-67
lines changed

README.md

100755100644
Lines changed: 73 additions & 67 deletions
Original file line numberDiff line numberDiff line change
@@ -1,105 +1,108 @@
11
# AgentClick
22

3-
![AgentClick icon](./icon.png)
3+
<p align="center">
4+
<img src="./icon.png" alt="AgentClick icon" width="180" />
5+
</p>
46

5-
AI agents fail silently and take irreversible actions. AgentClick puts a human review step between your agent and the world.
7+
<p align="center">
8+
Human review UI for AI agents.
9+
</p>
610

7-
[![npm version](https://img.shields.io/npm/v/agentclick)](https://www.npmjs.com/package/agentclick)
8-
[![license](https://img.shields.io/npm/l/agentclick)](LICENSE)
9-
[![npm downloads](https://img.shields.io/npm/dm/agentclick)](https://www.npmjs.com/package/agentclick)
11+
<p align="center">
12+
Move from terminal-only interaction to a shared browser workflow where the agent can propose, the user can inspect and edit, and only then the action continues.
13+
</p>
14+
15+
<p align="center">
16+
<a href="https://www.npmjs.com/package/agentclick"><img src="https://img.shields.io/npm/v/agentclick" alt="npm version"></a>
17+
<a href="./LICENSE"><img src="https://img.shields.io/npm/l/agentclick" alt="license"></a>
18+
<a href="https://www.npmjs.com/package/agentclick"><img src="https://img.shields.io/npm/dm/agentclick" alt="npm downloads"></a>
19+
</p>
20+
21+
---
22+
23+
## What AgentClick Is For
24+
25+
Most agents still interact like this:
26+
27+
- user types in terminal
28+
- agent prints text
29+
- agent acts
30+
31+
That is too narrow for high-risk or high-context work.
32+
33+
AgentClick extends the interaction into a browser UI so the agent can hand off a structured review surface for things like:
34+
35+
- emails and inbox triage
36+
- shell commands and risky actions
37+
- plans and trajectories
38+
- forms and selections
39+
- memory review
40+
41+
The goal is simple: keep the speed of terminal agents, but add a real review layer before the agent commits to irreversible work.
1042

1143
---
1244

13-
## Why AgentClick
45+
## Why It Helps
1446

15-
- **Not just approve/deny** -- edit the email subject, change the command, modify the payload before it sends.
16-
- **Preference learning** -- delete a paragraph and tell AgentClick why. It writes the rule to disk so your agent never makes the same mistake again.
17-
- **Framework-agnostic** -- works with OpenAI, Anthropic, LangChain, or any HTTP-capable agent. Just POST and long-poll.
47+
- **Edit before execution**: the user can change the draft, command, or payload instead of only approve/reject.
48+
- **Shared visual context**: the agent and user move from raw terminal text to a purpose-built UI.
49+
- **Preference learning**: feedback from review can be persisted so the agent improves over time.
50+
- **Framework-agnostic**: anything that can `POST` JSON and poll an HTTP endpoint can use it.
1851

1952
---
2053

2154
## Quick Start
2255

2356
```bash
2457
npm install -g @harvenstar/agentclick
25-
agentclick # local only
26-
agentclick --remote # + public URL for phone / remote access
58+
agentclick
2759
```
2860

29-
`--remote` automatically downloads and starts a [Cloudflare Quick Tunnel](https://developers.cloudflare.com/cloudflare-one/connections/connect-networks/do-more-with-tunnels/trycloudflare/) — no account needed. A public HTTPS URL is printed in the terminal; open it on any device.
30-
31-
Then test it with a mock session:
61+
For remote access from another device:
3262

3363
```bash
34-
curl -X POST http://localhost:3001/api/review \
35-
-H "Content-Type: application/json" \
36-
-d '{"type":"code_review","sessionKey":"test","payload":{"command":"rm -rf /tmp/old-cache","cwd":"/home/user","explanation":"Clean up stale cache directory","risk":"medium"}}'
64+
agentclick --remote
3765
```
3866

39-
A browser tab opens automatically. Review, approve or reject, and close the tab.
67+
`--remote` automatically downloads and starts a [Cloudflare Quick Tunnel](https://developers.cloudflare.com/cloudflare-one/connections/connect-networks/do-more-with-tunnels/trycloudflare/). It prints a public HTTPS URL you can open on your phone or another machine.
4068

4169
---
4270

43-
## How It Works
71+
## Use It With An Agent
4472

45-
1. **Agent POSTs structured data** to `http://localhost:3001/api/review` with a session key.
46-
2. **User reviews, edits, and approves** in the browser -- paragraph-level delete/rewrite for emails, approve/reject for commands and actions.
47-
3. **Agent receives the result** via long-poll (`GET /api/sessions/:id/wait`) and continues execution.
73+
If your agent can work with local repos and local skills, keep the instructions short.
4874

49-
No WebSockets, no framework plugins. One HTTP endpoint in, one HTTP endpoint out.
75+
Example:
5076

51-
---
77+
1. Ask the agent to download or clone AgentClick.
78+
2. Ask the agent to load the skill from this repo.
79+
3. Ask the agent to use AgentClick for review-heavy tasks.
5280

53-
## Comparison
81+
Prompt:
5482

55-
| Feature | AgentClick | AgentGate | LangGraph interrupt() | Vercel AI SDK |
56-
|---|---|---|---|---|
57-
| Pre-built review UI | Yes | No | No | No |
58-
| Edit before approve | Yes | No | No | No |
59-
| Preference learning | Yes | No | No | No |
60-
| Framework-agnostic | Yes | Yes | LangGraph only | Vercel only |
61-
| Self-hosted | Yes | Yes | Yes | Cloud |
62-
63-
---
64-
65-
## Session Types
83+
```text
84+
Download agentlayer-io/AgentClick, load its SKILL.md, start it locally, and use it whenever you need a browser review UI instead of only terminal output.
85+
```
6686

67-
- **email_review** -- two-column inbox and draft editor. Users can delete paragraphs with reasons, request rewrites, toggle intent suggestions, and confirm or regenerate.
68-
- **code_review** -- displays the shell command, working directory, affected files as a collapsible tree, and risk level. Approve or reject with an optional note.
69-
- **action_approval** -- generic high-risk action gate. Shows action description, detail, and risk badge. Approve or reject with an optional note.
70-
- **form_review** -- editable key-value form. Each field can be free-text or a dropdown. Agent receives the edited values on completion.
71-
- **selection_review** -- single or multi-select option picker. Agent receives the chosen option IDs.
72-
- **trajectory_review** -- DAG visualization of a multi-step agent execution. Users can mark incorrect steps, provide per-step guidance, set a resume point, and request a retry. Guidance with "Remember this" checked is persisted to `MEMORY.md` for future runs.
73-
- **plan_review** -- step tree with DAG layout for reviewing an agent's proposed plan before execution. Users can edit step labels, insert or remove steps, add constraints, choose an alternative plan, or request a regeneration.
74-
- **memory_review** -- grouped file browser for reviewing agent memory modifications. Users decide which files to include or disregard, accept or reject proposed edits, and leave a global note for the agent.
87+
If the agent supports sub-skills, the root [`SKILL.md`](./SKILL.md) routes to the right one automatically.
7588

7689
---
7790

7891
## Skill Layout
7992

80-
The root `SKILL.md` is a router only. Detailed review workflows live in:
81-
82-
- `skills/clickui-approve/`
83-
- `skills/clickui-code/`
84-
- `skills/clickui-email/`
85-
- `skills/clickui-plan/`
86-
- `skills/clickui-trajectory/`
87-
- `skills/clickui-memory/`
88-
89-
Use the sub-skill that matches the review type instead of expanding the root skill file.
93+
The root skill is [`SKILL.md`](./SKILL.md). It routes to the right sub-skill.
9094

91-
---
92-
93-
## API
94-
95-
| Method | Endpoint | Description |
95+
| Skill | Path | Purpose |
9696
|---|---|---|
97-
| POST | `/api/review` | Agent creates a review session. Returns `{ sessionId, url }`. Browser opens automatically unless `noOpen: true` is passed. |
98-
| POST | `/api/review/batch` | Create multiple sessions at once. Pass `{ sessions: [...] }`. Returns `{ sessions: [{ sessionId, url }] }`. All sessions are silent (no browser open). |
99-
| GET | `/api/sessions/:id` | Fetch session data (payload, status, result). |
100-
| GET | `/api/sessions/:id/wait` | Long-poll. Blocks up to 5 minutes until the user completes the review. |
101-
| POST | `/api/sessions/:id/complete` | UI submits the user's decision. Triggers preference learning and agent callback. |
102-
| PUT | `/api/sessions/:id/payload` | Agent updates payload after a rewrite cycle. Only valid when session status is `rewriting`. |
97+
| Router | `SKILL.md` | Entry point that routes the agent to the right review workflow. |
98+
| Action Approval | `skills/clickui-approve/` | Approve or reject risky actions before execution. |
99+
| Code Review | `skills/clickui-code/` | Review shell commands, diffs, and code-related actions in UI. |
100+
| Email Review | `skills/clickui-email/` | Review inbox items, drafts, replies, and live email sessions. |
101+
| Plan Review | `skills/clickui-plan/` | Inspect and revise proposed plans before the agent runs them. |
102+
| Trajectory Review | `skills/clickui-trajectory/` | Review multi-step runs, mistakes, and resume points. |
103+
| Memory Review | `skills/clickui-memory/` | Review memory files and memory-management changes. |
104+
105+
For direct agent usage, telling the agent to load the root skill is usually enough.
103106

104107
---
105108

@@ -112,9 +115,12 @@ npm install
112115
npm run dev
113116
```
114117

115-
Server runs on `http://localhost:3001`, UI on `http://localhost:5173`.
118+
Development mode:
119+
120+
- server: `http://localhost:38173`
121+
- web: `http://localhost:5173`
116122

117-
For production-style single-port serving:
123+
Production-style single-port serving:
118124

119125
```bash
120126
npm run build

0 commit comments

Comments
 (0)