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 skills add PURPLE-ORCA/skills --skill modern-inertiagit clone --depth 1 https://github.com/PURPLE-ORCA/skillsWrote 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/purple-orca/skills/modern-inertia)<a href="https://agentmods.dev/skills/purple-orca/skills/modern-inertia"><img src="https://agentmods.dev/badge/skills/purple-orca/skills/modern-inertia/github.svg" alt="Measured on agentmods" height="20"></a>Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.
<a href="https://agentmods.dev/skills/purple-orca/skills/modern-inertia"><img src="https://agentmods.dev/badge/skills/purple-orca/skills/modern-inertia.svg" alt="Reviewed on agentmods" width="80" 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.1 | $0.00092 | $0.01367 |
| Opus 5 | $0.00046 | $0.00683 |
| Sonnet 5 | $0.00018 | $0.00273 |
| Haiku 4.5 | $0.00009 | $0.00137 |
Grade A, and why
modern-inertia 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 12d 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 — 116 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Modern Inertia (v3.x) Complete Guide
This skill covers Inertia v3 (Beta) and its integration with React 19. Every section follows: what it is → DO this → DON'T do that → migration path.
Critical DO / DON'T Quick Reference
| DO (Modern Inertia v3) | DON'T (Legacy v2/Anti-pattern) | Why |
|---|---|---|
Use the @inertiajs/vite plugin for setup |
Manually configure resolve and SSR entry points |
The plugin auto-resolves ./Pages and wires up SSR silently |
Use useHttp() for standalone API calls |
Reach for axios or fetch for background data |
useHttp gives reactive state (progress, errors) without router visits |
Chain .optimistic() on forms or router visits |
Build manual useState rollbacks with try/catch |
v3 has native optimistic UI with automatic rollback on server/validation errors |
Use preserveErrors: true on partial reloads |
Manually stash errors in local state | Prevents wiping out existing form validation when refreshing a component |
Use preserveFragment: true |
Rely on custom JS to scroll to #hashes after redirect |
v3 natively supports keeping URL hash fragments intact across redirects |
Pass layout inside createInertiaApp |
Manually wrap every single page in a <Layout> |
v3 allows defining a global default layout at the app root |
Use router.cancelAll() to abort |
Use router.cancel() |
cancelAll handles sync, async, and prefetch requests |
Core Architecture & UX Changes
1. Zero-Config SSR via Vite
You no longer need a separate ssr.tsx file, nor do you need to manually resolve page components in your entry point. SSR works out of the box during bun run dev.
// In vite.config.js: plugins: [laravel(...), react(), inertia()]
// In app.tsx:
import { createInertiaApp } from '@inertiajs/react';
createInertiaApp({
// Optional: Set a default layout for all pages here
setup({ el, App, props }) {
createRoot(el).render(<App {...props} />);
},
});
2. Standalone HTTP Requests (useHttp)
For requests that shouldn't trigger a page visit (e.g., live search). It provides the exact same developer experience as useForm, but returns data instead of a router visit.
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.
- 12d ago First seen · 116 lines · 92 tokens per session scan A fce59a994f0f
modern-inertia is a skill published in the GitHub repository PURPLE-ORCA/skills (2 stars, last pushed 1mo ago), licensed MIT. It adds 92 tokens to every session and 1,367 once invoked, about $0.0005 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-31.
Other skills, from other repositories
nextjs-app-router
Full end-to-end tRPC setup for Next.js App Router. Covers route handler with fetchRequestHandler (GET + POST exports), TRPCProvider with QueryClientProvider, createTRPCOptionsProxy for RSC prefetching, HydrateClient/HydrationBoundary for hydration, useSuspenseQuery for Suspense, and server-side callers.
nextjs-pages-router
Set up tRPC in Next.js Pages Router with createNextApiHandler, createTRPCNext, withTRPC HOC, SSR via ssr option and ssrPrepass, SSG via createServerSideHelpers with getStaticProps, and server-side helpers for getServerSideProps prefetching.
with-tanstack-query
Compose Angular Query with signal-owned Table filtering, sorting, and pagination state using reactive query options, manual row-model boundaries, direct query data, server counts, and valid injection context.
langbot-dev
Develop, build, and debug the LangBot core backend and web frontend. Use when working inside the LangBot repository — backend (Python/Quart, src/langbot/pkg), the Vite/React web UI, HTTP API controllers/services, Alembic migrations, or the MCP server. Covers the dev environment (uv, pnpm), repo layout, the API auth…
trigger-realtime-and-frontend
Trigger.dev client/frontend surface: subscribe to runs in realtime (runs.subscribeToRun and the @trigger.dev/react-hooks hook useRealtimeRun), consume metadata and AI/text streams in React (useRealtimeStream), trigger tasks from the browser (useTaskTrigger, useRealtimeTaskTrigger), and mint scoped frontend credentials…
sanity-live-cache-components
Integrates Sanity Live with Next.js Cache Components in next-sanity v13+ apps. Sets up sanityFetch, a shared cachedSanity 'use cache' boundary, , Visual Editing, Presentation Tool, draft mode handling, and the three-layer (Page/Dynamic/Cached) component pattern with explicit perspective/stega prop-drilling. Sequences…