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).
Import static data directly instead of prop-drilling it into a single-use component
If a component is rendered in exactly one place with the same static data every time, import that data directly rather than passing it as a prop.
Bad example
| 1 | import { countryList } from '@/data/country-list'; |
| 2 |
|
| 3 | type AddressFormProps = { countries?: Country[] }; |
| 4 |
|
| 5 | const AddressForm: React.FC<AddressFormProps> = ({ countries = [] }) => { |
| 6 | return <CountryPicker options={countries} />; |
| 7 | }; |
| 8 |
|
| 9 | // only ever rendered as: |
| 10 | <AddressForm countries={countryList} />; |
Explanation (EN)
`countries` is threaded through as a prop even though `AddressForm` is only ever rendered once and always with the same static `countryList`. The prop adds an optional/default-value layer and an extra import at the call site for zero actual flexibility.
Objašnjenje (HR)
`countries` se prosljeđuje kao prop iako se `AddressForm` renderira samo jednom i uvijek s istim statičkim `countryList`. Prop dodaje sloj opcionalnosti/default vrijednosti i dodatni import na mjestu poziva, a da pritom ne donosi nikakvu stvarnu fleksibilnost.
Good example
| 1 | import { countryList } from '@/data/country-list'; |
| 2 |
|
| 3 | const AddressForm: React.FC = () => { |
| 4 | return <CountryPicker options={countryList} />; |
| 5 | }; |
| 6 |
|
| 7 | // rendered simply as: |
| 8 | <AddressForm />; |
Explanation (EN)
`AddressForm` imports the static `countryList` directly since it is the only consumer, removing the pointless prop, its default value, and the need for the parent to know about or forward that data.
Objašnjenje (HR)
`AddressForm` direktno importira statički `countryList` jer je jedini koji ga koristi, čime se uklanja nepotreban prop, njegova default vrijednost i potreba da roditelj uopće zna za te podatke ili ih prosljeđuje dalje.
Exceptions / Tradeoffs (EN)
Keep the data as a prop if the component is genuinely reused elsewhere with different data, or if the data must be swappable for testing/storybook purposes.
Iznimke / Tradeoffi (HR)
Zadrži podatke kao prop ako se komponenta stvarno ponovno koristi negdje drugdje s različitim podacima, ili ako podaci moraju biti zamjenjivi radi testiranja/storybooka.