Permix

Next App Router Repros

Red-to-green reproduction cases for Next.js caching, hydration, layout guards, and framework handlers

Purpose

examples/next-app-router is the focused repro harness used to prove the original failure cases and lock them down with end-to-end tests.

Covered scenarios

  • cached permission snapshots after role changes
  • hydration readiness after SSR
  • multi-role rule composition
  • overlapping request isolation
  • server layout guards with notFound()
  • Hono route handlers in the App Router
  • tRPC route handlers in the App Router

Run it

pnpm --filter next-app-router dev

Run the end-to-end tests:

pnpm --filter next-app-router test:e2e

Why this example matters

This example is intentionally narrower than the CMS demo. It exists so a bug in caching, hydration, or request isolation can be reproduced in a very small surface area before it gets lost inside a larger app.

Suggested use

  • Start here when you suspect a framework integration bug.
  • Use next-minimal when you need a teaching example.
  • Use next-blog-cms when you want to explore a realistic multi-role application.

Next Blog CMS Demo

A larger multi-role Next.js demo with local data, impersonation, nested routes, and API guards

Role-based Example

A minimal React example that maps one selected role to a Permix ruleset

On this page

Purpose
Covered scenarios
Run it
Why this example matters
Suggested use