kernel-dev-react

Enforce the React structure this project expects. This skill exists to stop the LLM from mixing presentation, data fetching, routing, and domain logic into the wrong layer.

Non-Negotiables

• Presentational components receive data via props; they do not fetch their own data.
• Shared UI packages stay presentational and environment-agnostic.
• Remote data flows through query or mutation hooks and the typed API client, not direct component fetches.
• Derived state is computed, not stored.
• Hooks and components each have a single responsibility.

Forbidden behavior:

• Do not import auth, API, routing, or database code into shared UI package components.
• Do not fetch remote data directly inside presentational components.
• Do not store server state in useState.
• Do not use useEffect to derive state that can be computed inline.
• Do not import from another package's private internals to make a component "just work."

Boundary Rules