A small React pattern that removed half our prop drilling

We had a settings page where props were threaded through four levels of components. Every new field touched five files.

The fix wasn't a state library. It was composition:

<SettingsSection title="Notifications"> <NotificationFields /> </SettingsSection> 

Instead of passing value and onChange down, each section owns its slice of state, and the page composes sections. The props stayed where they were used.

We deleted about 200 lines of plumbing. The page is easier to read and the components are testable in isolation.

I'm learning Kotlin Multiplatform next — mostly curiosity about sharing UI logic without sharing UI. If you've tried it, I'd love to compare notes.