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).

PriorityP2 — style, consistency, readabilityScopeUniversal — language-agnostic, broadly applicable

Exceptions / tradeoffs (EN)Iznimke / tradeoffi (HR)

frontend ruleP2universalStack: css

cssmaintainabilitydata-drivenicons

Map variants to assets via a data-derived class rather than per-variant branches

Generate a className from the item's id/name and resolve the asset in CSS, so adding or removing a variant degrades gracefully instead of breaking compilation.

PR: frontpage-web · org-mining-hist-2026-06Created: Jun 18, 2026

Bad example

Old codetsx

1	`if (category.id === 'MOVIE') return <MovieIcon />;`
2	`if (category.id === 'SPORT') return <SportIcon />;`

Explanation (EN)

Objašnjenje (HR)

Good example

New codetsx

1	const iconClass = `tvcategory-${category.name.toLowerCase()}`;
2	`return <div className={iconClass} />;`
3	`// CSS: .tvcategory-film { background-image: url('Movie.svg'); }`

Explanation (EN)

Objašnjenje (HR)

Login required