Rules Hub
Code Ruleset
← Back to all rules
Rule priority, scope & exceptions
Use this to align rules with the senior-level structure (P0/P1/P2, scope, exceptions/tradeoffs).
frontend ruleP1stack specificStack: react
reactkeysreserved-propsdata-modeling
Pass readable identity separately from the JSX key
Do not read JSX key as an ordinary prop; domain data may still contain a field named key.
PR: hegnar-web · org-mining-hist-2026-06Created: Jun 19, 2026
Bad example
Old codetypescript
| 1 | function Row(props: { key?: string }) { return <span>{props.key}</span>; } |
Explanation (EN)
The child cannot read the special JSX key as props.key.
Objašnjenje (HR)
Good example
New codetypescript
| 1 | <Row key={item.key} itemId={item.key} /> |
Explanation (EN)
The reconciliation key and the readable domain prop have separate roles.
Objašnjenje (HR)
Notes (EN)
When passing identity to a component, supply a normal named prop as well as the reconciliation key if the component needs that value.
Exceptions / Tradeoffs (EN)
A domain object can validly have a key field. The restriction concerns the special JSX key attribute, which is not delivered as an ordinary component prop.