Effectful View Model Architecture Guide

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:

• User entity → displayName: "John D."
• timestamp: 1702425600 → formattedDate: "Dec 13, 2024"
• balance: 1000000n → displayBalance: "$1,000,000"
• isActive && hasAccess → canEdit: true
• error.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