Rules Hub
Coding Rules Library
Rule priority, scope & exceptions
Use this to align rules with the senior-level structure (P0/P1/P2, scope, exceptions/tradeoffs).
Name side-effect-only components with a verb
A component that renders nothing and only performs a side effect (like registering something) should be named for that action, not for the thing it manages.
Bad example
| 1 | interface Props { tags: string; } |
| 2 |
|
| 3 | // Renders nothing -- just registers custom elements as a side effect. |
| 4 | const HegnarElements: React.FC<Props> = ({ tags }) => { |
| 5 | useRegisterElements(tags); |
| 6 | return null; |
| 7 | }; |
Explanation (EN)
The name HegnarElements reads like a component that renders those elements. It actually renders nothing and only performs a registration side effect, which the name hides.
Objašnjenje (HR)
Naziv HegnarElements zvuci kao komponenta koja renderira te elemente. Ona zapravo ne renderira nista i samo izvodi sporedni efekt registracije, sto naziv skriva.
Good example
| 1 | interface Props { tags: string; } |
| 2 |
|
| 3 | // Renders nothing -- just registers custom elements as a side effect. |
| 4 | const RegisterHegnarElements: React.FC<Props> = ({ tags }) => { |
| 5 | useRegisterElements(tags); |
| 6 | return null; |
| 7 | }; |
Explanation (EN)
Naming it with a verb (Register...) makes the side-effect-only, render-nothing nature of the component obvious at every call site, without needing to open the file.
Objašnjenje (HR)
Naziv s glagolom (Register...) cini ocitim, na svakom mjestu koristenja, da komponenta samo izvodi sporedni efekt i ne renderira nista, bez potrebe da se otvara file.