Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
npx agentmods add skills/mpsuesser/pi-effect-harness/effect-react-vmnpx skills add mpsuesser/pi-effect-harness --skill effect-react-vmgit clone --depth 1 https://github.com/mpsuesser/pi-effect-harnessWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/skills/mpsuesser/pi-effect-harness/effect-react-vm)<a href="https://agentmods.dev/skills/mpsuesser/pi-effect-harness/effect-react-vm"><img src="https://agentmods.dev/badge/skills/mpsuesser/pi-effect-harness/effect-react-vm.svg" alt="Measured on agentmods" height="20"></a>What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5 | $0.00041 | $0.04699 |
| Opus 5 | $0.00020 | $0.02350 |
| Sonnet 5 | $0.00008 | $0.00940 |
| Haiku 4.5 | $0.00004 | $0.00470 |
Grade A, and why
effect-react-vm scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 4d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
How it starts
The opening of the file, as written. The whole thing — 664 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Effectful View Model Architecture Guide
Effect Source Reference
The Effect v4 source is available at ~/.cache/effect-v4/.
Browse and read files there directly to look up APIs, types, and implementations.
Reference this for:
- Atom reactivity:
packages/effect/src/unstable/reactivity/ - Context source:
packages/effect/src/Context.ts - Layer source:
packages/effect/src/Layer.ts - Effect source:
packages/effect/src/
The Golden Rule: Zero UI Logic
VMs take domain input → VMs produce UI-ready output → Components are pure renderers
VM transforms domain to UI-ready:
Userentity →displayName: "John D."timestamp: 1702425600→formattedDate: "Dec 13, 2024"balance: 1000000n→displayBalance: "$1,000,000"isActive && hasAccess→canEdit: trueerror.code→errorMessage: "Network failed"
Components must NEVER: format strings/dates/numbers, compute derived values, contain business logic, transform entities
Components ONLY: subscribe via useAtomValue, invoke via useAtomSet, pattern match with $match, render UI-ready values
Error handling: Components CAN pattern match on error states (to render different UI per error type), but MUST render error.message as-is—VM is responsible for producing user-friendly messages
File Structure
Every parent component needs a VM:
components/
Wallet/
Wallet.tsx # Component - pure renderer
Wallet.vm.ts # VM - interface, tag, default layer export
index.ts # Re-exports
Child components used for UI composition receive VM as props—only parent components define their own VM.
VMs vs Regular Layers
VMs are strictly UI constructs. A VM only exists if a component for that exact VM exists.
| Pattern | When to Use | Location |
|---|---|---|
| VM | Layer serves a React component | components/X/X.vm.ts paired with X.tsx |
| Service Layer | Non-UI logic, shared business rules | services/, lib/, etc. |
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 4d ago First seen · 664 lines · 41 tokens per session scan A 6d3ef89f02db
effect-react-vm is a skill published in the GitHub repository mpsuesser/pi-effect-harness (23 stars, last pushed 2mo ago), licensed MIT. It adds 41 tokens to every session and 4,699 once invoked, about $0.0002 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.
Other skills, from other repositories
effect-patterns-building-apis
Effect-TS patterns for Building Apis. Use when working with building apis in Effect-TS applications.
effect-patterns-concurrency
Effect-TS patterns for Concurrency. Use when working with concurrency in Effect-TS applications.
effect-patterns-building-data-pipelines
Effect-TS patterns for Building Data Pipelines. Use when working with building data pipelines in Effect-TS applications.
effect-patterns-error-management
Effect-TS patterns for Error Management. Use when working with error management in Effect-TS applications.
effect-patterns-making-http-requests
Effect-TS patterns for Making Http Requests. Use when working with making http requests in Effect-TS applications.
effect-patterns-observability
Effect-TS patterns for Observability. Use when working with observability in Effect-TS applications.