DEV Community

Discussion on: React components composition: how to get it right

adevnadia profile image
Nadia Makarevich Author

The beauty of React is there are no strict rules, only recommendations and suggestions, and people can make their own decisions based on them and what makes sense for their application 🙂

If the only thing that you have in your header is a div with an icon and the dropdown menu, I wouldn't bother with extraction - the component is going to be small enough to read through it anyway.

If you have or plan to have in the nearest future multiple items there, and the header is going to manage multiple states independent from each other, then extracting the logic of the dropdown would help with readability. And then yes, extracting it would make sense.

micheledellaquila profile image

thank you for answering. In this moment my header manages open / close dropdown's state and with context the theme of application. I'm gonna include an icon that it will manage close or open sidebar. I think divided is perfect solution because i don't want to header manages this 3 different state, obviously as you said there aren't fixed rule. My problem were the size of component and managed this state / context. Congratulations again for the articles.