Rules Hub
Coding Rules Library
← 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 ruleP2stack specificStack: react
reactrenderinggroupingreadability
Group items into a keyed map before rendering instead of returning nested node arrays
To render items grouped by some key (e.g. by day), first reduce them into a keyed object, then render each group; avoid returning a hard-to-reason-about matrix of nodes.
PR: frontpage-web · org-mining-hist-2026-06Created: Jun 18, 2026
Bad example
Old codetsx
| 1 | return this.props.events.map((e, i) => { |
| 2 | // tries to emit a title only sometimes and returns arrays of arrays |
| 3 | }); |
Explanation (EN)
Objašnjenje (HR)
Good example
New codetsx
| 1 | const byDay = {}; |
| 2 | events.forEach(e => { |
| 3 | const key = getDayOfYear(new Date(e.startTime)); |
| 4 | (byDay[key] ||= []).push(e); |
| 5 | }); |
| 6 | return <div>{Object.keys(byDay).map((k, i) => this.renderDay(byDay[k], i))}</div>; |
Explanation (EN)
Objašnjenje (HR)